Newer
Older
xc-business-system / src / views / equipement / standard / book / components / config / first / config.vue
<!-- 标准装置台账信息详情 配置核查项 第一套:多功能校准源 -->
<script name="StandardBookEquipmentConfig" lang="ts" setup>
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import type { ICheckItem } from '../../../book-interface'
import TemplateTable from './templateTable.vue'
import { useCheckList } from '@/commonMethods/useCheckList'
import type { TableColumn } from '@/components/NormalTable/table_interface'
import { config, getCheckItemDetail } from '@/api/equipment/standard/book'
import { calc } from '@/utils/useCalc'
const textMap: { [key: string]: string } = {
  edit: '编辑',
  detail: '详情',
}// 页面类型字典
const form = ref({ // 表单
  equipmentNo: '', // 统一编号
  equipmentName: '', // 设备名称
  model: '', // 规格型号
  manufactureNo: '', // 出厂编号
  measureRange: '', // 测量范围
  uncertainty: '', // 不确定度或允许误差极限或准确度等级
  itemCategoryName: '', // 核查项分类名称
  itemCategoryId: '', // 核查项分类id
  remark: '', // 核查项备注
  belongStandardEquipment: '', // 检校标准装置
  belongStandardEquipmentName: '', // 检校标准装置名称
})
const pageType = ref('detail') // 页面类型: add, edit, detail
const infoId = ref('') // id
const $router = useRouter() // 路由实例
const loading = ref(false) // loading
const equipmentId = ref('') // 设备id

// -----------------------------------路由参数------------------------------------------------------
// 从路由中获取页面类型参数
const $route = useRoute()
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 best = ref(true) // 最佳点
const worst = ref(true) // 最差点
const model = ref(true) // 典型点
const columns = ref<TableColumn[]>([ // 表头
  { text: '核查点类型', value: 'testType', align: 'center', required: true, width: '90' },
  { text: '核查项目', value: 'params', align: 'center', required: true, width: '110' },
  { text: '核查点', value: 'checkPoint', align: 'center', required: true, width: '200' },
  { text: '单位', value: 'unit', align: 'center', required: true, width: '110' },
  { text: '频率', value: 'frequency', align: 'center' },
  { text: '单位', value: 'frequencyUnit', align: 'center', width: '110' },
  { text: '分辨力', value: 'resolution', align: 'center', required: true, width: '200' },
  { text: '循环次数', value: 'cycleNumber', align: 'center', required: true, width: '200' },
  { text: '测量标准相对扩展不确定度Urel', value: 'urel', align: 'center', required: true, width: '220' },
  { text: '核查类型', value: 'checkType', align: 'center', required: false, width: '220' },
  { text: '通道', value: 'thoroughfare', align: 'center', width: '220' },
  // { text: 'TFER', value: 'tfer', align: 'center', width: '110' },
  // { text: 'DCCP', value: 'dccp', align: 'center', width: '110' },
  // { text: 'FLIT', value: 'flit', align: 'center', width: '110' },
])
// 校验表格(点击保存的时候、增加行用)
const checkList = (list: any, title: string) => {
  if (!checkArrayDataUnique()) { return false }
  if (!useCheckList(list, columns.value, title)) { return false }
  return true
}
// 频率有数据的时候校验频率单位字段
const checkFrequencyUnit = (list: any) => {
  let result = true
  if (list.length) {
    for (let i = 0; i < list.length; i++) {
      if (`${list[i].frequency}` && !list[i].frequencyUnit) {
        ElMessage.warning(`请先完善 检定项表格 第${i + 1}行中 频率单位 字段`)
        result = false
        return
      }
    }
  }
  return result
}

// ======================最佳点============================
const bestList = ref<ICheckItem[]>([]) // 最佳点
const checkoutBestList = ref<ICheckItem[]>([]) // 最佳点多选

// 多选
const handleSelectionBestIndex = (e: any) => {
  checkoutBestList.value = e
  console.log(checkoutBestList.value)
}
// ======================最差点============================
const worstList = ref<ICheckItem[]>([]) // 最差点
const checkoutWorstList = ref<ICheckItem[]>([]) // 最差点多选

