<template>
  <div class="bigBox">
    <MOSTY.FromPage :title="pageTitle" @closeDialog="black">
      <template #content>
        <MOSTY.Assort :title="'基础信息'" />
        <div class="fromBox">
          <el-form class="mosty-from-wrap" ref="ruleFormRef" label-width="125px" :model="data.formData" :inline="true"
            :rules="rules" :disabled="!saveBtn">
            <el-form-item label="危害因素:" prop="hazardousfactors" style="width: 100%;">
              <el-select v-model="data.formData.hazardousfactors" placeholder="请选择危害因素" multiple style="width: 100%">
                <el-option v-for="item in props.obj.zdlist.D_TB_ZYJK_WHYS" :key="item.value" :label="item.label"
                  :value="item.value"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="所属场所:" prop="sitename">
              <el-select v-model="data.formData.sitename" @change="cahngecsmc" clearable style="width: 250px"
                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="所属建筑物:" prop="buildingname">
              <el-select v-model="data.formData.buildingname" @change="cahngejzwmc" clearable style="width: 250px"
                placeholder="请选择">
                <el-option v-for="item in jzwlist" :key="item" :label="item.buildingname" :value="item.id" />
              </el-select>
            </el-form-item>
            <el-form-item label="所属楼层:" prop="floorname" v-if="data.formData.publicarea != '1'">
              <el-select v-model="data.formData.floorname" @change="cahngelcmc" clearable style="width: 250px"
                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="partname">
              <el-select v-model="data.formData.partname" @change="cahngebw" clearable style="width: 250px"
                placeholder="请选择">
                <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="上一次检测日期:" prop="sycjcsj">
              <el-date-picker v-model="data.formData.sycjcsj" style="width: 250px" type="date" value-format="YYYY-MM-DD"
                placeholder="请选择上一次检测日期" />
            </el-form-item>
            <el-form-item label="责任部门:" prop="deptname">
              <el-input v-model="data.formData.deptname" readonly style="width: 250px">
              </el-input>
            </el-form-item>
            <el-form-item label="部门负责人:" prop="postusername" style="width:100%">
              <el-input v-model="data.formData.postusername" type="textarea" :rows="4" readonly style="width: 100%">
              </el-input>
            </el-form-item>


            <el-form-item label="场所二维码:" v-if="data.formData.id" style="width: 100%">
              <MOSTY.ErwmImg
                :url="qrcodeImg(data.formData.id, 'S', data.formData.sitename, data.formData.partname, data.formData.deptname)"
                :filename='"职业危害场所二维码"' :id='"htmlsmewmzywhcs"' />
            </el-form-item>
          </el-form>
        </div>

        <MOSTY.Assort v-if="data.formData.id" :title="'关联信息(固定信息、动态信息)'" />
        <div>
          <div v-if="data.formData.id">
            <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="'sb'" :cardtype="'02'" :isEdit="true" :obj="data.formData"
                @handleChange="changelicolor" @tableChange="tableChange" @resetChange="resetChange" />
            </div>
          </div>
        </div>

        <div>
          <div v-if="data.formData.id">
            <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="'sb'" :obj="data.formData" @handleChange="changelicolor2"
                @resetChange="searchChange" />
            </div>
          </div>
        </div>

        <div v-if="data.formData.id && tablist2[4].actives">
          <div class="mb10">
            <div class="addbtn" style="text-align: right">
              <el-button v-if="saveBtn" type="primary" @click="Adduser" class="float:right">
                <el-icon>
                  <Plus />
                </el-icon>
                <span>新增</span>
              </el-button>
            </div>
            <el-table ref="multipleTableRef" :data="userlist" stripe height="30vh" style="width: 100%"
              v-loading="userloading" border>
              <el-table-column type="selection" width="55" :selectable="handleSelectTable" />
              <el-table-column type="index" label="序号" width="55" />
              <el-table-column label="人员名称" property="username"></el-table-column>
              <el-table-column label="人员类别" property="peopletype">
                <template #default="{ row }">
                  <dict-tag :options="D_BZ_RYLB_NEW" :value="row.peopletype" :tag="false" />
                </template>
              </el-table-column>
              <el-table-column label="身份证号" property="idCard">
                <template #default="{ row }">
                  {{ row.idCard }}
                </template>
              </el-table-column>
              <el-table-column label="性别" property="idCard">
                <template #default="{ row }">
                  {{ idCardType(row.idCard, 2) }}
                </template>
              </el-table-column>
              <el-table-column label="年龄" property="idCard">
                <template #default="{ row }">
                  {{ idCardType(row.idCard, 3) }}
                </template>
              </el-table-column>
              <el-table-column label="岗位名称" property="positionName"> </el-table-column>
              <el-table-column label="操作" width="300">
                <template #default="{ row }">
                  <span class="operedit" v-if="saveBtn" @click="xguser(row)"><el-icon>
                      <EditPen />
                    </el-icon>修改</span>
                  <el-popconfirm v-if="saveBtn" confirm-button-text="是" cancel-button-text="否" icon-color="red"
                    title="确定要删除?" @confirm="deldetery(row)">
                    <template #reference>
                      <span class="operdel" size="small"><el-icon>
                          <Delete />
                        </el-icon>
                        删除</span>
                    </template>
                  </el-popconfirm>
                  <span class="operesee" @click="userxq(row)"><el-icon>
                      <View />
                    </el-icon>查看</span>
                  <span class="operedown" @click="tjjltabs(row)"><el-icon>
                      <Compass />
                    </el-icon>体检记录表</span>
                </template>
              </el-table-column>
            </el-table>
            <div class="fenye">
              <MOSTY.Pages :pageConfiger="userfrom" @changeNo="changeuser" @changeSize="changeSizeuser">
              </MOSTY.Pages>
            </div>
          </div>
        </div>
        <div>
          <MOSTY.Assort :title="'检测记录'" />
          <div>
            <el-button class="addbtn" type="primary" @click="addjcjl" v-if="saveBtn">
              <el-icon>
                <CirclePlus />
              </el-icon>
              <span>新增</span>
            </el-button>
          </div>
          <el-table ref="multipleTableRef" stripe :data="tableData" style="width: 100%" height="30vh" border
            v-loading="tableloading">
            <el-table-column label="检测日期" show-overflow-tooltip property="ckeckDate"></el-table-column>
            <el-table-column label="检测危害因素" property="checkHazardousfactors">
              <template #default="{ row }">
                <dict-tag :options="D_TB_ZYJK_WHYS" :value="row.checkHazardousFactors" :tag="false" />
              </template>
            </el-table-column>
            <el-table-column label="检查周期" property="inspectionCycle">
              <template #default="{ row }">
                <dict-tag :options="props.obj.zdlist.D_TB_JCZQ" :value="row.inspectionCycle" :tag="false" />
              </template>
            </el-table-column>
            <el-table-column label="检测点位数量" property="checkNumberPoints"></el-table-column>
            <el-table-column label="标准值" property="standardValue"></el-table-column>
            <el-table-column label="超标点位数量" property="exceedingNumberPoints"></el-table-column>
            <el-table-column label="涉及人数" property="numberPeopleInvolved"></el-table-column>
            <el-table-column label="操作">
              <template #default="{ row }">
                <span class="operedit" v-if="saveBtn" @click="handleCbj(row)"><el-icon>
                    <EditPen />
                  </el-icon>修改</span>
                <el-popconfirm v-if="saveBtn" confirm-button-text="是" cancel-button-text="否" icon-color="red"
                  title="确定要删除?" @confirm="delRow(row)">
                  <template #reference>
                    <span class="operdel" size="small">
                      <el-icon>
                        <Delete />
                      </el-icon>
                      删除</span>
                  </template>
                </el-popconfirm>
                <span class="operesee" @click="handleCbjxq(row)"><el-icon>
                    <Compass />
                  </el-icon>查看</span>
              </template>
            </el-table-column>
          </el-table>
          <div class="fenye">
            <MOSTY.Pages :pageConfiger="pageConfiger" @changeNo="changeNo" @changeSize="changeSize">
            </MOSTY.Pages>
          </div>
        </div>
      </template>
      <template #footer>

        <el-button type="primary" v-if="saveBtn" v-loading="loadingshow" @click="submit(ruleFormRef)">
          <el-icon>
            <DocumentChecked />
          </el-icon>保存
        </el-button>
        <el-button @click="black">
          <el-icon>
            <DocumentDelete />
          </el-icon>关闭
        </el-button>
      </template>
    </MOSTY.FromPage>

    <Choosebm :formInfo="data.fromObj" :searchType="'04'" :showDdld="showDept" @closezzjg="closeJhss"
      @listdata="getSonValue" :zzlx="zzlx" :deptId="ssdwid" />
    <whcsjcjl v-if="addDiaShow" :saveBtnShow="saveBtnShow" :zdlist="props.obj.zdlist" :addDiaShow="addDiaShow"
      :zywhid="data.formData.hazardousfactors" :title="jltitle" :occupationalHazardId="listQuery.occupationalHazardId"
      :rowId="rowId" @changeclose="closejcjl">
    </whcsjcjl>
    <zywhryadd v-if="addUserShow" :saveBtnShow="saveBtnShow"
      :zdlist="{ D_BZ_RYLB_NEW, D_BZ_SF, D_TB_ZYJK_WHYS, D_TB_JCZQ }" :addUserShow="addUserShow"
      :deptid="data.formData.deptid" :title="usertitle" :hazardsiteid="userfrom.hazardsiteid" :rowId="rowId"
      @changePage="closeuser">
    </zywhryadd>
    <tjjltab v-if="dialogTjjltab" v-model="dialogTjjltab" :title="'体检记录表'" @changeclosetj="handleClose"
      :userId="userId" />
  </div>
