电表

pagesA/sdPage/dfReport.vue

@@ -72,30 +72,43 @@
       </view>
     </view>
     <scroll-view class="house-view" scroll-y="true">
-      <view class="section-card">
+      <view
+        class="section-card"
+        v-for="(item, index) in form.waterMeters"
+        :key="item.id || index"
+        style="margin-bottom: 24rpx"
+      >
+        <view class="section-title">水表{{ index + 1 }}</view>
         <view class="meter-row">
           <text class="meter-label">水表号</text>
-          <!-- <text>20072620</text> -->
           <u-input
-            v-model="form.meterNumber"
+            v-model="item.meterNumber"
             type="digit"
             placeholder="请输入水表号"
             border="none"
+            :disabled="!!item.meterNumber"
+            :custom-style="
+              item.meterNumber ? 'background:#fff;color:#bbb;' : ''
+            "
           />
         </view>
         <view class="meter-row">
           <text class="meter-label">上次表数</text>
           <u-input
-            v-model="form.lastMeterReading"
+            v-model="item.lastMeterReading"
             type="digit"
-            :placeholder="`3823.1`"
+            placeholder="请输入上次表数"
             border="none"
+            :disabled="!!item.lastMeterReading"
+            :custom-style="
+              item.meterNumber ? 'background:#fff;color:#bbb;' : ''
+            "
           />
         </view>
         <view class="meter-row">
           <text class="meter-label">本次表数</text>
           <u-input
-            v-model="form.thisMeterReading"
+            v-model="item.thisMeterReading"
             type="digit"
             placeholder="请输入本次表数"
             border="none"
@@ -109,14 +122,17 @@
             :preview-full-image="true"
             :deletable="true"
             :show-upload-list="true"
-            :fileList="fileList"
+            :fileList="item.fileList || []"
             :auto-upload="false"
             accept="all"
             :maxSize="10 * 1024 * 1024"
             @oversize="oversize"
-            @delete="onDelete"
+            @delete="(e) => onDelete(e, index)"
+          >
+            <view
+              class="custom-upload-btn"
+              @click.stop="() => chooseMedia(index)"
             >
-            <view class="custom-upload-btn" @click.stop="chooseMedia">
               <view class="icon-box">
                 <image
                   class="camera-icon"
@@ -151,7 +167,6 @@ export default {
       waterMeter: 3245.1,
       electricMeter: 2672.6,
       remark: "",
-      fileList: [],
       deptNames: [],
       deptOptions: [],
 
@@ -169,6 +184,7 @@ export default {
         houseId: "",
         waterMeters: [],
         roomId: "",
+        fileList: [],
       },
     };
   },
@@ -333,14 +349,23 @@ export default {
       this.getLastMeter();
       this.$forceUpdate();
     },
-
     onDelete(event, index) {
-      // this.form.waterMeters[index].fileList.splice(event.index, 1);
+      if (
-      // this.form.waterMeters[index].imageList.splice(event.index, 1);
+        this.form.waterMeters[index] &&
+        Array.isArray(this.form.waterMeters[index].fileList)
+      ) {
+        this.form.waterMeters[index].fileList.splice(event.index, 1);
+        // this.form.waterMeters[index].imageList = this.form.waterMeters[
+        //   index
+        // ].fileList.map((v) => v.url);
+      }
     },
-    chooseMedia() {
+    chooseMedia(index) {
+      if (!this.form.waterMeters[index].fileList) {
+        this.$set(this.form.waterMeters[index], "fileList", []);
+      }
       uni.chooseMedia({
-        count: 10 - this.fileList.length,
+        count: 10 - this.form.waterMeters[index].fileList.length,
         mediaType: ["image", "video"],
         sourceType: ["album", "camera"],
         maxDuration: 60,
@@ -359,7 +384,7 @@ export default {
                   : "image");
               // 上传
               const uploadRes = await uploadImage(filePath);
-              this.fileList.push({
+              this.form.waterMeters[index].fileList.push({
                 url: uploadRes.data?.url || uploadRes.url || uploadRes.path,
                 name: uploadRes.data?.name || uploadRes.name || "",
                 type: type,
@@ -386,6 +411,26 @@ export default {
         meterNumber: "",
       };
       const res = await queryLastMeterReading(params);
+      if (Array.isArray(res.data) && res.data.length > 0) {
+        this.form.waterMeters = res.data.map((item, idx) => ({
+          lastMeterReading: item.thisMeterReading,
+          meterNumber: item.meterNumber,
+          thisMeterReading: "", 
+          fileList: [],
+          // id: item.id || idx,
+        }));
+      } else {
+        // res.data 为空时，显示一个空表单
+        this.form.waterMeters = [
+          {
+            lastMeterReading: "",
+            meterNumber: "",
+            thisMeterReading: "",
+            fileList: [],
+            // id: 1,
+          },
+        ];
+      }
     },
     onSubmit() {
       let { buildingId, unitId, houseId } = this.form;
@@ -401,16 +446,18 @@ export default {
     },
     async submitAdd() {
       let params = [];
+      this.form.waterMeters.forEach((item) => {
         params.push({
-        meterNumber: this.form.meterNumber,
+          meterNumber: item.meterNumber,
           meterType: 1,
           houseId: this.form.houseId,
           roomId: this.form.roomId,
-        lastMeterReading: this.form.lastMeterReading,
+          lastMeterReading: item.lastMeterReading,
-        thisMeterReading: this.form.thisMeterReading,
+          thisMeterReading: item.thisMeterReading,
-        images: this.fileList,
+          images: item.fileList,
           remark: this.form.remark,
         });
+      });
       console.log(params, "params");
 
       const res = await submitWaterAndElectricity(params);
@@ -429,7 +476,7 @@ export default {
             }, 1500);
           },
         });
-      }else {
+      } else {
         uni.showToast({
           title: res.msg || "提交失败",
           icon: "none",