<!-- 进度 -->
<script lang="ts" setup name="ProgressBar">
import { ElMessage } from 'element-plus'
import noveltySearch from './noveltySearch.vue'
import SkyStep from '@/components/SkyStep/index.vue'
import { detailQualityRegistration, getRegistrationList } from '@/api/quality/internal/registration'
import { getDictByCode } from '@/api/system/dict'
import type { deptType, dictType } from '@/global'
import { SCHEDULE } from '@/utils/scheduleDict'
import useUserStore from '@/store/modules/user'

const $router = useRouter()
const user = useUserStore() // 用户信息
const loading = ref(false)
const showEmpty = ref(false)
const labCode = ref('') // 实验室
const groupCode = ref('') as any // 部门
const isAdministrator = ref('0') // 是不是超级管理员
const emptyDisc = ref('') // 描述文字
// 内部审核进度
const scheduleList = ref([]) as any

// ------------------------------------------字典----------------------------------------------
const groupCodeList = ref([]) as any // 部门
const labCodeList = ref<dictType[]>([]) // 实验室

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: null,
    })
  })

  // 实验室
  getDictByCode('bizGroupCodeEquipment').then((response) => {
    labCodeList.value = response.data
  })
}
getDict()

// ----------------------------------------获取数据-----------------------------------------
// 查询条件
const listQuery = ref({
  approvalStatus: '0',
  fileCode: '',
  fileName: '',
  creatorName: '',
  createTimeStart: '',
  createTimeEnd: '',
  offset: 1,
  limit: 999999,
  bizLabCode: '', // 实验室
  formId: SCHEDULE.INTERNAL_AUDIT_WORK_REGITRATION_APPROVAL,
})

// 内部审核登记表
function fetchRegistrationList() {
  getRegistrationList({ ...listQuery.value, bizLabCode: labCode.value, formId: SCHEDULE.INTERNAL_AUDIT_WORK_REGITRATION_APPROVAL }).then((response) => {
    const tempList = response.data.rows.filter((item: { isShow: number }) => item.isShow === 1) || [] // isShow === 1 标识这个登记表勾选了展示在工作台
    if (tempList && tempList.length) {
      scheduleList.value = [
        {
          stageType: '1',
          label: '内审组建立',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
          scheduleUserList: [] as any[],
        },
        {
          stageType: '2',
          label: '内部审核计划公示',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 2).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
          scheduleUserList: [] as any[],
        },
        {
          stageType: '3',
          label: '《内部审核检查表》编制',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 3).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '4',
          label: '首次会议',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 4).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '5',
          label: '现场审核',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 5).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '6',
          label: '内审组内部会议',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 6).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '7',
          label: '交换意见',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 7).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '8',
          label: '末次会议',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 8).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '9',
          label: '措施制定',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 9).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '10',
          label: '措施实施',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 10).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '11',
          label: '效果验证',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 11).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
        {
          stageType: '12',
          label: '记录存档',
          time: tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 1).scheduleTime,
          status: `${tempList[0].scheduleList.find((item: { stageType: number }) => item.stageType === 12).isCompleted}` === '1' ? 'success' : 'undone', // 是否完成(0 未完成 1 完成)
        },
      ]
    }
    loading.value = false
  }).catch(() => {
    loading.value = false
  })
}
// ----------------------------------------------------------------------------------------
function fetchData() {
  loading.value = true
  fetchRegistrationList()
}

// 改变实验室\部门
const changeSelect = () => {
  if (!showEmpty.value && (isAdministrator.value === '1' || (user.bizLabCode && user.groupNo))) {
    fetchData()
  }
}
onMounted(() => {
  isAdministrator.value = user.roleTips.includes('administrator') ? '1' : '0' // 是否是超级管理员
  console.log('是否是超级管理员', user.roleTips, isAdministrator.value)
  if (isAdministrator.value === '1') { // 超级管理员
    labCode.value = user.bizLabCode || 'H' // 有实验室就默认本人实验室，没有实验室就默认海口
    groupCode.value = null // 超级管理员默认查看全部
    fetchData()
  }
  else { // 不是超级管理员
    if (!user.bizLabCode) { // 没有实验室
      emptyDisc.value = '此用户非超级管理员且无实验室，无权限查看'
      showEmpty.value = true
    }
    else if (!user.groupNo) { // 有实验室但没有组
      emptyDisc.value = '此用户非超级管理员且无部门，无权限查看'
      showEmpty.value = true
    }
    else { // 有实验室且有组
      showEmpty.value = false
      if (user.groupNo === 'GL') { // 综合管理组
        labCode.value = user.bizLabCode // 实验室
        // 综合管理组默认查实验室下面的所有数据，不筛选部门
        groupCode.value = ''
        // 综合管理组可以查看待分发
      }
      else { // 其他组
        labCode.value = user.bizLabCode // 实验室
        // 其他组默认筛选自己组
        groupCode.value = user.groupNo
      }
      fetchData()
    }
  }
})
const showTab = ref('内部审核进度')
</script>

<template>
  <div v-loading="loading" class="workBench-step">
    <!-- 切换按钮 内部审核进度/测试校准检定方法查新进度  -->
    <div class="show-tab">
      <el-radio-group v-model="showTab" size="small">
        <el-radio-button label="内部审核进度" value="内部审核进度" />
        <el-radio-button label="测试校准检定方法查新进度" value="测试校准检定方法查新进度" />
      </el-radio-group>
    </div>
    <!-- 内部审核进度 -->
    <template v-if="showTab === '内部审核进度'">
      <div style="display: flex;align-items: center;">
        <div class="title" style="margin-right: 10px;">
          内部审核进度
        </div>
        <!-- 超级管理员才可以筛选实验室 -->
        <el-select
          v-model="labCode" :disabled="isAdministrator === '0'" style="width: 130px;" class="short-input"
          placeholder="实验室" clearable @change="changeSelect"
        >
          <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
        </el-select>
        <!-- 综合管理组才可以筛选部门 -->
        <!-- <el-select v-model="groupCode" :disabled="isAdministrator === '0' && user.groupNo !== 'GL'" style="width: 130px;margin-left: 10px;" class="short-input" placeholder="部门" clearable @change="changeSelect">
        <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
      </el-select> -->
      </div>
      <div v-if="scheduleList.length" style="display: flex;flex-direction: column;width: 100%;height: 100%;">
        <sky-step :step-list="scheduleList" />
      </div>
      <el-empty v-if="!scheduleList.length" style="height: 100%;padding: 0;" :image-size="50" />
    </template>
    <!-- 测试校准检定方法查新进度 -->
    <novelty-search v-if="showTab === '测试校准检定方法查新进度'" />
  </div>
</template>

<style lang="scss" scoped>
.workBench-step {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  .title {
    font-weight: 600;
    font-size: 14px;
    color: rgb(52 52 52);
  }

  .show-tab {
    position: absolute;
    top: 0;
    right: 5px;
  }
}
</style>