提交优化项

Houjie

2025-05-15 1833dd6d7cac01c35840af52fadc1199821e5805

 pages/checkList/checkListDetils/checkListDetils.vue

@@ -6,7 +6,18 @@
      </cu-custom>
      <view class="container">

         <template>
            <!-- 浮窗遮罩层 -->
            <view v-if="showPreview" class="overlay" @tap.stop="closePreview">
               <view class="modal">
                  <!-- 关闭按钮 -->
                  <text class="close-btn" @tap.stop="showPreview = false">&times;</text>
                  <!-- 图片展示 -->
                  <image :src="previewImageSrc" mode="aspectFit" class="preview-image" />
               </view>
            </view>

         </template>
         <uni-forms ref="form" :modelValue="formData" validate-trigger="bind" err-show-type="undertext">
            <uni-group top="1">
               <view class="text-gray margin-bottom-lg">—————————— 基本信息 ——————————</view>
@@ -27,18 +38,12 @@
                  <uni-easyinput type="textarea" v-model="formData.remark" :disabled="true" />
               </uni-forms-item>
               <uni-forms-item name="outNum" :label-width="80" label="点检图片:">
                  <view class="grid col-4 grid-square flex-sub">
                     <view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage"
                        :data-url="imgList[index]">
                        <image :src="imgList[index]" mode="aspectFill"></image>
                        <view class="cu-tag bg-red radius" @tap.stop="DelImg" :data-index="index">
                           <text class='cuIcon-close'></text>
                        </view>
                     </view>
                     <view class="solids" v-if="imgList.length<1">
                        <text class='cuIcon-cameraadd'></text>
                     </view>
                  </view>
                  <uni-file-picker limit="9" :value="fileLists" :image-styles="imageStyles"
                     :sourceType="sourceType" @select="select" @progress="progress" @success="success"
                     @fail="fail" @delete="deletea" :readonly="true" />
               </uni-forms-item>
               <uni-forms-item name="outNum" :label-width="80" label="作业指导:">
                  <button class="cu-btn  bg-blue" @tap="showPreview = true">查看</button>
               </uni-forms-item>
            </uni-group>
         </uni-forms>
@@ -59,14 +64,17 @@
            </view>
            <view class="flex">
               <view class="flex-sub text-light bg-white  padding-xs margin-xs radius">保养要求:</view>
               <view class="flex-sub bg-white padding-xs margin-xs radius text-right"
               <view class="flex-sub bg-white padding-xs margin-xs radius text-right">
                  {{item.itemDemand}}
               </view>
               <!-- <view class="flex-sub bg-white padding-xs margin-xs radius text-right"
                  v-if="item.itemDemand!=null && item.itemDemand.length>10">
                  {{(item.itemDemand).toString().substr(0,10)+'...'}}
               </view>

               <view class="flex-sub bg-white padding-xs margin-xs radius text-right" v-else>
                  {{item.itemDemand}}
               </view>
               </view> -->
            </view>

            <view class="flex">
