feat(mes): 清理 qc-template TODO，补全注释风格与表单布局

- TemplateForm/TemplateIndicatorForm/TemplateItemForm/TemplateIndicatorList/TemplateItemList：注释风格对齐（ref 行内注释、函数步骤注释、defineExpose/defineEmits 说明）
- TemplateIndicatorForm：表单布局调整为多行 el-row/el-col（质检指标+标准值 / 计量单位+误差上下限 / 检测方法 / 说明图 / 备注）
- TemplateItemForm：表单布局调整为多行（产品物料 / 最低检测数+最大不合格数 / 致命+严重+轻微缺陷率 / 备注），补充缺失的备注字段
- index.vue：搜索项检测种类改为单值 Integer 查询

src/views/mes/qc/template/TemplateForm.vue

@@ -95,18 +95,16 @@ import { QcTemplateApi, QcTemplateVO } from '@/api/mes/qc/template'
 import TemplateIndicatorList from './TemplateIndicatorList.vue'
 import TemplateItemList from './TemplateItemList.vue'
 
-// TODO @AI：整个文件的注释风格，参考 user 的 form.vue 那；
-
 defineOptions({ name: 'TemplateForm' })
 
-const { t } = useI18n()
-const message = useMessage()
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
 
-const dialogVisible = ref(false)
-const dialogTitle = ref('')
-const formLoading = ref(false)
-const formType = ref('')
-const activeTab = ref('indicator')
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const activeTab = ref('indicator') // 子表当前激活的 Tab
 const formData = ref({
   id: undefined as number | undefined,
   code: undefined,
@@ -118,10 +116,12 @@ const formData = ref({
 const formRules = reactive({
   code: [{ required: true, message: '方案编号不能为空', trigger: 'blur' }],
   name: [{ required: true, message: '方案名称不能为空', trigger: 'blur' }],
-  types: [{ required: true, message: '检测种类不能为空', trigger: 'change', type: 'array', min: 1 }],
+  types: [
+    { required: true, message: '检测种类不能为空', trigger: 'change', type: 'array', min: 1 }
+  ],
   enableFlag: [{ required: true, message: '是否启用不能为空', trigger: 'change' }]
 })
-const formRef = ref()
+const formRef = ref() // 表单 Ref
 
 /** 生成方案编号 */
 const generateCode = () => {
@@ -135,6 +135,7 @@ const open = async (type: string, id?: number) => {
   formType.value = type
   activeTab.value = 'indicator'
   resetForm()
+  // 修改时，设置数据
   if (id) {
     formLoading.value = true
     try {
@@ -148,12 +149,16 @@ const open = async (type: string, id?: number) => {
     }
   }
 }
-defineExpose({ open })
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
-const emit = defineEmits(['success'])
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const submitForm = async () => {
-  await formRef.value.validate()
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
   formLoading.value = true
   try {
     const data = formData.value as unknown as QcTemplateVO
@@ -165,6 +170,7 @@ const submitForm = async () => {
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
+    // 发送操作成功的事件
     emit('success')
   } finally {
     formLoading.value = false

src/views/mes/qc/template/TemplateIndicatorForm.vue

@@ -1,61 +1,92 @@
 <!-- MES 质检方案-检测指标项 表单 -->
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="900px">
     <el-form
       ref="formRef"
       :model="formData"
       :rules="formRules"
-      label-width="130px"
+      label-width="100px"
       v-loading="formLoading"
     >
-      <el-form-item label="质检指标" prop="indicatorId">
-        <QcIndicatorSelect v-model="formData.indicatorId" placeholder="请选择质检指标" />
-      </el-form-item>
-      <el-form-item label="检测方法" prop="checkMethod">
-        <el-input
-          type="textarea"
-          v-model="formData.checkMethod"
-          placeholder="请输入检测方法"
-          :rows="3"
-        />
-      </el-form-item>
-      <el-form-item label="标准值" prop="standardValue">
-        <el-input-number
-          v-model="formData.standardValue"
-          placeholder="请输入标准值"
-          :precision="4"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="单位" prop="unitMeasureId">
-        <MdUnitMeasureSelect
-          v-model="formData.unitMeasureId"
-          placeholder="请选择计量单位"
-          clearable
-        />
-      </el-form-item>
-      <el-form-item label="误差上限" prop="thresholdMax">
-        <el-input-number
-          v-model="formData.thresholdMax"
-          placeholder="请输入误差上限"
-          :precision="4"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="误差下限" prop="thresholdMin">
-        <el-input-number
-          v-model="formData.thresholdMin"
-          placeholder="请输入误差下限"
-          :precision="4"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="说明图URL" prop="docUrl">
-        <el-input v-model="formData.docUrl" placeholder="请输入说明图URL" />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input type="textarea" v-model="formData.remark" placeholder="请输入备注" />
-      </el-form-item>
+      <el-row :gutter="16">
+        <el-col :span="12">
+          <el-form-item label="质检指标" prop="indicatorId">
+            <QcIndicatorSelect
+              v-model="formData.indicatorId"
+              placeholder="请选择质检指标"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="标准值" prop="standardValue">
+            <el-input-number
+              v-model="formData.standardValue"
+              placeholder="请输入标准值"
+              :precision="4"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="16">
+        <el-col :span="8">
+          <el-form-item label="计量单位" prop="unitMeasureId">
+            <MdUnitMeasureSelect
+              v-model="formData.unitMeasureId"
+              placeholder="请选择计量单位"
+              clearable
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="误差上限" prop="thresholdMax">
+            <el-input-number
+              v-model="formData.thresholdMax"
+              placeholder="请输入"
+              :precision="4"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="误差下限" prop="thresholdMin">
+            <el-input-number
+              v-model="formData.thresholdMin"
+              placeholder="请输入"
+              :precision="4"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="检测方法" prop="checkMethod">
+            <el-input
+              type="textarea"
+              v-model="formData.checkMethod"
+              placeholder="请输入检测方法"
+              :rows="3"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="说明图URL" prop="docUrl">
+            <el-input v-model="formData.docUrl" placeholder="请输入说明图URL" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="备注" prop="remark">
+            <el-input type="textarea" v-model="formData.remark" placeholder="请输入备注" />
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@@ -69,16 +100,15 @@ import { QcTemplateIndicatorApi, QcTemplateIndicatorVO } from '@/api/mes/qc/temp
 import QcIndicatorSelect from '@/views/mes/qc/indicator/components/QcIndicatorSelect.vue'
 import MdUnitMeasureSelect from '@/views/mes/md/unitmeasure/components/MdUnitMeasureSelect.vue'
 
-// TODO @AI：整个文件的注释风格，参考 user 的 form.vue 那；
 defineOptions({ name: 'TemplateIndicatorForm' })
 
-const { t } = useI18n()
-const message = useMessage()
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
 
-const dialogVisible = ref(false)
-const dialogTitle = ref('')
-const formLoading = ref(false)
-const formType = ref('')
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
   id: undefined,
   templateId: undefined as number | undefined,
@@ -94,7 +124,7 @@ const formData = ref({
 const formRules = reactive({
   indicatorId: [{ required: true, message: '质检指标不能为空', trigger: 'change' }]
 })
-const formRef = ref()
+const formRef = ref() // 表单 Ref
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number, templateId?: number) => {
@@ -103,6 +133,7 @@ const open = async (type: string, id?: number, templateId?: number) => {
   formType.value = type
   resetForm()
   formData.value.templateId = templateId
+  // 修改时，设置数据
   if (id) {
     formLoading.value = true
     try {
@@ -112,12 +143,16 @@ const open = async (type: string, id?: number, templateId?: number) => {
     }
   }
 }
-defineExpose({ open })
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
-const emit = defineEmits(['success'])
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const submitForm = async () => {
-  await formRef.value.validate()
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
   formLoading.value = true
   try {
     const data = formData.value as unknown as QcTemplateIndicatorVO
@@ -129,6 +164,7 @@ const submitForm = async () => {
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
+    // 发送操作成功的事件
     emit('success')
   } finally {
     formLoading.value = false

src/views/mes/qc/template/TemplateIndicatorList.vue

@@ -57,8 +57,6 @@
 </template>
 
 <script setup lang="ts">
-// TODO @AI：整个文件的注释风格，参考 user 的 index.vue 那；
-
 import { DICT_TYPE } from '@/utils/dict'
 import { QcTemplateIndicatorApi, QcTemplateIndicatorVO } from '@/api/mes/qc/template/indicator'
 import TemplateIndicatorForm from './TemplateIndicatorForm.vue'
@@ -67,11 +65,11 @@ defineOptions({ name: 'TemplateIndicatorList' })
 
 const props = defineProps<{ templateId: number }>()
 
-const message = useMessage()
-const { t } = useI18n()
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
-const loading = ref(false)
-const list = ref<QcTemplateIndicatorVO[]>([])
+const loading = ref(false) // 列表的加载中
+const list = ref<QcTemplateIndicatorVO[]>([]) // 列表的数据
 
 /** 查询列表 */
 const getList = async () => {
@@ -89,23 +87,26 @@ const getList = async () => {
   }
 }
 
-/** 打开表单 */
+/** 添加/修改操作 */
 const formRef = ref()
 const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id, props.templateId)
 }
 
-/** 删除 */
+/** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {
+    // 删除的二次确认
     await message.delConfirm()
+    // 发起删除
     await QcTemplateIndicatorApi.deleteTemplateIndicator(id)
     message.success(t('common.delSuccess'))
+    // 刷新列表
     await getList()
   } catch {}
 }
 
-/** 监听 templateId 变化，重新加载 */
+/** 监听 templateId 变化，重新加载列表 */
 watch(
   () => props.templateId,
   () => getList(),

src/views/mes/qc/template/TemplateItemForm.vue

@@ -1,61 +1,94 @@
 <!-- MES 质检方案-产品关联 表单 -->
 <template>
-  <Dialog :title="dialogTitle" v-model="dialogVisible">
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="900px">
     <el-form
       ref="formRef"
       :model="formData"
       :rules="formRules"
-      label-width="150px"
+      label-width="120px"
       v-loading="formLoading"
     >
-      <el-form-item label="产品物料" prop="itemId">
-        <MdItemSelect v-model="formData.itemId" placeholder="请选择产品物料" />
-      </el-form-item>
-      <el-form-item label="最低检测数" prop="quantityCheck">
-        <el-input-number
-          v-model="formData.quantityCheck"
-          placeholder="请输入最低检测数"
-          :min="1"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="最大不合格数" prop="quantityUnqualified">
-        <el-input-number
-          v-model="formData.quantityUnqualified"
-          placeholder="0表示不启用"
-          :min="0"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="最大致命缺陷率(%)" prop="criticalRate">
-        <el-input-number
-          v-model="formData.criticalRate"
-          placeholder="0表示不允许"
-          :min="0"
-          :max="100"
-          :precision="2"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="最大严重缺陷率(%)" prop="majorRate">
-        <el-input-number
-          v-model="formData.majorRate"
-          placeholder="0表示不允许"
-          :min="0"
-          :max="100"
-          :precision="2"
-          class="!w-1/1"
-        />
-      </el-form-item>
-      <el-form-item label="最大轻微缺陷率(%)" prop="minorRate">
-        <el-input-number
-          v-model="formData.minorRate"
-          :min="0"
-          :max="100"
-          :precision="2"
-          class="!w-1/1"
-        />
-      </el-form-item>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="产品物料" prop="itemId">
+            <MdItemSelect v-model="formData.itemId" placeholder="请选择产品物料" class="!w-1/1" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="16">
+        <el-col :span="8">
+          <el-form-item label="最低检测数" prop="quantityCheck">
+            <el-input-number
+              v-model="formData.quantityCheck"
+              placeholder="请输入最低检测数"
+              :min="1"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="最大不合格数" prop="quantityUnqualified">
+            <el-tooltip content="超出最大不合格数后整批判定不合格，0表示不启用" placement="top">
+              <el-input-number
+                v-model="formData.quantityUnqualified"
+                placeholder="0表示不启用"
+                :min="0"
+                class="!w-1/1"
+              />
+            </el-tooltip>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="16">
+        <el-col :span="8">
+          <el-form-item label="致命缺陷率(%)" prop="criticalRate">
+            <el-tooltip content="缺陷比例超出后整批判定不合格，0表示不允许出现" placement="top">
+              <el-input-number
+                v-model="formData.criticalRate"
+                placeholder="0表示不允许"
+                :min="0"
+                :max="100"
+                :precision="2"
+                class="!w-1/1"
+              />
+            </el-tooltip>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="严重缺陷率(%)" prop="majorRate">
+            <el-tooltip content="缺陷比例超出后整批判定不合格，0表示不允许出现" placement="top">
+              <el-input-number
+                v-model="formData.majorRate"
+                placeholder="0表示不允许"
+                :min="0"
+                :max="100"
+                :precision="2"
+                class="!w-1/1"
+              />
+            </el-tooltip>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="轻微缺陷率(%)" prop="minorRate">
+            <el-tooltip content="缺陷比例超出后整批判定不合格，0表示不允许出现" placement="top">
+              <el-input-number
+                v-model="formData.minorRate"
+                :min="0"
+                :max="100"
+                :precision="2"
+                class="!w-1/1"
+              />
+            </el-tooltip>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="备注" prop="remark">
+            <el-input type="textarea" v-model="formData.remark" placeholder="请输入备注" />
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@@ -65,19 +98,18 @@
 </template>
 
 <script setup lang="ts">
-// TODO @AI：整个文件的注释风格，参考 user 的 form.vue 那；
 import { QcTemplateItemApi, QcTemplateItemVO } from '@/api/mes/qc/template/item'
 import MdItemSelect from '@/views/mes/md/item/components/MdItemSelect.vue'
 
 defineOptions({ name: 'TemplateItemForm' })
 
-const { t } = useI18n()
-const message = useMessage()
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
 
-const dialogVisible = ref(false)
-const dialogTitle = ref('')
-const formLoading = ref(false)
-const formType = ref('')
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formData = ref({
   id: undefined,
   templateId: undefined as number | undefined,
@@ -86,13 +118,14 @@ const formData = ref({
   quantityUnqualified: 0,
   criticalRate: 0,
   majorRate: 0,
-  minorRate: 100
+  minorRate: 100,
+  remark: undefined
 })
 const formRules = reactive({
   itemId: [{ required: true, message: '产品物料不能为空', trigger: 'change' }],
   quantityCheck: [{ required: true, message: '最低检测数不能为空', trigger: 'blur' }]
 })
-const formRef = ref()
+const formRef = ref() // 表单 Ref
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number, templateId?: number) => {
@@ -101,6 +134,7 @@ const open = async (type: string, id?: number, templateId?: number) => {
   formType.value = type
   resetForm()
   formData.value.templateId = templateId
+  // 修改时，设置数据
   if (id) {
     formLoading.value = true
     try {
@@ -110,12 +144,16 @@ const open = async (type: string, id?: number, templateId?: number) => {
     }
   }
 }
-defineExpose({ open })
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
-const emit = defineEmits(['success'])
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const submitForm = async () => {
-  await formRef.value.validate()
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
   formLoading.value = true
   try {
     const data = formData.value as unknown as QcTemplateItemVO
@@ -127,6 +165,7 @@ const submitForm = async () => {
       message.success(t('common.updateSuccess'))
     }
     dialogVisible.value = false
+    // 发送操作成功的事件
     emit('success')
   } finally {
     formLoading.value = false
@@ -143,7 +182,8 @@ const resetForm = () => {
     quantityUnqualified: 0,
     criticalRate: 0,
     majorRate: 0,
-    minorRate: 100
+    minorRate: 100,
+    remark: undefined
   }
   formRef.value?.resetFields()
 }

src/views/mes/qc/template/TemplateItemList.vue

@@ -57,8 +57,6 @@
 </template>
 
 <script setup lang="ts">
-// TODO @AI：整个文件的注释风格，参考 user 的 index.vue 那；
-
 import { QcTemplateItemApi, QcTemplateItemVO } from '@/api/mes/qc/template/item'
 import TemplateItemForm from './TemplateItemForm.vue'
 
@@ -66,11 +64,11 @@ defineOptions({ name: 'TemplateItemList' })
 
 const props = defineProps<{ templateId: number }>()
 
-const message = useMessage()
-const { t } = useI18n()
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
-const loading = ref(false)
-const list = ref<QcTemplateItemVO[]>([])
+const loading = ref(false) // 列表的加载中
+const list = ref<QcTemplateItemVO[]>([]) // 列表的数据
 
 /** 查询列表 */
 const getList = async () => {
@@ -88,23 +86,26 @@ const getList = async () => {
   }
 }
 
-/** 打开表单 */
+/** 添加/修改操作 */
 const formRef = ref()
 const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id, props.templateId)
 }
 
-/** 删除 */
+/** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {
+    // 删除的二次确认
     await message.delConfirm()
+    // 发起删除
     await QcTemplateItemApi.deleteTemplateItem(id)
     message.success(t('common.delSuccess'))
+    // 刷新列表
     await getList()
   } catch {}
 }
 
-/** 监听 templateId 变化，重新加载 */
+/** 监听 templateId 变化，重新加载列表 */
 watch(
   () => props.templateId,
   () => getList(),