// 多选
const handleSelectionWorstIndex = (e: any) => {
  checkoutWorstList.value = e
}
// ======================典型点============================
const modelList = ref<ICheckItem[]>([]) // 典型点
const checkoutModelList = ref<ICheckItem[]>([]) // 典型点多选

// 多选
const handleSelectionModelIndex = (e: any) => {
  checkoutModelList.value = e
}
// =========================================================
/**
 * 增加行公共方法
 * @param list 要操作的数组
 * @param title 操作的表格
 */
const addRow = (list: ICheckItem[], title: string) => {
  if (!checkFrequencyUnit(list)) { return false }
  if (!checkArrayDataUnique()) { return false }
  if (checkList(list, `${title}表格`)) {
    if (list.length) { // 增加行时默认上一行数据
      list.push({
        id: '',
        testType: list[list.length - 1].testType, // 核查点类型
        params: list[list.length - 1].params, // 核查项目(参数)
        checkPoint: Number(calc(Number(list[list.length - 1].checkPoint), 1, '+')), // 核查点
        unit: list[list.length - 1].unit, // 单位
        frequency: '', //	频率
        frequencyUnit: '', //	频率单位(直接存字典value)
        resolution: list[list.length - 1].resolution, // 分辨力
        cycleNumber: list[list.length - 1].cycleNumber, // 循环次数
        urel: list[list.length - 1].urel, // 测量标准相对扩展不确定度Urel
        checkType: list[list.length - 1].checkType, // 核查类型
        thoroughfare: list[list.length - 1].thoroughfare, // 通道
        tfer: list[list.length - 1].tfer, // TFER
        dccp: list[list.length - 1].dccp, // DCCP
        flit: list[list.length - 1].flit, // FLIT
        equipmentId: list[list.length - 1].equipmentId, // 配套设备id
      })
    }
    else {
      list.push({
        id: '',
        testType: title, // 核查点类型
        params: '', // 核查项目(参数)
        checkPoint: 1, // 核查点
        unit: '', // 单位
        frequency: '', //	频率
        frequencyUnit: '', //	频率单位(直接存字典value)
        resolution: 0.1, // 分辨力
        cycleNumber: 6, // 循环次数
        urel: '', // 测量标准相对扩展不确定度Urel
        checkType: ['重复性', '稳定性'], // 核查类型
        thoroughfare: [], // 通道
        tfer: '', // TFER
        dccp: '', // DCCP
        flit: '', // FLIT
        equipmentId: infoId.value, // 配套设备id
      })
    }
  }
}
/**
 * 删除行公共方法
 * @param checkoutList 选中的数组
 * @param list 操作的数组
 */
const delRow = (checkoutList: ICheckItem[], list: ICheckItem[], type: String) => {
  console.log(checkoutList.length)

  if (!checkoutList.length) {
    ElMessage.warning('请选中要删除的行')
  }
  else {
    if (type === '最佳点') {
      bestList.value = list.filter((item: any) => {
        return !checkoutList.includes(item)
      })
    }
    else if (type === '最差点') {
      worstList.value = list.filter((item: any) => {
        return !checkoutList.includes(item)
      })
    }
    else {
      modelList.value = list.filter((item: any) => {
        return !checkoutList.includes(item)
      })
    }
  }
}
// ---------------------------------------按钮-----------------------------------------------------
// 点击关闭
const close = () => {
  $router.back()
}
// 清空配置
const clear = () => {
  ElMessageBox.confirm(
    '确认清空配置项吗?',
    '提示',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    },
  )
    .then(() => {
      bestList.value = [] // 清空最佳点
      worstList.value = [] // 清空最差点
      modelList.value = [] // 清空典型点
      form.value.remark = ''
    })
}

