Newer
Older
xc-business-system / src / views / business / taskMeasure / measureData / detail.vue
dutingting on 29 Nov 2023 8 KB 安全阀标准装置检定数据搭建
<!-- 检定数据管理详情 -->
<script lang="ts" setup name="MeasureDataDetail">
import { ref } from 'vue'
import { ElLoading, ElMessage } from 'element-plus'
import FirstTemplateDetail from './components/first/templateDetail.vue'
import ThirdTemplateDetail from './components/third/templateDetail.vue'
import FourthTemplateDetail from './components/fourth/templateDetail.vue'
import SixthTemplateDetail from './components/sixth/templateDetail.vue'
import saveMeasureCertificateDialog from './dialog/saveMeasureCertificateDialog.vue'
import useUserStore from '@/store/modules/user'
import { addMeasureData, updateMeasureData } from '@/api/business/taskMeasure/measureData'
const user = useUserStore() // 用户信息
const textMap: { [key: string]: string } = {
  edit: '编辑',
  add: '新建',
  detail: '详情',
}// 字典
const $router = useRouter() // 关闭页面使用
const $route = useRoute() // 路由参数
const pageType = ref('add') // 页面类型: add, edit, detail
const infoId = ref('') // 列表id
const templateDetailRef = ref() // 详情组件ref
const dataNo = ref('') // 检定数据编号
const saveMeasureCertificateRef = ref() // 生成原始记录和检定证书组件ref
const belongStandardEquipment = ref('') // 检校标准装置
const belongStandardEquipmentName = ref('') // 检校标准装置名称
const itemCategoryName = ref('') // 检定项分类名称
const itemCategoryId = 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 close = () => {
  $router.back()
}

// 点击编辑按钮
const edit = () => {
  pageType.value = 'edit'
}

// 处理保存入参
const solveSaveParams = () => {
  let params
  if (belongStandardEquipment.value === '1') { // 第一套:多功能校准源
    params = {
      ...templateDetailRef.value.form,
      ...templateDetailRef.value.sampleList[0], // 被检件信息
      customerName: pageType.value === 'add' ? '' : templateDetailRef.value.form.customerName, // 委托单位系统生成,在此置空(原有数据是从我的任务列表页带来,仅做展示)
      model: templateDetailRef.value.sampleList[0].sampleModel, // 型号
      equipmentIds: templateDetailRef.value.measureDataCalibratorList.map((item: { id: string }) => item.id),
      measureDataCalibratorList: templateDetailRef.value.list, // 检定数据
      id: pageType.value === 'edit' ? infoId.value : '',
      itemCategoryName: itemCategoryName.value, // 检定项分类名称
      itemCategoryId: itemCategoryId.value, // 检定项分类id
      belongStandardEquipment: belongStandardEquipment.value, // 标准装置code
      belongStandardEquipmentName: belongStandardEquipmentName.value, // 标准装置名称
    }
  }
  else if (belongStandardEquipment.value === '4') { // 第四套:0.02级活塞式压力计
    params = {
      ...templateDetailRef.value.templateFormAndTableRef.form,
      ...templateDetailRef.value.itemFormData,
      ...templateDetailRef.value.templateFormAndTableRef.sampleList[0], // 被检件信息
      customerName: pageType.value === 'add' ? '' : templateDetailRef.value.templateFormAndTableRef.form.customerName, // 委托单位系统生成,在此置空(原有数据是从我的任务列表页带来,仅做展示)
      model: templateDetailRef.value.templateFormAndTableRef.sampleList[0].sampleModel, // 型号
      equipmentIds: templateDetailRef.value.templateFormAndTableRef.measureEquipmentList.map((item: { id: string }) => item.id),
      measureDataPistonGaugeList: templateDetailRef.value.list, // 检定数据
      id: pageType.value === 'edit' ? infoId.value : '',
    }
  }
  return params
}

// 校验
const check = () => {
  if (belongStandardEquipment.value === '1') { // 第一套:多功能校准源
    return templateDetailRef.value.checkout()
  }
  else if (belongStandardEquipment.value === '4') { // 第四套:0.02活塞式压力计
    if (templateDetailRef.value.checkout() && templateDetailRef.value.templateFormAndTableRef.checkout()) {
      return true
    }
    return false
  }
}

