<!-- 送检通知 详情 -->
<script lang="ts" setup name="NoticeEdit">
import type { FormInstance, FormRules, UploadUserFile } from 'element-plus'
import tableList from './tableList.vue'
const $route = useRoute()
const $router = useRouter()
const ruleFormRef = ref<FormInstance>() // from组件
// 显示标题
const textMap: { [key: string]: string } = {
  update: '编辑',
  create: '新增',
  detail: '详情',
}
// 对话框类型：create,update
const dialogStatus = ref('detail')
const ruleForm = ref({
  createDeptName: '',
  createUserName: '',
  notifyDept: '',
  notifyName: '',
  notifyNo: '',
  planCategoryName: '',
  createTime: '',
  id: '',
}) // 表单
// 弹窗初始化
const initDialog = () => {
  dialogStatus.value = $route.params.type as string
  ruleFormRef.value?.resetFields()
  ruleForm.value = JSON.parse($route.query.row as string)
}
onMounted(() => {
  initDialog()
})
// 关闭弹窗
const close = () => {
  $router.back()
}
// 取消
const resetForm = (formEl: FormInstance | undefined) => {
  formEl?.resetFields()
  close()
}
</script>

<template>
  <app-container style="overflow: hidden;">
    <approval-dialog ref="approvalDialogRef" @on-success="() => { $router.back() }" />
    <detail-page title="送检通知-详情">
      <template #btns>
        <el-button type="info" @click="resetForm(ruleFormRef)">
          关闭
        </el-button>
      </template>
    </detail-page>
    <detail-block-com>
      <div class="tips">
        您部门负责的设备已到检定/校准期，为了保证我单位设备的合格率，请于接到本通知之日起，在检定的年/季/月内将设备及时送检。若有提前/延迟送检需求，请及时提交申请。谢谢您的合作!
      </div>
      <div class="tips" style="height: 15px;line-height: 15px;" />
    </detail-block-com>
    <detail-block-com>
      <el-form label-position="right" label-width="110px" class="form" disabled>
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="通知编号">
              <el-input v-model.trim="ruleForm.notifyNo" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="通知名称">
              <el-input v-model.trim="ruleForm.notifyName" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="计划分类">
              <el-input v-model.trim="ruleForm.planCategoryName" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="创建单位">
              <el-input v-model.trim="ruleForm.createDeptName" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="创建人">
              <el-input v-model.trim="ruleForm.createUserName" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="创建时间">
              <el-input v-model.trim="ruleForm.createTime" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="18">
            <el-form-item label="备注">
              <el-input v-model.trim="ruleForm.createTime" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block-com>
    <detail-block-com>
      <table-list :id="ruleForm.id" />
    </detail-block-com>
  </app-container>
</template>

<style lang="scss" scoped>
// 样式
.tips {
  height: 25px;
  line-height: 25px;
  padding: 10px;
  padding-top: 0;
  padding-bottom: 0;
}
</style>
