<!-- 溯源结果确认详情，展示溯源计划页面 -->
<script name="SourceConfirmDetailPlan" lang="ts" setup>
import type { Ref } from 'vue'
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import dayjs from 'dayjs'
import type { dictType } from '@/global'
import { getDictByCode } from '@/api/system/dict'
import { SCHEDULE } from '@/utils/scheduleDict'
import useUserStore from '@/store/modules/user'
import { addSourcePlanList, failUpdateSourcePlanList, getInfo, getSourcePlanList, submit, updateSourcePlanList } from '@/api/equipment/source/plan'
const $router = useRouter() // 关闭页面使用
const user = useUserStore() // 用户信息
const form = ref({
  planYear: '', // 年度
  labCode: '', // 实验室
  groupCode: '', // 部门
  equipmentId: '', // 设备id
  equipmentNo: '', // 统一编号
  equipmentName: '', // 设备名称
  model: '', // 规格型号
  manufactureNo: '', // 出厂编号
  manufacturer: '', // 生产厂家
  standardNo: '', // 所属测量标准号
  standardName: '', // 所属测量标准名称
  standardSituation: '1', // 标准情况字典code
  standardSituationName: '', // 标准情况(字典value)
  equipmentCategory: '', // 所属类别(字典code)
  equipmentCategoryName: '', // 所属类别(字典value)

  meterIdentify: '', // 检定结果
  traceDate: '', // 测试、校准/检定日期
  traceWay: '', // 溯源方式(字典code)
  traceWayName: '', // 溯源方式(字典value)
  supplierId: '', // 溯源机构id
  supplierName: '', // 溯源机构名称
  planTraceTime: '', // 计划溯源时间
  remark: '', // 备注
})
const loading = ref(false) // loading
const $route = useRoute() // 路由参数
const infoId = ref('') // id
// -----------------------------------------------路由参数---------------------------------
if ($route.params && $route.params.id) {
  infoId.value = $route.params.id as string
}
// -----------------------------------------字典--------------------------------------------------------------
const labCodeList = ref<dictType[]>([]) // 实验室
const groupCodeList = ref<dictType[]>([]) // 部门

// 查询字典
const getDict = async () => {
  // 实验室
  getDictByCode('bizGroupCodeEquipment').then((response) => {
    labCodeList.value = response.data
  })
  // 部门
  getDictByCode('bizGroupCode').then((response) => {
    groupCodeList.value = response.data
  })
}

// 获取上一年溯源信息
const fetchSourceInfoLastyear = (planYear: string | number) => {
  const year = Number(planYear) - 1
  console.log('上一年度', year)
  const param = {
    approvalStatus: '0', // 审批状态
    createTimeEnd: '', // 申请时间结束
    createTimeStart: '', // 申请时间开始
    createUserName: '', // 申请人
    formId: SCHEDULE.TRACE_PALN_APPROVAL, // formid
    planName: '', // 文件名称
    planNo: '', // 文件编号
    labCode: '', // 实验室
    groupCode: '', // 部门、部门、
    planYear: year, // 年度
    planStatusName: '', // 溯源计划状态
    limit: 20,
    offset: 1,
  }
  getSourcePlanList(param).then((response) => {
    if (response.data.rows.length) {
      getInfo({ id: response.data.rows[0].id }).then((res) => {
        form.value.meterIdentify = res.data.meterIdentify // 检定结果
        form.value.traceDate = res.data.traceDate // 测试、校准/检定日期
        form.value.traceWay = res.data.traceWay // 溯源方式(字典code)
        form.value.traceWayName = res.data.traceWayName // 溯源方式(字典value)
        form.value.supplierId = res.data.supplierId // 溯源机构id
        form.value.supplierName = res.data.supplierName // 溯源机构名称
      })
    }
  })
}

// ----------------------------------------------溯源需求----------------------------------------
const sourceNeedlist = ref([])
const sourceNeedColumns = ref([
  { text: '参数', value: 'measureParam', align: 'center', required: true },
  { text: '测量范围', value: 'measureRange', align: 'center', required: true },
])
const route = useRoute()
// 获取详情
const fetchInfo = () => {
  loading.value = true
  getInfo({ id: infoId.value }).then((res) => {
    loading.value = false
    //   form.value = res.data
    //   form.value.planYear = `${res.data.planYear}`
    //   list.value = res.data.tracePlanEquipmentList // 设备列表
    if (res && res.data && res.data.tracePlanEquipmentList && res.data.tracePlanEquipmentList.length) {
      const equipmentInfoList = res.data.tracePlanEquipmentList.filter((item: { equipmentId: string }) => item.equipmentId === $route.query.equipmentId)
      if (equipmentInfoList && equipmentInfoList.length) {
        const equipmentInfo = equipmentInfoList[0]
        form.value = equipmentInfo
        sourceNeedlist.value = equipmentInfo.technicalTargetList
      }
      form.value.labCode = res.data.labCode // 实验室
      form.value.groupCode = res.data.groupCode // 部门
      form.value.directorName = route.query.directorName as string // 负责人
    }
  })
}

// 关闭新增页面的回调
const close = () => {
  $router.back()
}
// ---------------------------------------------钩子----------------------------------------------

onMounted(() => {
  getDict()
  fetchInfo() // 获取详情信息
})
</script>

