<!-- 第15套：小功率标准装置 -->
<!-- 检定数据管理详情模板 -->
<script lang="ts" setup name="MeasureDataTemplateDetail">
import { ref } from 'vue'
import { ElLoading } from 'element-plus'
import changeRecord from '../changeRecord.vue'
import TemplateFormAndTable from '../templateFormAndTable.vue'
import categoryNameDict from '/public/config/categoryNameDict.json'
import { useSolveFormData } from '../useSolveFormData'
import type { IDetailMeasureList } from './fifteenth-interface'
import templateTable from './templateTable.vue'
import useUserStore from '@/store/modules/user'
import type { TableColumn } from '@/components/NormalTable/table_interface'
import { calculateHandle, getInfo } from '@/api/business/taskMeasure/measureData'
import { getInfo as getItemInfo } from '@/api/business/measure/item'
import { useCheckList } from '@/commonMethods/useCheckList'
import { useMergeTableRow } from '@/commonMethods/useMergeTableRow'
import { useRound } from '@/commonMethods/useRound'

const props = defineProps({
  infoId: String, // id
  dataNo: String, // 检定数据编号
})
const emits = defineEmits(['giveInfoId', 'changeMeterIdentify'])
const $route = useRoute() // 路由参数
const templateFormAndTableRef = ref() // 表单和被检设备、测量设备表格公共组件ref
const itemFormData = ref({ // 有关于检定项的数据
  itemId: '', // 检定项id
  itemCategoryName: '', // 设备检定项分类名称
  itemCategoryId: '', // 设备检定项分类名称id
  belongStandardEquipment: '', // 标准装置code
  belongStandardEquipmentName: '', // 标准装置名称

  appearance: 1, // 外观及功能性检查
  appearanceFunctionCheck: '正常', // 外观及功能性检查
  remark: '', // 备注
})
const tableLoading = ref(false)
// -------------------------------------------路由参数------------------------------------------
const pageType = ref('add') // 页面类型: add, edit, detail
const infoId = ref('') // 列表id
if ($route.params && $route.params.type) {
  pageType.value = $route.params.type as string

  if ($route.params.id) {
    infoId.value = $route.params.id as string
  }
}

// ------------------------------------------标签----------------------------------------------------------
const radioMenus = ref([ // 标签内容
  { name: '检定数据', value: 'measure-data' },
  { name: '历史修改记录', value: 'change-record' },
])
const current = ref('measure-data') // 选择的tab 默认基本信息

// ---------------------------------------检定项数据表格----------------------------------------------------
const list = ref<IDetailMeasureList[]>([]) // 表格数据

const columns = ref<TableColumn[]>([ // 表头
  { text: '检定项目', value: 'params', align: 'center', required: true },
  { text: '频率', value: 'frequency', align: 'center', required: true },
  { text: '频率单位', value: 'frequencyUnit', align: 'center', required: true },
  { text: 'Pcu/mW', value: 'pcu', align: 'center', required: true, width: '180' },
  { text: 'Kc/%', value: 'kc', align: 'center', required: true },
  { text: '被测探头示数Pbu/mW', value: 'probePbu', align: 'center', required: true, width: '180' },
  { text: '标准反射系数ГGe', value: 'standardReflectionCoefficient', align: 'center', required: true },
  { text: '被检设备反射系数Гu', value: 'deviceReflectionCoefficient', align: 'center', required: true },
  { text: '被测探头校准因子Kb/%', value: 'probeCalibrationFactor', align: 'center', required: false },
  { text: 'U(k=2)', value: 'urel', align: 'center', required: true },
])

// -------------------------------------------获取详情信息--------------------------------------------------
// 获取页面详情信息
const fetchInfo = () => {
  const loading = ElLoading.service({
    lock: true,
    background: 'rgba(255, 255, 255, 0.8)',
  })
  getInfo({
    id: infoId.value,
    belongStandardEquipment: itemFormData.value.belongStandardEquipment,
    // 我的任务跳转过来如果已经配置过检定项了，到编辑页面，且用一下三个字段替代传id请求详情
    itemId: $route.query.itemId, // 检定项id
    orderId: $route.query.orderId, // 任务单id
    sampleId: $route.query.sampleId, // 被检设备id
  }).then((res) => {
    // 有关于检定项的数据
    itemFormData.value.itemId = res.data.itemId // 检定项id
    itemFormData.value.itemCategoryName = res.data.itemCategoryName // 设备检定项分类名称
    itemFormData.value.itemCategoryId = res.data.itemCategoryId ? res.data.itemCategoryId : itemFormData.value.itemCategoryId // 设备检定项分类名称id
    itemFormData.value.appearanceFunctionCheck = `${res.data.appearanceFunctionCheck}` // 外观（1/0）
    itemFormData.value.remark = res.data.remark // 结论、备注

    // =======================================表单公共组件数据处理=======================================================
    useSolveFormData(res, templateFormAndTableRef.value)
    // ==================================检定数据========================================================================

    list.value = res.data.measureDataLowPowerList.map((item: IDetailMeasureList) => {
      return {
        ...item,
        editable: pageType.value !== 'detail',
        params: '校准因子',
      }
    }) // 检定数据

    infoId.value = res.data.id
    emits('giveInfoId', infoId.value)
    loading.close()
  })
}

