<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="canteenName">
            <el-input v-model="fromData.canteenName" placeholder="请输入食堂名称" style="width: 337px" clearable></el-input>
          </el-form-item>
          <!-- <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">
            <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">
            <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> -->
          <!--  && !props.formData.id -->
          <el-form-item label="所属楼层:" prop="floorName" v-if="fromData.publicarea != '1'">
            <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> -->
          <!-- v-if="!props.formData.id" -->
          <el-form-item :label="fromData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partName">
            <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="部位类型:">
            <MOSTY.DictTree :zdlist="bwlxlist" :type="'array'" v-model="fromData.partType" :placeholder='"请选择部位类型"'
              style="width: 337px;" />
          </el-form-item>
          <el-form-item label="部位面积:" prop="partArea">
            <el-input v-model.number="fromData.partArea" @blur="fromData.partArea = JEblurFn(fromData.partArea)"
              type="number" placeholder="请填写部位面积" style="width: 337px">
              <template #append>平方米</template></el-input>
          </el-form-item>

          <el-form-item label="耐火等级:" v-if='fromData.publicarea != "1"' prop="fireproof">
            <el-select v-model="fromData.fireproof" 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="所在位置:">
            <el-input v-model="fromData.location" style="width: 337px" />
          </el-form-item>
          <el-form-item label="备注:" style="width: 100%;">
            <el-input v-model="fromData.bz" :rows="3" type="textarea" clearable style="width: 337px" />
          </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.imageFile" @filehandleChange="changeFiles">
              </MOSTY.Upload>
            </div>
          </el-form-item>
        </el-form>
        <MOSTY.Assort :title="'管理信息'" />
        <el-form class="mosty-from-wrap2" :model="fromData" ref="ruleFormRef2" label-position="right"
          label-width="150px" :disabled='false'>
          <el-form-item label="责任部门:" style="display: flex">
            <el-input v-model="fromData.responsibleDeptName" placeholder="请选择责任部门" readonly style="width: 337px">
              <template #append>
                <el-button :disabled="!props.formData.saveBtnShow" class='cursor'
                  @click="ChooesDdld('01')">选择</el-button></template>
            </el-input>
          </el-form-item>
          <el-form-item label="责任人:" style="display: flex;width:100%">
            <div style="display: flex;width: 100%;">
              <el-input v-model="fromData.responsibleUserName" type="textarea" :rows="4" placeholder="请选择责任人" readonly
                style="width: calc(100% - 70px);">

              </el-input>
              <el-button :disabled="!props.formData.saveBtnShow" class='cursor ml10'
                @click="ChooesDdld('02')">选择</el-button>
            </div>

          </el-form-item>
          <!-- <el-form-item label="责任人电话:">
            <el-input v-model="fromData.contactnumber" disabled style="width: 337px" />
          </el-form-item> -->
          <el-form-item label="食物留样人员:" style="display: flex;width:100%">
            <div style="display: flex;width: 100%;">
              <el-input v-model="fromData.keepSampleUserName" type="textarea" :rows="4"
                :title='fromData.keepSampleUserName' placeholder="请选择食物留样人员" readonly clearable
                style="width: calc(100% - 70px);">

              </el-input>
              <el-button :disabled="!props.formData.saveBtnShow" class='cursor ml10'
                @click="ChooesDdld('03')">选择</el-button>
            </div>
          </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' :type='"bw"' :obj="tableObj" from="食堂管理" @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='props.formData' @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" :deptId="fromData.orgId"
          :zzlx="zzlx" />
        <ChooseUser v-model="chooseUserVisible" :Single="false" :data="memberList" :deptId='fromData.responsibleDeptId'
          @choosedUsers="getSonValue"></ChooseUser>
        <!-- 选择相关方人员 -->
        <MOSTY.xgfandzzjgry v-model="choosexgfUserVisible" :Single="singleShow" :data="memberList" :stlyrylx='stlyrylx'
          :relatedid="null" :deptId='fromData.orgId' :xgflx="'04'" @choosedUsers="getSonValue"
          @changerylx='changerylx' />

      </template>
    </MOSTY.FromPage>
  </div>
