import { Component, OnInit, ViewChild, Inject } from '@angular/core';
import {HttpClient, HttpHeaders} from '@angular/common/http'
import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { ImgsDataDetail } from './addGrouping.component'
import { MatSnackBarConfig, MatSnackBar } from '@angular/material/snack-bar';
import { ImagesData } from './imagesdata.component'
import { Router,ActivatedRoute } from '@angular/router'


export interface Food {
  value: string;
  name: string;
}
@Component({
  selector: 'app-fire-fighting-device',
  templateUrl: './fire-fighting-device.component.html',
  styleUrls: ['./fire-fighting-device.component.scss']
})
export class FireFightingDeviceComponent implements OnInit {

  constructor(private router:Router,private route:ActivatedRoute,public http: HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar) { }


  isEditPattern = true
  ngOnInit(): void {
    this.getCompanyInformation()
    this.getAllBuilding()
    if(localStorage.getItem("pattern") == "edit"){
      this.isEditPattern = true
    }else if(localStorage.getItem("pattern") == "look"){
      this.isEditPattern = false
    }
  }

  //定义属性数据
  singleElection:Food[]=[
  {value:'true', name: '有'},
  {value:'false', name: '无'}]

  companyBuiltInGrouping:any = []; //单位消防设施内置分组
  companyDetails:any = []; //单位详情
  companyEachDetails:any = [] //单位每层详情
  companyOptionalGrouping:any = []; //单位消防设施可选分组

  //获得单位基本信息
  getCompanyInformation () {
    let companyId  = this.route.snapshot.queryParams.id
    this.http.get(`/api/Companies/${companyId}`).subscribe((data:any)=>{
      if (data.buildingTypes.length) {
        let newData = {buildingType: data.buildingTypes[0].id,companyId : companyId}
        this.http.get('/api/CompanyFacilities',{params:newData}).subscribe((data:any)=>{ //获得单位的消防设施
          this.companyBuiltInGrouping = data[0].summary.companyFacilityGroups
          this.companyOptionalGrouping = data[0].summary.companyOptionalGroups
          this.companyDetails = data[0].details
          this.companyEachDetails = data[0].eachDetails
          this.companyBuiltInGrouping.forEach(element => { //循环单位内置分组项
            element.selectBuiltInGrouping = []
            element.facilityItems.forEach((elements,index) => {
              elements.total = element.facilityCount[index]
              elements.expanded = false});
          });
          if(sessionStorage.getItem("tabsindex") == "4"){
            this.companyBuiltInGrouping = [this.companyBuiltInGrouping[1]]
            this.companyOptionalGrouping = []
          }
          if(sessionStorage.getItem("tabsindex") == "5"){
            this.companyBuiltInGrouping.splice(1,1)
          }
        }) //http
      } //if

    })
  }

  //创建单位消防设施内置分组项
  addCompanyGrouping (e) {
    let data = e
    let dialogRef = this.dialog.open(ImgsDataDetail,{data});
    dialogRef.afterClosed().subscribe(data=>{
      if (data) { e.facilityItems.push(data) } }); 
  }

  //保存单位消防设施内置分组项
  editCompanyGrouping(e) {
    let header = {groupId:e.id}
    let data = []
    e.facilityItems.forEach((element,index) => {
      let msg = {
        isBuiltin: element.isBuiltin,
        details: element.details,
        name: element.name,
        isEachFloor: element.isEachFloor,
        order: element.order}
      data.push(msg)
      if (index==e.facilityItems.length-1) {
        this.http.post('/api/CompanyFacilityItems/Batch',data,{params:header}).subscribe(data=>{
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('数据更新成功','确定',config);
        }) }
    }); //forEach
  
  }

  //checked单位消防设施内置分组项时
  checkedCompany (e,item,items) {
    if (e.checked) {
      item.selectBuiltInGrouping.push(items)
    } else {
      item.selectBuiltInGrouping.splice(item.selectBuiltInGrouping.findIndex(oldItem => oldItem == items), 1)
    }
  }