// 初始化输入数据
const initInputData = (data: any) => {
  list.value = data.map((item: any) => {
    return {
      ...item,
      params: '校准因子',
      dataType: '1', //	检定数据类型(一个检定数据中区分多个表格)(字典code)
      frequency: item.frequency, //	频率
      frequencyUnit: item.frequencyUnit, //	频率单位
      exceedMark: 0, //	超出范围标*(1/0)
      kc: useRound(item.kc, 3), //	Kc/%
      pcu: item.pcu, //	Pcu/mW
      probeCalibrationFactor: '', //	被测探头校准因子Kb/%
      probePbu: item.probePbu, //	被测探头示数Pbu/mW
      standardReflectionCoefficient: useRound(item.standardReflectionCoefficient, 2), //	标准反射系数ГGe
      deviceReflectionCoefficient: useRound(item.deviceReflectionCoefficient, 2), //	被检设备反射系数Гu
      urel: item.urel, //	U(k=2)
    }
  })
}

/**
 * 新增的时候获取检定项输入数据(获取检定项分类详情)
 * @param itemId  检定项id
 * @param itemCategoryName 检定项分类名字
 * @param belongStandardEquipment 检校标准装置字典
 */
const fetchItemInfo = (itemId: string, itemCategoryName: string, belongStandardEquipment = '') => {
  const params = {
    id: itemId,
    itemCategoryName, // 检定项分类名字
    belongStandardEquipment, // 检校标准装置字典code
  }
  getItemInfo(params).then((res) => {
    itemFormData.value.appearance = res.data.appearanceFunctionCheck // 外观及功能检查 1有外观，2没有外观
    itemFormData.value.appearanceFunctionCheck = res.data.appearanceFunctionCheck ? '正常' : ''// 外观及功能检查 1有外观，2没有外观
    initInputData(res.data.measureItemDataLowPowerList)
  })
}

// ----------------------------------------点击保存时校验---------------------------------------
// 点击计算结果校验
const checkout = () => {
  return useCheckList(list.value, columns.value)
}
// -----------------------------------------生成结果处理----------------------------------------
// 点击计算结果
const calculate = () => {
  if (!checkout()) {
    return false
  }
  // =============表格loading==============================
  tableLoading.value = true
  // =======================================================
  const params = {
    belongStandardEquipment: itemFormData.value.belongStandardEquipment, // 检校标准装置
    itemCategoryName: itemFormData.value.itemCategoryName, // 检定项分类名称
    measureDataLowPowerList: list.value.map((item: IDetailMeasureList) => {
      return {
        ...item,
        exceedMark: 0,
      }
    }),
  }
  calculateHandle(params).then((res) => {
    if (res.data && res.data.length) {
      list.value = res.data.map((item: IDetailMeasureList, index: number) => {
        return {
          ...item,
          probeCalibrationFactor: res.data[index].probeCalibrationFactor,
          params: '校准因子',
        }
      })
    }

    tableLoading.value = false
  }).catch(() => {
    tableLoading.value = false
  })
}
// ----------------------------------------------------------------------------------------
const isNeverDefineItemCategory = ref(false) // 检定项分类是否是从未定义过的
watch(() => itemFormData.value.itemCategoryName, (newValue) => {
  if (newValue) {
    // 判断是否是新增的检定项分类
    const index = categoryNameDict.findIndex((item: any) => item === newValue)
    if (index === -1) {
      isNeverDefineItemCategory.value = true
    }
    else {
      isNeverDefineItemCategory.value = false
    }
  }
})
// ------------------------------------------钩子----------------------------------------------

watch(() => props.infoId, (newValue) => {
  if (newValue) {
    infoId.value = newValue
  }
}, { immediate: true })