</template>

<script setup>
import {
  reactive,
  ref,
  defineAsyncComponent,
  onMounted,
  computed,
  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: 'sbss2', actives: true, components: defineAsyncComponent(() => import("./cyfwtab.vue")) },
  { title: '食堂工作人员', icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("./rytztab.vue")) },
  { title: '食材供应商', icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("./scgystab.vue")) },
  { title: '食堂设备设施', icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/stsbssList.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")) },
  { title: '食物留样记录', icon: 'sbss2', actives: false, components: defineAsyncComponent(() => import("./stlyjltab.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" }],
  ...rule.numbernineRule({ validator: true, require: false, iszs: true, firstNum: 7, lastNum: 2 }, "partArea"),
  canteenName: [{ required: true, message: "请输入食堂名称", trigger: "blur" }]
};
const saveloading = ref(false)
const stlyrylx = ref('01')
const isShowgd = ref(true)
const isShowdt = ref(true)
const memberList = ref([])
/** 部位类型 */
const bwlxlist = ref([])
const props = defineProps({
  formData: {
    type: Object,
    default: {}
  },
  type: {
    default: '',
    type: String
  },
  zdlist: {
    type: Object,
    default: {}
  },
  rowId: {
    type: String,
    default: ''
  },
  /** 部门信息 orgId,orgName */
  orgObj: {
    type: Object,
    default: {}
  },
});
/** tableobj 因为需要设置showadd 为true所以这样写 */
const tableObj = computed(() => {

  return { ...fromData.value, ...{ showadd: true, from: '食堂管理' } }
})
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 choosexgfUserVisible = ref(false)
const singleShow = ref(true); //单选多选
const leaderid = ref("");
/** 01: 责任部门 02:责任人 03:食物留样人员  */
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.partArea = fromData.value.partArea ? Number(fromData.value.partArea).toFixed(2) : null
  fromData.value.saveBtnShow = props.formData.saveBtnShow;
  fromData.value.partType = '100107020000'
  // 获取部位类型列表/
  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);
    fromData.value = { ...props.formData }
    getjzwlist(fromData.value.siteId)
    // changelicolor(tablist.value[0]); //
  } else {
  }
  // getcsData();
  // getcsData();
  getcsData();

});

//根据操作人 查询 场所
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 changeFiles = () => { }