// 保存
const save = () => {
  let formRef // 验证表单的ref
  if (belongStandardEquipment.value === '1') {
    formRef = templateDetailRef.value.ruleFormRef
  }
  else {
    formRef = templateDetailRef.value.templateFormAndTableRef.ruleFormRef
  }
  formRef!.validate((valid: boolean) => { // 表单校验
    if (valid) {
      if (!check()) { return false } // 校验
      const loading = ElLoading.service({
        lock: true,
        background: 'rgba(255, 255, 255, 0.8)',
      })
      const params = solveSaveParams() // 处理入参
      // 新建
      if (pageType.value === 'add') { // 新建
        addMeasureData(params).then((res) => {
          ElMessage.success('保存成功')
          dataNo.value = res.data.dataNo // 检定数据编号
          infoId.value = res.data.id // id
          pageType.value = 'detail'
          templateDetailRef.value.pageType = 'detail'
          loading.close()
        }).catch(() => {
          loading.close()
        })
      }
      // 保存
      else if (pageType.value === 'edit') { // 编辑
        updateMeasureData(params).then((res) => {
          ElMessage.success('保存成功')
          pageType.value = 'detail'
          templateDetailRef.value.pageType = 'detail'
          loading.close()
        }).catch(() => {
          loading.close()
        })
      }
    }
  })
}

// 点击标识打印
const labelPrinting = () => {
  ElMessage.info('敬请期待')
}

// 生成原始记录和检定证书
const createRecord = () => {
  const params = solveSaveParams()
  params.dataId = infoId.value
  saveMeasureCertificateRef.value.initDialog(params)
}

const giveInfoId = (id: string) => {
  infoId.value = id
}

// -------------------------------------------获取详情信息--------------------------------------------------
onMounted(async () => {
  itemCategoryName.value = $route.query.itemCategoryName as string || '' // 检定项分类名称
  itemCategoryId.value = $route.query.itemCategoryId as string || '' // 检定项分类id
  belongStandardEquipment.value = $route.query.belongStandardEquipment as string || ''// 标准装置code
  belongStandardEquipmentName.value = $route.query.belongStandardEquipmentName as string || ''// 标准装置名称
})
</script>

<template>
  <app-container>
    <detail-page :title="`检定数据管理-${textMap[pageType]}`">
      <template #btns>
        <el-button v-if="pageType === 'detail'" type="primary" @click="createRecord">
          生成原始记录和检定证书
        </el-button>
        <el-button v-if="pageType === 'detail'" type="primary" @click="labelPrinting">
          标识打印
        </el-button>
        <el-button v-if="pageType !== 'detail'" type="primary" @click="save">
          保存
        </el-button>
        <!-- <el-button v-if="pageType === 'detail'" type="primary" @click="edit">
          编辑
        </el-button> -->
        <el-button type="info" @click="close">
          关闭
        </el-button>
      </template>
    </detail-page>
    <!-- 第一套:多功能校准源 -->
    <first-template-detail v-if="belongStandardEquipment === '1'" ref="templateDetailRef" :data-no="dataNo" :info-id="infoId" @giveInfoId="giveInfoId" />
    <!-- 第3套:多功能电气安全校准器标准装置 -->
    <third-template-detail v-if="belongStandardEquipment === '3'" ref="templateDetailRef" :data-no="dataNo" :info-id="infoId" @giveInfoId="giveInfoId" />
    <!-- 第四套:0.02级活塞式压力计 -->
    <fourth-template-detail v-if="belongStandardEquipment === '4'" ref="templateDetailRef" :data-no="dataNo" :info-id="infoId" @giveInfoId="giveInfoId" />
    <!-- 第6套:安全阀标准装置 -->
    <sixth-template-detail v-if="belongStandardEquipment === '6'" ref="templateDetailRef" :data-no="dataNo" :info-id="infoId" @giveInfoId="giveInfoId" />
  </app-container>
  <save-measure-certificate-dialog ref="saveMeasureCertificateRef" />
</template>

<style lang="scss" scoped>
.step {
  line-height: 28px;
  font-size: 20px;
  color: #3d7eff;
  font-weight: bold;
  margin-bottom: 5px;
  width: fit-content;
}
</style>

<style lang="scss">
.fieldtest-record-detail {
  .el-table thead.is-group th.el-table__cell {
    background: #f2f6ff;
  }
}
</style>