  //删除消防设施内置分组项
  deleteCompanyGrouping (e) {
    if (e.selectBuiltInGrouping.length) {
     let isDelete = confirm('您确定要删除吗')
     if (isDelete) {
      let msg:any = `?groupId=${e.id}`
      e.selectBuiltInGrouping.forEach((element,index) => {
        let data = `&name=${element.name}`
        msg = msg + data
        if (index === e.selectBuiltInGrouping.length-1) {
          this.http.delete('/api/CompanyFacilityItems/Batch' + msg).subscribe(data=>{
            let deleteMsg = e.selectBuiltInGrouping
            deleteMsg.forEach(deleteElement => {
              e.facilityItems.splice(e.facilityItems.findIndex(item=>item.name==deleteElement.name),1)
            });
            e.selectBuiltInGrouping = []

           }) //http
        } //if
      }); //forEach
     }
    } else {
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('请选择内置分组项','确定',config);
    }
  }

  //保存单位消防设施可选分组
  editCompanyOptional (e,item) {
    e.stopPropagation() //阻止冒泡
    item.propertyInfos.forEach((element,index) => { 
      element.propertyValue = String(element.propertyValue)
      if (index == item.propertyInfos.length-1 ) {
        this.http.post('/api/CompanyOptionalGroups',item).subscribe(data=>{
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('数据更新成功','确定',config);
        })
      } //if
     });
  }