@@ -102,6 +110,16 @@
      mixins: [MescrollMixin], // 使用mixin
      data() {
         return {
            showPreview: false,
            // 图片回显
            fileLists: [],
            // 上传图片的样式
            sourceType: ['album', 'camera'],
            imageStyles: {
               width: 90,
               height: 90,
            },
            previewImageSrc: '',
            ipAndPort: configService.staticURL,
            scrollLeft: 0,
            searchValue: '',
@@ -120,11 +138,12 @@
            url: {
               upload: "/eam/sysFiles/batch_upload",
               stallList: "/eam/eamInspectionOrder/queryById",
               getEquipmentList:'eam/equipment/list',
               // getEquipmentList: "eam/equipment/asyncLoadEquipment",
               getEquipmentList: 'eam/equipment/list',
               getStandardFile: "eam/maintenanceStandard/queryById",
               BaoList: 'eam/eamInspectionOrderDetail/queryList'
            },
            id: '',
            standardId: '',
            inspectionResult: '',
            upOption: {
               page: {
@@ -140,10 +159,12 @@
               isShowNoMore: false,
               textNoMore: '我是有底线的 >_<'
            },
            imgList: [],
            styles: {
               color: '#2979FF',
               borderColor: '#2979FF'
            },
            referenceFileList: [],
            msg1Count: 0,
            msg2Count: 0,
            msg1Title: ""
@@ -171,54 +192,41 @@

      },
      methods: {
         closePreview() {
            this.showPreview = false;
         },
         changeEquipmentList(e) {
            this.formData.num = e;
         },
         handleCode(e) {
            this.inspectionResult = e;
         },
            getEquipment() {
                     this.$http.get(this.url.getEquipmentList, {
                        params: {
                           pageNo: 1,
                           pageSize: 9999,
                           order: 'desc',
                           column: 'createTime'
                        },
							
                     }).then(res => {
                        //设置列表数据
                        if (res.data.success) {
                           this.equipmentList = res.data.result.records
                        } else {
                           uni.showToast({
                              icon: "error",
                              title: res.data.message,
                              duration: 2000
                           });
			
                        }
                     }).catch(() => {
                        this.$tip.error("联网失败")
                     })
                  },
         // getEquipment() {
         //    this.$http.get(this.url.getEquipmentList).then(res => {
         //       //设置列表数据
         //       if (res.data.success) {
         //          this.equipmentList = res.data.result
         //       } else {
         //          uni.showToast({
         //             icon: "error",
         //             title: res.data.message,
         //             duration: 2000
         //          });
         getEquipment() {
            this.$http.get(this.url.getEquipmentList, {
               params: {
                  pageNo: 1,
                  pageSize: 9999,
                  order: 'desc',
                  column: 'createTime'
               },

         //       }
         //    }).catch(() => {
         //       this.$tip.error("联网失败")
         //    })
         // },
            }).then(res => {
               //设置列表数据
               if (res.data.success) {
                  this.equipmentList = res.data.result.records
               } else {
                  uni.showToast({
                     icon: "error",
                     title: res.data.message,
                     duration: 2000
                  });

               }
            }).catch(() => {
               this.$tip.error("联网失败")
            })
         },

         getList() {
            this.$http.get(this.url.BaoList, {
               params: {
@@ -237,68 +245,102 @@
               //联网失败, 结束加载
            })
         },
         ChooseImage() {
            var that = this;
            uni.chooseImage({
               count: 4,
               sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
               sourceType: ['album'], // 从相册选择
               success: (res) => {
                  // 存储选择的图片路径
                  that.imgList = res.tempFilePaths;
                  that.formData.avatar =[];
                  // 创建上传任务的 Promise 数组
                  const uploadPromises = res.tempFilePaths.map((filePath, index) => {
                     return new Promise((resolve, reject) => {
                        that.$http.upload(that.url.upload, {
                              filePath: filePath,
                              name: 'file'
                           })
                           .then(uploadRes => {
                              // 假设服务器返回的结果中包含文件路径
                              const filePath = uploadRes.data.result[0];
                              // 追加到 formData.avatar 中，并用逗号分隔
                              this.formData.avatar.push(filePath);
                              resolve(filePath);
                           })
                           .catch(err => {
                              console.error('图片' + index + '上传失败:', err);
                              reject(err);
                           });
                     });
                  });
			
                  // 并发执行所有上传任务
                  Promise.all(uploadPromises)
                     .then((uploadedFilePaths) => {
                        console.log('所有图片上传成功:', that.formData.avatar);
                     })
                     .catch((err) => {
                        console.error('图片上传失败:', err);
                        that.$tip.error('图片上传失败');
                     });
               }
            });
         },
         ViewImage(e) {
            uni.previewImage({
               urls: this.imgList,
               current: e.currentTarget.dataset.url
            });
         },
         DelImg(e) {
            uni.showModal({
               title: '提示',
               content: '确定要删除这段回忆吗？',
               cancelText: '再看看',
               confirmText: '再见',
               success: res => {
                  if (res.confirm) {
                     this.imgList.splice(e.currentTarget.dataset.index, 1)
                  }
               }
            })
         },

      getStandardFile() {
          this.$http.get(this.url.getStandardFile, {
              params: {
                  id: this.standardId
              }
          }).then(res => {
              if (res.data.success) {
                  console.log("res", res.data.result);
                  const referenceFileStr = res.data.result.referenceFile;
		
                  // 判断是否存在 referenceFile 并进行解析
                  if (referenceFileStr) {
                      try {
                          const referenceFileObj = JSON.parse(referenceFileStr);
                          const filePath = `${this.ipAndPort}${referenceFileObj.filePath}`;
                          this.previewImageSrc = filePath;
                          console.log('previewImageSrc:', this.previewImageSrc);
                      } catch (e) {
                          console.error("referenceFile 解析失败", e);
                          this.previewImageSrc = '';
                      }
                  } else {
                      console.warn("referenceFile 不存在");
                      this.previewImageSrc = '';
                  }
              }
          }).catch(err => {
              console.error("网络请求失败", err);
              // 联网失败, 结束加载
          });
      },


         // ChooseImage() {
         //    var that = this;
         //    uni.chooseImage({
         //       count: 4,
         //       sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
         //       sourceType: ['album'], // 从相册选择
         //       success: (res) => {
         //          // 存储选择的图片路径
         //          that.imgList = res.tempFilePaths;
         //          that.formData.avatar =[];
         //          // 创建上传任务的 Promise 数组
         //          const uploadPromises = res.tempFilePaths.map((filePath, index) => {
         //             return new Promise((resolve, reject) => {
         //                that.$http.upload(that.url.upload, {
         //                      filePath: filePath,
         //                      name: 'file'
         //                   })
         //                   .then(uploadRes => {
         //                      // 假设服务器返回的结果中包含文件路径
         //                      const filePath = uploadRes.data.result[0];
         //                      // 追加到 formData.avatar 中，并用逗号分隔
         //                      this.formData.avatar.push(filePath);
         //                      resolve(filePath);
         //                   })
         //                   .catch(err => {
         //                      console.error('图片' + index + '上传失败:', err);
         //                      reject(err);
         //                   });
         //             });
         //          });

         //          // 并发执行所有上传任务
         //          Promise.all(uploadPromises)
         //             .then((uploadedFilePaths) => {
         //                console.log('所有图片上传成功:', that.formData.avatar);
         //             })
         //             .catch((err) => {
         //                console.error('图片上传失败:', err);
         //                that.$tip.error('图片上传失败');
         //             });
         //       }
         //    });
         // },
         // ViewImage(e) {
         //    uni.previewImage({
         //       urls: this.imgList,
         //       current: e.currentTarget.dataset.url
         //    });
         // },
         // DelImg(e) {
         //    uni.showModal({
         //       title: '提示',
         //       content: '确定要删除这段回忆吗？',
         //       cancelText: '再看看',
         //       confirmText: '再见',
         //       success: res => {
         //          if (res.confirm) {
         //             this.imgList.splice(e.currentTarget.dataset.index, 1)
         //          }
         //       }
         //    })
         // },

         upCallback() {
            this.$http.get(this.url.stallList, {
@@ -310,23 +352,34 @@
               console.log("url", res)
               //设置列表数据
               if (res.data.success) {
		
                     this.formData.num = this.announcement1.equipmentId
                     this.formData.orderNum = this.announcement1.orderNum
                      this.formData.operator = this.announcement1.operator
                     this.formData.remark=this.announcement1.remark
                     this.formData.inspectionDate = this.announcement1.inspectionDate
                     this.formData.avatar = this.announcement1.imageFiles
                     if(!this.formData.avatar == null){
                           this.imgList = JSON.parse(this.formData.avatar)
                        const imageObjects = JSON.parse(this.formData.avatar);a
                        // 提取 filePath 并拼接 IP 和端口
                        this.imgList = imageObjects.map(imageObj => {
                           return `${this.ipAndPort}${imageObj.filePath}`;
                        });
                     }
							
							
                  this.formData.num = this.announcement1.equipmentId
                  this.formData.orderNum = this.announcement1.orderNum
                  this.formData.operator = this.announcement1.operator
                  this.formData.remark = this.announcement1.remark
                  this.formData.inspectionDate = this.announcement1.inspectionDate
                  if (this.announcement1.standardId !== null) {
                     this.standardId = this.announcement1.standardId
                     this.getStandardFile()
                  }
                  this.formData.avatar = this.announcement1.imageFiles
                  if (!this.formData.avatar == null) {
                     this.imgList = JSON.parse(this.formData.avatar)
                     const imageObjects = JSON.parse(this.formData.avatar);
                     a
                     // 提取 filePath 并拼接 IP 和端口
                     this.imgList = imageObjects.map(imageObj => {
                        return `${this.ipAndPort}${imageObj.filePath}`;
                     });

                     // 根据 imgList 构造 fileLists
                     this.fileLists = this.imgList.map(url => ({
                        url: url,
                        extname: 'png',
                        name: 'eam'
                     }));
                  }


               }
            }).catch(() => {
               //联网失败, 结束加载
@@ -404,4 +457,41 @@
      margin-top: 85px;
      height: auto;
   }

   .overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.7);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 999;
   }

   .modal {
      position: relative;
      width: 90%;
      max-width: 600px;
      background: #fff;
      border-radius: 12rpx;
      padding: 20rpx;
      box-sizing: border-box;
   }

   .preview-image {
      width: 100%;
      max-height: 80vh;
      object-fit: contain;
   }

   .close-btn {
      position: absolute;
      top: 10rpx;
      right: 20rpx;
      font-size: 40rpx;
      color: #333;
   }
</style>