✨ feat(mes): 添加安灯呼叫记录创建和更新请求 VO

src/api/mes/pro/andon/record/index.ts

@@ -45,9 +45,9 @@ export const ProAndonRecordApi = {
     return await request.delete({ url: `/mes/pro/andon-record/delete?id=` + id })
   },
 
-  // 处置安灯记录
-  handleAndonRecord: async (data: any) => {
-    return await request.put({ url: `/mes/pro/andon-record/handle`, data })
+  // 更新安灯记录（保存/已处置）
+  updateAndonRecord: async (data: any) => {
+    return await request.put({ url: `/mes/pro/andon-record/update`, data })
   },
 
   // 导出安灯记录 Excel

src/views/mes/autocode/rule/index.vue

@@ -1,3 +1,4 @@
+<!-- TODO @AI：应该放到 md 里； -->
 <!-- MES 编码规则列表 -->
 <template>
   <ContentWrap>

src/views/mes/pro/andon/record/AndonHandleForm.vue

@@ -1,117 +0,0 @@
-<!-- 安灯呼叫记录 处置弹窗 -->
-<template>
-  <Dialog title="处置安灯呼叫" v-model="dialogVisible" width="600px">
-    <el-form
-      ref="formRef"
-      :model="formData"
-      :rules="formRules"
-      label-width="100px"
-      v-loading="formLoading"
-    >
-      <!-- 只读展示呼叫信息 -->
-      <el-form-item label="工作站">
-        <el-input :model-value="recordInfo.workstationName" disabled />
-      </el-form-item>
-      <el-form-item label="发起人">
-        <el-input :model-value="recordInfo.userNickname" disabled />
-      </el-form-item>
-      <el-form-item label="呼叫原因">
-        <el-input :model-value="recordInfo.reason" disabled />
-      </el-form-item>
-      <el-form-item label="级别">
-        <dict-tag :type="DICT_TYPE.MES_PRO_ANDON_LEVEL" :value="recordInfo.level" />
-      </el-form-item>
-      <!-- 可编辑字段 -->
-      <el-form-item label="处置时间" prop="handleTime">
-        <el-date-picker
-          v-model="formData.handleTime"
-          type="datetime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          placeholder="请选择处置时间"
-          class="!w-full"
-        />
-      </el-form-item>
-      <el-form-item label="处置人" prop="handlerUserId">
-        <UserSelect v-model="formData.handlerUserId" />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="formData.remark" type="textarea" placeholder="请输入处置备注" />
-      </el-form-item>
-    </el-form>
-    <template #footer>
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
-    </template>
-  </Dialog>
-</template>
-
-<script setup lang="ts">
-import { ProAndonRecordApi } from '@/api/mes/pro/andon/record'
-import { DICT_TYPE } from '@/utils/dict'
-import { useUserStoreWithOut } from '@/store/modules/user'
-import UserSelect from '@/views/system/user/components/UserSelect.vue'
-import { formatDate } from '@/utils/formatTime'
-
-defineOptions({ name: 'AndonHandleForm' })
-
-const message = useMessage()
-
-const dialogVisible = ref(false) // 弹窗的是否展示
-const formLoading = ref(false) // 表单的加载中
-const formData = ref<any>({}) // 表单数据
-const recordInfo = ref<any>({}) // 呼叫记录信息（只读展示）
-const formRules = reactive({
-  handleTime: [{ required: true, message: '处置时间不能为空', trigger: 'change' }],
-  handlerUserId: [{ required: true, message: '处置人不能为空', trigger: 'change' }]
-})
-const formRef = ref() // 表单 Ref
-
-/** 打开弹窗 */
-const open = async (id: number) => {
-  dialogVisible.value = true
-  resetForm()
-  formLoading.value = true
-  try {
-    // 加载记录信息
-    recordInfo.value = await ProAndonRecordApi.getAndonRecord(id)
-    // 初始化处置表单，默认当前用户
-    const userStore = useUserStoreWithOut()
-    formData.value = {
-      id: id,
-      handleTime: formatDate(new Date(), 'YYYY-MM-DD HH:mm:ss'),
-      handlerUserId: userStore.getUser?.id,
-      remark: undefined
-    }
-  } finally {
-    formLoading.value = false
-  }
-}
-defineExpose({ open })
-
-/** 提交处置 */
-const emit = defineEmits(['success'])
-const submitForm = async () => {
-  await formRef.value.validate()
-  formLoading.value = true
-  try {
-    await ProAndonRecordApi.handleAndonRecord(formData.value)
-    message.success('处置成功')
-    dialogVisible.value = false
-    emit('success')
-  } finally {
-    formLoading.value = false
-  }
-}
-
-/** 重置表单 */
-const resetForm = () => {
-  formData.value = {
-    id: undefined,
-    handleTime: undefined,
-    handlerUserId: undefined,
-    remark: undefined
-  }
-  recordInfo.value = {}
-  formRef.value?.resetFields()
-}
-</script>

src/views/mes/pro/andon/record/AndonRecordForm.vue

@@ -1,56 +1,114 @@
-<!-- 安灯呼叫记录 新增/详情弹窗 -->
+<!-- 安灯呼叫记录 新增/处置/详情弹窗 -->
 <template>
   <Dialog :title="dialogTitle" v-model="dialogVisible" width="600px">
     <el-form
       ref="formRef"
       :model="formData"
-      :rules="formRules"
+      :rules="formType === 'create' ? createRules : undefined"
       label-width="100px"
-      :disabled="formType === 'detail'"
       v-loading="formLoading"
     >
+      <!-- ====== 呼叫信息（create 可编辑，update/detail 只读） ====== -->
       <el-form-item label="工作站" prop="workstationId">
-        <MdWorkstationSelect v-model="formData.workstationId" placeholder="请选择工作站" />
+        <MdWorkstationSelect
+          v-if="formType === 'create'"
+          v-model="formData.workstationId"
+          placeholder="请选择工作站"
+        />
+        <el-input v-else :model-value="formData.workstationName" disabled />
       </el-form-item>
       <el-form-item label="发起人" prop="userId">
-        <UserSelect v-model="formData.userId" />
+        <UserSelect v-if="formType === 'create'" v-model="formData.userId" />
+        <el-input v-else :model-value="formData.userNickname" disabled />
       </el-form-item>
       <el-form-item label="生产工单" prop="workOrderId">
-        <ProWorkOrderSelect v-model="formData.workOrderId" placeholder="请选择工单（可选）" />
+        <ProWorkOrderSelect
+          v-if="formType === 'create'"
+          v-model="formData.workOrderId"
+          placeholder="请选择工单（可选）"
+        />
+        <el-input v-else :model-value="formData.workOrderCode || '-'" disabled />
       </el-form-item>
       <el-form-item label="工序" prop="processId">
-        <ProProcessSelect v-model="formData.processId" placeholder="请选择工序（可选）" />
+        <ProProcessSelect
+          v-if="formType === 'create'"
+          v-model="formData.processId"
+          placeholder="请选择工序（可选）"
+        />
+        <el-input v-else :model-value="formData.processName || '-'" disabled />
       </el-form-item>
       <el-form-item label="呼叫原因" prop="configId">
-        <AndonConfigSelect v-model="formData.configId" @change="handleConfigChange" />
-      </el-form-item>
-      <el-form-item label="级别" prop="level">
-        <dict-tag
-          v-if="formData.level"
-          :type="DICT_TYPE.MES_PRO_ANDON_LEVEL"
-          :value="formData.level"
+        <AndonConfigSelect
+          v-if="formType === 'create'"
+          v-model="formData.configId"
+          @change="handleConfigChange"
         />
-        <span v-else class="text-gray-400">由呼叫原因自动带出</span>
+        <el-input v-else :model-value="formData.reason" disabled />
       </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
+      <el-form-item label="级别">
+        <template v-if="formType === 'create'">
+          <dict-tag
+            v-if="formData.level"
+            :type="DICT_TYPE.MES_PRO_ANDON_LEVEL"
+            :value="formData.level"
+          />
+          <span v-else class="text-gray-400">由呼叫原因自动带出</span>
+        </template>
+        <dict-tag v-else :type="DICT_TYPE.MES_PRO_ANDON_LEVEL" :value="formData.level" />
       </el-form-item>
-      <!-- 详情模式额外展示 -->
-      <template v-if="formType === 'detail'">
+
+      <!-- ====== 处置信息（update 可编辑，detail 只读，create 不展示） ====== -->
+      <template v-if="formType !== 'create'">
+        <el-divider content-position="left">处置信息</el-divider>
         <el-form-item label="状态">
           <dict-tag :type="DICT_TYPE.MES_PRO_ANDON_STATUS" :value="formData.status" />
         </el-form-item>
-        <el-form-item label="处置时间" v-if="formData.handleTime">
-          <el-input :model-value="formData.handleTime" disabled />
+        <el-form-item label="处置时间">
+          <el-date-picker
+            v-if="formType === 'update'"
+            v-model="formData.handleTime"
+            type="datetime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="请选择处置时间"
+            class="!w-full"
+          />
+          <el-input v-else :model-value="formData.handleTime || '-'" disabled />
         </el-form-item>
-        <el-form-item label="处置人" v-if="formData.handlerUserNickname">
-          <el-input :model-value="formData.handlerUserNickname" disabled />
+        <el-form-item label="处置人">
+          <UserSelect v-if="formType === 'update'" v-model="formData.handlerUserId" />
+          <el-input v-else :model-value="formData.handlerUserNickname || '-'" disabled />
         </el-form-item>
       </template>
+
+      <!-- ====== 备注（create/update 可编辑，detail 只读） ====== -->
+      <el-form-item label="备注">
+        <el-input
+          v-if="formType !== 'detail'"
+          v-model="formData.remark"
+          type="textarea"
+          placeholder="请输入备注"
+        />
+        <span v-else>{{ formData.remark || '-' }}</span>
+      </el-form-item>
     </el-form>
-    <template #footer v-if="formType !== 'detail'">
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
-      <el-button @click="dialogVisible = false">取 消</el-button>
+
+    <!-- ====== 底部按钮 ====== -->
+    <template #footer>
+      <!-- create 模式 -->
+      <template v-if="formType === 'create'">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="handleCreate" :disabled="formLoading">确 定</el-button>
+      </template>
+      <!-- update 模式 -->
+      <template v-else-if="formType === 'update'">
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+        <el-button type="primary" @click="handleSave" :disabled="formLoading">保 存</el-button>
+        <el-button type="success" @click="handleFinish" :disabled="formLoading">已处置</el-button>
+      </template>
+      <!-- detail 模式 -->
+      <template v-else>
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </template>
     </template>
   </Dialog>
 </template>
@@ -59,51 +117,67 @@
 import { ProAndonRecordApi } from '@/api/mes/pro/andon/record'
 import { ProAndonConfigVO } from '@/api/mes/pro/andon/config'
 import { DICT_TYPE } from '@/utils/dict'
+import { useUserStoreWithOut } from '@/store/modules/user'
+import { formatDate } from '@/utils/formatTime'
+import { MesProAndonStatusEnum } from '@/views/mes/utils/constants'
 import MdWorkstationSelect from '@/views/mes/md/workstation/components/MdWorkstationSelect.vue'
 import ProWorkOrderSelect from '@/views/mes/pro/workorder/components/ProWorkOrderSelect.vue'
 import ProProcessSelect from '@/views/mes/pro/process/components/ProProcessSelect.vue'
 import UserSelect from '@/views/system/user/components/UserSelect.vue'
 import AndonConfigSelect from '../config/components/AndonConfigSelect.vue'
-import { useUserStoreWithOut } from '@/store/modules/user'
 
-/** 安灯呼叫记录 新增/详情弹窗 */
 defineOptions({ name: 'AndonRecordForm' })
 
-const { t } = useI18n()
-const message = useMessage()
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
-const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
-const formType = ref('') // 表单的类型：create - 新增；detail - 详情
+const formType = ref('') // 表单的类型：create - 新增；update - 处置；detail - 详情
+const dialogTitle = computed(() =>
+  // 弹窗的标题
+  formType.value === 'create'
+    ? '新增安灯呼叫'
+    : formType.value === 'update'
+      ? '处置安灯呼叫'
+      : '安灯呼叫详情'
+)
 const formData = ref<any>({}) // 表单数据
-const formRules = reactive({
-  workstationId: [{ required: true, message: '工作站不能为空', trigger: 'change' }],
-  configId: [{ required: true, message: '呼叫原因不能为空', trigger: 'change' }],
-  level: [{ required: true, message: '级别不能为空', trigger: 'change' }]
-})
 const formRef = ref() // 表单 Ref
+const createRules = reactive({
+  workstationId: [{ required: true, message: '工作站不能为空', trigger: 'change' }],
+  configId: [{ required: true, message: '呼叫原因不能为空', trigger: 'change' }]
+})
+const userStore = useUserStoreWithOut()
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
-  dialogTitle.value = type === 'create' ? '新增安灯呼叫' : '安灯呼叫详情'
   formType.value = type
   resetForm()
   if (type === 'create') {
-    // 自动填充当前用户
-    const userStore = useUserStoreWithOut()
+    // 新增时，自动填充当前用户
     formData.value.userId = userStore.getUser?.id
-  } else if (type === 'detail') {
+  } else {
+    // 修改 / 详情时，设置数据
     formLoading.value = true
     try {
       formData.value = await ProAndonRecordApi.getAndonRecord(id!)
+      // 处置模式下，默认填充处置时间和处置人
+      if (type === 'update') {
+        if (!formData.value.handleTime) {
+          formData.value.handleTime = formatDate(new Date())
+        }
+        if (!formData.value.handlerUserId) {
+          formData.value.handlerUserId = userStore.getUser?.id
+        }
+      }
     } finally {
       formLoading.value = false
     }
   }
 }
