<!-- 受检设备信息详情页 -->
<script name="EquipmentInfoBookDetail" lang="ts" setup>
import bookBasic from './components/basic.vue'
// 页面类型字典
const props = defineProps({
  detailTitle: { // 详情页标题
    type: String,
    default: '',
  },
})
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 equipmentNo = ref('')
// -------------------------------------标签--------------------------------------------------
const radioMenus = ref([ // 标签内容
  { name: '基本信息', value: 'book-basic' },
])
const current = ref('book-basic') // 选择的tab 默认基本信息
// -----------------------------------路由参数-------------------------------------------------
// 从路由中获取页面类型参数
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 = () => {
  bookBasicRef.value.saveForm()
}
// 草稿箱保存成功
const addSuccess = (equipmentNoParam: string, infoIdParam: string) => {
  equipmentNo.value = equipmentNoParam
  infoId.value = infoIdParam
  pageType.value = 'detail'
}
// 编辑成功
const saveSuccess = () => {
  pageType.value = 'detail'
}
// 点击编辑
const handleEdit = () => {
  pageType.value = 'edit' // 编辑模式
}
// -----------------------------------------钩子--------------------------------------------------
onMounted(() => {
})
</script>

<template>
  <app-container>
    <detail-page v-loading="loading" :title="props.detailTitle ? `${props.detailTitle}-${textMap[pageType]}` : `设备信息管理-${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"
      @save-success="saveSuccess"
      @addSuccess="addSuccess"
    />
  </app-container>
</template>