ShangHaiYuan-AnXin/src/app/data-collection/fire-force/fire-force.component.ts

import { FlatTreeControl } from '@angular/cdk/tree';
import { HttpClient } from '@angular/common/http';
import { Inject, Renderer2 } from '@angular/core';
import { ElementRef } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree';
import { Console } from 'console';
import { TreeService } from 'src/app/http-interceptors/tree.service';
import Viewer from 'viewerjs'
declare var CryptoJS
declare var AMap: any;

@Component({
  selector: 'app-fire-force',
  templateUrl: './fire-force.component.html',
  styleUrls: ['./fire-force.component.scss']
})
export class FireForceComponent implements OnInit {

  constructor(private tree: TreeService, public snackBar: MatSnackBar, private http: HttpClient, private elementRef: ElementRef, public renderer2: Renderer2, public dialog: MatDialog) { }

  isCheckedOfSearchDiv: boolean = true//列表过滤滑块
  slideChange(e) {
    this.isCheckedOfSearchDiv = e.checked
  }
  searchForm: any = {
    name: '',
    integrityNum: ''
  }
  listIntegrityNum: any[] = [
    { id: -1, name: '全部' },
    { id: 0, name: '<=50%' },
    { id: 1, name: '50%-60%' },
    { id: 2, name: '60%-70%' },
    { id: 3, name: '70%-80%' },
    { id: 4, name: '80%-90%' },
    { id: 5, name: '90%-100%' }
  ]
  checkBoxList: any[] = [
    { id: 0, name: '总队', isChecked: false },
    { id: 1, name: '支队', isChecked: false },
    { id: 2, name: '大队', isChecked: false },
    { id: 3, name: '中队(消防站)', isChecked: false },
    { id: 4, name: '其他消防队伍', isChecked: false }
  ]
  //勾选力量类型checkbox在地图上显示marker
  checkBoxChange() {
    let Levels = []
    this.checkBoxList.forEach(item => {
      if (item.isChecked) {
        Levels.push(item.id)
      }
    })
    let params: any = {
      PageSize: 999999,
      Levels: Levels
    }
    if (Levels.length != 0) {//如果勾选了checkbox
      this.http.get('/api/CustomFireForce', { params: params }).subscribe((data: any) => {
        this.createMarker(data)
      })
    } else {
      this.cluster.setData([])
    }
  }
  //循环渲染出所有力量markers
  cluster: any //力量聚合实例
  createMarker(list) {
    let markerArrcluster = []
    this.cluster ? this.cluster.setData([]) : null
    list.forEach((item) => {
      let image
      if (item.forceType == 2) {
        image = '/assets/fireForcesMarkers/qita.png'
      } else if (item.level == 0) {
        image = '/assets/fireForcesMarkers/zongdui.png'
      } else if (item.level == 1) {
        image = '/assets/fireForcesMarkers/zhidui.png'
      } else if (item.level == 2) {
        image = '/assets/fireForcesMarkers/dadui.png'
      } else if (item.level == 3) {
        image = '/assets/fireForcesMarkers/zhongdui.png'
      }
      // 用于点集合的数组
      item.fireForceDetailInfo.location ?
        markerArrcluster.push({
          lnglat: [item.fireForceDetailInfo.location.x, item.fireForceDetailInfo.location.y],
          image: image,
          data: item
        }) : null
    })
    this.map.plugin(["AMap.MarkerClusterer"], () => {
      var gridSize = 60
      var count = markerArrcluster.length;
      var _renderClusterMarker = function (context) {
        var factor = Math.pow(context.count / count, 1 / 18);
        var div = document.createElement('div');
        var Hue = 180 - factor * 180;
        var bgColor = 'hsla(' + Hue + ',100%,40%,0.7)';
        var fontColor = 'hsla(' + Hue + ',100%,90%,1)';
        var borderColor = 'hsla(' + Hue + ',100%,40%,1)';
        var shadowColor = 'hsla(' + Hue + ',100%,90%,1)';
        div.style.backgroundColor = bgColor;
        var size = Math.round(30 + Math.pow(context.count / count, 1 / 5) * 20);
        div.style.width = div.style.height = size + 'px';
        div.style.border = 'solid 1px ' + borderColor;
        div.style.borderRadius = size / 2 + 'px';
        div.style.boxShadow = '0 0 5px ' + shadowColor;
        div.innerHTML = context.count;
        div.style.lineHeight = size + 'px';
        div.style.color = fontColor;
        div.style.fontSize = '14px';
        div.style.textAlign = 'center';
        context.marker.setOffset(new AMap.Pixel(-size / 2, -size / 2));
        context.marker.setContent(div)
      };
      var _renderMarker = (context) => {
        var content = `<img class='clusterImgCollection' src="${context.data[0].image}" alt="">`;
        var offset = new AMap.Pixel(-15, -15);
        context.marker.setContent(content)
        context.marker.setOffset(offset)
      }
      this.cluster = new AMap.MarkerCluster(this.map, markerArrcluster, {
        gridSize: gridSize, // 设置网格像素大小
        renderClusterMarker: _renderClusterMarker, // 自定义聚合点样式
        renderMarker: _renderMarker, // 自定义非聚合点样式
      });
      this.cluster.on('click', (e) => {
        if (e.clusterData.length == 1) {
          let node = e.clusterData[0].data
          // console.log(node)
          this.clearData()
          this.selectedFireForce = node.fireForceDetailInfo
          this.selectedFireForceId = node.fireForceDetailId
          if (node.forceType != 0) {//如果是其他消防力量
            this.selectedFireForceLevel = 4
          } else {
            this.selectedFireForceLevel = node.level
          }
          this.FireForceDetailInfo.stationName = node.fireForceDetailInfo.name

          if (node.fireForceDetailId) {
            let type
            if (node.forceType == 0) {
              type = 0
            } else {
              type = 1
            }
            this.isMasklayer = true
            this.http.get(`/api/FireForceDetail/${type}/${node.id}`).subscribe((data: any) => {
              this.isMasklayer = false
              this.FireForceDetailInfo = data
              if (data.location && data.location.x) {//如果已经标注单位坐标
                this.positionLngLat = data.location
              }
              //相关资料
              data.relevantInfomationData ? this.AttachmentArr = JSON.parse(data.relevantInfomationData) : null

              if (node.forceType == 0 && node.level == 0) {
                this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData
                this.ZongcontactData = JSON.parse(data.contactData) || this.ZongcontactData
              }
              if (node.forceType == 0 && node.level == 1) {
                this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData
                this.ZhicontactData = JSON.parse(data.contactData) || this.ZhicontactData
              }
              if (node.forceType == 0 && (node.level == 2 || node.level == 3)) {
                this.DaZhongpersonCountData = JSON.parse(data.personCountData) || this.DaZhongpersonCountData
                this.DaZhongcontactData = JSON.parse(data.contactData) || this.DaZhongcontactData
              }
              if (node.forceType != 0) {
                this.otherpersonCountData = JSON.parse(data.personCountData) || this.otherpersonCountData
                this.othercontactData = JSON.parse(data.contactData) || this.otherpersonCountData
              }
            })

          }
          //寻找管辖单位
          this.allFireForceList.forEach(item => {
            if (item.id == node.parentId) {
              this.superior.name = item.name
              this.superior.code = item.code
            }
          })
        }
      })
    });

  }
  ngOnInit(): void {
    this.getAllFireForce()
    setTimeout(() => {
      this.createMap()
    }, 0);
  }
  //获得所有消防力量
  newdata: any
  allFireForceList: any = []
  getAllFireForce() {
    let MinIntegrity = 0
    let MaxIntegrity = 1.1
    if (this.searchForm.integrityNum == '0') {
      MinIntegrity = 0
      MaxIntegrity = 0.5
    } else if (this.searchForm.integrityNum == '1') {
      MinIntegrity = 0.5
      MaxIntegrity = 0.6
    } else if (this.searchForm.integrityNum == '2') {
      MinIntegrity = 0.6
      MaxIntegrity = 0.7
    } else if (this.searchForm.integrityNum == '3') {
      MinIntegrity = 0.7
      MaxIntegrity = 0.8
    } else if (this.searchForm.integrityNum == '4') {
      MinIntegrity = 0.8
      MaxIntegrity = 0.9
    } else if (this.searchForm.integrityNum == '5') {
      MinIntegrity = 0.9
      MaxIntegrity = 1.1
    } else if (this.searchForm.integrityNum == '-1') {
      MinIntegrity = 0
      MaxIntegrity = 1.1
    }
    let params: any = {
      Keyword: this.searchForm.name ? this.searchForm.name : '',
      MinIntegrity: MinIntegrity,
      MaxIntegrity: MaxIntegrity
    }
    this.http.get('/api/CustomFireForce', { params: params }).subscribe((data: any) => {
      this.allFireForceList = data
      this.dataSource.data = this.tree.toTree(data)
      this.treeControl.expand(this.treeControl.dataNodes[0]);
    })
  }
  upDateAllFireForce = (): void => {
    this.http.get('/api/CustomFireForce').subscribe((data: any) => {
      this.newdata = this.tree.toTree(data)
      const nodes = this.treeControl.dataNodes;
      const expandNodes = [];
      nodes.forEach((item) => {
        if (item.expandable && this.treeControl.isExpanded(item)) {
          expandNodes.push(item.id);
        }
      });
      this.dataSource.data = this.newdata;
      let newNodes = this.treeControl.dataNodes;
      newNodes = newNodes.filter(n => {
        return expandNodes.indexOf(n.id) >= 0;
      });
      newNodes.forEach(item => {
        this.treeControl.expand(item);
      });
    })
  }
  private _transformer = (node, level: number) => {//要给渲染节点传那些属性参数
    return {
      expandable: !!node.children && node.children.length > 0,
      name: node.name,
      level: level,
      id: node.id,
      parentId: node.parentId,
      enabled: node.enabled,
      order: node.order,
      children: node.children,
      code: node.code,
      division: node.division,
      fireForceDetailId: node.fireForceDetailId,
      forceType: node.forceType,
      fireForceDetailInfo: node.fireForceDetailInfo,
      contentVerify: node.contentVerify,
    };
  }
  treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable);
  treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children);
  dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
  hasChild = (_: number, node: any) => node.expandable;
  selectedFireForceId: any
  selectedFireForceLevel: any
  selectedFireForce: any
  //选择要显示的消防力量
  superior: any = { //上级单位
    name: '',
    code: ''
  }
  selectTreeNode(node) {
    // console.log(node)
    this.isGisTopBox = false
    if (this.selectedFireForceId != node.id) {
      this.clearData()
      this.selectedFireForce = node
      this.selectedFireForceId = node.id
      if (node.forceType != 0) {//如果是其他消防力量
        this.selectedFireForceLevel = 4
      } else {
        this.selectedFireForceLevel = node.level
      }
      this.FireForceDetailInfo.stationName = node.name
      if (this.newPositionMarker) {
        this.map.remove(this.newPositionMarker);
      }

      if (node.fireForceDetailId) {
        this.isPost = false//是否走post创建接口
        let type
        if (node.forceType == 0) {
          type = 0
        } else {
          type = 1
        }
        this.isMasklayer = true
        this.http.get(`/api/FireForceDetail/${type}/${node.id}`).subscribe((data: any) => {
          this.isMasklayer = false
          this.FireForceDetailInfo = data
          // console.log(888,data)
          if (data.location && data.location.x) {//如果已经标注单位坐标
            this.positionLngLat = data.location
            this.map.setCenter([data.location.x, data.location.y]);
            this.newPositionMarker = new AMap.Marker({
              position: [data.location.x, data.location.y],
              content: this.newPositionMarkerContent,
              offset: new AMap.Pixel(-15, -18)
            })
            // 将 markers 添加到地图
            this.map.add(this.newPositionMarker);
          } else {
            this.map.setCity('株洲市');
          }
          //相关资料
          data.relevantInfomationData ? this.AttachmentArr = JSON.parse(data.relevantInfomationData) : null

          if (node.forceType == 0 && node.level == 0) {
            this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData
            this.ZongcontactData = JSON.parse(data.contactData) || this.ZongcontactData
          }
          if (node.forceType == 0 && node.level == 1) {
            this.ZongpersonCountData = JSON.parse(data.personCountData) || this.ZongpersonCountData
            this.ZhicontactData = JSON.parse(data.contactData) || this.ZhicontactData
          }
          if (node.forceType == 0 && (node.level == 2 || node.level == 3)) {
            this.DaZhongpersonCountData = JSON.parse(data.personCountData) || this.DaZhongpersonCountData
            this.DaZhongcontactData = JSON.parse(data.contactData) || this.DaZhongcontactData
          }
          if (node.forceType != 0) {
            this.otherpersonCountData = JSON.parse(data.personCountData) || this.otherpersonCountData
            this.othercontactData = JSON.parse(data.contactData) || this.othercontactData
          }
        })
      } else {

        this.map.setCity('株洲市');
      }

      //寻找管辖单位
      this.allFireForceList.forEach(item => {
        if (item.id == node.parentId) {
          this.superior.name = item.name
          this.superior.code = item.code
        }
      })
    }
  }
  //搜索
  isTreeView: boolean = true//决定显示树还是列表
  searchList() {
    if (!this.searchForm.name && !this.searchForm.integrityNum) {
      this.isTreeView = true
    } else {
      this.isTreeView = false
    }

    this.getAllFireForce()
  }
  //重置搜索
  reset() {
    this.isTreeView = true
    this.selectedFireForceLevel = null
    this.searchForm = {
      name: '',
      integrityNum: ''
    }
    this.getAllFireForce()
  }
  //js乘法
  accMul(arg1, arg2, fix) {
    if (!parseInt(fix) == fix) {
      return;
    }
    var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
    try { m += s1.split(".")[1].length } catch (e) { }
    try { m += s2.split(".")[1].length } catch (e) { }
    if (m > fix) {
      return (Math.round(Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m - fix)) / Math.pow(10, fix));
    } else if (m <= fix) {
      return (Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)).toFixed(fix);
    } else {
      return (arg1 * arg2).toFixed(fix).toString();
    }
  }
  //完整度颜色
  integrity(width) {
    let _this = this
    let style: any = {}
    style.width = width + '%';
    if (width < 30) {
      style.background = '#FF5D4A'
    }
    if (width >= 30 && width < 60) {
      style.background = '#FFDD00'
    }
    if (width >= 60) {
      style.background = '#5CD64E'
    }
    return style
  }
  //删除某条消防队
  deleteFireForce(item, e) {
    e.stopPropagation()
    // console.log(this.dataSource.data)
    let isDelete = window.confirm(`确定要删除${item.name}吗`)
    if (isDelete) {
      // this.http.delete(`/api/CustomFireForce/${item.id}`).subscribe(data => {
      //   let config = new MatSnackBarConfig();
      //   config.verticalPosition = 'top';
      //   config.duration = 3000
      //   this.snackBar.open('删除成功','确定',config);
      //   this.upDateAllFireForce()
      //   if(item.id == this.selectedFireForce.id){
      //     this.selectedFireForceLevel = null
      //   }
      // })
      let body = {
        title: item.name,
        operation: 2,//删除操作方式
        contentType: 13,//消防力量类型
        itemId: item.id,
        verifyState: 3,
      }
      this.http.post('/api/ContentVerifies', body).subscribe((data) => {
        let config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('删除审核提交成功', '确定', config);
        item.contentVerify = data
      })
    }
  }
  //当前点击tab页面第几个
  tabIndex: any = 1
  selectedTab(index) {
    this.tabIndex = index
  }

  //消防力量详情提交信息
  FireForceDetailInfo: any = {
    // id:'',//编号
    stationName: '',//队站名称
    isIndependentAlarm: true,//是否独立报警
    phoneNumber: '',//联系电话
    faxNumber: '',//传真
    jurisdictionArea: null,//辖区面积
    remark: '',//备注
    address: '',//地址
    location: {
      x: '',
      y: ''
    },
    personCountData: [],//人员数量自定义
    contactData: [],//联系方式自定义
    dutyForceData: [],//执勤力量自定义
    relevantInfomationData: []//相关资料
  }
  //总队支队人员数量
  ZongpersonCountData: any = [
    { PropertyName: '现役官兵人数', PropertyValue: '' },
    { PropertyName: '政府专职消防员数', PropertyValue: '' },
    { PropertyName: '消防文员数', PropertyValue: '' }
  ]
  //总队联系方式
  ZongcontactData: any = [
    { PropertyName: '总队长名称', PropertyValue: '' },
    { PropertyName: '总队长联系方式', PropertyValue: '' },
    { PropertyName: '总队政委名称', PropertyValue: '' },
    { PropertyName: '总队政委联系方式', PropertyValue: '' }
  ]
  //支队联系方式
  ZhicontactData: any = [
    { PropertyName: '支队长名称', PropertyValue: '' },
    { PropertyName: '支队长联系方式', PropertyValue: '' },
    { PropertyName: '支队政委名称', PropertyValue: '' },
    { PropertyName: '支队政委联系方式', PropertyValue: '' }
  ]
  //大队中队人员数量
  DaZhongpersonCountData: any = [
    { PropertyName: '现役人员', PropertyValue: '' },
    { PropertyName: '政府专职消防员数', PropertyValue: '' },
    { PropertyName: '每日执勤人数', PropertyValue: '' }
  ]
  //大队中队联系方式
  DaZhongcontactData: any = [
    { PropertyName: '站长姓名', PropertyValue: '' },
    { PropertyName: '站长联系方式', PropertyValue: '' },
    { PropertyName: '指导员姓名', PropertyValue: '' },
    { PropertyName: '指导员联系方式', PropertyValue: '' },
    { PropertyName: '副指导员姓名', PropertyValue: '' },
    { PropertyName: '副指导员联系方式', PropertyValue: '' },
    { PropertyName: '副站长一姓名', PropertyValue: '' },
    { PropertyName: '副站长一联系方式', PropertyValue: '' },
    { PropertyName: '副站长二姓名', PropertyValue: '' },
    { PropertyName: '副站长二联系方式', PropertyValue: '' },
    { PropertyName: '副站长三姓名', PropertyValue: '' },
    { PropertyName: '副站长三联系方式', PropertyValue: '' }
  ]
  //其他消防力量联系方式
  othercontactData: any = [
    { PropertyName: '队长', PropertyValue: '' },
    { PropertyName: '联系方式', PropertyValue: '' },
    { PropertyName: '站长', PropertyValue: '' },
    { PropertyName: '联系方式', PropertyValue: '' },
    { PropertyName: '负责人', PropertyValue: '' },
    { PropertyName: '联系方式', PropertyValue: '' }
  ]
  //其他消防力量人员数量
  otherpersonCountData: any = [
    { PropertyName: '每日执勤人数', PropertyValue: '' },
    { PropertyName: '消防队员总人数', PropertyValue: '' },
    { PropertyName: '执勤车辆数', PropertyValue: '' },
    { PropertyName: '灭火剂总量', PropertyValue: '' }
  ]
  //清空表单数据
  clearData() {
    this.deletedFile = []//清空相关资料已删除缓存
    this.AttachmentArr = []//清空相关资料
    this.positionLngLat = { x: '', y: '' }
    this.FireForceDetailInfo = {
      // id:'',//编号
      stationName: '',//队站名称
      isIndependentAlarm: null,//是否独立报警
      phoneNumber: '',//联系电话
      faxNumber: '',//传真
      jurisdictionArea: null,//辖区面积
      remark: '',//备注
      address: '',//地址
      location: {
        x: '',
        y: ''
      },
      personCountData: [],//人员数量自定义
      contactData: [],//联系方式自定义
      dutyForceData: [],//执勤力量自定义
      relevantInfomationData: []//相关资料
    }
    this.ZongpersonCountData = [
      { PropertyName: '现役官兵人数', PropertyValue: '' },
      { PropertyName: '政府专职消防员数', PropertyValue: '' },
      { PropertyName: '消防文员数', PropertyValue: '' }
    ]
    this.ZongcontactData = [
      { PropertyName: '总队长名称', PropertyValue: '' },
      { PropertyName: '总队长联系方式', PropertyValue: '' },
      { PropertyName: '总队政委名称', PropertyValue: '' },
      { PropertyName: '总队政委联系方式', PropertyValue: '' }
    ]
    this.ZhicontactData = [
      { PropertyName: '支队长名称', PropertyValue: '' },
      { PropertyName: '支队长联系方式', PropertyValue: '' },
      { PropertyName: '支队政委名称', PropertyValue: '' },
      { PropertyName: '支队政委联系方式', PropertyValue: '' }
    ]
    this.DaZhongpersonCountData = [
      { PropertyName: '现役人员', PropertyValue: '' },
      { PropertyName: '政府专职消防员数', PropertyValue: '' },
      { PropertyName: '每日执勤人数', PropertyValue: '' }
    ]
    this.DaZhongcontactData = [
      { PropertyName: '站长姓名', PropertyValue: '' },
      { PropertyName: '站长联系方式', PropertyValue: '' },
      { PropertyName: '指导员姓名', PropertyValue: '' },
      { PropertyName: '指导员联系方式', PropertyValue: '' },
      { PropertyName: '副指导员姓名', PropertyValue: '' },
      { PropertyName: '副指导员联系方式', PropertyValue: '' },
      { PropertyName: '副站长一姓名', PropertyValue: '' },
      { PropertyName: '副站长一联系方式', PropertyValue: '' },
      { PropertyName: '副站长二姓名', PropertyValue: '' },
      { PropertyName: '副站长二联系方式', PropertyValue: '' },
      { PropertyName: '副站长三姓名', PropertyValue: '' },
      { PropertyName: '副站长三联系方式', PropertyValue: '' }
    ]
    this.othercontactData = [
      { PropertyName: '队长', PropertyValue: '' },
      { PropertyName: '联系方式', PropertyValue: '' },
      { PropertyName: '站长', PropertyValue: '' },
      { PropertyName: '联系方式', PropertyValue: '' },
      { PropertyName: '负责人', PropertyValue: '' },
      { PropertyName: '联系方式', PropertyValue: '' }
    ]
    this.otherpersonCountData = [
      { PropertyName: '每日执勤人数', PropertyValue: '' },
      { PropertyName: '消防队员总人数', PropertyValue: '' },
      { PropertyName: '执勤车辆数', PropertyValue: '' },
      { PropertyName: '灭火剂总量', PropertyValue: '' }
    ]
  }
  //新增消防力量
  selectedFireForceTypeIndex: any//新增消防力量名称
  addFireForce() {
    if (this.selectedFireForceId && this.selectedFireForce.forceType == 0) {
      const dialogRef = this.dialog.open(AddFireForce, {
        data: {},
        id: 'addWater'
      });
      dialogRef.afterClosed().subscribe(
        data => {
          if (typeof data === 'number' && !isNaN(data)) {
            this.isPost = true
            this.selectedFireForceTypeIndex = data
            this.selectedFireForceLevel = data
            //  this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null
            //  this.positionLngLat.x = 0
            //  this.positionLngLat.y = 0
            //  this.map.setCity('株洲市');
            this.selectedFireForce.contentVerify = null
            this.clearData()
          }
        }
      );
    } else if (this.selectedFireForceId && this.selectedFireForce.forceType != 0) {
      let config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('该选中机构无法增加其他机构', '确定', config);
    } else {
      let config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('请先从左侧列表选择一个组织机构', '确定', config);
    }

  }
  //保存
  isPost: boolean = false//是否走post创建接口
  newselectedFireForceId: any //创建成功其他消防力量后保存一下创建出来的id
  save() {
    if (!this.FireForceDetailInfo.stationName) {
      alert('名称必填')
      return
    }
    //删除一下数据库的文件
    if (this.deletedFile.length != 0) {
      this.deletedFile.forEach(item => {
        this.http.delete(`/api/Objects/PlanPlatform/${item.objectName}`).subscribe(data => {
          // console.log('删除原文件成功')
        })
      });
    }
    this.FireForceDetailInfo.jurisdictionArea = Number(this.FireForceDetailInfo.jurisdictionArea)
    this.FireForceDetailInfo.relevantInfomationData = JSON.stringify(this.AttachmentArr)
    // console.log(1111,this.FireForceDetailInfo)
    //如果是总支大中
    this.FireForceDetailInfo.location = { x: '', y: '' }
    if (this.atLastPositionLngLat.x) {
      this.FireForceDetailInfo.location.x = this.atLastPositionLngLat.x
      this.FireForceDetailInfo.location.y = this.atLastPositionLngLat.y
    } else {
      this.FireForceDetailInfo.location = null
    }
    if (this.selectedFireForce.forceType == 0 && (this.selectedFireForceLevel == 0 || this.selectedFireForceLevel == 1 || this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3)) {//如果是总队
      let body = this.FireForceDetailInfo

      if (this.selectedFireForceLevel == 0) {//总队
        this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData)
        this.FireForceDetailInfo.contactData = JSON.stringify(this.ZongcontactData)
        this.FireForceDetailInfo.dutyForceData = null
      }
      if (this.selectedFireForceLevel == 1) {//支队
        this.FireForceDetailInfo.personCountData = JSON.stringify(this.ZongpersonCountData)
        this.FireForceDetailInfo.contactData = JSON.stringify(this.ZhicontactData)
        this.FireForceDetailInfo.dutyForceData = null
      }
      if (this.selectedFireForceLevel == 2 || this.selectedFireForceLevel == 3) {//大队 中队
        this.FireForceDetailInfo.personCountData = JSON.stringify(this.DaZhongpersonCountData)
        this.FireForceDetailInfo.contactData = JSON.stringify(this.DaZhongcontactData)
        this.FireForceDetailInfo.dutyForceData = null
      }
      // console.log('body',body)
      this.http.put(`/api/FireForceDetail/0/${this.selectedFireForce.id}`, body).subscribe(data => {
        let config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('保存成功', '确定', config);
        this.upDateAllFireForce()
      })
    }
    //如果是其他消防力量
    else {
      if (!this.isPost) {
        let body = this.FireForceDetailInfo
        body.personCountData = JSON.stringify(this.otherpersonCountData)
        body.contactData = JSON.stringify(this.othercontactData)
        body.dutyForceData = null
        let id
        if (this.selectedFireForce.forceType == 0) {
          id = this.newselectedFireForceId
        } else {
          id = this.selectedFireForce.id
        }
        this.http.put(`/api/FireForceDetail/1/${id}`, body).subscribe(data => {
          let config = new MatSnackBarConfig();
          config.verticalPosition = 'top';
          config.duration = 3000
          this.snackBar.open('保存成功', '确定', config);
          this.upDateAllFireForce()
        })
      } else {
        let forceType
        this.selectedFireForceTypeIndex == 4 ? forceType = 1 : null
        this.selectedFireForceTypeIndex == 5 ? forceType = 2 : null
        this.selectedFireForceTypeIndex == 6 ? forceType = 4 : null
        let body = {
          organizationId: this.selectedFireForce.id,
          name: this.FireForceDetailInfo.stationName,
          createTime: new Date(),
          forceType: forceType
        }
        let params = {
          organizationId: this.selectedFireForce.id
        }
        this.http.post('/api/CustomFireForce', body, { params: params }).subscribe((data: any) => {
          this.newselectedFireForceId = data.id
          this.selectedFireForce = data
          let body = this.FireForceDetailInfo
          body.personCountData = JSON.stringify(this.otherpersonCountData)
          body.contactData = JSON.stringify(this.othercontactData)
          body.dutyForceData = null
          this.http.put(`/api/FireForceDetail/1/${data.id}`, body).subscribe(data2 => {
            this.upDateAllFireForce()
            this.selectedFireForceId = data.id
            this.isPost = false
            let config = new MatSnackBarConfig();
            config.verticalPosition = 'top';
            config.duration = 3000
            this.snackBar.open('保存成功', '确定', config);
          })
        })
      }


    }


  }
  //提交审核
  submitAudit() {
    let isTrue = window.confirm('请确认保存后提交审核，否则将无法审核最新内容，是否继续？')
    if (isTrue) {
      // console.log('提交审核的消防力量',this.FireForceDetailInfo)
      let body = {
        title: this.FireForceDetailInfo.stationName,
        operation: this.selectedFireForce.contentVerify ? 1 : 0,//操作方式
        contentType: 13,//消防力量类型
        itemId: this.selectedFireForce.id,
        verifyState: 3,
      }
      this.http.post('/api/ContentVerifies', body).subscribe((data) => {
        this.selectedFireForce.contentVerify = data
        let config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('提交成功', '确定', config);
      })
    }

  }
  //撤销审核
  cancelAudit() {
    let isTrue = window.confirm('您确认要撤销该审核吗？')
    if (isTrue) {
      // console.log('撤销审核的消防力量',this.waterData)
      this.http.delete(`/api/ContentVerifies/${this.selectedFireForce.contentVerify.id}`).subscribe((data) => {
        this.selectedFireForce.contentVerify = null
        let config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('撤销成功', '确定', config);
      })
    }
  }
  close() {
    this.selectedFireForceLevel = null
    this.selectedFireForceId = null
    this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null
    this.isGisTopBox = false
  }
  map: any
  placeSearch: any//构造地点查询类
  isMapLabel: boolean = false //是否已经标记坐标
  newPositionMarkerContent: any =
    '<div class="custom-content-marker">' +
    '   <img src="/assets/images/dingwei.png">' +
    '</div>'
  newPositionMarkerContentBtn: any =
    '<div class="custom-content-marker">' +
    '   <img src="/assets/images/dingwei.png">' +
    '   <div  class="btnbox"><img id="setPositionOk" src="/assets/images/ok.png"><span>|</span><img id="setPositionClose" src="/assets/images/close.png"></div>' +
    '</div>'
  //创建地图
  newPositionMarker: any//坐标实例
  createMap() {
    this.map = new AMap.Map('container', {
      zoom: 12
    })
    this.map.setCity('株洲市');
    //输入提示
    var autoOptions = {
      input: "tipinput"
    };
    AMap.plugin(['AMap.PlaceSearch', 'AMap.AutoComplete'], () => {
      let auto = new AMap.AutoComplete(autoOptions);
      this.placeSearch = new AMap.PlaceSearch();  //构造地点查询类
      auto.on("select", (e) => {
        this.newPositionMarker.setPosition([e.poi.location.lng, e.poi.location.lat])
        this.positionLngLat = { x: e.poi.location.lng, y: e.poi.location.lat }
        this.map.setCenter([e.poi.location.lng, e.poi.location.lat]); //设置地图中心点
      });//注册监听，当选中某条记录时会触发

    });
  }
  //点击位置
  isGisTopBox: boolean = false //
  searchTitle: any = ''//

  positionLngLat: any = { x: '', y: '' }//临时坐标点
  atLastPositionLngLat: any = { x: '', y: '' }//最终坐标点
  setPosition() {
    if (!this.isGisTopBox) {
      this.isGisTopBox = true
      this.newPositionMarker ? this.map.remove(this.newPositionMarker) : null
      let center
      if (this.newPositionMarker && this.atLastPositionLngLat.x) {//如果已经标注单位坐标
        center = [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]
      } else if (this.newPositionMarker && !this.atLastPositionLngLat.x && this.FireForceDetailInfo.location && this.FireForceDetailInfo.location.x) {
        center = [this.FireForceDetailInfo.location.x, this.FireForceDetailInfo.location.y]
      } else {
        center = this.map.getCenter(); //获取当前地图中心位置
      }
      this.newPositionMarker = new AMap.Marker({
        draggable: true,
        position: center,
        content: this.newPositionMarkerContentBtn,
        offset: new AMap.Pixel(-15, -18)
      });
      this.positionLngLat = { x: center.lng || center[0], y: center.lat || center[1] }
      this.map.add(this.newPositionMarker);
      this.isMapLabel = true
      this.newPositionMarker.on('dragend', (e) => {
        this.positionLngLat = { x: e.lnglat.lng, y: e.lnglat.lat }
      })
      //点击确定
      this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'), 'click', (event) => {
        this.isGisTopBox = false
        this.map.remove(this.newPositionMarker)
        this.newPositionMarker = new AMap.Marker({
          position: [this.positionLngLat.x, this.positionLngLat.y],
          content: this.newPositionMarkerContent,
          offset: new AMap.Pixel(-15, -18)
        });
        this.atLastPositionLngLat = JSON.parse(JSON.stringify(this.positionLngLat))
        this.map.add(this.newPositionMarker);
        this.positionLngLat = this.atLastPositionLngLat
      })
      this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'), 'click', (event) => {
        this.isGisTopBox = false
        this.map.remove(this.newPositionMarker)
        if (this.positionLngLat.x && this.positionLngLat.x != 0 && !this.atLastPositionLngLat.x) {//直接取消
          this.map.remove(this.newPositionMarker)
          this.positionLngLat = {}
          this.atLastPositionLngLat = {}
        } else {
          this.newPositionMarker = new AMap.Marker({
            position: [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y],
            content: this.newPositionMarkerContent,
            offset: new AMap.Pixel(-15, -18)
          });
          this.map.setCenter([this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]); //设置地图中心点
          this.map.add(this.newPositionMarker);
          this.positionLngLat = this.atLastPositionLngLat
        }
      })//取消
      this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionOk'), 'touchstart', (event) => {
        this.isGisTopBox = false
        this.map.remove(this.newPositionMarker)
        this.newPositionMarker = new AMap.Marker({
          position: [this.positionLngLat.x, this.positionLngLat.y],
          content: this.newPositionMarkerContent,
          offset: new AMap.Pixel(-15, -18)
        });
        this.atLastPositionLngLat = JSON.parse(JSON.stringify(this.positionLngLat))
        this.map.add(this.newPositionMarker);
        this.positionLngLat = this.atLastPositionLngLat
      })
      this.renderer2.listen(this.elementRef.nativeElement.querySelector('#setPositionClose'), 'touchstart', (event) => {
        this.isGisTopBox = false
        this.map.remove(this.newPositionMarker)
        if (this.positionLngLat.x && this.positionLngLat.x != 0 && !this.atLastPositionLngLat.x) {//直接取消
          this.map.remove(this.newPositionMarker)
          this.positionLngLat = {}
          this.atLastPositionLngLat = {}
        } else {
          this.newPositionMarker = new AMap.Marker({
            position: [this.atLastPositionLngLat.x, this.atLastPositionLngLat.y],
            content: this.newPositionMarkerContent,
            offset: new AMap.Pixel(-15, -18)
          });
          this.map.setCenter([this.atLastPositionLngLat.x, this.atLastPositionLngLat.y]); //设置地图中心点
          this.map.add(this.newPositionMarker);
          this.positionLngLat = this.atLastPositionLngLat
        }
      })//取消
    }

  }


  //上传附件
  file: any; //上传的文件
  AttachmentArr: any = []//上传附件地址集合
  uploadId: any//分块上传id
  objectName: any
  progressBarValue: any = 0//分块上传进度
  isMasklayer: boolean = false//圆圈遮罩层是否打开
  isMasklayerUploading: boolean = false//上传进度条遮罩层是否打开
  isMasklayerDownload: boolean = false//下载进度条遮罩层是否打开
  uploadAttachment(e) {
    this.file = e.target.files[0] || null //上传的文件
    let file = e.target.files[0] || null //获取上传的文件
    let fileSize = file.size || null //上传文件的总大小
    let shardSize = 5 * 1024 * 1024 //5MB一个分片

    if (file && fileSize <= shardSize) { //上传文件<=5MB时
      this.isMasklayer = true
      let formData = new FormData()
      formData.append("file", file)
      let storageFolderId //要存储到服务器的文件夹id 一般为当前选中单位的id 如果新创建的话就存到public文件夹
      this.selectedFireForce.id ? storageFolderId = this.selectedFireForce.id : storageFolderId = 'public'
      this.http.post(`/api/Objects/PlanPlatform/FireForce/${storageFolderId}`, formData).subscribe((data: any) => {
        let obj = {
          objectName: data.objectName,
          fileName: data.fileName,
          fileLength: data.fileLength
        }
        this.AttachmentArr.push(obj)
        this.isMasklayer = false
        let config = new MatSnackBarConfig();
        config.verticalPosition = 'top';
        config.duration = 3000
        this.snackBar.open('上传成功', '确定', config);
      })
    } else if (file && fileSize > shardSize) { //上传文件>5MB时,分块上传
      this.isMasklayerUploading = true
      let data = { filename: file.name }
      let storageFolderId //要存储到服务器的文件夹id 一般为当前选中单位的id 如果新创建的话就存到public文件夹
      this.selectedFireForce.id ? storageFolderId = this.selectedFireForce.id : storageFolderId = 'public'
      this.http.post(`/api/NewMultipartUpload/PlanPlatform/FireForce/${storageFolderId}`, {}, { params: data }).subscribe((data: any) => { //初始化分段上传
        this.objectName = data.objectName
        this.uploadId = data.uploadId
        this.subsectionUploading()
      })
    }
  }
  PartNumberETag: any = []; //每次返回需要保存的信息

  //开始分段上传
  async subsectionUploading() {
    let file = this.file || null //获取上传的文件
    let fileSize = file.size || null //上传文件的总大小
    let shardSize = 5 * 1024 * 1024 //5MB一个分片
    let allSlice = Math.ceil(fileSize / shardSize) //总文件/5MB===共分多少段
    for (let i = 0; i < allSlice; i++) { //循环分段上传
      let start = i * shardSize //切割文件开始位置
      let end = Math.min(fileSize, start + shardSize); //切割文件结束位置
      let formData = new FormData()
      formData.append("file", file.slice(start, end))

      //同步写法实现异步调用
      let result = await new Promise((resolve, reject) => {
        // await 需要后面返回一个 promise 对象
        this.http.post(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i + 1}`, formData).subscribe((data: any) => {
          let msg = {
            "partNumber": data.partNumber || null,
            "eTag": data.eTag || null
          }
          resolve(msg) // 调用 promise 内置方法处理成功
        })
      });
      this.PartNumberETag.push(result)
      // this.progressBarValue = Number((i/allSlice).toFixed(2))*100
      this.progressBarValue = this.accMul(Number((i / allSlice).toFixed(2)) * 100, 1, 0)
      if (this.PartNumberETag.length === allSlice) {
        this.progressBarValue = 100
        this.endUploading()
      }
    }//for循环

  }

  //完成分块上传
  endUploading() {
    let data = this.PartNumberETag
    let paramsData = { uploadId: this.uploadId }
    this.http.post(`/api/CompleteMultipartUpload/PlanPlatform/${this.objectName}`, data, { params: paramsData }).subscribe(data => {
      this.PartNumberETag = [] //清空保存返回的信息
      let obj = {
        objectName: this.objectName,
        fileName: this.file.name,
        fileLength: this.file.size
      }
      this.AttachmentArr.push(obj)
      this.isMasklayerUploading = false//关闭进度条遮罩层
      this.progressBarValue = 0//重置进度数
      let config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('上传成功', '确定', config);
    })
  }

  //取消分块上传
  cancelUploading() {
    this.http.delete(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}`).subscribe(data => {
      this.progressBarValue = 0;
      this.isMasklayerUploading = false
      this.PartNumberETag = [] //清空保存返回的信息
      const config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('取消上传成功', '确定', config);
    })
  }

  //下载
  download(e) {
    this.isMasklayerDownload = true //开启下载进度条
    let file = e //传递过来的文件元数据
    let fileSize = file.fileLength //下载文件的总大小
    let shardSize = 3 * 1024 * 1024 //文件大小是否大于10MB
    if (file && fileSize <= shardSize) { //<=3MB时直接下载
      this.progressBarValue = 60
      this.http.get(`/api/Objects/PlanPlatform/${e.objectName}`, { responseType: 'blob' },).subscribe(data => {
        let url = window.URL.createObjectURL(new Blob([data])); //createObjectURL创建一个下载Blob的url地址
        let link = document.createElement("a");
        link.style.display = "none";
        link.href = url;
        let fileName = e.fileName ? e.fileName : e.objectName.split('/')[e.objectName.split('/').length - 1]
        link.setAttribute("download", fileName);
        document.body.appendChild(link);
        link.click();
        this.isMasklayerDownload = false //关闭下载进度条
        this.progressBarValue = 0 //初始化进度条
      })
    } else if (file && fileSize > shardSize) { //>3MB时分块下载
      this.blockingDownload(e) //分段下载
    }

  }

  //分段下载并合并
  async blockingDownload(e) {
    let file = e //传递过来的文件元数据
    let fileSize = file.fileLength //下载文件的总大小
    let shardSize = 3 * 1024 * 1024 //3MB一个分片
    let allSlice = Math.ceil(fileSize / shardSize) //总文件/3MB===共分多少段
    let allFile: any = [] //所有的file分段

    for (let i = 0; i < allSlice; i++) {
      let start = i * shardSize //每次下载文件开始位置
      let end = Math.min(fileSize, start + shardSize - 1); //每次下载文件结束为止

      let result = await new Promise((result, reject) => {
        this.http.get(`/api/Objects/PlanPlatform/${e.objectName}`, { headers: { 'range': `bytes= ${start}-${end}` }, responseType: 'blob' }).subscribe(data => {
          result(data)
        })
      })
      allFile.push(result)
      // this.progressBarValue = Number((i/allSlice).toFixed(2))*100 //文件进度数
      this.progressBarValue = this.accMul(Number((i / allSlice).toFixed(2)) * 100, 1, 0)
      if (allFile.length === allSlice) { //合并文件输出给浏览器
        let url = window.URL.createObjectURL(new Blob(allFile)); //createObjectURL创建一个下载Blob的url地址
        let link = document.createElement("a");
        link.style.display = "none";
        link.href = url;
        let fileName = e.fileName ? e.fileName : e.objectName.split('/')[e.objectName.split('/').length - 1]
        link.setAttribute("download", fileName);
        document.body.appendChild(link);
        link.click();
        this.isMasklayerDownload = false //关闭下载进度条
        this.progressBarValue = 0 //初始化进度条
      }

    } //for循环结束

  }

  //删除图片
  deletedFile: any = []
  deleteFile(item, e) {
    e.stopPropagation()
    let isTrue = window.confirm('确定要删除该文件吗？')
    if (isTrue) {
      let index
      this.AttachmentArr.forEach((element, key) => {
        if (element.objectName == item.objectName) {
          index = key
        }
      });
      this.AttachmentArr.splice(index, 1)
      this.deletedFile.push(item)
      let config = new MatSnackBarConfig();
      config.verticalPosition = 'top';
      config.duration = 3000
      this.snackBar.open('删除成功', '确定', config);
    }
  }

  //点击文件
  clickFile(item) {
    let suffix = item.fileName.split('.')[item.fileName.split('.').length - 1]
    if (suffix == 'png' || suffix == 'jpg' || suffix == 'JPG') {
      let dom = document.getElementById(`viewerjs`)
      let pObjs = dom.childNodes;
      let node = document.createElement("img")
      node.style.display = "none";
      node.src = "/api/Objects/PlanPlatform/" + item.objectName;
      node.id = 'img'
      dom.appendChild(node)
      setTimeout(() => {
        let viewer = new Viewer(document.getElementById(`viewerjs`), {
          hidden: () => {
            dom.removeChild(pObjs[0]);
            viewer.destroy();
          }
        });
        node.click();
      }, 0);
    }
    if (suffix == 'docx' || suffix == 'doc' || suffix == 'pdf') {
      let fetchUrl = item.objectName
      let json = {
        doc: {
          docId: new Date(),
          title: item.fileName,
          fetchUrl: `http://39.106.78.171:8000/api/Objects/PlanPlatform/` + fetchUrl
        },
        user: {
          uid: "test",
          nickName: "test",
          avatar: "",
          privilege: [
            'FILE_READ', 'FILE_DOWNLOAD', 'FILE_PRINT'
          ],
        },
      }
      var stringjson = JSON.stringify(json)
      var wordArray = CryptoJS.enc.Utf8.parse(stringjson);
      var base64 = CryptoJS.enc.Base64.stringify(wordArray);
      window.open(`http://121.5.10.84:80/apps/editor/openPreview?data=${base64}`)
    }
    if (suffix == 'mp4') {
      const dialogRef = this.dialog.open(ViewDetails, {//调用open方法打开对话框并且携带参数过去
        data: { item: item, type: "video" },
        id: 'videodialog'
      });
      dialogRef.afterClosed().subscribe();
    }
  }

  //收起展开列表
  isPutDown: boolean = false
  putDown() {
    this.isPutDown = !this.isPutDown
  }
}



//新增消防力量弹出框
@Component({
  selector: 'addwater',
  templateUrl: './addFireForce.html',
  styleUrls: ['./fire-force.component.scss']
})
export class AddFireForce {

  constructor(private http: HttpClient, public dialogRef: MatDialogRef<AddFireForce>, @Inject(MAT_DIALOG_DATA) public data, public snackBar: MatSnackBar) { }


  addList: any = [
    { id: 4, name: '微型消防站' },
    { id: 5, name: '企业专职消防站' },
    { id: 6, name: '义务(志愿)消防站' }
  ]
  selectedFireForceTypeIndex: any = 4
  selecteAddType(item, key) {
    this.selectedFireForceTypeIndex = item.id

  }
  ngOnInit(): void {

  }

  confirm() {
    this.dialogRef.close(this.selectedFireForceTypeIndex)
  }

}

//查看图片大图和视频
@Component({
  selector: 'viewdetails',
  templateUrl: './viewdetails.html',
  styleUrls: ['./fire-force.component.scss']
})
export class ViewDetails {
  // myControl = new FormControl();
  //注入MatDialogRef，可以用来关闭对话框
  //要访问对话框组件中的数据，必须使用MAT_DIALOG_DATA注入令牌
  constructor(private http: HttpClient, public dialogRef: MatDialogRef<ViewDetails>, @Inject(MAT_DIALOG_DATA) public data) { }
  Url: string
  onNoClick(): void {
    this.dialogRef.close();
  }
  ngOnInit(): void {
    this.Url = '/api/Objects/PlanPlatform/' + this.data.item.objectName
  }
  closeDialog() {
    this.dialogRef.close();
  }

}