Newer
Older
xc-business-system / src / views / business / measure / item / components / first / templateDetailFirst.vue
dutingting on 16 Oct 2023 9 KB 第一套检定项前五种设备
<!-- 第一套标准装置多功能校准源 -->
<!-- 第一种表格--增加行模式 -->
<!-- 数字多用表(手持)、数字多用表(台式)、多功能店里参数测量仪、钳形电流表、指针式万用表 使用 -->
<script lang="ts" setup name="TemplateDetailFirst">
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import type { ITemplateDetailFirstList } from './first-interface'
import { useCheckList } from '@/commonMethods/useCheckList'
import { getDictByCode } from '@/api/system/dict'
import type { dictType } from '@/global'
const props = defineProps({
  pageType: {
    type: String,
    default: 'add',
  },
})
const list = ref<ITemplateDetailFirstList[]>([]) // 表格数据
const checkoutList = ref<ITemplateDetailFirstList[]>([]) // 选中数据
const columns = ref([ // 表头
  { text: '参数', value: 'params', align: 'center', required: true },
  { text: '量', value: 'capacity', align: 'center', width: '120', required: true },
  { text: '单位', value: 'unit', align: 'center', width: '120', required: true },
  { text: '频率', value: 'frequency', align: 'center' },
  { text: '量程', value: 'rangeRange', align: 'center', required: true },
  { text: '标准值', value: 'standardValue', align: 'center', required: true },
  { text: '分辨力', value: 'resolution', align: 'center', required: true },
  { text: '最大允许误差', value: 'maximumError', align: 'center', required: true },
  { text: '误差参数a', value: 'errorParamA', align: 'center', required: true },
  { text: '误差参数b', value: 'errorParamB', align: 'center', required: true },
])

// ------------------------------------------字典----------------------------------------------
const paramsList = ref<dictType[]>([]) // 参数
const capacityList = ref<dictType[]>([]) // 量
const unitUList = ref<dictType[]>([]) // U单位
const unitIList = ref<dictType[]>([]) // I单位
const unitRList = ref<dictType[]>([]) // R单位
const frequencyList = ref<dictType[]>([]) // 频率
const maximumErrorList = ref<dictType[]>([]) // 最大允许误差
/**
 * 获取字典
 */
function getDict() {
  // 参数
  getDictByCode('bizFirstStandardParams').then((response) => {
    paramsList.value = response.data
  })
  // 量
  getDictByCode('bizFirstStandardCapacity').then((response) => {
    capacityList.value = response.data
  })
  // U单位
  getDictByCode('bizFirstStandardUnitU').then((response) => {
    unitUList.value = response.data
  })
  // I单位
  getDictByCode('bizFirstStandardUnitI').then((response) => {
    unitIList.value = response.data
  })
  // R单位
  getDictByCode('bizFirstStandardUnitR').then((response) => {
    unitRList.value = response.data
  })
  // 频率
  getDictByCode('bizFirstStandardFrequency').then((response) => {
    frequencyList.value = response.data
  })

  // 最大允许误差
  maximumErrorList.value = [
    {
      id: '=a*s示值 + b*量程',
      name: '=a*s示值 + b*量程',
      value: '=a*s示值 + b*量程',
    },
    {
      id: '=a*s示值 + b*量程',
      name: '=a*s示值 + b*分辨力',
      value: '=a*s示值 + b*分辨力',
    },
    {
      id: '=a*s示值 + 常数b',
      name: '=a*s示值 + 常数b',
      value: '=a*s示值 + 常数b',
    },
  ]
}

getDict()
// ------------------------------------------------------------------------------------------------

// 增加行
const addRow = () => {
  if (useCheckList(list.value, columns.value, '检定项表格')) {
    if (list.value.length) { // 增加行时默认上一行数据
      list.value.push({
        id: '', // 主键
        params: list.value[list.value.length - 1].params, // 参数
        capacity: list.value[list.value.length - 1].capacity, // 量
        unit: list.value[list.value.length - 1].unit, // 单位
        frequency: list.value[list.value.length - 1].frequency, // 频率
        rangeRange: list.value[list.value.length - 1].rangeRange, // 量程
        standardValue: list.value[list.value.length - 1].standardValue, // 标准值
        resolution: list.value[list.value.length - 1].resolution, // 分辨力
        maximumError: list.value[list.value.length - 1].maximumError, // 最大允许误差
        errorParamA: list.value[list.value.length - 1].errorParamA, // 误差参数a
        errorParamB: list.value[list.value.length - 1].errorParamB, // 误差参数b
      })
    }
    else {
      list.value.push({
        id: '', // 主键
        params: '', // 参数
        capacity: '', // 量
        unit: '', // 单位
        frequency: '', // 频率
        rangeRange: '', // 量程
        standardValue: '', // 标准值
        resolution: '0.0001', // 分辨力
        maximumError: '', // 最大允许误差
        errorParamA: '', // 误差参数a
        errorParamB: '', // 误差参数b
      })
    }
  }
}

// 删除行
const deleteRow = () => {
  if (!checkoutList.value.length) {
    ElMessage.warning('请选中要删除的行')
  }
  else {
    list.value = list.value.filter((item: any) => {
      return !checkoutList.value.includes(item)
    })
  }
}

// 多选
const handleSelectionChange = (e: any) => {
  checkoutList.value = e
}
</script>

<template>
  <detail-block title=" ">
    <template v-if="props.pageType !== 'detail'" #btns>
      <el-button type="primary" @click="addRow">
        增加行
      </el-button>
      <el-button type="info" @click="deleteRow">
        删除行
      </el-button>
    </template>
    <el-table
      ref="tableRef"
      :data="list"
      border
      style="width: 100%;"
      @selection-change="handleSelectionChange"
    >
      <el-table-column v-if="pageType !== 'detail'" type="selection" width="38" />
      <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"
        align="center"
      >
        <template #header>
          <span v-show="item.required" style="color: red;">*</span><span>{{ item.text }}</span>
        </template>
        <template #default="scope">
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'params'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in paramsList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'capacity'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            filterable
          >
            <el-option v-for="item in capacityList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <!-- U单位 -->
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'unit' && scope.row.capacity === 'U'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in unitUList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <!-- I单位 -->
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'unit' && scope.row.capacity === 'I'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in unitIList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <!-- R单位 -->
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'unit' && scope.row.capacity === 'R'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in unitRList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <!-- 频率 -->
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'frequency' && (scope.row.params === 'ACV' || scope.row.params === 'ACI')"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in unitRList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <!-- 最大允许误差 -->
          <el-select
            v-if="props.pageType !== 'detail' && item.value === 'maximumError'"
            v-model="scope.row[item.value]"
            placeholder="请选择"
            :disabled="props.pageType === 'detail'"
            filterable
          >
            <el-option v-for="item in maximumErrorList" :key="item.id" :label="item.name" :value="item.value" />
          </el-select>
          <span v-if="item.value === 'frequency' && (scope.row.params !== 'ACV' && scope.row.params !== 'ACI')">/</span>
          <el-input v-if="props.pageType !== 'detail' && (item.value === 'rangeRange' || item.value === 'resolution' || item.value === 'errorParamA' || item.value === 'errorParamB' || item.value === 'standardValue')" v-model="scope.row[item.value]" :autofocus="true" :placeholder="`${item.text}`" class="input" />
          <span v-if="props.pageType === 'detail' && item.value === 'frequency'">{{ scope.row[item.value] }}</span>
        </template>
      </el-table-column>
    </el-table>
  </detail-block>
</template>