<template>
  <div class="bigBox">
    <MOSTY.FromPage :title="props.formData.title" @closeDialog="black">
      <template #content>
        <MOSTY.Assort :title="'基础信息'" />
        <el-form class="mosty-from-wrap" ref="ruleFormRef" label-width="170px" :model="fromData" :inline="true"
          :rules="rules" :disabled="!props.formData.saveBtnShow">

          <el-form-item label="所属场所:" prop="sitename" v-if="props.formData.id">
            <el-input v-model="fromData.sitename" style="width: 337px" disabled />
          </el-form-item>
          <el-form-item label="所属场所:" prop="sitename" v-if="!props.formData.id">
            <el-select v-model="fromData.sitename" @change="cahngecsmc" style="width: 337px" clearable
              placeholder="请选择场所名称">
              <el-option v-for="item in csmclist" :key="item" :label="item.placename" :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item :label="fromData.publicarea == '1' ? '所属场区:' : '所属建筑物:'" prop="buildingname"
            v-if="!props.formData.id">
            <el-select v-model="fromData.buildingname" @change="cahngejzwmc" clearable style="width: 337px"
              :placeholder="fromData.publicarea == '1' ? '请选择所属场区:' : '请选择所属建筑物:'">
              <el-option v-for="item in jzwlist" :key="item" :label="item.buildingname" :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item :label="fromData.publicarea == '1' ? '所属场区:' : '所属建筑物:'" prop="buildingname"
            v-if="props.formData.id">
            <el-input v-model="fromData.buildingname" disabled style="width: 337px" />
          </el-form-item>
          <el-form-item label="所属楼层:" prop="floorname" v-if="fromData.publicarea != '1' && !props.formData.id">
            <el-select v-model="fromData.floorname" @change="cahngelcmc" clearable style="width: 337px"
              placeholder="请选择所属楼层">
              <el-option v-for="item in lclist" :key="item" :label="item.floorname" :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item label="所属楼层:" prop="floorname" v-if="props.formData.id && fromData.publicarea != '1'">
            <el-input v-model.number="fromData.floorname" style="width: 337px" disabled />
          </el-form-item>
          <el-form-item :label="fromData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partname"
            v-if="!props.formData.id">
            <el-select v-model="fromData.partname" @change="cahngebw" clearable style="width: 337px"
              :placeholder="fromData.publicarea == '1' ? '请选择场区部位:' : '请选择所属部位:'">
              <el-option v-for="item in bwlist" :key="item" :label="item.partname ? item.partname : item.qtmc"
                :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item :label="fromData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partname"
            v-if="props.formData.id">
            <el-input v-model="fromData.partname" disabled style="width: 337px" />
          </el-form-item>
          <el-form-item label="部位类型:" prop="checktype">
            <MOSTY.DictTree :zdlist="bwlxlist" disabled :type="'array'" v-model="fromData.checktype"
              :placeholder='"请选择部位类型"' style="width: 337px;" />
          </el-form-item>
          <el-form-item label="部位面积:" prop="area">
            <el-input v-model.number="fromData.area" @blur="fromData.area = JEblurFn(fromData.area)" type="number"
              placeholder="请填写部位面积" disabled style="width: 337px">
              <template #append>平方米</template></el-input>
          </el-form-item>

          <el-form-item label="从业人员数量:" prop="practitioner">
            <el-input v-model.number="fromData.practitioner" type="number" style="width: 337px">
              <template #append>人</template></el-input>
          </el-form-item>
          <el-form-item label="火灾种类:" prop="firetype"
            :rules="[{ required: true, message: '请选择火灾种类', trigger: 'blur' }]">
            <div style="width: 337px;">
              <MOSTY.DictRidioAndSelect :dictData="props.zdlist.D_BZ_XFZDBWHZLX" v-model="fromData.firetype"
                selectType="select" :disabled="false" />
            </div>
          </el-form-item>
          <el-form-item label="危险等级:" prop="dangerlevel"
            :rules="[{ required: true, message: '请选择危险等级', trigger: 'blur' }]">
            <div style="width: 337px;">
              <MOSTY.DictRidioAndSelect :dictData="props.zdlist.D_BZ_XFZDBWWXDJ" v-model="fromData.dangerlevel"
                selectType="select" :disabled="false" />
            </div>
          </el-form-item>
          <el-form-item label="耐火等级:" v-if='fromData.publicarea != "1"' prop="fireresisrating">
            <el-select v-model="fromData.fireresisrating" clearable placeholder="请选择耐火等级" style="width: 337px">
              <el-option v-for="item in props.zdlist.D_TB_NHDJ" :key="item" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="确立消防重点部位原因:" prop="establishreason">
            <el-select v-model="fromData.establishreason" clearable placeholder="请选择确立消防重点部位原因" style="width: 337px">
              <el-option v-for="item in props.zdlist.D_BZ_QLYY" :key="item" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>

          <el-form-item label="是否张贴重点部位标志:" prop="putUpFlag">
            <div style="width: 337px;">
              <MOSTY.DictRidioAndSelect :dictData="props.zdlist.D_BZ_SF" v-model="fromData.putUpFlag" selectType="radio"
                :disabled='!props.formData.saveBtnShow' />
            </div>
          </el-form-item>
          <el-form-item label="危险源情况:" prop="sourceOfDanger">
            <el-input v-model="fromData.sourceOfDanger" placeholder="请输入危险源情况" style="width: 337px"
              clearable></el-input>
          </el-form-item>
          <el-form-item label="火种情况:" prop="sourceOfFire">
            <el-select v-model="fromData.sourceOfFire" clearable placeholder="请选择火种情况" style="width: 337px">
              <el-option v-for="item in props.zdlist.D_BZ_HZQK" :key="item" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="消防安全管理措施:" prop="fsqcmeasures">
            <el-input v-model="fromData.fsqcmeasures" placeholder="请输入消防安全管理措施" style="width: 337px"
              clearable></el-input>
          </el-form-item>


          <el-form-item label="部位信息图片:" style="width: 100%;">
            <div style='display:flex;'>
              <MOSTY.ErwmImg v-if="fromData.id"
                :url="qrcodeImg(fromData.id, 'P', fromData.sitename, fromData.partname ? fromData.partname : fromData.qtmc)"
                :filename='"部位二维码"' />
              <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="false" :isImg="true" :ShowfileList="false"
                :disabled='!props.formData.saveBtnShow' v-model="fromData.venuefile" @filehandleChange="changeFiles">
              </MOSTY.Upload>
            </div>

          </el-form-item>
        </el-form>
        <MOSTY.Assort :title="'管理信息'" />
        <el-form :model="fromData" ref="ruleFormRef2" label-position="right" label-width="150px" :disabled='true'>
          <el-form-item label="责任部门:" style="display: flex">
            <el-input v-model="fromData.deptname" placeholder="请选择责任部门" clearable disabled style="width: 337px">
              <template #append>
                <el-button class='cursor' @click="ChooesDdld('01')">选择</el-button></template>
            </el-input>
          </el-form-item>
          <el-form-item label="岗位负责人:" prop="postusername" style="display: flex;width:100%;">
            <el-input v-model="fromData.postusername" placeholder="请选择岗位负责人" type="textarea" :rows="4" readonly
              style="width: 93%" clearable>
            </el-input>
            <el-button class='cursor ml10' @click="ChooesDdld('02')">选择</el-button>
          </el-form-item>


        </el-form>
        <div v-if='props.formData.id'>
          <MOSTY.Assort :title="'关联信息(固定信息、动态信息)'" />
          <div>
            <div class='table-lable'>
              <span>固定信息</span>
              <img :src="getImgUrl('img/icon-jt.png')" style='cursor:pointer' @click='isShowgd = !isShowgd' />
            </div>
            <div v-show='isShowgd'>
              <MOSTY.TabList :tablist='tablist' :equipmentType="equipmentType" :type='"bw"' :obj='fromData'
                @handleChange="changelicolor" @resetChange='resetChange' />
            </div>
          </div>
          <div>
            <div class=' table-lable'>
              <span>动态信息</span>
              <img :src="getImgUrl('img/icon-jt.png')" style='cursor:pointer' @click='isShowdt = !isShowdt' />
            </div>
            <div v-show='isShowdt'>
              <MOSTY.TabList :tablist='tablist2' :type='"bw"' :obj='fromData' @handleChange="changelicolor2" />
            </div>
          </div>
        </div>
      </template>
      <template #footer>

        <el-button type="primary" @click="submit(ruleFormRef)" v-loading='saveloading'
          v-if="props.formData.saveBtnShow">
          <el-icon>
            <DocumentChecked />
          </el-icon>保存
        </el-button>
        <el-button @click="black">
          <el-icon>
            <DocumentDelete />
          </el-icon>关闭
        </el-button>
      </template>
      <template #dwbox>
        <!-- 选择部门 -->
        <Choosebm :showDdld="showDept" @closezzjg="closezzjg" @listdata="getSonValue" :zzlx="zzlx" />
        <ChooseUser v-model="chooseUserVisible" :Single="singleShow" :data="memberList" :deptId='fromData.deptid'
          @choosedUsers="getSonValue"></ChooseUser>
      </template>
    </MOSTY.FromPage>
  </div>
