<template>
  <div>
    <div class="btnBox">
      <!-- 安全员、科长 -->
      <div v-if="['AQY', 'KZ'].includes(props.initPage.role) && ['21', '20'].includes(listQuery.stage)">
        <!-- <el-button type="primary" @click="handlehz">
          <span>提交审核</span>
        </el-button>
        <el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要驳回?"
          @confirm="bigDangerReject">
          <template #reference>
            <el-button type="primary" class='mr10' :disabled="!isAqbm || !proms?.identifyEntityId">
              <span>重大风险辨识遗漏驳回</span>
            </el-button>
          </template>
</el-popconfirm> -->
      </div>
      <el-button type="primary" @click="Close">
        <el-icon>
          <ArrowLeft />
        </el-icon>
        <span>返回</span>
      </el-button>
    </div>
    <!-- 表格 -->
    <div class="box-a">
      <div style="height:calc(100vh - 157px);">
        <MOSTY.Table highlightCurrentRow :table-columns="tableColumn" :tableData="tableData1"
          :tableloading="tableloading" :isSelect="false" :isSort="false" style="width: 100%;" actionsW="100">
          <template #num="{ row }">
            <span>{{ row.orangePointCount + row.redPointCount + row.yellowPointCount
              + row.bluePointCount }}</span>
          </template>
          <template #stage="{ row }">
            <dict-tag :options="GZ_D_ENT_STAGE" :value="row.stage" :tag="false" />
          </template>
          <!-- <template #actions="{ row }">
            <span class="operesee" v-if="row.stage == '21' || (row.orangePointCount + row.redPointCount + row.yellowPointCount
              + row.bluePointCount) > 0" @click.stop="handlexg(row)">查看</span>
            <span v-else>--</span>
          </template> -->
        </MOSTY.Table>
      </div>
    </div>
  </div>
</template>
<script setup>
// 引入
import { defineProps, watch, onMounted, getCurrentInstance, defineEmits, ref, computed } from 'vue'
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { getApi } from "@/api/tobAcco_api.js";
const emits = defineEmits(["close"]);
const { proxy } = getCurrentInstance();
const { GZ_D_ENT_STAGE } = proxy.$dict("GZ_D_ENT_STAGE");
const tableHeight = ref()
const props = defineProps({
  btnshow: {
    default: true,
    type: Boolean
  },
  initPage: Object,
  title: String,
  planid: {
    type: String,
    default: null
  },
});

const deptlist = ref([])
const shsm = ref(null)
/** 左边部门状态 */
const zbbmzt = ref(1)//左边部门状态
const total = ref(0)
const status = ref(2)
const proms = ref({
})
const listQuery = ref({})
const listpage = ref({
  pageCurrent: 1,
  pageSize: 10,
  planid: props.planid
})

const tableData1 = ref([])
const tableData2 = ref([])
const infoList = ref([])
const tableloading = ref(false)
const tableColumn = ref([
  {
    title: "分公司",
    prop: "entityName",
    sortable: true
  },
  {
    title: "风险数量",
    prop: "num",
    slot: true,
    sortable: true
  },
  {
    title: "状态",
    prop: "stage",
    sortable: true,
    slot: true
  },
])

const idlist = ref({
  planid: props.planid,
})
onMounted(() => {
  proms.value.planid = props.planid
  tabHeightFn();
  getpageDate()

})
//辨识评价-页面数据详情
function getpageDate () {
  // orgcode:只有评价小组登录才传orgcode
  getApi({ planid: props.planid }, '/mosty-jcgl/dangerPlanlist/bspj/showSjInfo').then(res => {
    tableData1.value = res.list
    let arr = tableData1.value.filter(item => {
      return (item.orangePointCount + item.redPointCount + item.yellowPointCount
        + item.bluePointCount) > 0
    })
    let arr2 = tableData1.value.filter(item => {
      return item.stage == '21'
    })


    if (arr.length > 0) {
      handlexg(arr[0])
    } else if (arr2.length > 0) {
      handlexg(arr2[0])
    }
    infoList.value = res.list.map(item => {
      return { entityCode: item.entityCode, entityName: item.entityName, id: item.id, usernames: item.teamUsernames, userids: item.teamUserids }
    })
    deptlist.value = res.list.map(item => {
      return { value: item.entityCode, label: item.entityName }
    })
    shsm.value = res.shsm ? res.shsm : null
    // status.value = res.entity.status
    listQuery.value = res.entity;
    proms.value.identifyEntityId = res.entity.id;
    idlist.value.identifyEntityId = res.entity.id;

    //     10-部门辨识中
    // 20-分公司辨识中 21-分公司汇总评价中
    // 30-整体任务辨识中 31-省、市公司分管领导审核中 32- 省、市公司主管领导审核中  33-完成
    if (['30', '31', '32'].includes(res.entity.stage)) {
      status.value = 3
    } else if (res.entity.stage == '33') {
      status.value = 4
    }
  })
}
//查看
function handlexg (row) {
  listpage.value.depcode = row.entityCode;
  zbbmzt.value = row.stage
  getpjxqTab()
}
//   辨识评价 - 查询各个单位的辨识情况
function getpjxqTab () {
  tableData2.value = []
  getApi(listpage.value, '/mosty-jcgl/dangerPlanlist/bspj/getBmbsListByDeptId').then(res => {
    tableData2.value = Array.isArray(res?.records) ? res.records : []
    total.value = res.total
  })
}
// 方法
const tabHeightFn = () => {
  tableHeight.value =
    window.innerHeight - 100 - 57 - 60 + 'px'
}
//返回
function Close () {
  emits("close");
}
</script>

<style lang="scss" scoped>
.titleBox {
  border: none;
  height: 152px;
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.el-form-item__label {
  padding: 12px 12px 0 0 !important;
}

.stebox {
  width: 90%;
  display: flex;
  justify-content: center;
  position: relative;
  align-items: center;
  margin: o auto;
}

.left {
  width: 70%;
}

.el-select {
  width: 150px;
}

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

.bs-title {
  color: red;
  margin: 10px;
}

.leftbox {
  width: 30%;
  margin-right: 40px;
}

.tabBox2 {
  width: 65%;
}

.fil-bbox {
  display: flex;

  .font {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    margin: 10px;

    .labs {
      color: #999494;
    }
  }
}

.operates {
  cursor: pointer;
  color: yellowgreen !important;
  display: inline-block;
  width: 40px;
  height: 23px;
  border: 1px solid #000;
  margin: 0 5px;
  background-color: #fff;
}

.operated {
  cursor: pointer;
  color: #fff !important;
  display: inline-block;
  width: 40px;
  height: 23px;
  border: 1px solid #000;
  margin: 0 5px;
  background-color: #f11515;
}

.redfont {
  color: rgb(245, 34, 34) !important;
}

.box-big {
  display: flex;
  margin-top: 10px;

  .fix-box {
    display: flex;
    margin-right: 30px;
  }
}

.el-textarea {
  --el-input-placeholder-color: #4c4e52 !important;
}

.btnpas {
  display: inline-block;
  padding: 5px 10px;
  color: #fff !important;
  margin-right: 4px;
  background-color: var(--el-color-primary);
  border-radius: 5px;
  cursor: pointer;
}

.fxdjspan {
  display: inline-block !important;
  width: 100px;
  text-align: center;
  padding: 5px 0;
  border-radius: 5px;
  color: #fff !important;
}

.reds {
  background-color: #e80000;
}

.orgs {
  background-color: #ff8040;
}

.blus {
  background-color: #e2d101;
}

.gres {
  background-color: #0080ff;
}
</style>
