<template>
  <div class="main">
    <div class="above">
      <div class="btnBox">
        <el-select v-model="pageData.listQuery.planYear" style="width: 150px;">
          <el-option v-for="item in filterYear(7)" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
        <el-button type="primary">
          <el-icon>
            <UploadFilled />
          </el-icon>
          <span>查询</span>
        </el-button>
        <el-button type="primary" @click="refresh">
          <el-icon>
            <Refresh />
          </el-icon>
          <span>统计更新</span>
        </el-button>
        <el-button type="primary">
          <el-icon>
            <Histogram />
          </el-icon>
          <span>历史记录</span>
        </el-button>
      </div>
    </div>
    <div class="below">
      <el-table ref="multipleTableRef" stripe :data="pageData.tableData" :fit="true" style="width: 99%;" @selection-change="handleSelectionChange" border v-loading="tableLoading">
        <el-table-column label="所属单位" property="orgName" fixed="left" width="300px">
          <template #default="scoped">
            <span v-if="scoped.row.updateFlag == '1'"><el-icon color="red" size="16px" @click="openHint(scoped.row)">
                <QuestionFilled />
              </el-icon></span>
            <span>{{ scoped.row.orgName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="年份" property="reportingYear" fixed="left"></el-table-column>
        <el-table-column label="从业人员在册在岗人数" property="jobDutyPeopleQty" width="200px"></el-table-column>
        <el-table-column label="从业人员劳务派遣人数" property="dispatchDutyPeopleQty" width="200px"></el-table-column>
        <el-table-column label="独立设置安全管理机构标识" width="200px">
          <template #default="row">
            <dict-tag :options="D_BZ_SF" :value="row.independentSettingsFlag" :tag="false" />
          </template>
        </el-table-column>
        <el-table-column label="安全管理人员编制人数" property="organizationPeopleQty" width="200px" />
        <el-table-column label="安全管理人员配置人数" property="allocationPeopleQty" width="200px"></el-table-column>
        <el-table-column label="设置安全工程师岗位标识" property="sePositionFlag" width="200px"></el-table-column>
        <el-table-column label="注安专业持证人数" property="safetyPeopleQty" width="150px"></el-table-column>
        <el-table-column label="注消专业持证人数" property="cancellationPeopleQty" width="150px"></el-table-column>
        <el-table-column label="安全生产标准化达标级别名称" property="complianceLevelName" width="250px"></el-table-column>
        <el-table-column label="安全生产标准化达标级别代码" property="complianceLevelCode" width="250px"></el-table-column>
        <el-table-column label="安全生产标准化-达标得分" property="complianceScore" width="250px"></el-table-column>
        <el-table-column label="安全生产标准化-有效截止日期" property="expireDate" width="250px"></el-table-column>
        <el-table-column label="年度安全生产标准化自评得分" property="yearSelfEvaluationScore" width="250px"></el-table-column>
        <el-table-column label="职业健康安全管理体系-认证标识" property="attestationFlag" width="300px"></el-table-column>
        <el-table-column label="职业健康安全管理体系-有效截至日期" property="effectiveUntilDate" width="300px"></el-table-column>
        <el-table-column label="统计时间" property="updateTime" width="180px"></el-table-column>
        <el-table-column label="操作" width="100" fixed="right">
          <template #default="{ row }">
            <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?" @confirm="deldete(row)">
              <template #reference>
                <span class="operedit"><el-icon>
                    <Position />
                  </el-icon>上报</span>
              </template>
            </el-popconfirm>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script setup>
import { reactive, ref, getCurrentInstance, onMounted, watchEffect, defineProps } from "vue"
import { getApi } from "@/api/tobAcco_api.js";
import { ElMessageBox } from "element-plus";
import { filterYear } from "@/utils/auth.js";
import { dateFormat } from "@/utils/tools.js"
const props = defineProps({ obj: Object })
const pageData = reactive({
  tableData: [],
  listQuery: {
    orgCode: "",
    year: dateFormat({ type: "year" })
  }
});
const { proxy } = getCurrentInstance()
const { D_BZ_SF } = proxy.$dict("D_BZ_SF");
const tableLoading = ref(false)
// 初始化
onMounted(() => {
  getDataList()
})
// 查看提示
const openHint = (row) => {
  ElMessageBox.alert(row.updateDesc, '变更提示', {
    // if you want to disable its autofocus
    // autofocus: false,
    confirmButtonText: '确认',
  })
}
// 统计更新
const refresh = () => {
  getApi({}, "/mosty-jcgl/enterpriseInfo/syncLocal").then(res => {
    getDataList()
  })
}
//列表
const getDataList = () => {
  tableLoading.value = true
  getApi(pageData.listQuery, "/mosty-jcgl/enterpriseInfo/getList").then(async res => {
    if (res) {
      pageData.tableData = res
    }
  }).finally(() => {
    tableLoading.value = false
  })
}
watchEffect(() => {
  if (props.obj) {
    pageData.listQuery.orgCode = props.obj.orgCode
    getDataList()
  }
})
</script>
<style lang="scss" scoped>
.main {
  width: 100%;
  height: calc(100vh - 220px);

  .above {
    .btnBox {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      margin-bottom: 10px;
    }
  }
}

::v-deep .el-table {
  border-bottom: 1px solid var(--el-color-primary);
  overflow: auto;
}
</style>