</template>

<script setup>
import {
  reactive,
  ref,
  defineAsyncComponent,
  onMounted,
  onUnmounted,
  getCurrentInstance

} from "vue";
import * as MOSTY from "@/components/MyComponents/index";
import Choosebm from "@/components/MyComponents/ChooseDept/index.vue";
import ChooseUser from "@/components/MyComponents/ChooseUser/Leader.vue";
import { ElMessage } from "element-plus";
import { JEblurFn } from "@/utils/auth.js";
import { getImgUrl } from "@/utils/tools.js"
import { getApi, deleteApi, putApi, postApi } from "@/api/tobAcco_api.js";
import * as rule from "@/utils/rules.js";
import { qrcodeImg } from "@/utils/tools.js";
const { proxy } = getCurrentInstance();
const tablist = ref([
  { title: '办公区域', icon: 'jianzhuwu', actives: true, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Bgqyindex.vue")) },
  { title: '安防设备设施', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Security.vue")) },
  { title: '安防器材', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Apparatus.vue")) },
  { title: '消防设备设施', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Security.vue")) },
  { title: '消防器材', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Apparatus.vue")) },
  // { title: '安全标识', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Safetysigns.vue")) },
  { title: '生产设备设施', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Produce.vue")) },
  { title: '变配电设备设施', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Distributing.vue")) },
  { title: '特种设备', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Equipment.vue")) },
])
const tablist2 = ref([
  { title: '检查标准', num: 0, icon: 'jianzhuwu', sblx: '', actives: true, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Synthesize.vue")) },
  { title: '检查记录', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Standard.vue")) },
  { title: '风险清单', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Risklist.vue")) },
  { title: '隐患清单', num: 0, icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Pitfall.vue")) }
])
const rules = {
  sitename: [{ required: true, message: "请选择场所名称", trigger: "blur" }],
  buildingname: [{ required: true, message: "请选择所属建筑物", trigger: "blur" }],
  floorname: [{ required: true, message: "请选择所属楼层", trigger: "blur" }],
  partname: [{ required: true, message: "请选择所属部位", trigger: "blur" }],
  aqbslb: [{ required: true, message: "请选择标识类型", trigger: "blur" }],
  putUpFlag: [{ required: true, message: "请选择是否张贴重点部位标志", trigger: "blur" }],
  ...rule.znumberRule({ validator: true, require: true }, "area"),
  sourceOfDanger: [{ required: true, message: "请输入危险源情况", trigger: "change" }],
  fsqcmeasures: [{ required: true, message: "请输入消防安全管理措施", trigger: "change" }],
  state: [{ required: true, message: "请选择使用状态", trigger: "change" }],
  ...rule.znumberRule({ validator: true, require: true }, "area"),
  fireresisrating: [{ required: true, message: "请选择耐火类别", trigger: "blur" }],
  dangerlevel: [{ required: true, message: "请选择危险等级", trigger: "blur" }],
  sourceOfFire: [{ required: true, message: "请选择火种情况", trigger: "blur" }],
  establishreason: [{ required: true, message: "请选择确立消防重点部位原因", trigger: "blur" }],
  ...rule.numberzzsRule({ validator: true, require: true, num: 200 }, "practitioner"),
};
const saveloading = ref(false)

const isShowgd = ref(true)
const isShowdt = ref(true)
const bwlxlist = ref([])
const props = defineProps({
  formData: {
    type: Object,
    default: {}
  },
  type: {
    default: '',
    type: String
  },
  zdlist: {
    type: Object,
    default: {}
  }
});
const bwlist = ref([]);
const showDept = ref(false)
const emit = defineEmits("changePage");
const ruleFormRef = ref();
const ruleFormRef2 = ref();
const fromData = ref({
  state: '01'
})
const deptId = ref("");
const chooseUserVisible = ref(false); //选择领导弹窗
const singleShow = ref(true); //单选多选
const memberList = ref([]);
const zzlx = ref(null);
const addtype = ref('xfzdbw')
const csmclist = ref([]);
const jzwlist = ref([]);
const lclist = ref([]);
onMounted(() => {
  addtype.value = props.formData.type ? props.formData.type : 'xfzdbw';
  fromData.value.area = fromData.value.area ? Number(fromData.value.area).toFixed(2) : null
  fromData.value.saveBtnShow = props.formData.saveBtnShow;
  proxy.mittBus.on("mittxfss", (data) => {
    tablist.value[3].num = data
  });
  proxy.mittBus.on("mittxfqc", (data) => {
    tablist.value[4].num = data
  });
  proxy.mittBus.on("mittafss", (data) => {
    tablist.value[1].num = data
  });
  proxy.mittBus.on("mittafqc", (data) => {
    tablist.value[2].num = data
  });
  getApi({ zdbh: 'D_TB_JCYWLX', dm: '10' }, '/mosty-base/sysDict/getJcyelxDictTree').then(res => {
    res[0].itemList = res[0].itemList.filter(item => {
      return item.dm.indexOf('1001') == 0 || item.dm.indexOf('1002') == 0
    })
    bwlxlist.value = res[0].itemList
  })
  if (props.formData.id) {
    getmain(props.formData.id);
  } else {
    getcsData();

  }
});
onUnmounted(() => {
  proxy.mittBus.off("mittxfss");
  proxy.mittBus.off("mittxfqc");
  proxy.mittBus.off("mittafss");
  proxy.mittBus.off("mittafqc");
});
//根据操作人 查询 场所
function getcsData() {
  getApi({}, "/mosty-jcgl/site/getSiteListByUser").then((res) => {
    csmclist.value = res;
  });
}
//获取场所选择
const cahngecsmc = (val) => {
  csmclist.value.forEach((item) => {
    if (item.id == val) {
      fromData.value.siteid = item.id;
      fromData.value.sitename = item.placename;
      fromData.value.buildingname = '';
      fromData.value.buildingid = '';
      fromData.value.publicarea = '';
      fromData.value.floorname = '';
      fromData.value.floorid = '';
      fromData.value.partname = '';
      fromData.value.partid = '';
      getjzwlist(item.id)
    }
  });
};

//获取当前部位
const cahngebw = (val) => {
  bwlist.value.forEach((item) => {
    if (item.id == val) {
      fromData.value.partid = item.id;
      fromData.value.partname = item.partname ? item.partname : item.qtmc;
      getmain(item.id);

    }
  });
};

//	根据placeid，查询建筑物
function getjzwlist(placeid) {
  getApi({ placeid }, '/mosty-jcgl/building/queryBuildingByPlaceid').then(res => {
    jzwlist.value = res ? res : []
  })
}
//获取建筑物名称
function cahngejzwmc(val) {
  jzwlist.value.forEach((item) => {
    if (item.id == val) {
      fromData.value.buildingid = item.id;
      fromData.value.buildingname = item.buildingname;
      fromData.value.publicarea = item.publicarea;
      fromData.value.floorname = '';
      fromData.value.floorid = '';
      fromData.value.partname = '';
      fromData.value.partid = '';
      if (item.publicarea == '1') {
        getbwdata('01', item.id);
      } else {
        getlcdata(item.id);
      }
    }
  });
}
//根据建筑物查询楼层
function getlcdata(id) {
  getApi({ id }, '/mosty-jcgl/floor/queryFloorByBuildId').then(res => {
    lclist.value = res ? res : []
  })
}
//获取楼层名称
function cahngelcmc(val) {
  lclist.value.forEach((item) => {
    if (item.id == val) {
      fromData.value.floorid = item.id;
      fromData.value.floorname = item.floorname;
      fromData.value.partname = '';
      fromData.value.partid = '';
      getbwdata('02', item.id);
    }
  });
}

//(新)根据建筑物id查询部位
// 查询类型 01 - 建筑物下部位 02 - 楼层下部位
function getbwdata(type, id) {
  getApi({ type, id }, "/mosty-jcgl/importantPart/getPartList").then((res) => {
    bwlist.value = res ? res : [];
  });
}

//点击领导选择按钮
function ChooesDdld(val) {
  zzlx.value = val;
  memberList.value = [];
  if (val == "02") {
    if (fromData.value.deptid) {
      memberList.value = fromData.value.responsibleuserid ? fromData.value.responsibleuserid.split(',') : [];
      singleShow.value = false;
      chooseUserVisible.value = true;
    } else {
      ElMessage.error("请先选择责任部门！!");
    }

  } else {
    showDept.value = true;
  }
}
const getSonValue = (value) => {
  if (zzlx.value == "01") {
    fromData.value.deptname = value.orgName;
    fromData.value.deptid = value.id;
    deptId.value = value.id;
  } else if (zzlx.value == "02") {
    fromData.value.postusername = value.map(item => {
      if (item.mobile) {
        return item.userName + '（' + item.mobile + '）'
      } else {
        return item.userName
      }
    }).toString();
    fromData.value.postuserid = value.map(item => {
      return item.id
    }).toString();
  }
};

//关闭弹窗
const closezzjg = (val) => {
  showDept.value = val;
};
// 保存
const submit = async (ruleFormRef) => {
  saveloading.value = true
  if (!ruleFormRef) return;
  await ruleFormRef.validate((valid) => {
    if (valid) {
      ruleFormRef2.value.validate((valid) => {
        if (valid) {
          fromData.value.venuefile = fromData.value.venuefile ? fromData.value.venuefile.toString() : null;
          if (fromData.value) {
            if (props.type == 'add') {
              postApi(fromData.value, "/mosty-jcgl/importantPart/add")
                .then((res) => {
                  ElMessage.success("新增成功");
                  emit("changePage", res);
                }).finally(() => {
                  saveloading.value = false
                })
            } else {
              postApi(fromData.value, "/mosty-jcgl/importantPart/edit")
                .then((res) => {
                  ElMessage.success("修改成功");
                  emit("changePage");
                }).finally(() => {
                  saveloading.value = false
                })
            }
          }
        } else {
          ElMessage.error("请输入必填项!");
          saveloading.value = false
        }
      });
    } else {
      ElMessage.error("请输入必填项!");
      saveloading.value = false
    }
  });
};
//获取详情
function getmain(id) {
  if (id) {
    getApi({ id: id }, "/mosty-jcgl/importantPart/getInfo").then((res) => {
      if (res) {
        fromData.value = res;
        fromData.value.saveBtnShow = props.formData.saveBtnShow;
        getlcxq(fromData.value.buildingid)
        getcsData();
        if (res.partid) {
          getApi({ id: res.partid }, '/mosty-jcgl/part/queryScenePartById').then(res => {
            if (res) {
              fromData.value.partname = res.partname ? res.partname : res.qtmc;
            }
          })
        }
      }
    });
  }
}
//获取建筑物详情
function getlcxq(id) {
  getApi({}, `/mosty-jcgl/building/getBuildingById/${id}`).then(res => {
    fromData.value.publicarea = res.publicarea ? res.publicarea : '2'
    if (fromData.value.publicarea == '1') {
      getbwdata('01', id);
    } else {
      getlcdata(id);
    }
  })
}
const black = () => {
  if (props.formData.saveBtnShow) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        // 关闭上一次的表单校验
        ruleFormRef.value.clearValidate();
        emit("changePage");
      })
      .catch(() => {
        // catch error
      })
  } else {
    // 关闭上一次的表单校验
    ruleFormRef.value.clearValidate();
    emit("changePage");
  }

};
//安全标识总数
function getaqbscount() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sitelogo/countAllSitelogo').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '安全标识') {
        item.num = res ? res : 0
      }
    })
  })
}
//安全器材总数
function getaqqccount(val) {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglAqqc/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '安全器材' && val === '1') {
        item.num = res ? res : 0
      }
      if (item.title == '消防器材' && val === '2') {
        item.num = res ? res : 0
      }
    })
  })
}
//生产设备设施总数
function getscsbsscount() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglScsbss/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '生产设备设施') {
        item.num = res ? res : 0
      }
    })
  })
}
//变配电设备设施总数
function getbpdcount() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglBpdsb/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '变配电设备设施') {
        item.num = res ? res : 0
      }
    })
  })
}
//安全设备设施总数
function getaqsbsscount(val) {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglAqsbss/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '安防设备设施' && val === '1') {
        item.num = res ? res : 0
      }
      if (item.title == '消防设备设施' && val === '2') {
        item.num = res ? res : 0
      }
    })
  })

}
//特种设备总数
function gettzsbcount() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglTzsb/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '特种设备') {
        item.num = res ? res : 0
      }
    })
  })
}
//获取风险清单总数
function getCount() {
  getApi({ partid: fromData.value.id }, '/mosty-jcgl/dynamic/riskStatistics').then(res => {
    tablist2.value.forEach(item => {
      if (item.title == '风险清单') {
        item.num = res ? res.R + res.O + res.Y + res.B : 0
      }
    })
  })
}
const equipmentType = ref()
//分类点击事件
function changelicolor(val) {
  tablist.value.forEach(item => {
    if (item.title == val.title) {
      item.actives = true
    } else {
      item.actives = false
    }
  })
  if (val.title == '安防设备设施') {
    equipmentType.value = 1
    // getaqsbsscount('1')
  } else if (val.title == '消防设备设施') {
    equipmentType.value = 0
    // getaqsbsscount('2')
  } else if (val.title == '安防器材') {
    equipmentType.value = 1
    // getaqqccount('1')
  } else if (val.title == '消防器材') {
    equipmentType.value = 0
    // getaqqccount('2')
  }
  // else if (val.title == '安全标识') {
  //   getaqbscount()
  // }
  else if (val.title == '生产设备设施') {
    getscsbsscount()
  } else if (val.title == '变配电设备设施') {
    getbpdcount()
  } else if (val.title == '特种设备') {
    gettzsbcount()
  }
}
function changelicolor2(val) {
  tablist2.value.forEach(item => {
    if (item.title == val.title) {
      item.actives = true
    } else {
      item.actives = false
    }
  })
  if (val.title == '风险清单') {
    getCount()
  }
}
//刷新接口
function resetChange(val) {
  if (val == 'aqbs') {
    // getaqbscount()
  } else if (val == 'scsb') {
    getscsbsscount()
  } else if (val == 'bpdsb') {
    getbpdcount()
  } else if (val == 'afqc') {
    // getaqqccount('1')
  } else if (val == 'xfqc') {
    // getaqqccount('2')
  } else if (val == 'afsbss') {
    // getaqsbsscount('1')
  } else if (val == 'xfsbss') {
    // getaqsbsscount('2')
  } else if (val == 'tzsb') {
    gettzsbcount()
  }
}

</script>

<style lang="scss" scoped>
.table-lable {
  margin: 10px;
  color: var(--el-color-primary);
}

::v-deep ::-webkit-scrollbar {
  display: none !important;
}

::v-deep .el-pagination {
  justify-content: center !important;
}

::v-deep .el-form {
  margin: auto;
  padding: 10px;
  margin: 10px 30px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.el-form-item {
  display: flex;
  margin-right: 20px;
}

::v-deep .el-table .cell {
  padding: 0 0 !important;
}

::v-deep .el-table--border .el-table__cell .cell {
  padding-left: 0px !important;

  >input {
    width: 100%;
    height: 33px;
  }
}

.headBox {
  display: flex;
  justify-content: end;
  width: 100%;
  margin-bottom: 10px;
}

::v-deep .el-upload-list {
  width: 50%;
}

::v-deep .el-form-item__content {
  margin-left: 0px !important;
}
</style>