<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="130px" :model="formData" :inline="true"
          :rules="rules" :disabled="!props.formData.saveBtnShow">
          <el-form-item label="安全器材类型:" prop="sblx">
            <!-- :disabled='formData.id' -->
            <MOSTY.DictTree v-model="formData.sblx" :zdlist="sbsslist" :placeholder='"请选择"' :type='"array"'
              style="width: 337px;" @nameChange='getxzqh' />
          </el-form-item>
          <el-form-item label="器材名称:" prop="name" :rules="[{ required: true, message: '请输入名称', trigger: 'blur' }]">
            <el-input v-model="formData.name" placeholder="请输入安防器材名称" clearable style="width: 337px"></el-input>
          </el-form-item>
          <!-- 灭火器才有 -->
          <el-form-item label="安装类型:" prop="azlx" v-if="Isgetdm(formData.sblx, '20020101')">
            <div style="width: 337px">
              <MOSTY.DictRidioAndSelect :dictData="D_BZ_MHQAZLX" v-model="formData.azlx" selectType="radio"
                :disabled="false" />
            </div>
          </el-form-item>
          <el-form-item label="生产厂家:" prop="manufacturer" v-if="!Isgetdm(formData.sblx, '20020101')">
            <el-input v-model="formData.manufacturer" placeholder="请输入生产厂家" clearable style="width: 337px"></el-input>
          </el-form-item>
          <el-form-item label="生产日期:" prop="time">
            <el-date-picker v-model="formData.time" type="date" value-format="YYYY-MM-DD" style="width: 337px"
              placeholder="请选择生产日期" :disabled-date="disabledDate" />
          </el-form-item>
          <el-form-item label="组内灭火器数量:" prop="account" v-if="Isgetdm(formData.sblx, '20020101')">
            <el-input v-model.number="formData.account" type="number" style="width: 337px;" @change="keysv++">
              <template #append>具</template>
            </el-input>
          </el-form-item>
          <el-form-item label="所属场所:" prop="sitename" v-if="['cs', 'jzw', 'lc', 'bw'].includes(addtype)">
            <el-input v-model="formData.sitename" style="width: 337px" disabled />
          </el-form-item>
          <!-- <el-form-item label="所属场所:" prop="sitename" v-if="['aqqc'].includes(addtype) && formData.id">
            <el-input v-model="formData.sitename" style="width: 337px" disabled />
          </el-form-item> -->
          <!-- &&!formData.id -->
          <el-form-item label="所属场所:" prop="sitename" v-if="['aqqc'].includes(addtype)">
            <el-select v-model="formData.sitename" @change="cahngecsmc" clearable style="width: 337px"
              placeholder="请选择">
              <el-option v-for="(item, index) in csmclist" :key="index" :label="item.placename" :value="item.id" />
            </el-select>
          </el-form-item>
          <!--  && !formData.id -->
          <el-form-item :label="formData.publicarea == '1' ? '所属场区:' : '所属建筑物:'" prop="buildingname"
            v-if="['cs', 'aqqc'].includes(addtype)">
            <el-select v-model="formData.buildingname" @change="cahngejzwmc" clearable style="width: 337px"
              placeholder="请选择">
              <el-option v-for="(item, index) in jzwlist" :key="index" :label="item.buildingname" :value="item.id" />
            </el-select>
          </el-form-item>
          <!-- 'cs', 'jzw', 'lc', 'bw', 'aqqc' -->
          <el-form-item :label="formData.publicarea == '1' ? '所属场区:' : '所属建筑物:'" prop="buildingname"
            v-if="['jzw', 'lc', 'bw'].includes(addtype) && formData.id">
            <el-input v-model="formData.buildingname" style="width: 337px" disabled />
          </el-form-item>
          <el-form-item :label="formData.publicarea == '1' ? '所属场区:' : '所属建筑物:'" prop="buildingname"
            v-if="['jzw', 'lc', 'bw'].includes(addtype) && !formData.id">
            <el-input v-model="formData.buildingname" style="width: 337px" disabled />
          </el-form-item>
          <!--  && !formData.id -->
          <el-form-item label="所属楼层:" prop="floorname"
            v-if="['cs', 'jzw', 'aqqc'].includes(addtype) && formData.publicarea != '1'">
            <el-select v-model="formData.floorname" @change="cahngelcmc" clearable style="width: 337px"
              placeholder="请选择">
              <el-option v-for="(item, index) in lclist" :key="index" :label="item.floorname" :value="item.id" />
            </el-select>
          </el-form-item>
          <!-- 'cs', 'jzw', 'lc', 'bw', 'aqqc' -->
          <el-form-item label="所属楼层:" prop="floorname"
            v-if="['lc', 'bw'].includes(addtype) && formData.id && formData.publicarea != '1'">
            <el-input v-model.number="formData.floorname" style="width: 337px" disabled />
          </el-form-item>
          <el-form-item label="所属楼层:" prop="floorname"
            v-if="['lc', 'bw'].includes(addtype) && !formData.id && formData.publicarea != '1'">
            <el-input v-model.number="formData.floorname" style="width: 337px" disabled />
          </el-form-item>
          <!-- !formData.id -->
          <el-form-item :label="formData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partname"
            v-if="['cs', 'jzw', 'lc', 'aqqc'].includes(addtype)">
            <el-select v-model="formData.partname" @change="cahngebw" clearable style="width: 337px" placeholder="请选择">
              <el-option v-for="(item, index) in bwlist" :key="index" :label="item.partname ? item.partname : item.qtmc"
                :value="item.id" />
            </el-select>
          </el-form-item>
          <el-form-item :label="formData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partname"
            v-if="['bw'].includes(addtype) && !formData.id">
            <el-input v-model="formData.partname" disabled style="width: 337px" />
          </el-form-item>
          <!-- 'cs', 'jzw', 'lc', 'bw', 'aqqc' -->
          <el-form-item :label="formData.publicarea == '1' ? '场区部位:' : '所属部位:'" prop="partname"
            v-if="['bw'].includes(addtype) && formData.id">
            <el-input v-model="formData.partname" disabled style="width: 337px" />
          </el-form-item>
          <el-form-item label="具体位置:" prop="location">
            <el-input v-model="formData.location" placeholder="请输入具体位置" clearable style="width: 834px"></el-input>
          </el-form-item>
          <el-form-item label="状态:" prop="state" v-if="formData.id">
            <div style="width: 337px;">
              <MOSTY.DictRidioAndSelect :dictData="D_BZ_SYZT" v-model="formData.state" selectType="radio"
                :disabled="false" />
            </div>
          </el-form-item>
          <!-- <el-form-item label="检测周期:" prop="detectionTime">
            <el-input v-model="formData.detectionTime" type="number" style="width: 337px" placeholder="请输入检测周期">
              <template #append>月</template>
            </el-input>
          </el-form-item>
          <el-form-item label="检测日期:" prop="sycjcrq">
            <el-date-picker v-model="formData.sycjcrq" type="date" value-format="YYYY-MM-DD" style="width: 337px"
              placeholder="请选择检测日期" />
          </el-form-item>
          <el-form-item label="检查周期:" prop="inspectTime">
            <el-input v-model="formData.inspectTime" type="number" style="width: 337px" placeholder="请输入检查周期">
              <template #append>月</template>
            </el-input>
          </el-form-item>

          <el-form-item label="报废时间:" prop="scrapTime">
            <el-date-picker v-model="formData.scrapTime" type="date" value-format="YYYY-MM-DD" style="width: 337px"
              placeholder="请选择报废时间" />
          </el-form-item> -->
          <el-form-item label="设备资料:" style="width: 100%;" prop="deviceFile">
            <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="true" placeholder="请上传设备资料（pdf,ofd,doc,docx,xls,xlsx）"
              :isImg="false" ShowfileList :disabled="!props.formData.saveBtnShow" v-model="formData.deviceFile"
              :nameshow='true' :gsgfList="['pdf', 'ofd', 'doc', 'docx', 'xls', 'xlsx']">
            </MOSTY.Upload>
          </el-form-item>
          <el-form-item label="其它资料:" style="width: 100%;" prop="otherFile">
            <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="true" :isImg="false" ShowfileList
              :disabled="!props.formData.saveBtnShow" placeholder="请上传其他资料（pdf,ofd,doc,docx,xls,xlsx）"
              v-model="formData.otherFile" :nameshow='true' :gsgfList="['pdf', 'ofd', 'doc', 'docx', 'xls', 'xlsx']">
            </MOSTY.Upload>
          </el-form-item>

          <el-form-item label="安全器材图片:" style="width: 100%;">
            <div style='display:flex;'>
              <MOSTY.ErwmImg :url="preViewImg" :filename='"安全器材二维码"' v-if="props.formData.id" />
              <MOSTY.Upload :width="'100%'" :limit="5" :nopicer="false" :isImg="true" :ShowfileList="false"
                :disabled="!props.formData.saveBtnShow" v-model="formData.picture" :nameshow='true'
                :gsgfList="['jpg', 'png']">
              </MOSTY.Upload>
            </div>
          </el-form-item>
        </el-form>
        <MOSTY.Assort :title="'管理信息'" />
        <el-form class="mosty-from-wrap" ref="ruleFormRef2" label-width="130px" :model="formData" :inline="true"
          :rules="rules2" :disabled="!props.formData.saveBtnShow">
          <el-form-item label="责任部门:" prop="responsibilitydeptname" style="display: flex;">
            <el-input v-model="formData.responsibilitydeptname" placeholder="请选择责任部门" clearable style="width: 337px">
              <template #append>
                <el-button @click="ChooesDdld('01')">选择</el-button></template>
            </el-input>
          </el-form-item>
          <el-form-item label="设备责任人:" prop="responsibilitypersonname" style="display: flex;width:100%;">
            <el-input v-model="formData.responsibilitypersonname" placeholder="请选择设备责任人" type="textarea" :rows="4"
              readonly style="width: 93%" clearable>
            </el-input>
            <el-button class='cursor ml10' @click="ChooesDdld('03')">选择</el-button>
          </el-form-item>
          <el-form-item label="巡查相关方：" prop="xgfMc">
            <XiangGFSelect style="width: 337px" v-model="formData.xgfMc" v-model:id="formData.xgfId"
                           @change="xgfDwChange"  @update:modelValue="updateModelValue" @update:id = 'updateId' />
          </el-form-item>
          <el-form-item label="相关方责任人：" prop="xgfRyMc">
            <XiangGFRen inputWidth="337px" v-model:ids="formData.xgfRyId" v-model:cName="formData.xgfRyMc" :relatedid="formData.xgfId"
                        :disabled="!formData.xgfId" @update:ids="updateIds" @update:cName="updateName"/>
          </el-form-item>



        </el-form>
        <MOSTY.Assort v-if="formData.id || (tablist && tablist.length > 0)" :title="'关联信息(固定信息、动态信息)'" />
        <div v-show='tablist && tablist.length > 0'>
          <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' :obj='formData' :showCount="false" @tableChange='tableChange'
                :key="keysv" :type='"sb"' :cardtype="'01'" :isEdit="props.formData.saveBtnShow"
                @resetChange='resetChange' @handleChange="changelicolor1" />
            </div>
          </div>
        </div>
        <div v-if="props?.formData?.id">
          <!-- <div v-if="['1'].includes(formData.xf)"> -->
          <div v-if="formData.id">
            <div class='table-lable'>
              <span>动态信息</span>
              <img :src="getImgUrl('img/icon-jt.png')" style='cursor:pointer' @click='isShowdt = !isShowdt' />
            </div>
            <div v-if='isShowdt'>
              <MOSTY.TabList :tablist='tablist2' :obj='formData' type="sb" @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>
        <!-- 选择责任人 -->
        <ChooseUser v-model="chooseUserVisible" :Single="singleShow" :data="memberList"
          :deptId="formData.responsibilitydeptid" @choosedUsers="getSonValue"></ChooseUser>
        <Choosebm :showDdld="showDept" @closezzjg="closezzjg" @listdata="getSonValue" :zzlx="zzlx" />
      </template>
    </MOSTY.FromPage>
  </div>