//获取当前部位
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 : []
    if (fromData.value.buildingId) {
      fromData.value.publicarea = jzwlist.value.find(item => item.id == fromData.value.buildingId)?.publicarea
    }
  })
}
//获取建筑物名称
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) {
  const url = type === '01' ? '/mosty-jcgl/part/getListByBuildid' : '/mosty-jcgl/part/getListByFloorid'
  getApi({ type, id }, url).then((res) => {
    bwlist.value = res ? res : [];
  });
  // getApi({ type, id }, "/mosty-jcgl/importantPart/getPartList").then((res) => {
  //   bwlist.value = res ? res : [];
  // });
}

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

  } else if (val == "01") {
    showDept.value = true;
  } else {
    memberList.value = fromData.value.keepSampleUserId ? fromData.value.keepSampleUserId.split(',') : [];
    singleShow.value = false;
    choosexgfUserVisible.value = true
  }
}
const getSonValue = (value) => {
  // 部门
  if (zzlx.value == "01") {
    fromData.value.responsibleDeptName = value.orgName;
    fromData.value.responsibleDeptId = value.id;

    // 责任人
  } else if (zzlx.value == "02") {
    let arr1 = [];
    let arrid1 = [];
    for (let i = 0; i < value.length; i++) {
      const element = value[i];
      element.zzlx = zzlx.value;
      arr1.push(element.userName);
      arrid1.push(element.id);
    }
    memberList.value = value.map((item) => {
      return item.id;
    });
    fromData.value.responsibleUserName = arr1.toString();
    fromData.value.responsibleUserId = arrid1.toString()
    // fromData.value.responsibleDeptName = value[0].deptName;
    // fromData.value.deptid = value[0].deptId;
    // 留样人员
  } else {
    let arr = [];
    let arrid = [];
    for (let i = 0; i < value.length; i++) {
      const element = value[i];
      element.zzlx = zzlx.value;
      arr.push(element.userName);
      arrid.push(element.id);
    }
    memberList.value = value.map((item) => {
      return item.id;
    });
    fromData.value.keepSampleUserName = arr.toString();
    fromData.value.keepSampleUserId = arrid.toString()
  }
};
//获取人员类型
function changerylx(val) {
  stlyrylx.value = val
}
//关闭弹窗
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) {
            const params = { ...fromData.value }
            // imageFile =
            delete params.saveBtnShow
            params.imageFile = Array.isArray(params.imageFile) ? params.imageFile.toString() : params.imageFile
            if (!fromData.value.id) {
              params.orgId = props.orgObj.orgId
              params.orgName = props.orgObj.orgName
              postApi(params, "/mosty-jcgl/canteenInfo/saveCanteenInfo")
                .then((res) => {
                  ElMessage.success("新增成功");
                  emit("changePage", res);
                }).finally(() => {
                  saveloading.value = false
                })
            } else {

              postApi(params, "/mosty-jcgl/canteenInfo/editCanteenInfo")
                .then((res) => {
                  ElMessage.success("修改成功");
                  emit("changePage");
                }).finally(() => {
                  saveloading.value = false
                })
            }

          }
        } else {

          ElMessage.error("请输入必填项!");
          saveloading.value = false
        }
      });
    } else {

      ElMessage.error("请输入必填项!");
      saveloading.value = false
    }
  });
};
/** 获取详情
 *
 * @param id id
 * @param from 来自
 */
function getmain(id, from) {
  if (id) {
    getApi({ id: id }, "/mosty-jcgl/importantPart/getInfo").then((res) => {
      if (res) {
        // fromData.value = res;
        // checktype:部位类型  area:部位面积 , location:所在位置 deptname: 责任部门(deptid);
        //postusername: 责任人(postuserid) fireresisrating:防火等级
        const { checktype, area, location, deptname, deptid, postusername, postuserid, fireresisrating } = res;
        // fromData.value.canteenName = canteenName;
        // fromData.value.saveBtnShow = props.formData.saveBtnShow;
        fromData.value = {
          ...fromData.value,
          location,
          partType: checktype,
          partArea: area,
          responsibleDeptName: deptname,
          responsibleDeptId: deptid,
          responsibleUserName: postusername,
          responsibleUserId: postuserid,
          fireproof: fireresisrating ? fireresisrating : fromData.value.fireproof,
        }

        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() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglAqqc/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '安全器材') {
        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() {
  postApi({ partid: fromData.value.id, type: '1' }, '/mosty-jcgl/sbglAqsbss/countAll').then(res => {
    tablist.value.forEach(item => {
      if (item.title == '安全设备设施') {
        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
      }
    })
  })
}

//分类点击事件
function changelicolor(val) {
  tablist.value.forEach(item => {
    if (item.title == val.title) {
      item.actives = true
    } else {
      item.actives = false
    }
  })
  if (val.title == '安全设备设施') {
    getaqsbsscount()
  } else if (val.title == '安全器材') {
    getaqqccount()
  } 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 == 'aqqc') {
    getaqqccount()
  } else if (val == 'tzsb') {
    gettzsbcount()
  } else if (val == 'aqsbss') {
    getaqsbsscount()
  }
}

</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;
}

.mosty-from-wrap,
.mosty-from-wrap2 {
  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>
