设备点检保养的样式调整

src/views/mes/workOrderManagement/components/TicketResultDialog.vue

@@ -81,23 +81,15 @@
         <el-table-column :label="t('EquipmentManagement.WorkOrderManagement.images')" align="center" prop="images" min-width="260">
           <template #default="scope">
             <div v-if="String(scope.row.inspectionResult) === '0'" v-loading="isImageUploading(String(scope.row.id))"
-              class="ticket-result-images" :class="{ 'is-full': (imageMap[String(scope.row.id)] || []).length >= 3 }">
-              <el-upload
-                v-model:file-list="fileListMap[String(scope.row.id)]"
-                list-type="picture-card"
-                :auto-upload="false"
-                :limit="3"
-                :on-change="(uploadFile: any) => handleImageChange(uploadFile, String(scope.row.id))"
-                :on-exceed="handleImageExceed"
-              >
-                <el-icon><Plus /></el-icon>
-              </el-upload>
+              element-loading-text="上传中" class="ticket-result-images"
+              :class="{ 'is-full': (imageMap[String(scope.row.id)] || []).length >= 3 }">
+              <UploadImgs v-model="imageMap[String(scope.row.id)]" :limit="3" width="64px" height="64px"
+                @uploading-change="setImageUploading(String(scope.row.id), $event)" />
             </div>
-            <div v-else-if="scope.row.images" class="ticket-result-images">
-              <template v-for="(img, imgIdx) in parseImages(scope.row.images).slice(0, 3)" :key="imgIdx">
-                <el-image :src="img" :preview-src-list="parseImages(scope.row.images)" preview-teleported fit="cover"
-                  class="ticket-result-image" />
-              </template>
+            <div v-else-if="parseImages(scope.row.images).length" class="ticket-result-images">
+              <el-image v-for="image in parseImages(scope.row.images)" :key="image" :src="image"
+                :preview-src-list="parseImages(scope.row.images)" preview-teleported fit="cover"
+                class="ticket-result-image" />
             </div>
             <span v-else>-</span>
           </template>
@@ -166,7 +158,7 @@ import { getStrDictOptions } from '@/utils/dict'
 import { useDictStoreWithOut } from '@/store/modules/dict'
 import { TicketManagementApi, TicketResultVO } from '@/api/mes/ticketManagement'
 import { isHexColor } from '@/utils/color'
-import { Plus } from '@element-plus/icons-vue'
+import UploadImgs from '@/components/UploadFile/src/UploadImgs.vue'
 
 const { t } = useI18n()
 const message = useMessage()
@@ -197,7 +189,6 @@ const managementId = ref<number | undefined>(undefined)
 const decisionMap = reactive<Record<string, '1' | '2' | undefined>>({})
 const imageMap = reactive<Record<string, string[]>>({})
 const imageUploadingMap = reactive<Record<string, boolean>>({})
-const fileListMap = reactive<Record<string, any[]>>({})
 
 const hasImageUploading = computed(() => Object.values(imageUploadingMap).some(Boolean))
 
@@ -254,7 +245,7 @@ const resetResultState = () => {
   for (const key of Object.keys(decisionMap)) delete decisionMap[key]
   for (const key of Object.keys(imageMap)) delete imageMap[key]
   for (const key of Object.keys(imageUploadingMap)) delete imageUploadingMap[key]
-  for (const key of Object.keys(fileListMap)) delete fileListMap[key]
+  
   list.value = []
   total.value = 0
   queryParams.pageNo = 1
@@ -309,39 +300,6 @@ const handleCurrentChange = () => {
   getList()
 }
 
-const handleImageChange = (uploadFile: any, rowKey: string) => {
-  if (!uploadFile || !rowKey) return
-  setImageUploading(rowKey, true)
-  try {
-    const reader = new FileReader()
-    reader.onload = (e: any) => {
-      const base64 = e.target?.result
-      if (base64) {
-        if (!imageMap[rowKey]) {
-          imageMap[rowKey] = []
-        }
-        if (imageMap[rowKey].length < 3) {
-          imageMap[rowKey].push(base64)
-        }
-      }
-      setImageUploading(rowKey, false)
-    }
-    reader.onerror = () => {
-      setImageUploading(rowKey, false)
-    }
-    if (uploadFile.raw) {
-      reader.readAsDataURL(uploadFile.raw)
-    } else {
-      setImageUploading(rowKey, false)
-    }
-  } catch {
-    setImageUploading(rowKey, false)
-  }
-}
-
-const handleImageExceed = () => {
-  message.warning(t('EquipmentManagement.WorkOrderManagement.imageLimitExceed'))
-}
 
 const handleSave = async () => {
   const payload: TicketResultVO[] = []

src/views/mes/workOrderManagement/index.vue

@@ -1,4 +1,4 @@
-<template>
+<template>
   <template v-if="!resultVisible">
   <ContentWrap>
     <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" min-label-width="68px">
@@ -240,7 +240,7 @@ const resultTitle = computed(() => {
   const row = selectedResultRow.value
   if (!row) return t('EquipmentManagement.WorkOrderManagement.dialogTitleDefault')
   return row.planNo
-    ? "${t('EquipmentManagement.WorkOrderManagement.dialogTitleDefault')}-${row.planNo}"
+    ? `${t('EquipmentManagement.WorkOrderManagement.dialogTitleDefault')}-${row.planNo}`
     : t('EquipmentManagement.WorkOrderManagement.dialogTitleDefault')
 })