优化

src/views/material/ma/partType/index.vue

@@ -547,7 +547,7 @@ export default {
     handleUpdate(row) {
       this.flagTemp = 2;
       this.reset();
-      this.getTreeselect();
+      // this.getTreeselect();
       const id = row.id;
       getAccessoryDetail(id).then((response) => {
         this.form = response.data;

src/views/material/repair/repairManage/component/edit.vue

@@ -89,13 +89,17 @@
                   上传
                 </el-button>
               </el-upload>
+              <!-- 查看按钮 - 显示图片数量 -->
               <el-button
                 size="mini"
                 type="text"
                 @click="picturePreview(scope.row)"
                 v-if="scope.row.bmFileInfos && scope.row.bmFileInfos.length > 0"
               >
-                查看
+                查看图片
+                <span v-if="getImageCount(scope.row) > 0" style="margin-left: 2px; color: #409EFF;">
+    ({{ getImageCount(scope.row) }})
+  </span>
               </el-button>
             </div>
           </template>
@@ -546,8 +550,98 @@
     </el-dialog>
 
     <!-- 图片查看弹窗 -->
-    <el-dialog :visible.sync="dialogVisible" width="500px" height="500px">
+<!--    <el-dialog :visible.sync="dialogVisible" width="500px" height="500px">-->
-      <img width="100%" height="500px" :src="dialogImageUrl" />
+<!--      <img width="100%" height="500px" :src="dialogImageUrl" />-->
+<!--    </el-dialog>-->
+
+    <!-- 图片查看弹窗 - 支持多张图片切换 -->
+    <el-dialog
+      :visible.sync="dialogVisible"
+      width="600px"
+      height="600px"
+      :close-on-click-modal="false"
+      @closed="handlePreviewClose"
+    >
+      <div style="position: relative; height: 500px; background-color: #f5f5f5;">
+        <!-- 图片显示区域 -->
+        <img
+          v-if="dialogImageUrl"
+          width="100%"
+          height="100%"
+          :src="dialogImageUrl"
+          style="object-fit: contain;"
+        />
+
+        <!-- 多图导航 - 当有多张图片时显示 -->
+        <div
+          v-if="previewImageFiles && previewImageFiles.length > 1"
+          style="position: absolute; top: 50%; width: 100%; transform: translateY(-50%);"
+        >
+          <!-- 上一张按钮 -->
+          <el-button
+            circle
+            size="mini"
+            style="position: absolute; left: 10px; background: rgba(0,0,0,0.3); color: white;"
+            @click="prevImage"
+          >
+            <i class="el-icon-arrow-left"></i>
+          </el-button>
+
+          <!-- 下一张按钮 -->
+          <el-button
+            circle
+            size="mini"
+            style="position: absolute; right: 10px; background: rgba(0,0,0,0.3); color: white;"
+            @click="nextImage"
+          >
+            <i class="el-icon-arrow-right"></i>
+          </el-button>
+        </div>
+
+        <!-- 图片计数器 -->
+        <div
+          v-if="previewImageFiles && previewImageFiles.length > 1"
+          style="position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); background: rgba(0,0,0,0.7); color: white; padding: 5px 15px; border-radius: 15px; font-size: 14px;"
+        >
+          {{ previewFileIndex + 1 }} / {{ previewImageFiles.length }}
+        </div>
+
+        <!-- 图片名称 -->
+<!--        <div-->
+<!--          v-if="previewImageFiles && previewImageFiles.length > 0 && previewImageFiles[previewFileIndex]"-->
+<!--          style="position: absolute; bottom: 40px; left: 0; width: 100%; text-align: center; background: rgba(0,0,0,0.5); color: white; padding: 5px; font-size: 12px;"-->
+<!--        >-->
+<!--          {{ previewImageFiles[previewFileIndex].name }}-->
+<!--        </div>-->
+      </div>
+
+      <!-- 缩略图列表 -->
+      <div
+        v-if="previewImageFiles && previewImageFiles.length > 1"
+        style="margin-top: 10px; padding: 10px; background-color: #f8f8f8; border-radius: 5px; max-height: 80px; overflow-x: auto; white-space: nowrap;"
+      >
+        <div
+          v-for="(file, index) in previewImageFiles"
+          :key="index"
+          :style="{
+        display: 'inline-block',
+        margin: '0 5px',
+        border: '2px solid',
+        borderColor: previewFileIndex === index ? '#409EFF' : '#ddd',
+        borderRadius: '4px',
+        cursor: 'pointer',
+        opacity: previewFileIndex === index ? 1 : 0.8,
+        transition: 'all 0.3s'
+      }"
+          @click="previewFileIndex = index; dialogImageUrl = file.url;"
+        >
+          <img
+            :src="file.url"
+            :alt="file.name"
+            style="width: 50px; height: 50px; object-fit: cover;"
+          />
+        </div>
+      </div>
     </el-dialog>
   </div>
 </template>
@@ -827,6 +921,9 @@ export default {
       idsList:[],
       //一级页面传来的id
       taskIdTemp:undefined,
+      previewRow: null,              // 当前预览的行数据
+      previewImageFiles: [],         // 当前行的图片文件列表
+      previewFileIndex: 0,           // 当前预览的图片索引
     };
   },
   mounted() {
@@ -842,9 +939,27 @@ export default {
     ...mapState(["user"]),
   },
   methods: {
+    // 重置表单方法
+    resetForm(formName) {
+      if (this.$refs[formName]) {
+        this.$refs[formName].resetFields();
+      }
+    },
     goBack() {
       this.$emit("goBackPage");
     },
+    // 计算行数据中的图片数量
+    getImageCount(row) {
+      if (!row.bmFileInfos || row.bmFileInfos.length === 0) return 0;
+
+      const imageFiles = row.bmFileInfos.filter(file => {
+        const parts = file.name.split(".");
+        const extension = parts.pop().toLowerCase();
+        return ["jpg", "jpeg", "png", "gif", "bmp", "webp"].includes(extension);
+      });
+
+      return imageFiles.length;
+    },
     // 获取 任务详情数据
     async GetViewByApply() {
       console.log(this.repairRow);
@@ -1035,8 +1150,10 @@ export default {
       this.innerRowData = row;
       this.partTableList = [];
       if (this.innerRowData.partTableList && this.innerRowData.partTableList.length > 0) {
-        this.partTableList = this.innerRowData.partTableList;
+        this.partTableList = JSON.parse(JSON.stringify(this.innerRowData.partTableList));
       }
+      // 重置配件选择器
+      this.partTypeId = null;
       this.getPartTypeTreeData();
       this.openInner = true;
     },
@@ -1387,28 +1504,61 @@ export default {
         this.repairDeviceList[index].bmFileInfos;
     },
     //维修弹窗图片查看
+// 图片查看 - 支持多张图片预览（只处理图片）
     picturePreview(row) {
-      //   console.log(row);
+      if (row.bmFileInfos && row.bmFileInfos.length > 0) {
-      //   console.log(row.bmFileInfos);
+        // 筛选出图片文件（只显示图片）
-      //   if (row.bmFileInfos.length > 0) {
+        const imageFiles = row.bmFileInfos.filter(file => {
-      //     let file = row.bmFileInfos[0];
+          const parts = file.name.split(".");
-      //     this.dialogImageUrl = file.url;
+          const extension = parts.pop().toLowerCase();
-      //     const parts = file.name.split(".");
+          return ["jpg", "jpeg", "png", "gif", "bmp", "webp"].includes(extension);
-      //     const extension = parts.pop();
+        });
-      //     if (
+
-      //       extension === "doc" ||
+        // 如果没有图片，显示提示
-      //       extension === "docx" ||
+        if (imageFiles.length === 0) {
-      //       extension === "pdf"
+          this.$message.info("没有可预览的图片文件");
-      //     ) {
+          return;
-      //       const windowName = file.name;
+        }
-      //       window.open(file.url, windowName);
+
-      //     } else {
+        // 存储当前行和图片列表
-      //       this.dialogVisible = true;
+        this.previewRow = row;
-      //     }
+        this.previewImageFiles = imageFiles;
-      //   }
+        this.previewFileIndex = 0;
-      console.log(file);
+
-      this.dialogImageUrl = file.url.replaceAll('#','%23');
+        // 显示第一张图片
+        this.dialogImageUrl = imageFiles[0].url;
         this.dialogVisible = true;
+      } else {
+        this.$message.info("没有可预览的附件");
+      }
+    },
+
+// 切换到上一张图片
+    prevImage() {
+      if (this.previewImageFiles && this.previewImageFiles.length > 0) {
+        this.previewFileIndex--;
+        if (this.previewFileIndex < 0) {
+          this.previewFileIndex = this.previewImageFiles.length - 1;
+        }
+        this.dialogImageUrl = this.previewImageFiles[this.previewFileIndex].url;
+      }
+    },
+
+// 切换到下一张图片
+    nextImage() {
+      if (this.previewImageFiles && this.previewImageFiles.length > 0) {
+        this.previewFileIndex++;
+        if (this.previewFileIndex >= this.previewImageFiles.length) {
+          this.previewFileIndex = 0;
+        }
+        this.dialogImageUrl = this.previewImageFiles[this.previewFileIndex].url;
+      }
+    },
+    // 预览弹窗关闭时的清理
+    handlePreviewClose() {
+      this.previewRow = null;
+      this.previewImageFiles = [];
+      this.previewFileIndex = 0;
     },
     // 图片上传
     handleChange(file, fileList) {