<!-- 预防措施处理单编辑页面 -->
<script name="QualityPreventHandler" lang="ts" setup>
import type { FormInstance, FormRules, UploadUserFile } from 'element-plus'
import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
import dayjs from 'dayjs'
import useUserStore from '@/store/modules/user'
const $route = useRoute()
const $router = useRouter()
const userStore = useUserStore()
const ruleFormRef = ref<FormInstance>() // from组件
const dialogStatus = ref('create')
const ruleForm = ref({
  createTime: '',
  id: '',
  temName: '',
  temTip: '',
  updateId: '',
  updateName: '',
  updateTime: '',
}) // 表单
const rules = ref<FormRules>({
  temName: [{ required: true, message: '模板名称必填', trigger: ['blur', 'change'] }],
}) // 表单验证规则
// 模板管理内容列表
onMounted(() => {
  // const data = JSON.parse($route.query.row as string)
  // ruleForm.value = data

  // // 获取当前用户信息
  // ruleForm.value.updateTime = dayjs().format('YYYY-MM-DD HH:mm') // 创建时间
  // ruleForm.value.updateId = userStore.id
  // ruleForm.value.updateName = userStore.name
})
// 保存
const saveForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) { return }
  await formEl.validate((valid, fields) => {
    if (valid) {
      ElMessageBox.confirm(
        '确认保存吗？',
        '提示',
        {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        },
      ).then((res) => {
      })
    }
  })
}
</script>

<template>
  <app-container style="overflow: hidden;">
    <detail-page title="预防措施处理单">
      <template #btns>
        <el-button type="primary">
          提交
        </el-button>
        <el-button type="primary" @click="saveForm(ruleFormRef)">
          保存
        </el-button>
        <el-button type="info" @click="() => $router.go(-1)">
          关闭
        </el-button>
      </template>
    </detail-page>
    <detail-block title="">
      <el-form ref="ruleFormRef" :model="ruleForm" :class="$route.path.includes('detail') ? 'isDetail' : ''" :rules="rules" label-position="right" label-width="120px" class="form" :disabled="$route.path.includes('detail')">
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="实验室代码" prop="temTip">
              <el-select
                v-model="ruleForm.storageLocation"
                placeholder="实验室代码"
                class="short-input"
                filterable
                style="width: 100%;"
              >
                <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="处理单编号" prop="temName">
              <el-input v-model.trim="ruleForm.temName" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="处理单名称" prop="temName">
              <el-input v-model.trim="ruleForm.temName" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="6">
            <el-form-item label="提出人" prop="updateName">
              <el-input v-model.trim="ruleForm.updateName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="记录时间" prop="updateTime">
              <!-- <el-input v-model.trim="ruleForm.time" disabled /> -->
              <el-input v-model.trim="ruleForm.updateTime" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label-width="200px" label="关联不符合要求情况分析报告" prop="updateTime">
              <!-- <el-input v-model.trim="ruleForm.time" disabled /> -->
              <el-button type="primary">
                选择
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block>
    <detail-block title="">
      <el-form :model="ruleForm" :class="$route.path.includes('detail') ? 'isDetail' : ''" :rules="rules" label-position="right" label-width="120px" class="form" :disabled="$route.path.includes('detail')">
        <el-row :gutter="24" class="marg">
          <el-col :span="24">
            <el-form-item label-width="200px" label="潜在不符合要求事实描述" prop="conferenceTime" />
          </el-col>
        </el-row>
        <el-row :gutter="24" class="marg">
          <el-col :span="22">
            <el-form-item label-width="200px" label="" prop="conferenceTime">
              <el-input v-model.trim="ruleForm.conferenceTime" placeholder="潜在不符合要求事实描述" :rows="3" type="textarea" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </detail-block>
  </app-container>
</template>