<template>
  <app-container class="source-resultConfirm-planDetail">
    <detail-page v-loading="loading" title="溯源结果确认-查看">
      <template #btns>
        <el-button type="info" @click="close">
          关闭
        </el-button>
      </template>
      <el-form
        ref="equipmentInfoFormRef"
        :model="form"
        :label-width="130"
        label-position="right"
      >
        <el-row :gutter="24">
          <el-col :span="6">
            <el-form-item label="统一编号:" prop="equipmentNo">
              <el-input v-model="form.equipmentNo" disabled placeholder="统一编号" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="设备名称:" prop="equipmentName">
              <el-input v-model="form.equipmentName" disabled placeholder="设备名称" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="规格型号" prop="model">
              <el-input
                v-model.trim="form.model"
                placeholder="规格型号"
                disabled
                class="full-width-input"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="出厂编号:" prop="manufactureNo">
              <el-input
                v-model.trim="form.manufactureNo"
                placeholder="出厂编号"
                class="detail-input"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="生产厂家:" prop="manufacturer">
              <el-input
                v-model.trim="form.manufacturer"
                placeholder="生产厂家"
                class="detail-input"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="实验室:" prop="labCode">
              <el-select
                v-model="form.labCode"
                placeholder="实验室"
                class="short-input"
                filterable
                clearable
                disabled
              >
                <el-option v-for="item in labCodeList" :key="item.id" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="部门:" prop="labCode">
              <el-select
                v-model="form.groupCode"
                placeholder="部门"
                class="short-input"
                filterable
                clearable
                disabled
              >
                <el-option v-for="item in groupCodeList" :key="item.id" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="负责人:">
              <el-input
                v-model.trim="form.directorName"
                placeholder="负责人"
                class="detail-input"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属测量标准编号:" label-width="140px" prop="standardNo">
              <el-input
                v-model.trim="form.standardNo"
                placeholder="所属测量标准编号"
                class="detail-input"
                type="textarea"
                autosize
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属测量标准名称:" label-width="140px" prop="standardName">
              <el-input
                v-model.trim="form.standardName"
                placeholder="所属测量标准名称"
                class="detail-input"
                type="textarea"
                autosize
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="标准情况:" prop="standardSituation">
              <el-radio-group v-model="form.standardSituation" disabled>
                <el-radio label="1">
                  已建
                </el-radio>
                <el-radio label="2">
                  待建
                </el-radio>
                <el-radio label="3">
                  其他
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属类别:" prop="equipmentCategory">
              <el-radio-group v-model="form.equipmentCategory" disabled>
                <el-radio label="1">
                  主标准器
                </el-radio>
                <el-radio label="2">
                  配套仪器
                </el-radio>
                <el-radio label="3">
                  其他
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="6">
            <el-form-item label="上一年度溯源情况" />
          </el-col>
          <el-col :span="6">
            <el-form-item label="检定结果:" prop="meterIdentify">
              <el-select
                v-model="form.meterIdentify"
                :placeholder="pageType === 'detail' ? ' ' : '检定结果'"
                disabled
                class="full-width-input"
              >
                <el-option v-for="item of meterIdentifyDict" :key="item.value" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="测试、校准/检定日期:" label-width="150px" prop="traceDate">
              <el-date-picker
                v-model="form.traceDate"
                type="datetime"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                placeholder="测试、校准/检定日期"
                disabled
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="6">
            <el-form-item label="本年溯源计划" />
          </el-col>
          <el-col :span="6">
            <el-form-item label="溯源方式:" prop="traceWay">
              <el-radio-group v-model="form.traceWay" disabled>
                <el-radio label="1">
                  自检
                </el-radio>
                <el-radio label="2">
                  送检
                </el-radio>
                <el-radio label="3">
                  比对
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="溯源机构名称:" prop="supplierName">
              <el-input
                v-model="form.supplierName"
                placeholder="溯源机构名称"
                class="input"
                disabled
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="计划溯源时间:" prop="planTraceTime">
              <el-date-picker
                v-model="form.planTraceTime"
                type="datetime"
                :placeholder="pageType === 'detail' ? ' ' : '计划溯源时间'"
                class="full-width-input"
                :class="{ 'detail-input': pageType === 'detail' }"
                disabled
                format="YYYY-MM-DD HH:mm:ss"
                value-format="YYYY-MM-DD HH:mm:ss"
                :clearable="false"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="12">
            <el-form-item label="备注:">
              <el-input
                v-model="form.remark"
                type="textarea"
                autosize
                :placeholder="pageType === 'detail' ? '' : '备注'"
                disabled
                :class="{ 'detail-input': pageType === 'detail' }"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <!-- 溯源需求 -->
      <detail-block v-loading="loading" title="溯源需求">
        <el-table
          :data="sourceNeedlist"
          border
          style="width: 100%;"
          max-height="600"
          @row-dblclick="rowDbClick"
          @selection-change="handleSelectionSourceNeedChange"
        >
          <el-table-column align="center" label="序号" width="80" type="index" />
          <el-table-column
            v-for="item in sourceNeedColumns"
            :key="item.value"
            :prop="item.value"
            :label="item.text"
            align="center"
          />
        </el-table>
      </detail-block>
    </detail-page>
  </app-container>
</template>

<style lang="scss">
.source-resultConfirm-planDetail {
  .el-radio__label {
    display: block !important;
  }
}
</style>