  //单位消防设施切换展开面板
  SwitchBoard (e) {
    e.expanded = !e.expanded
    if (e.expanded) { //展开面板展开时
      if (e.isEachFloor) { //逐层统计时
        let data = this.companyEachDetails[e.name]
        if (data) {
          e.loopTable = []
          data.forEach(item => {
            let tableMsg = {name:item.name, header:[], body:[]}
            item.assets[0].propertyInfos.forEach(element => { //表头
              if (element.propertyType!=3) {
                let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位
                tableMsg.header.push(element.propertyName+unit)}
            });
            item.assets.forEach(element => { //表格内容
              let everyBody = {}
              element.propertyInfos.forEach((elements,index) => {
                if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { 
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = elements.propertyValue }
                if (elements.propertyType==6) { 
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' }
                if (elements.propertyType!=3 && elements.propertyName=='图片') { 
                  let imgLength = []
                  element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} })
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = String(imgLength.length) } 

              }); //propertyInfos
              tableMsg.body.push(everyBody)
            }); //assets
            e.loopTable.push(tableMsg)
          });

        } //data有数据时
      } else { //非逐层统计时
        let data = this.companyDetails[e.name]
        if (data) { 
          e.header = []
          e.body = []
          data[0].propertyInfos.forEach(element => { //表头
            if (element.propertyType!=3) {
              let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位
              e.header.push(element.propertyName+unit)}
          });
          data.forEach(element => { //表格内容
            let everyBody = {}
            element.propertyInfos.forEach((elements,index) => {
              if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { 
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = elements.propertyValue }
              if (elements.propertyType==6) { 
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' }
              if (elements.propertyType!=3 && elements.propertyName=='图片') { 
                let imgLength = []
                element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} })
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = String(imgLength.length) }

            });
            e.body.push(everyBody)
          });

        }
      } //非逐层统计时



    }
  }



  allBuildingGrouping:any; //所有建筑的消防设施 内置分组+可选分组
  //获取所有建筑
  getAllBuilding () {
    let companyId  = this.route.snapshot.queryParams.id
    this.http.get('/api/Buildings',{params:{
      companyId:companyId
    }}).subscribe((data:any)=>{
      this.allBuildingGrouping = data
      if (this.allBuildingGrouping.length) { this.getAllBuildingFacilities() }
    })
  }

  //获取所有建筑的消防设施
  getAllBuildingFacilities () {
    let companyId  = this.route.snapshot.queryParams.id
    this.allBuildingGrouping.forEach(element => {
      let header = {buildingId: element.id, buildingType: element.buildingTypes[0].id,companyId:companyId}
      this.http.get('/api/BuildingFacilities',{params:header}).subscribe(data=>{
        element.buildingFacilityGroups = data[0].summary.buildingFacilityGroups
        element.buildingOptionalGroups = data[0].summary.buildingOptionalGroups
        element.buildingDetails = data[0].details
        element.buildingEachDetails = data[0].eachDetails
        element.buildingFacilityGroups.forEach((elements) => { //循环每个建筑内置分组项
          elements.selectBuiltInGrouping = []
          elements.facilityItems.forEach((newElement,index) => { 
            newElement.total = elements.facilityCount[index]
            newElement.expanded = false });
        });
        if(sessionStorage.getItem("tabsindex") == "4"){
          element.buildingFacilityGroups = [element.buildingFacilityGroups[1]]
          element.buildingOptionalGroups = []
        }
        if(sessionStorage.getItem("tabsindex") == "5"){
          element.buildingFacilityGroups.splice(1,1)
        }
      })

    });

  }

  //创建建筑消防设施内置分组项
  addBuildingGrouping (e,item) {
    let data = {buildingId: e.id, item}
    let dialogRef = this.dialog.open(ImgsDataDetail,{data});
    dialogRef.afterClosed().subscribe(data=>{
      if (data) { item.facilityItems.push(data) } 
    }); 
  }

  //保存建筑消防设施内置分组项
  editBuildingGrouping (e,item) {
    let companyId  = this.route.snapshot.queryParams.id
    let header = {companyId:companyId,buildingId:e.id, groupId:item.id}
    let data = []
    item.facilityItems.forEach((element,index) => {
      let msg = {
        isBuiltin: element.isBuiltin,
        details: element.details,
        name: element.name,
        isEachFloor: element.isEachFloor,
        order: element.order}
      data.push(msg)
      if (index==item.facilityItems.length-1) {
        this.http.post('/api/BuildingFacilityItems/Batch',data,{params:header}).subscribe(data=>{
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('数据更新成功','确定',config);
        }) }
    }); //forEach

  }

  //删除建筑消防设施内置分组项
  deleteBuildingGrouping (e,item) {
    if (item.selectBuiltInGrouping.length) {
      let isDelete = confirm('您确定要删除吗')
      if (isDelete) {
        let msg:any = `?buildingId=${e.id}&groupId=${item.id}`
        item.selectBuiltInGrouping.forEach((element,index) => {
          let data = `&name=${element.name}`
          msg = msg + data
          if (index === item.selectBuiltInGrouping.length-1) {
            this.http.delete('/api/BuildingFacilityItems/Batch'+msg).subscribe(data=>{
              let deleteMsg = item.selectBuiltInGrouping
              deleteMsg.forEach(deleteElement => {
                item.facilityItems.splice(item.facilityItems.findIndex(items=>items.name==deleteElement.name),1)
              });
              item.selectBuiltInGrouping = []

            }) //http
          } //if
        }) //forEach
      }
      } else {
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('请选择内置分组项','确定',config); 
    }
  }

  //保存建筑消防设施可选分组
  editBuildingOptional (e,item) {
    let companyId  = this.route.snapshot.queryParams.id
    e.stopPropagation() //阻止冒泡
    item.propertyInfos.forEach((element,index) => { 
      element.propertyValue = String(element.propertyValue)
      if (index == item.propertyInfos.length-1 ) {
        this.http.post('/api/BuildingOptionalGroups',item,{params:{
          companyId :companyId 
        }}).subscribe(data=>{
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('数据更新成功','确定',config);
        })
      } //if
     });
  }

  //建筑消防设施切换展开面板
  SwitchBuildingBoard (item,e) {
    e.expanded = !e.expanded
    if (e.expanded) { //展开面板展开时
      if (e.isEachFloor) { //逐层统计时
        let data = item.buildingEachDetails[e.name]
        if (data) {
          e.loopTable = []
          data.forEach(item => {
            let tableMsg = {name:item.name, header:[], body:[]}
            item.assets[0].propertyInfos.forEach(element => { //表头
              if (element.propertyType!=3) {
                let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位
                tableMsg.header.push(element.propertyName+unit)}
            });
            item.assets.forEach(element => { //表格内容
              let everyBody = {}
              element.propertyInfos.forEach((elements,index) => {
                if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { 
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = elements.propertyValue }
                if (elements.propertyType==6) { 
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' }
                if (elements.propertyType!=3 && elements.propertyName=='图片') { 
                  let imgLength = []
                  element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} })
                  let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                  everyBody[elements.propertyName+unit] = String(imgLength.length) }

              }); //propertyInfos
              tableMsg.body.push(everyBody)
            }); //assets
            e.loopTable.push(tableMsg)
          });
          
        } //data有数据时
      } else { //非逐层统计时
        let data = item.buildingDetails[e.name]
        if (data) { 
          e.header = []
          e.body = []
          data[0].propertyInfos.forEach(element => { //表头
            if (element.propertyType!=3) {
              let unit = element.physicalUnit? '('+ element.physicalUnit +')' : '' //单位
              e.header.push(element.propertyName+unit)}
          });
          data.forEach(element => { //表格内容
            let everyBody = {}
            element.propertyInfos.forEach((elements,index) => {
              if (elements.propertyType!=3 && elements.propertyName!='图片' && elements.propertyType!=6) { 
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = elements.propertyValue }
              if (elements.propertyType==6) { 
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = elements.propertyValue=='1'?'是':'否' }
              if (elements.propertyType!=3 && elements.propertyName=='图片') { 
                let imgLength = []
                element.propertyInfos.find(item=>{ if(item.propertyType==3){imgLength.push(item)} })
                let unit = elements.physicalUnit? '('+ elements.physicalUnit +')' : '' //单位
                everyBody[elements.propertyName+unit] = String(imgLength.length) }

            });
            e.body.push(everyBody)
          });

        }
      } //非逐层统计时



    }
  }

  //单位消防设施预览图片
  previewImg (e) {
    if (e.isEachFloor) { //逐层统计时
      let newData = this.companyEachDetails[e.name]
      if (newData) {
        let data = {name:e.name, images:[]}
        let imgName 
        newData.forEach(item => {
          item.assets.forEach(element => {
            element.propertyInfos.forEach( elements => { 
              if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue}
              if (elements.propertyType===3) {
               elements.propertyName = imgName
               data.images.push(elements)} });
          });
        }); //newDate

        if (data.images.length) {
          let dialogRef = this.dialog.open(ImagesData,{width:'1350px',height:'700px',data}); //打开图片弹窗
        } else {
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('暂无图片数据','确定',config);
        }

      } else{
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('暂无图片数据','确定',config); }
    } else { //非逐层统计时
      let newData = this.companyDetails[e.name]
      let imgName 
      if (newData) {
        let data = {name:e.name, images:[]}
        newData.forEach(element => {
          element.propertyInfos.forEach(elements => { 
            if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue}
            if (elements.propertyType===3) {
              elements.propertyName = imgName
              data.images.push(elements)} });
        });
        if (data.images.length) {
          let dialogRef = this.dialog.open(ImagesData,{width:'1350px',height:'700px',data}); //打开图片弹窗
        } else {
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('暂无图片数据','确定',config);
        }
        
      } else {
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('暂无图片数据','确定',config); }
    }

  }

  //建筑消防设施预览图片
  previewBuildingImg (item,e) {
    if (e.isEachFloor) { //逐层统计时
      let newData = item.buildingEachDetails[e.name]
      if (newData) {
        let data = {name:e.name, images:[]}
        let imgName
        newData.forEach(item => {
          item.assets.forEach(element => {
            element.propertyInfos.forEach( elements => { 
              if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue}
              if (elements.propertyType===3) {
               elements.propertyName = imgName
               data.images.push(elements)} });
          });
        }); //newDate
      
        if (data.images.length) {
          let dialogRef = this.dialog.open(ImagesData,{width:'1350px',height:'700px',data}); //打开图片弹窗
        } else {
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('暂无图片数据','确定',config);
        }

      } else{
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('暂无图片数据','确定',config); }
    } else { //非逐层统计时
      let newData = item.buildingDetails[e.name]
      let imgName 
      if (newData) {
        let data = {name:e.name, images:[]}
        newData.forEach(element => {
          element.propertyInfos.forEach(elements => { 
            if (elements.propertyName.includes('名称')) {imgName = elements.propertyValue}
            if (elements.propertyType===3) {
              elements.propertyName = imgName
              data.images.push(elements)} 
            });
        });
        if (data.images.length) {
          let dialogRef = this.dialog.open(ImagesData,{width:'1350px',height:'700px',data}); //打开图片弹窗
        } else {
          const config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('暂无图片数据','确定',config);
        }
        
      } else {
        const config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('暂无图片数据','确定',config); }
    }

  }




}