</template>

<script setup>
import { reactive, ref, onMounted, getCurrentInstance, defineAsyncComponent } from "vue"
import * as MOSTY from "@/components/MyComponents/index"
import Choosebm from "@/components/MyComponents/ChooseDept/index.vue"
import * as rule from "@/utils/rules.js"
import whcsjcjl from "./whcsjcjl.vue"
import zywhryadd from "./zywhryadd.vue"
import tjjltab from "./tjjltab.vue"
import { ElMessage } from "element-plus"
import { postApi, getApi } from "@/api/tobAcco_api.js"
import { getItem } from "@/utils/storage"
import { qrcodeImg, isString, getImgUrl } from "@/utils/tools.js"
import { Html2canvasImg } from "@/utils/html2pdf.js"
const { proxy } = getCurrentInstance()
const { D_BZ_RYLB_NEW, D_BZ_SF, D_TB_ZYJK_WHYS, D_TB_JCZQ } = proxy.$dict("D_BZ_RYLB_NEW", "D_BZ_SF", "D_TB_ZYJK_WHYS", "D_TB_JCZQ")
const dialogTjjltab = ref(false)
const userId = ref("")
const usertitle = ref("职业危害人员新增")
const addUserShow = ref(false)
const userfrom = ref({
  pageSize: 5,
  pageCurrent: 1,
  total: 0
})
const pageConfiger = ref({
  pageSize: 5,
  pageCurrent: 1,
  total: 0
})
const loadingshow = ref(false)
const addDiaShow = ref(false)
const saveBtnShow = ref(false)
const ssdwid = getItem("deptId").ssdwid
const zzlx = ref(null)
function onloadewm1(val) {
  Html2canvasImg("htmlsmewmzywhcs", "职业危害场所二维码")
}
const handleSelectTable = row => {
  return false
}
const props = defineProps({
  obj: {
    type: Object,
    default: () => { }
  }
})
const tableloading = ref(false)
const userloading = ref(false)
const listQuery = reactive({
  pageCurrent: 1,
  pageSize: 5
})
const userlist = ref([])
const rowId = ref(null)
const jltitle = ref("")
const tableData = ref([])
const showDept = ref(false) //选择部门
const saveBtn = ref(true)
const emit = defineEmits("changePage")
const ruleFormRef = ref()
const pageTitle = ref("")
const data = reactive({
  formData: {
    orgname: getItem("deptId").ssdwmc,
    orgcode: getItem("deptId").ssdwid
  }
})
const checktype = ref(null)//部位类型
const isShowgd = ref(true)
const isShowdt = ref(true)
const tablist = ref([
  {
    title: "职业病危害告知卡",
    num: -1,
    icon: "sbss2",
    actives: true,
    components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Zygzk.vue"))
  },
  {
    title: "检测记录",
    num: -1,
    icon: "sbss2",
    actives: false,
    components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/ZYCheckRecord.vue"))
  }
])
const tablist2 = ref([
  { title: "检查标准", num: -1, icon: "jianzhuwu", sblx: '100000000000', actives: true, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Synthesize.vue")) },
  { title: "检查记录", num: -1, icon: "sbss2", actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Standard.vue")) },
  { title: "风险清单", num: -1, icon: "sbss2", actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Risklist.vue")) },
  { title: "隐患清单", num: -1, icon: "sbss2", actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Pitfall.vue")) },
  { title: "职业危害作业人员", num: -1, icon: "sbss2", actives: false, components: defineAsyncComponent(() => import("@/components/MyComponents/TabList/Hazardous.vue")) }
])

function changelicolor(val) {
  tablist.value.forEach((item,index) => {
    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
    }
  })
}

function tableChange(val) {
  if(val?.title =='检测记录') {
    setJcJlTotal(tablist.value[1])
  }
  data.formData.list = val
}
function resetChange(val) {
  // gettabcount()
}

const rules = reactive({
  sitename: [{ required: true, message: "场所名称不能为空", trigger: "blur" }],
  buildingname: [{ required: true, message: "请选择所属建筑物", trigger: "blur" }],
  floorname: [{ required: true, message: "请选择所属楼层", trigger: "blur" }],
  partname: [{ required: true, message: "请选择所属部位", trigger: "blur" }],
  siteaddress: [{ required: true, message: "场所地址不能为空", trigger: "blur" }],
  deptname: [{ required: true, message: "责任部门不能为空", trigger: "blur" }],
  postusername: [{ required: true, message: "部门负责人不能为空", trigger: "blur" }],
  hazardousfactors: [{ required: true, message: "危害因素不能为空", trigger: "blur" }],
  sycjcsj: [{ required: true, message: "请选择上一次检测日期", trigger: "blur" }],
})
/**设置检测记录数量 */
const setJcJlTotal = (tabItem) => {
  
  if (!props.obj.rowId) return
  let params = {
    pageSize: 1,
    pageCurrent: 1,
    bizId: props.obj.rowId,
    bizType: 'zywhcs'
  }
  postApi(params, "/mosty-jcgl/deviceCheckRecord/pageList")
    .then(res => {
      tabItem.num = res.total || 0
    })
}
/**设置-检查标准-数量 */
const setJcJlTotal1 = (tabItem) => {
  const responsibilitydeptid = data.formData.responsibilitydeptid
  const params = {
    pageCurrent: 1,
    pageSize: 1,
    keywords: '',
    deptId: responsibilitydeptid
  }
  getApi(params, '/mosty-jcgl/dynamic/checkList').then(res => {
    tabItem.num = res.total || 0
  })
}
/** 检查记录 */
const setJcJlTotal2 = (tabItem) => {
  const { objid, zbid, id } = data.formData
  const paramas = {
    pageCurrent: 1,
    pageSize: 1,
    objid: objid ? objid : zbid ? zbid : id,
    keywords: ''
  }
  getApi(paramas, '/mosty-jcgl/dynamic/checkLogList').then(res => {
    tabItem.num = res.total || 0
  })
}
/** 风险清单 */
const setJcJlTotal3 = (tabItem) => {
  let paramas = {
    pageCurrent: 1,
    pageSize: 1,
  }
  const { objid, zbid, id } = data.formData
  if (props.type == 'cs') {
    paramas.siteid = id
  } else if (props.type == 'jzw') {
    paramas.buildingid = id
  } else if (props.type == 'sb') {
    paramas.objid = zbid ? zbid : id
  } else if (props.type == 'bw') {
    paramas.partid = id
  }
 
  getApi(paramas, "/mosty-jcgl/dynamic/riskList").then((res) => {
    tabItem.num = res.total || 0
  })
}
/** 隐患清单 */
const setJcJlTotal4 = (tabItem) => {
  const { objid, zbid, id } = data.formData
  const paramas = {
    pageCurrent: 1,
    pageSize: 1,
    objid: objid ? objid : zbid ? zbid : id,
    keywords: ''
  }
 
  getApi(paramas, "/mosty-jcgl/dynamic/yhList").then((res) => {
    tabItem.num = res.total || 0
  })
}
/** 隐患清单 */
const setJcJlTotal5 = (tabItem) => {
  const paramas = {
    pageCurrent: 1,
    pageSize: 1,
    hazardsiteid: props.obj.rowId
  }
  postApi(paramas, "/mosty-jcgl/occHazardOpr/getPageList").then((res) => {
    tabItem.num = res.total || 0
    
  })
}

const setTotal = () => {
  if (isShowgd.value) setJcJlTotal(tablist.value[1])
  // 下面的备用
  return
  if (isShowdt.value) {
    setJcJlTotal1(tablist2.value[0])
    setJcJlTotal2(tablist2.value[1])
    setJcJlTotal3(tablist2.value[2])
    setJcJlTotal4(tablist2.value[3])
    setJcJlTotal5(tablist2.value[4])
  }
}
onMounted(() => {
  getcsData()
  if (props.obj) {
    pageTitle.value = props.obj.title
    saveBtn.value = props.obj.saveBtn
    if (props.obj.rowId) {
      listQuery.occupationalHazardId = props.obj.rowId
      userfrom.value.hazardsiteid = props.obj.rowId
      gtdataxq(props.obj.rowId)
      getuserlist()
      getTableData()

    }
  }
})

//获取详情
function gtdataxq(id) {
  getApi({ id: id }, `/mosty-jcgl/occupationalHazard/queryById`).then(res => {
    res.hazardousfactors = res.hazardousfactors ? res.hazardousfactors.split(",") : null
    data.formData = res
    getjzwxq(res.buildingid)//根据建筑物详情来判断是否有楼层
    getjzwlist(res.siteid)
    getbwdata(res.floorid)
    getbwxq(data.formData.partid)

    // 设置tablist 的计数
    setTotal()
  })
}
function getbwxq(id) {
  getApi({ id }, '/mosty-jcgl/part/queryScenePartById').then(res => {
    checktype.value = res ? res.checktype : null;
    data.formData.objid = res ? res.id : null

  })
}
function handleClose() {
  userId.value = true
  dialogTjjltab.value = false
}
const closeJhss = val => {
  showDept.value = val
}
const getSonValue = value => {
  if (zzlx.value == "01") {
    data.formData.deptname = value.orgName
    data.formData.deptid = value.id
  }
}
//新增职业危害人员
function Adduser() {
  usertitle.value = "职业危害人员新增"
  rowId.value = null
  saveBtnShow.value = true
  addUserShow.value = true
}
function xguser(row) {
  usertitle.value = "职业危害人员修改"
  rowId.value = row.id
  saveBtnShow.value = true
  addUserShow.value = true
}
function userxq(row) {
  usertitle.value = "职业危害人员详情"
  rowId.value = row.id
  saveBtnShow.value = false
  addUserShow.value = true
}
function tjjltabs(row) {
  userId.value = row.userid
  dialogTjjltab.value = true
}
function closeuser(val) {
  usertitle.value = ""
  rowId.value = null
  saveBtnShow.value = false
  addUserShow.value = false
  getuserlist()
}
//	查看职业危害人员
function getuserlist() {
  userlist.value = []
  userloading.value = true
  postApi(userfrom.value, "/mosty-jcgl/occHazardOpr/getPageList").then(res => {
    if (res.records) {
      userloading.value = false
      userlist.value = res.records
      userfrom.value.total = res.total
    } else {
      userlist.value = []
      userloading.value = false
    }
    // tablist2.value[4].num = res?.total || 0
  })
}
function idCardType(userCard, num) {
  //获取出生日期
  if (num == 1) {
    birth = userCard.substring(6, 10) + "-" + userCard.substring(10, 12) + "-" + userCard.substring(12, 14)
    return birth
  }
  //获取性别
  if (num == 2) {
    if (parseInt(userCard.substr(16, 1)) % 2 == 1) {
      return "男"
    } else {
      return "女"
    }
  }
  //获取年龄
  if (num == 3) {
    var myDate = new Date()
    var month = myDate.getMonth() + 1
    var day = myDate.getDate()
    var age = myDate.getFullYear() - userCard.substring(6, 10) - 1
    if (userCard.substring(10, 12) < month || (userCard.substring(10, 12) == month && userCard.substring(12, 14) <= day)) {
      age++
    }
    return age
  }
}
//删除人员
const deldetery = row => {
  if (row) {
    postApi({}, `/mosty-jcgl/occHazardOpr/del/${row.id}`).then(res => {
      ElMessage.success("职业危害作业人员删除成功")
      getuserlist()
    })
  }
}
function getTableData() {
  tableloading.value = true
  postApi(listQuery, "/mosty-jcgl/OccupationalHazardCheckRecords/queryTbOccupationalHazardCheckRecordsByOccupationalHazardId").then(res => {
    if (res.records) {
      tableloading.value = false
      tableData.value = res.records
      pageConfiger.value.total = res.total
    } else {
      tableData.value = []
      tableloading.value = false
    }
  })
}
const changeNo = val => {
  listQuery.pageCurrent = val
  pageConfiger.value.pageCurrent = val
  getTableData()
}
const changeSize = val => {
  listQuery.pageSize = val
  pageConfiger.value.pageSize = val
  getTableData()
}
const changeuser = val => {
  userfrom.value.pageCurrent = val
  getuserlist()
}
const changeSizeuser = val => {
  userfrom.value.pageSize = val
  getuserlist()
}
function addjcjl() {
  rowId.value = null
  jltitle.value = "检测记录新增"
  saveBtnShow.value = true
  addDiaShow.value = true
}
function handleCbj(row) {
  rowId.value = row.id
  jltitle.value = "检测记录修改"
  saveBtnShow.value = true
  addDiaShow.value = true
}
function handleCbjxq(row) {
  rowId.value = row.id
  jltitle.value = "检测记录详情"
  saveBtnShow.value = false
  addDiaShow.value = true
}
function delRow(val) {
  let ids = [val.id]
  postApi(ids, "/mosty-jcgl/OccupationalHazardCheckRecords/delTbOccupationalHazardCheckRecordsByIds").then(res => {
    ElMessage.success("删除成功")
    getTableData()
  })
}

function closejcjl() {
  addDiaShow.value = false
  rowId.value = null
  getTableData()
}
// 保存
const submit = async formEl => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      loadingshow.value = true
      data.formData.hazardousfactors = data.formData.hazardousfactors ? data.formData.hazardousfactors.toString() : null
      if (!data.formData.id) {
        postApi(data.formData, "/mosty-jcgl/occupationalHazard/add").then(res => {
          ElMessage.success("新增成功")
          emit("changePage", "Main")
        }).finally(() => {
          loadingshow.value = false
          data.formData.hazardousfactors = data.formData.hazardousfactors && isString(data.formData.hazardousfactors) ? data.formData.hazardousfactors.split(",") : data.formData.hazardousfactors
        })
      } else {
        postApi(data.formData, "/mosty-jcgl/occupationalHazard/update").then(res => {
          ElMessage.success("修改成功")
          emit("changePage", "Main")
        }).finally(() => {
          loadingshow.value = false
          data.formData.hazardousfactors = data.formData.hazardousfactors && isString(data.formData.hazardousfactors) ? data.formData.hazardousfactors.split(",") : data.formData.hazardousfactors
        })
      }
    }
  })
}
const black = () => {
  if (saveBtn.value) {
    proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
      .then(() => {
        // 关闭上一次的表单校验
        ruleFormRef.value.clearValidate()
        emit("changePage", "Main")
      })
      .catch(() => {
        // catch error
      })
  } else {
    // 关闭上一次的表单校验
    ruleFormRef.value.clearValidate()
    emit("changePage", "Main")
  }

}

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