-defineExpose({ open })
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 选择配置后自动填充原因和级别 */
 const handleConfigChange = (config: ProAndonConfigVO | undefined) => {
@@ -116,15 +190,69 @@ const handleConfigChange = (config: ProAndonConfigVO | undefined) => {
   }
 }
 
-/** 提交表单 */
-const emit = defineEmits(['success'])
-const submitForm = async () => {
+/** 提交新增 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const handleCreate = async () => {
+  // 校验表单
   await formRef.value.validate()
+  // 提交请求
   formLoading.value = true
   try {
     await ProAndonRecordApi.createAndonRecord(formData.value)
     message.success(t('common.createSuccess'))
     dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 保存处置信息（保持 ACTIVE 状态） */
+const handleSave = async () => {
+  // 提交请求
+  formLoading.value = true
+  try {
+    await ProAndonRecordApi.updateAndonRecord({
+      id: formData.value.id,
+      handleTime: formData.value.handleTime,
+      handlerUserId: formData.value.handlerUserId,
+      remark: formData.value.remark,
+      status: MesProAndonStatusEnum.ACTIVE
+    })
+    message.success('保存成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 标记已处置（状态变更为 HANDLED） */
+const handleFinish = async () => {
+  // 校验处置人和处置时间
+  if (!formData.value.handleTime) {
+    message.warning('标记已处置时，处置时间不能为空')
+    return
+  }
+  if (!formData.value.handlerUserId) {
+    message.warning('标记已处置时，处置人不能为空')
+    return
+  }
+  // 提交请求
+  formLoading.value = true
+  try {
+    await ProAndonRecordApi.updateAndonRecord({
+      id: formData.value.id,
+      handleTime: formData.value.handleTime,
+      handlerUserId: formData.value.handlerUserId,
+      remark: formData.value.remark,
+      status: MesProAndonStatusEnum.HANDLED
+    })
+    message.success('处置成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
     emit('success')
   } finally {
     formLoading.value = false

src/views/mes/pro/andon/record/index.vue

@@ -115,7 +115,7 @@
             v-if="scope.row.status === MesProAndonStatusEnum.ACTIVE"
             link
             type="success"
-            @click="openHandleForm(scope.row.id)"
+            @click="openRecordForm('update', scope.row.id)"
             v-hasPermi="['mes:pro-andon-record:update']"
           >
             处置
@@ -148,10 +148,8 @@
     />
   </ContentWrap>
 
-  <!-- 弹窗：新增/详情 -->
+  <!-- 弹窗：新增/处置/详情 -->
   <AndonRecordForm ref="recordFormRef" @success="getList" />
-  <!-- 弹窗：处置 -->
-  <AndonHandleForm ref="handleFormRef" @success="getList" />
   <!-- 弹窗：安灯设置 -->
   <AndonConfigDialog ref="configDialogRef" />
 </template>
@@ -161,7 +159,6 @@ import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import { ProAndonRecordApi, ProAndonRecordVO } from '@/api/mes/pro/andon/record'
 import AndonRecordForm from './AndonRecordForm.vue'
-import AndonHandleForm from './AndonHandleForm.vue'
 import AndonConfigDialog from '../config/AndonConfigForm.vue'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { MesProAndonStatusEnum } from '@/views/mes/utils/constants'
@@ -170,12 +167,12 @@ import UserSelect from '@/views/system/user/components/UserSelect.vue'
 
 defineOptions({ name: 'MesProAndon' })
 
-const message = useMessage()
-const { t } = useI18n()
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
 
 const loading = ref(true) // 列表的加载中
-const list = ref<ProAndonRecordVO[]>([]) // 列表的数据
 const total = ref(0) // 列表的总页数
+const list = ref<ProAndonRecordVO[]>([]) // 列表的数据
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -185,7 +182,7 @@ const queryParams = reactive({
   status: undefined,
   createTime: undefined
 })
-const queryFormRef = ref() // 搜索的表单 Ref
+const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
 
 /** 查询列表 */
@@ -212,18 +209,12 @@ const resetQuery = () => {
   handleQuery()
 }
 
-/** 新增/详情弹窗 */
+/** 新增/处置/详情操作 */
 const recordFormRef = ref()
 const openRecordForm = (type: string, id?: number) => {
   recordFormRef.value.open(type, id)
 }
 
-/** 处置弹窗 */
-const handleFormRef = ref()
-const openHandleForm = (id: number) => {
-  handleFormRef.value.open(id)
-}
-
 /** 安灯设置弹窗 */
 const configDialogRef = ref()
 const openConfigDialog = () => {
@@ -233,9 +224,12 @@ const openConfigDialog = () => {
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {
+    // 删除的二次确认
     await message.delConfirm()
+    // 发起删除
     await ProAndonRecordApi.deleteAndonRecord(id)
     message.success(t('common.delSuccess'))
+    // 刷新列表
     await getList()
   } catch {}
 }
@@ -243,17 +237,20 @@ const handleDelete = async (id: number) => {
 /** 导出按钮操作 */
 const handleExport = async () => {
   try {
+    // 导出的二次确认
     await message.exportConfirm()
+    // 发起导出
     exportLoading.value = true
     const data = await ProAndonRecordApi.exportAndonRecord(queryParams)
     download.excel(data, '安灯呼叫记录.xls')
+  } catch {
   } finally {
     exportLoading.value = false
   }
 }
 
-/** 初始化 **/
-onMounted(async () => {
-  await getList()
+/** 初始化 */
+onMounted(() => {
+  getList()
 })
 </script>