onMounted(() => {
  if (pageType.value === 'add') { // 从我的任务跳转过来（新增）
    itemFormData.value.itemId = $route.query.itemId as string// 检定项id
    itemFormData.value.itemCategoryName = $route.query.itemCategoryName as string// 设备检定项分类名称
    itemFormData.value.itemCategoryId = $route.query.itemCategoryId as string// 设备检定项分类名称id
    itemFormData.value.belongStandardEquipment = $route.query.belongStandardEquipment as string// 标准装置code
    itemFormData.value.belongStandardEquipmentName = $route.query.belongStandardEquipmentName as string// 标准装置名称
    // 查输入值(查检定项管理的详情)
    fetchItemInfo($route.query.itemId! as string, $route.query.itemCategoryName! as string, $route.query.belongStandardEquipment as string)
  }
  else {
    itemFormData.value.itemCategoryName = $route.query.itemCategoryName as string // 设备检定项分类名称
    itemFormData.value.itemCategoryId = $route.query.itemCategoryId as string// 设备检定项分类名称id
    itemFormData.value.belongStandardEquipment = $route.query.belongStandardEquipment as string// 标准装置code
    itemFormData.value.belongStandardEquipmentName = $route.query.belongStandardEquipmentName as string// 标准装置名称
    fetchInfo()
  }
})

defineExpose({ fetchInfo, checkout, itemFormData, templateFormAndTableRef, pageType, list })
</script>

<template>
  <div class="measure-data-template-detail">
    <template-form-and-table ref="templateFormAndTableRef" :page-type="pageType" @change-meter-identify="emits('changeMeterIdentify')" />
    <!-- 标签 -->
    <detail-block v-if="!isNeverDefineItemCategory" :title="pageType !== 'detail' ? '检定数据' : ''" :class="pageType === 'detail' ? 'setBottom' : ''">
      <el-radio-group v-if="pageType === 'detail'" v-model="current">
        <el-radio-button v-for="item in radioMenus" :key="item.value" :label="item.value">
          {{ item.name }}
        </el-radio-button>
      </el-radio-group>

      <el-form
        v-if="current === 'measure-data' && itemFormData.appearance"
        ref="formRef"
        :model="itemFormData"
        label-width="140"
        label-position="right"
        style="margin-top: 20px;"
      >
        <el-row>
          <!-- 外观  -->
          <el-col :span="12">
            <el-form-item label="外观及功能性检查:" prop="appearanceFunctionCheck">
              <el-input
                v-model="itemFormData.appearanceFunctionCheck"
                class="full-width-input"
                autosize
                type="textarea"
                :disabled="pageType === 'detail'"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <detail-block v-show="current === 'measure-data'" title="校准因子" style="margin-top: 0;padding-top: 0;">
        <template v-if="pageType !== 'detail'" #btns>
          <el-button type="primary" @click="calculate">
            计算结果
          </el-button>
        </template>
        <el-table
          ref="tableRef"
          v-loading="tableLoading"
          :data="list"
          border
        >
          <el-table-column align="center" label="序号" width="80" type="index" />
          <el-table-column
            v-for="item in columns"
            :key="item.value"
            :prop="item.value"
            :label="item.text"
            :width="item.width"
            align="center"
          >
            <template #header>
              <span v-show="item.required" style="color: red;">*</span><span>{{ item.text }}</span>
            </template>
            <template #default="scope">
              <precision-input-number
                v-if="pageType !== 'detail' && (item.value === 'probePbu' || item.value === 'pcu')"
                v-model="scope.row[item.value]"
                :placeholder="`${item.text}`"
                class="full-width-input"
                :disabled="pageType === 'detail'"
                :precision="3"
              />
            </template>
          </el-table-column>
        </el-table>
      </detail-block>
      <el-form
        v-if="current === 'measure-data'"
        ref="formRef"
        :model="itemFormData"
        label-width="140"
        label-position="right"
        style="margin-top: 20px;"
      >
        <el-row>
          <!-- 备注  -->
          <el-col :span="12">
            <el-form-item label="备注:" prop="remark">
              <el-input
                v-model="itemFormData.remark"
                class="full-width-input"
                autosize
                type="textarea"
                :disabled="pageType === 'detail'"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!-- 历史修改记录 -->
      <change-record v-if="pageType === 'detail' && current === 'change-record'" :info-id="infoId" />
    </detail-block>
  </div>
</template>

<style lang="scss">
.measure-data-template-detail {
  .el-radio__label {
    display: block !important;
  }
}
</style>