<!-- 测试校准检定方法查新进度-进度展示 -->
<script lang="ts" setup name="NoveltySearchProcess">
import { getDictByCode } from '@/api/system/dict'
import type { deptType, dictType } from '@/global'
import { showBenchNovelty } from '@/api/resource/fileNovelty'
import useUserStore from '@/store/modules/user'
const user = useUserStore() // 用户信息
const isAdministrator = ref('0') // 是不是超级管理员
const groupCodeList = ref([]) as any // 组别
const labCodeList = ref<dictType[]>([]) // 实验室
const methodList = ref<any[]>([]) // 实验室
const loading = ref(true)
const query = ref({
  fileId: '',
  groupCode: '',
  labCode: '',
})
const show = ref('')
// 获取数据
const fetchData = () => {
  loading.value = true
  showBenchNovelty(query.value).then((res) => {
    methodList.value = res.data.rows
    if (methodList.value.length) {
      show.value = methodList.value[0].id
    }
    else {
      show.value = ''
    }
    loading.value = false
  }).catch(() => {
    loading.value = false
  })
}
onMounted(() => {
  // 判断是否超级管理员
  isAdministrator.value = user.roleTips.includes('administrator') ? '1' : '0' // 是否是超级管理员
  if (isAdministrator.value === '0') {
    query.value.labCode = user.bizLabCode
  }
  fetchData()
})
function getDict() {
  // 组别
  getDictByCode('bizGroupCode').then((response) => {
    const tempMenu = ['电学电源组', '热工力学组', '无线电脉冲组']
    tempMenu.forEach((item) => {
      const tempFindData = response.data.find((e: { name: string; value: string }) => e.name === item)
      if (tempFindData) {
        groupCodeList.value.push({
          name: tempFindData.name,
          id: `${tempFindData.id}`,
          value: `${tempFindData.value}`,
        })
      }
    })
    groupCodeList.value.unshift({
      id: 'all',
      name: '全部',
      value: '',
    })
  })
  // 实验室
  getDictByCode('bizGroupCodeEquipment').then((response) => {
    labCodeList.value = response.data
    labCodeList.value.unshift({
      id: 'all',
      name: '全部',
      value: '',
    })
  })
}
getDict()

const currentRecord = ref()
// 节点数据
const processData = ref<any[]>([])
// 生成节点数据
const handlerProcessData = () => {
  processData.value = []
  const processOrderIndex = ['noveltySearchComplete', 'allSearchComplete', 'methodConfirmComplete', 'measureMethodComplete', 'standardComplete', 'environmentComplete', 'itemCategoryComplete', 'grantNoticeComplete', 'trainComplete', 'examineComplete', 'systemFileComplete']
  const processOrderChinese = ['《测试校准检定方法查新记录表》有查新', '西昌及海口实验室是否全部查新完成', '《方法确认登记表》更新', '《测试、校准或检定方法》更新', '《标准库台账》更新', '《工作间环境一览表》更新', '《检定项分类更新》更新', '《文件发放通知单》更新', '《文件学习（培训签到表）》更新', '《要求、委托书及合同评审表》更新', '《体系文件》更新']
  processOrderIndex.forEach((item: string, index: number) => {
    processData.value.push({
      text: processOrderChinese[index],
      value: item,
      time: currentRecord.value[`${item}Date`],
      complete: currentRecord.value[item],
    })
  })
}
watch(() => show.value, (newVal) => {
  if (newVal) {
    currentRecord.value = methodList.value.filter((item: any) => item.id === newVal)[0] || {}
    handlerProcessData()
    processData.value = processData.value.map((item: any, index: number) => ({
      stageType: index + 1,
      label: item.text,
      time: item.time,
      status: Number(item.complete) === 1 ? 'success' : 'undone',
    }))
  }
  else {
    processData.value = []
  }
})
</script>

<template>
  <div style="display: flex;align-items: center;">
    <div class="title" style="margin-right: 10px;">
      测试校准检定方法查新进度
    </div>
    <!-- 实验室下拉框 -->
    <el-select
      v-if="isAdministrator === '1'" v-model="query.labCode" style="width: 130px;" class="short-input"
      placeholder="实验室" clearable @change="fetchData"
    >
      <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
    </el-select>
    <!-- 组别 -->
    <el-select
      v-model="query.groupCode" style="width: 130px;margin-left: 10px;" class="short-input" placeholder="组别"
      clearable @change="fetchData"
    >
      <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
    </el-select>
    <!-- 测试校准检定方法 -->
    <el-select
      v-model="show" style="width: 130px;margin-left: 10px;" class="short-input" placeholder="测试校准检定方法"
      clearable
    >
      <el-option v-for="item in methodList" :key="item.id" :label="item.fileName" :value="item.id" />
    </el-select>
  </div>
  <!-- 进度 -->
  <div v-if="processData.length" v-loading="loading" style="display: flex;flex-direction: column;width: 100%;height: 100%;">
    <sky-step :step-list="processData" />
  </div>
  <el-empty v-if="!processData.length" style="height: 100%;padding: 0;" :image-size="50" />
</template>

<style lang="scss" scoped>
.title {
  font-weight: 600;
  font-size: 14px;
  color: rgb(52 52 52);
}

::v-deep(.el-step__title) {
  font-size: 12px;
}
</style>