// 点击保存
const save = () => {
  if (best.value && !bestList.value.length) { ElMessage.warning('最佳点不能为空'); return false }
  if (worst.value && !worstList.value.length) { ElMessage.warning('最差点不能为空'); return false }
  if (model.value && !modelList.value.length) { ElMessage.warning('典型点不能为空'); return false }
  if (!checkList(bestList.value, '最佳点表格')) { return false }
  if (!checkList(worstList.value, '最差点表格')) { return false }
  if (!checkList(modelList.value, '典型点表格')) { return false }
  let listParam = [] as any
  if (best.value) {
    listParam = listParam.concat(bestList.value)
  }
  if (worst.value) {
    listParam = listParam.concat(worstList.value)
  }
  if (model.value) {
    listParam = listParam.concat(modelList.value)
  }
  if (!listParam.length) {
    ElMessage.warning('请至少配置一个核查项')
    return false
  }
  listParam = listParam.map((item: any) => {
    return {
      ...item,
      checkType: item.checkType.join(','), // 核查类型
      thoroughfare: item.thoroughfare.join(','), // 通道
      remark: form.value.remark,
      equipmentId: equipmentId.value, // 配套设备id
    }
  })
  const params = {
    standardId: $route.query.standardId,
    equipmentId: equipmentId.value, // 设备id
    itemCategoryId: form.value.itemCategoryId, // 核查项分类id
    checkItemDataCalibratorList: listParam, // 多功能校准源检定项数据(一个核查项分类对应一个核查项数据表)
  }
  const loading = ElLoading.service({
    lock: true,
    text: '加载中',
    background: 'rgba(255, 255, 255, 0.6)',
  })
  config(params).then((res) => {
    ElMessage.success('已保存')
    pageType.value = 'detail'
    loading.close()
  })
}

// 获取详情
const getInfo = () => {
  const loading = ElLoading.service({
    lock: true,
    text: '加载中',
    background: 'rgba(255, 255, 255, 0.6)',
  })
  const params = {
    equipmentId: equipmentId.value, // 设备id
    belongStandardEquipment: form.value.belongStandardEquipment, // 检校标准装置code
    itemCategoryId: form.value.itemCategoryId, // 核查项分类id
    itemCategoryName: form.value.itemCategoryName, // 核查项分类名称
  }
  getCheckItemDetail(params).then((res) => {
    if (res.data && res.data.checkItemDataCalibratorList && res.data.checkItemDataCalibratorList.length) {
      // 最佳点
      bestList.value = res.data.checkItemDataCalibratorList.filter((item: { testType: string }) => item.testType === '最佳点')
      if (pageType.value === 'edit') {
        bestList.value = bestList.value.map((e: any) => {
          return {
            ...e,
            checkType: e.checkType ? e.checkType.split(',') : [], // 核查类型
            thoroughfare: e.thoroughfare ? e.thoroughfare.split(',') : [], // 通道
            resolution: Number(e.resolution), // 分辨力
          }
        })
      }

      // 最差点
      worstList.value = res.data.checkItemDataCalibratorList.filter((item: { testType: string }) => item.testType === '最差点')
      if (pageType.value === 'edit') {
        worstList.value = worstList.value.map((e: any) => {
          return {
            ...e,
            checkType: e.checkType ? e.checkType.split(',') : [], // 核查类型
            thoroughfare: e.thoroughfare ? e.thoroughfare.split(',') : [], // 通道
            resolution: Number(e.resolution), // 分辨力
          }
        })
      }
      // 典型点
      modelList.value = res.data.checkItemDataCalibratorList.filter((item: { testType: string }) => item.testType === '典型点')
      if (pageType.value === 'edit') {
        modelList.value = modelList.value.map((e: any) => {
          return {
            ...e,
            checkType: e.checkType ? e.checkType.split(',') : [], // 核查类型
            thoroughfare: e.thoroughfare ? e.thoroughfare.split(',') : [], // 通道
            resolution: Number(e.resolution), // 分辨力
          }
        })
      }

      best.value = bestList.value.length > 0
      worst.value = worstList.value.length > 0
      model.value = modelList.value.length > 0
    }
    // 核查项备注
    form.value.remark = bestList.value.length ? bestList.value[0].remark! : worstList.value.length ? worstList.value[0].remark! : modelList.value.length ? modelList.value[0].remark! : ''
    loading.close()
  })
}
// 校验三个表格中不能同时出现核查项目和核查点两个属性同时相同的两条数据
function checkArrayDataUnique() {
  const tempBestList = bestList.value.map((item: any, index: number) => { item.tempTitle = '最佳点'; item.tempIndex = index; return item })
  const tempWorstList = worstList.value.map((item: any, index: number) => { item.tempTitle = '最差点'; item.tempIndex = index; return item })
  const tempModelList = modelList.value.map((item: any, index: number) => { item.tempTitle = '典型点'; item.tempIndex = index; return item })
  const list = tempBestList.concat(tempWorstList, tempModelList)
  for (let i = 0; i < list.length; i++) {
    const j = i + 1
    for (let j = 0; j < list.length; j++) {
      if (i !== j && list[i].params === list[j].params && list[i].checkPoint + list[i].unit === list[j].checkPoint + list[j].unit) {
        if (list[i].tempTitle === list[j].tempTitle) {
          ElMessage.warning(`${list[i].tempTitle}第${list[i].tempIndex + 1}行第${list[j].tempIndex + 1}行的 核查项目、核查点和单位不能完全一样`)
        }
        else {
          ElMessage.warning(`${list[i].tempTitle}第${list[i].tempIndex + 1}行和${list[j].tempTitle}第${list[j].tempIndex + 1}行的 核查项目、核查点和单位不能完全一样`)
        }
        return false
      }
    }
  }
  return true
}
// --------------------------------------核查项目变化-------------------------------------------
const changeSelectParams = (val: string, row: any) => {
  console.log('val', val)
  console.log('row', row)
  if (val === 'DCV' || val === 'DCI' || val === 'R') { // 清空频率和频率单位
    row.frequency = ''
    row.frequencyUnit = ''
  }
}