const searchChange = e => {

}

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

//	根据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) {
      data.formData.buildingid = item.id
      data.formData.buildingname = item.buildingname
      data.formData.publicarea = item.publicarea
      data.formData.floorname = ""
      data.formData.floorid = ""
      data.formData.partname = ""
      data.formData.partid = ""
      data.formData.deptname = ""
      data.formData.postusername = ""
      data.formData.deptid = ""
      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) {
      data.formData.floorid = item.id
      data.formData.floorname = item.floorname
      data.formData.partname = ""
      data.formData.partid = ""
      data.formData.deptname = ""
      data.formData.postusername = ""
      data.formData.deptid = ""
      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 getjzwxq(id) {
  getApi({}, `/mosty-jcgl/building/getBuildingById/${id}`).then(res => {
    data.formData.publicarea = res.publicarea ? res.publicarea : "2"
    if (data.formData.publicarea == "1") {
      getbw2data(id)
    } else {
      getlcdata(id)
    }
  })
}
</script>

<style lang="scss" scoped>
::-webkit-scrollbar {
  width: 0 !important;
  height: 0;
}

.table-lable {
  margin: 10px;
  color: var(--el-color-primary);
}

.table-table-container {
  // min-height: 200px;
}

.box_cont {
  height: calc(100vh - 15vh);
  overflow-y: scroll;
}

.fromBox {
  width: 100%;
  margin: 20px auto;
  padding: 15px 15px 0 15px;
  border-radius: 1px;
}

.ld_box {
  display: flex;
  margin-right: 20px;
}


.el-form {
  width: 100%;
  align-items: center;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

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

.addbtn {
  margin-bottom: 10px;
}

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

.tabbox {
  max-height: 300px;
  overflow-y: scroll;

  .input {
    width: 100%;
    height: 100%;
  }
}

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