</template>

<script setup>
import { getImgUrl } from "@/utils/tools.js"
import { watch, ref, getCurrentInstance, defineAsyncComponent, onMounted, computed } from "vue";
import * as MOSTY from "@/components/MyComponents/index";
import Choosebm from "@/components/MyComponents/ChooseDept/index.vue";
import { ElMessage } from "element-plus";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import ChooseUser from "@/components/MyComponents/ChooseUser/Leader.vue";
import * as rule from "@/utils/rules.js";
import { Html2canvasImg } from "@/utils/html2pdf.js";
import XiangGFSelect from "@/components/dialog/component/XiangGFSelect.vue";
import XiangGFRen from "@/components/dialog/component/XiangGFRen.vue";


const { proxy } = getCurrentInstance();
const { D_BZ_MHQAZLX, D_BZ_SYZT } = proxy.$dict("D_BZ_MHQAZLX", "D_BZ_SYZT");
import { qrcodeImg, createAndClickLink } from "@/utils/tools.js";
const saveloading = ref(false)
const keysv = ref(1)
const rules2 = {
  responsibilitydeptname: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
  responsibilitypersonname: [{ required: true, message: "请选择负责人", trigger: "blur" }],
}
const rules = {
  ...rule.phoneRule({ require: true, validator: true }, "phone"),
  sitename: [{ required: true, message: "请输入场所名称", trigger: "blur" }],
  buildingname: [{ required: true, message: "请选择所属建筑物", trigger: "blur" }],
  floorname: [{ required: true, message: "请选择所属楼层", trigger: "blur" }],
  partname: [{ required: true, message: "请选择所属部位", trigger: "blur" }],
  sblx: [{ required: true, message: "请选择安全器材类型", trigger: "blur" }],
  azlx: [{ required: true, message: "请选择安装类型", trigger: "blur" }],
  ...rule.numberzzsRule({ validator: true, require: true, num: 999999 }, "account"),
  location: [{ required: true, message: "请输入具体位置", trigger: "blur" }],
  state: [{ required: true, message: "请选择状态", trigger: "blur" }],
  time: [{ required: true, message: "请选择生产日期", trigger: "blur" }],
  manufacturer: [{ required: true, message: "请输入生产厂家", trigger: "blur" }],
  // ...rule.numberzzsRule({ validator: true, require: false, num: 120 }, "inspectTime"),
  // ...rule.numberzzsRule({ validator: true, require: false, num: 120 }, "detectionTime"),
  // sycjcrq: [{ required: true, message: "请选择检测日期", trigger: "blur" }],
  // scrapTime: [{ required: true, message: "请选择报废时间", trigger: "blur" }],
};
const isShowdt = ref(true)
const isShowgd = ref(true)
const formData = ref({ type: '1', state: '01', account: 0 })
const tablist = ref([])
const props = defineProps({
  formData: {
    type: Object,
    default: {}
  },
  type: {
    default: '',
    type: String
  },
});
const tablist2 = ref([
  { title: '检查标准', num: 0, icon: 'jianzhuwu', sblx: '200200000000', 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 showDept = ref(false); //选择部门
const chooseUserVisible = ref(false); //选择领导弹窗
const singleShow = ref(true); //单选多选
const memberList = ref([]); //成员选择的id回显
const zzlx = ref(null);
const bwlist = ref([]);
const jzwlist = ref([]);
const lclist = ref([]);
const sbsslist = ref([]);
const emit = defineEmits("changePage", 'createPage');
const ruleFormRef = ref();
const ruleFormRef2 = ref();
const addtype = ref('aqqc')
const preViewImg = computed(() => {
  if (formData.value.sblx == '200201020000' || formData.value.sblx == '200201030000' || formData.value.sblx == '200201040000') {
    return []
  }
  return qrcodeImg(props.formData.zbid, '414', formData.value.sitename, formData.value.partname, `${formData.value.name}(${formData.value.nbbh})`)
})
onMounted(() => {
  getaqqclb()
  addtype.value = props.formData.type ? props.formData.type : 'aqqc';
  formData.value.siteid = props.formData.siteid ? props.formData.siteid : null;
  formData.value.sitename = props.formData.sitename ? props.formData.sitename : null;
  formData.value.buildingid = props.formData.buildingid ? props.formData.buildingid : null;
  formData.value.buildingname = props.formData.buildingname ? props.formData.buildingname : null;
  formData.value.floorid = props.formData.floorid ? props.formData.floorid : null;
  formData.value.floorname = props.formData.floorname ? props.formData.floorname : null;
  formData.value.partid = props.formData.partid ? props.formData.partid : null;
  formData.value.partname = props.formData.partname ? props.formData.partname : null;
  formData.value.publicarea = props.formData.publicarea ? props.formData.publicarea : null;
  formData.value.sfcq = props.formData.sfcq ? props.formData.sfcq : null;
  formData.value.saveBtnShow = props.formData.saveBtnShow;
  formData.value.showCount = false;
  formData.value.xgfRyId = props.formData.xgfRyId ? props.formData.xgfRyId : null;
  formData.value.xgfRyMc = props.formData.xgfRyMc ? props.formData.xgfRyMc : null;
  formData.value.xgfMc = props.formData.xgfMc ? props.formData.xgfMc : null;
  formData.value.xgfId = props.formData.xgfId ? props.formData.xgfId : null;


  if (props.formData.id) {
    if (props.formData.flx == '2') {
      //安防
      getmain(props.formData.id, '/mosty-jcgl/SbglAf/queryDetail');
    } else {
      //消防
      getmain(props.formData.id, '/mosty-jcgl/xf/queryDetail');
    }
  } else {
    formData.value.showCount = false;
    if (props.formData.type == 'cs') {
      getjzwlist(props.formData.siteid)
    } else if (props.formData.type == 'jzw') {
      if (props.formData.publicarea == '1') {
        getbw2data(props.formData.buildingid);
      } else {
        getlcdata(props.formData.buildingid);
      }
    } else if (props.formData.type == 'lc') {
      getbwdata(props.formData.floorid);
    } else if (['aqqc'].includes(addtype.value)) {
      getcsData();
    }
  }
});
watch(
  () => formData.value.sblx,
  (val) => {
    if (formData.value.id) {
      tablist.value = tablist.value.filter((item) => {
        return item.title !== '灭火器列表';
      });
    } else {
      tablist.value = []
    }
    if (Isgetdm(val, '20020101')) {
      tablist.value.push({ title: '灭火器列表', num: 0, icon: 'sbss2', actives: formData.value.id ? true : false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Mhqtable.vue")) })
    }
  },
  {
    immediate: true,
    deep: true
  }
);
// 获取相关方责任人id
const updateIds = (ids) => {
  formData.value.xgfRyId = ids;
}
// 获取相关方人员列表
const updateName = (names) => {
  formData.value.xgfRyMc = names;
}
// 获取检查方名称
const updateModelValue = (ModelValue) => {
  formData.value.xgfMc = ModelValue;
}
// 获取检查方id
const updateId = (id) => {
  formData.value.xgfId = id;
}


// 生效时间只能选当天及之前的
const disabledDate = (time) => {
  return time.getTime() > Date.now();
};
function getaqqclb() {
  getApi({ dm: '2002', zdbh: 'D_TB_JCYWLX', level: 2 }, '/mosty-base/sysDict/getJcyelxDictTree').then(res => {
    sbsslist.value = res[0].itemList
  })
}
//选择部门
function ChooesDdld(val) {
  zzlx.value = val;
  if (val == "01") {
    showDept.value = true;
  } else {
    if (formData.value.responsibilitydeptid) {
      memberList.value = formData.value.responsibilityperson ? formData.value.responsibilityperson.split(',') : [];
      singleShow.value = false;
      chooseUserVisible.value = true;
    } else {
      ElMessage.error("请先选择责任部门！!");
    }

  }
}
const getSonValue = (value) => {
  if (zzlx.value == "01") {
    formData.value.responsibilitydeptname = value.orgName;
    formData.value.responsibilitydeptid = value.id;
  } else {
    formData.value.responsibilitypersonname = value.map(item => {
      if (item.mobile) {
        return item.userName + '（' + item.mobile + '）'
      } else {
        return item.userName
      }
    }).toString();
    formData.value.responsibilityperson = value.map(item => {
      return item.id
    }).toString();
  }
};

/**相关方人员确认 */
const xgfDwChange = (val) => {
  // 清空相关方人员
  formData.value.xgfRyId = undefined
  formData.value.xgfRyMc = undefined
}

//获取子表数据
function tableChange(val) {
  formData.value.list = val
}
function changelicolor1(val) {
  tablist.value.forEach(item => {
    if (item.title == val.title) {
      item.actives = true
    } else {
      item.actives = false
    }
  })
}
function changelicolor2(val) {
  tablist2.value.forEach(item => {
    if (item.title == val.title) {
      item.actives = true
    } else {
      item.actives = false
    }
  })
}
// 保存
const submit = async (ruleFormRef) => {
  saveloading.value = true
  if (!ruleFormRef) return;
  await ruleFormRef.validate((valid) => {
    if (valid) {
      ruleFormRef2.value.validate((valid) => {
        if (valid) {
          formData.value.picture = formData.value.picture
            ? formData.value.picture.toString()
            : null;
          formData.value.deviceFile = formData.value.deviceFile?.toString()
          formData.value.otherFile = formData.value.otherFile?.toString()
          if (!formData.value.id) {
            //消防
            if (Isgetdm(formData.value.sblx, '200201')) {
              postApi(formData.value, "/mosty-jcgl/xf/addTbXfOne").then((res) => {
                ElMessage.success("新增成功");
                // emit("changePage", res);
                emit("createPage", res)
              }).finally(() => {
                saveloading.value = false
              })
            } else {
              //安防
              postApi(formData.value, "/mosty-jcgl/SbglAf/addTbSbglAfOne").then((res) => {
                ElMessage.success("新增成功");
                // emit("changePage", res);
                emit("createPage", res)
              }).finally(() => {
                saveloading.value = false
              })
            }

          } else {
            if (Isgetdm(formData.value.sblx, '200201')) {
              postApi(formData.value, "/mosty-jcgl/xf/updateTbXfOne").then(() => {
                ElMessage.success("修改成功");
                emit("changePage");
              }).finally(() => {
                saveloading.value = false
              })
            } else {
              postApi(formData.value, "/mosty-jcgl/SbglAf/updateTbSbglAfOne").then(() => {
                ElMessage.success("修改成功");
                emit("changePage");
              }).finally(() => {
                saveloading.value = false
              })
            }

          }
        } else {

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

      ElMessage.error("请输入必填项!");
      saveloading.value = false
    }
  });
};
//获取详情
function getmain(id, mosty) {
  getApi({ id: id }, mosty).then(res => {
    res.responsibilitypersonname = res.responsibilitypersonname ? res.responsibilitypersonname.replace(/（null）/g, '') : ''
    formData.value = res
    formData.value.state = res.state ? res.state : '01'
    formData.value.state = res.state ? res.state : '01'
    formData.value.saveBtnShow = props.formData.saveBtnShow;
    formData.value.zbid = props.formData.zbid;
    if (props.formData.flx == '3') {
      formData.value.showCount = true;
    } else {
      formData.value.showCount = false;
    }
    getlcxq(formData.value.buildingid)
    if (props.formData.type == 'cs') {
      getjzwlist(res.siteid)
    } else if (props.formData.type == 'lc') {
      getbwdata(res.floorid);
    } else if (['aqqc'].includes(addtype.value)) {
      getcsData();
    }
    if (res.partid) {
      getApi({ id: res.partid }, '/mosty-jcgl/part/queryScenePartById').then(res => {
        if (res) {
          formData.value.partname = res.partname ? res.partname : res.qtmc;
        }
      })
    }
    tablist.value = [
      // { title: '风险告知卡', num: 0, icon: 'sbss2', actives: true, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Fxgzk.vue")) },
    ]
  })
}
//获取建筑物详情
function getlcxq(id) {
  getApi({}, `/mosty-jcgl/building/getBuildingById/${id}`).then(res => {
    formData.value.publicarea = res.publicarea ? res.publicarea : '2'
    if (formData.value.publicarea == '1') {
      getbw2data(id);
    } else {
      getlcdata(id);
    }
  })
}
//获取设备设施名称
function getxzqh(val) {
  formData.value.name = val;
}
//查询是否包含某个字符
function Isgetdm(str, zf) {
  if (str) {
    return str.indexOf(zf) != -1;
  }

}
//关闭弹窗
const closezzjg = (val) => {
  showDept.value = val;
};
const black = () => {
  if (props.formData.saveBtnShow) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        // 关闭上一次的表单校验
        ruleFormRef.value.clearValidate();
        emit("changePage");
      })
      .catch(() => {
        // catch error
      })
  } else {
    // 关闭上一次的表单校验
    ruleFormRef.value.clearValidate();
    emit("changePage");
  }

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

    }
  });
};

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

//	根据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) {
      formData.value.buildingid = item.id;
      formData.value.buildingname = item.buildingname;
      formData.value.publicarea = item.publicarea;
      formData.value.floorname = '';
      formData.value.floorid = '';
      formData.value.partname = '';
      formData.value.partid = '';
      if (item.publicarea == '1') {
        getbw2data(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) {
      formData.value.floorid = item.id;
      formData.value.floorname = item.floorname;
      formData.value.partname = '';
      formData.value.partid = '';
      getbwdata(item.id);
    }
  });
}
// (新)根据楼层id查询部位
function getbwdata(id) {
  getApi({ id }, "/mosty-jcgl/part/getListByFloorid").then((res) => {
    bwlist.value = res ? res : [];
  });
}
//(新)根据建筑物id查询部位
function getbw2data(id) {
  getApi({ id }, "/mosty-jcgl/part/getListByBuildid").then((res) => {
    bwlist.value = res ? res : [];
  });
}
//刷新接口
function resetChange(val) {
}
</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-image {
  margin: 0;
  padding: 1px;
}



::v-deep .el-form {
  // width: 1525px;
  margin: auto;
  padding: 10px;
  margin-top: 10px;
  flex-wrap: wrap;
  justify-content: start;
  // padding: 10px 56px !important;
}

::v-deep .el-form-item__content {
  margin-left: 10px !important;
}

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

.bigBox {
  display: block !important;
  padding-right: 14px;
  box-sizing: border-box;
}

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



::v-deep .el-upload-list {
  width: 50%;
}
</style>
