<!-- 标准装置台账信息详情 -->
<script name="StandardBookInfoDetail" lang="ts" setup>
import { ElMessage, ElMessageBox } from 'element-plus'
import bookBasic from './components/basic.vue'
import bookStandard from './components/standard.vue'
import bookCertificate from './components/certificate.vue'

const textMap: { [key: string]: string } = {
  edit: '编辑',
  add: '新建',
  detail: '详情',
}// 页面类型字典
const $router = useRouter() // 路由实例
const loading = ref(false) // 表单加载状态
const pageType = ref('add') // 页面类型: add, edit, detail
const infoId = ref('') // id
const bookBasicRef = ref() // 子组件--基本信息ref
const approvalStatusName = ref('') // 审批状态名称
const showRefuseEditButton = ref(true) // 是否展示未通过编辑按钮
const standardNo = ref('') // 标准装置编号
const standardName = ref('') // 标准装置名称
const showSubmitButton = ref(false) // 控制提交按钮是否显示
const tabDisabled = ref(false) // 禁止radio tab

// -------------------------------------标签--------------------------------------------------
const radioMenus = ref([ // 标签内容
  { name: '基本信息', value: 'book-basic', disabled: false },
  { name: '标准配套设备', value: 'book-standard', disabled: true },
  { name: '标准证书', value: 'book-certificate', disabled: false },
])
const current = ref('book-basic') // 选择的tab 默认基本信息
const bookPersonRef = ref() // 计量人员组件ref
const bookJobInstructionRef = ref() // 作业指导书组件ref
const bookStandardRef = ref() // 标准配套设备组件ref
const bookStandardCertificateRef = ref() // 标准证书组件ref
const bookGradeRef = ref() // 量值溯源与传递等级
const bookProjectRef = ref() // 开展量传参数
// -----------------------------------路由参数-------------------------------------------------
// 从路由中获取页面类型参数
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 close = () => {
  $router.back()
}
// 点击保存
const saveForm = () => {
  switch (current.value) {
    case 'book-basic': // 基本信息
      bookBasicRef.value.saveForm()
      break
    case 'book-standard': // 标准配套设备
      bookStandardRef.value.saveEquipment()
      break
    case 'book-certificate': // 标准证书
      bookStandardCertificateRef.value.saveStandardCert()
      break
  }
}

// 新建保存成功
const addSuccess = (standardNoParam: string, id: string, standardNameParam?: string) => {
  standardNo.value = standardNoParam// 设备编号
  infoId.value = id // id
  standardName.value = standardNameParam! // 标准装置名称
  pageType.value = 'edit'
}
// 编辑成功
const saveSuccess = () => {
  pageType.value = 'detail'
}
// 点击编辑
const handleEdit = () => {
  pageType.value = 'edit' // 编辑模式
}
// -----------------------------------------钩子--------------------------------------------------
onMounted(() => {
  standardName.value = $route.query.standardName as string
})

onBeforeUnmount(() => {
})
</script>

<template>
  <app-container>
    <detail-page v-loading="loading" :title="`标准装置管理（${textMap[pageType]}）`">
      <template #btns>
        <el-button v-if="pageType === 'detail'" type="primary" @click="handleEdit">
          编辑
        </el-button>
        <el-button v-if="pageType !== 'detail'" type="primary" @click="saveForm">
          保存
        </el-button>
        <el-button type="info" @click="close">
          关闭
        </el-button>
      </template>
      <el-radio-group v-model="current">
        <el-radio-button
          v-for="item in radioMenus" :key="item.value" :label="item.value"
          :disabled="pageType === 'add'"
        >
          {{ item.name }}
        </el-radio-button>
      </el-radio-group>
    </detail-page>
    <!-- 基本信息 -->
    <book-basic
      v-if="current === 'book-basic'" :id="infoId" ref="bookBasicRef" :page-type="pageType"
      :approval-status-name="approvalStatusName" @add-success="addSuccess" @saveSuccess="saveSuccess"
    />
    <!-- 标准配套设备 -->
    <book-standard
      v-if="current === 'book-standard'" ref="bookStandardRef" :approval-status-name="approvalStatusName"
      :standard-name="standardName" :standard-id="infoId" :page-type="pageType"
    />
    <!-- 标准证书 -->
    <book-certificate
      v-if="current === 'book-certificate'" ref="bookStandardCertificateRef" :page-type="pageType"
      :standard-id="infoId"
    />
  </app-container>
</template>