// ------------------------------------------钩子--------------------------------------------------
onMounted(() => {
  form.value.equipmentNo = $route.query.equipmentNo as string // 统一编号
  form.value.equipmentName = $route.query.equipmentName as string // 设备名称
  form.value.model = $route.query.model as string // 规格型号
  form.value.manufactureNo = $route.query.manufactureNo as string // 出厂编号
  form.value.measureRange = $route.query.measureRange as string // 测量范围
  form.value.uncertainty = $route.query.uncertainty as string // 不确定度或允许误差极限或准确度等级
  form.value.itemCategoryName = $route.query.itemCategoryName as string // 核查项分类名称
  form.value.itemCategoryId = $route.query.itemCategoryId as string // 核查项分类id
  form.value.belongStandardEquipment = $route.query.belongStandardEquipment as string // 核查标准装置code
  form.value.belongStandardEquipmentName = $route.query.belongStandardEquipmentName as string // 核查标准装置名称
  equipmentId.value = $route.query.equipmentId as string // 设备id
  getInfo()
})
</script>

<template>
  <app-container>
    <detail-page v-loading="loading" :title="`配置核查项(${textMap[pageType]})`">
      <template #btns>
        <el-button v-if="pageType === 'edit'" type="warning" @click="clear">
          清空配置
        </el-button>
        <el-button v-if="pageType === 'edit'" type="primary" @click="save">
          保存
        </el-button>
        <el-button type="info" @click="close">
          关闭
        </el-button>
      </template>
      <el-form
        ref="ruleFormRef"
        :model="form"
        :label-width="130"
        label-position="right"
      >
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="统一编号:" prop="equipmentNo">
              <el-input
                v-model="form.equipmentNo"
                disabled
                :placeholder="pageType === 'detail' ? '' : '统一编号'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="设备名称:" prop="equipmentName">
              <el-input
                v-model="form.equipmentName"
                disabled
                :placeholder="pageType === 'detail' ? '' : '设备名称'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="规格型号:" prop="model">
              <el-input
                v-model="form.model"
                disabled
                :placeholder="pageType === 'detail' ? '' : '规格型号'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="出厂编号:" prop="manufactureNo">
              <el-input
                v-model="form.manufactureNo"
                disabled
                :placeholder="pageType === 'detail' ? '' : '出厂编号'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="测量范围:" prop="measureRange">
              <el-input
                v-model="form.measureRange"
                disabled
                type="textarea"
                autosize
                :placeholder="pageType === 'detail' ? '' : '测量范围'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label-width="260" label="不确定度或允许误差极限或准确度等级:" prop="uncertainty">
              <el-input
                v-model="form.uncertainty"
                type="textarea"
                autosize
                disabled
                :placeholder="pageType === 'detail' ? '' : '不确定度或允许误差极限或准确度等级'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="核查项分类名称:" prop="itemCategoryName">
              <el-input
                v-model="form.itemCategoryName"
                disabled
                :placeholder="pageType === 'detail' ? '' : '核查项分类名称'"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-page>
    <!-- 最佳点 -->
    <detail-block title="" style="padding-bottom: 20px;">
      <div style="display: flex;justify-content: space-between;">
        <el-checkbox v-model="best" :disabled="pageType === 'detail'">
          最佳点
        </el-checkbox>
        <div v-if="best && pageType !== 'detail'" style="padding: 0 10px;padding-bottom: 10px;">
          <el-button type="primary" @click="addRow(bestList, '最佳点')">
            增加行
          </el-button>
          <el-button type="info" @click="delRow(checkoutBestList, bestList, '最佳点')">
            删除行
          </el-button>
        </div>
      </div>

      <template-table v-if="best" :data="bestList" :columns="columns" :page-type="pageType" @selection-change="handleSelectionBestIndex" @changeSelectParams="changeSelectParams" />
    </detail-block>
    <!-- 最差点 -->
    <detail-block title="" style="padding-bottom: 20px;">
      <div style="display: flex;justify-content: space-between;">
        <el-checkbox v-model="worst" :disabled="pageType === 'detail'">
          最差点
        </el-checkbox>
        <div v-if="worst && pageType !== 'detail'" style="padding: 0 10px;padding-bottom: 10px;">
          <el-button type="primary" @click="addRow(worstList, '最差点')">
            增加行
          </el-button>
          <el-button type="info" @click="delRow(checkoutWorstList, worstList, '最差点')">
            删除行
          </el-button>
        </div>
      </div>
      <template-table v-if="worst" :data="worstList" :columns="columns" :page-type="pageType" @selection-change="handleSelectionWorstIndex" @changeSelectParams="changeSelectParams" />
    </detail-block>
    <!-- 典型点 -->
    <detail-block title="" style="padding-bottom: 20px;">
      <div style="display: flex;justify-content: space-between;">
        <el-checkbox v-model="model" :disabled="pageType === 'detail'">
          典型点
        </el-checkbox>
        <div v-if="model && pageType !== 'detail'" style="padding: 0 10px;padding-bottom: 10px;">
          <el-button type="primary" @click="addRow(modelList, '典型点')">
            增加行
          </el-button>
          <el-button type="info" @click="delRow(checkoutModelList, modelList, '典型点')">
            删除行
          </el-button>
        </div>
      </div>
      <template-table v-if="model" :data="modelList" :columns="columns" :page-type="pageType" @selection-change="handleSelectionModelIndex" @changeSelectParams="changeSelectParams" />
    </detail-block>
    <!-- 核查项备注 -->
    <el-form
      :model="form"
      label-width="120"
      label-position="right"
      style="margin-top: 20px;"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="核查项备注:" prop="remark">
            <el-input
              v-model="form.remark"
              class="full-width-input"
              autosize
              type="textarea"
              :disabled="pageType === 'detail'"
              :placeholder="pageType === 'detail' ? ' ' : '请输入核查项备注'"
            />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </app-container>
</template>