退房检查，退房详情接口联调

pages/api.js

@@ -1,4 +1,4 @@
-import request from "../utils/request.js";
+import request, { uploadFile } from "../utils/request.js";
 
 // 获取验证码
 export function getCodeImg() {
@@ -45,3 +45,16 @@ export function submitCheckout(data) {
     data: data,
   });
 }
+export function uploadImage(filePath, formData = {}) {
+  return uploadFile(filePath, {
+    formData: formData,
+  });
+}
+// 暂存提交退房
+export function tempSaveCheckOut(data) {
+  return request({
+    url: "/apartment/manager/tempSaveCheckOut",
+    method: "post",
+    data: data,
+  });
+}

pagesA/checkout/detail/detail.vue

@@ -21,7 +21,7 @@ import { detail } from '@/api/mz/contract';
         ><text class="label">联系电话</text>{{ info.telephone }}</view
       >
       <view class="info-row"
-        ><text class="label">居住日期</text>{{ info.startDate }}至{{
+        ><text class="label">居住日期</text>{{ info.checkInDate }}至{{
           info.checkOutDate
         }}</view
       >
@@ -36,17 +36,17 @@ import { detail } from '@/api/mz/contract';
       >
         <text class="device-label">{{ item.name }}</text>
         <u-radio-group
-          v-model="item.status"
           placement="row"
           @change="onDeviceChange(idx, $event)"
+          v-model="checkStatus[idx]"
         >
           <u-radio
             :custom-style="'margin-right:36rpx;'"
             activeColor="#0DC6C6"
             v-for="opt in statusOptions"
-            :key="opt"
-            :label="opt"
-            :name="opt"
+            :key="opt.value"
+            :label="opt.label"
+            :name="opt.value"
           ></u-radio>
         </u-radio-group>
       </view>
@@ -78,7 +78,6 @@ import { detail } from '@/api/mz/contract';
       <view class="section-title">其他说明</view>
       <u-textarea
         v-model="facilitiesCheckDesc"
-        
         ref="textarea"
         placeholder="请输入内容（不超过500字）"
         maxlength="500"
@@ -96,9 +95,9 @@ import { detail } from '@/api/mz/contract';
         @delete="deletePic"
         multiple
         :maxCount="10"
-        accept="image,video"
         uploadIconColor="#12c3c3"
         uploadText="点击上传"
+        :previewImage="true"
       >
       </u-upload>
     </view>
@@ -116,7 +115,12 @@ import { detail } from '@/api/mz/contract';
 </template>
 
 <script>
-import { getRoomFacilities,submitCheckout } from "../../../pages/api";
+import {
+  getRoomFacilities,
+  submitCheckout,
+  uploadImage,
+  tempSaveCheckOut,
+} from "../../../pages/api";
 
 export default {
   data() {
@@ -124,11 +128,39 @@ export default {
       btnStyle:
         "background:linear-gradient(90deg,#0DC6C6 0%,#13C2C2 100%);font-size:36rpx;border-radius:48rpx;width:60vw;height:80rpx;",
       deviceList: [],
-      statusOptions: ["完好", "破损", "丢失"],
-      waterMeterValue: '',
-      energyMeterValue: '',
+      statusOptions: [
+        {
+          label: "完好",
+          value: "0",
+        },
+        {
+          label: "破损",
+          value: "1",
+        },
+        {
+          label: "丢失",
+          value: "2",
+        },
+      ],
+      waterMeterValue: "",
+      energyMeterValue: "",
+      checkStatus: [
+        {
+          label: "完好",
+          value: "0",
+        },
+        {
+          label: "破损",
+          value: "1",
+        },
+        {
+          label: "丢失",
+          value: "2",
+        },
+      ],
       remark: "",
       fileList: [],
+      img1: [],
       info: {},
       facilitiesCheckDesc: "",
     };
@@ -149,25 +181,80 @@ export default {
     onDeviceChange(idx, val) {
       this.deviceList[idx].status = val;
     },
-    afterRead(event) {
-      let files = Array.isArray(event.file) ? event.file : [event.file];
-      this.fileList = this.fileList.concat(files);
+    beforeRead(event) {
+      console.log("event", event);
+    },
+
+    // 选择文件后上传
+    async afterRead(event) {
+      let lists = [].concat(event.file);
+      let fileListLen = this[`fileList${event.name}`].length;
+      lists.map((item) => {
+        this[`fileList${event.name}`].push({
+          ...item,
+          status: "uploading",
+          message: "上传中",
+        });
+      });
+      for (let i = 0; i < lists.length; i++) {
+        const result = await uploadImage(lists[i].url);
+        let item = this[`fileList${event.name}`][fileListLen];
+
+        this[`fileList${event.name}`].splice(
+          fileListLen,
+          1,
+          Object.assign(item, {
+            status: "success",
+            message: "",
+            url: result.url,
+          })
+        );
+        fileListLen++;
+      }
+      var arry = [];
+      this.fileList.filter((v, i) => {
+        arry.push(v.url);
+      });
+      this.img1 = arry;
     },
+    // 删除文件
     deletePic(event) {
-      this.fileList.splice(event.index, 1);
+      this[`fileList${event.name}`].splice(event.index, 1);
+      var arry = [];
+      this.fileList.filter((v, i) => {
+        arry.push(v.url);
+      });
+      this.img1 = arry;
     },
-    onSubmit() {
-      let data = {
-        checkOutRecId: this.info.checkOutRecId,
-        houseId: this.info.houseId,
-        roomId: this.info.roomId,
-        graduateId: this.info.graduateId,
-        graduateName: this.info.graduateName,
-        startDate: this.info.startDate,
-        checkOutDate: this.info.checkOutDate,
-        waterMeterValue: this.waterMeterValue,
+    // 暂存提交
+    handleTempSave(formData) {
+      tempSaveCheckOut(formData).then((res) => {
+        if (res.code === 200) {
+          uni.showToast({ title: res.msg, icon: "success" });
+          uni.navigateTo({
+            url: `/pagesA/checkout/list/list`,
+          });
+        } else {
+          uni.showToast({ title: res.msg, icon: "warning" });
         }
-
+      });
+    },
+    onSubmit() {
+      const facilitiesCheckResults = this.deviceList.map((item, index) => ({
+        facilityId: item.id,
+        checkResult: this.checkStatus[index],
+      }));
+      console.log(facilitiesCheckResults, "facilitiesCheckResults");
+      const params = {
+        idCard: this.info.idCard,
+        checkOutType: 0, //正常退房
+        facilitiesCheckDesc: this.facilitiesCheckDesc,
+        facilitiesCheckImages: this.fileList,
+        facilitiesCheckResults: facilitiesCheckResults,
+        waterMeterValue: this.waterMeterValue || "",
+        energyMeterValue: this.energyMeterValue || "",
+      };
+      this.handleTempSave(params);
       uni.showToast({ title: "提交成功", icon: "success" });
     },
   },

pagesA/checkout/list/list.vue

@@ -6,10 +6,16 @@
       :refreshing="refreshing"
       :finished="finished"
       :finished-text="'没有更多了'"
+      v-if="list && list.length > 0"
     >
       <u-list-item v-for="item in list" :key="item.chooseRoomRecId">
         <view class="checkout-card" @click="goDetail(item)">
-          <image :src="item.img" class="room-img" mode="aspectFill"></image>
+          <image
+            v-if="item.houseTypeImages && item.houseTypeImages.length > 0"
+            :src="item.houseTypeImages[0].url || ''"
+            class="room-img"
+            mode="aspectFill"
+          ></image>
           <view class="room-info">
             <view class="room-title">{{ item.roomNamePath }}</view>
             <view class="room-user">
@@ -18,12 +24,13 @@
               <text class="phone">{{ item.telephone }}</text>
             </view>
             <view class="room-date"
-              >{{ item.startDate }}至{{ item.checkOutDate }}</view
+              >{{ item.checkInDate }}至{{ item.checkOutDate }}</view
             >
           </view>
         </view>
       </u-list-item>
     </u-list>
+    <view v-else class="no-data"> 暂无数据~ </view>
   </view>
 </template>
 
@@ -33,49 +40,81 @@ export default {
   data() {
     return {
       list: [],
-      page: 1,
+      pageNum: 1,
       pageSize: 10,
       refreshing: false,
       finished: false,
+      loading: false,
     };
   },
   onLoad() {
     this.getList();
   },
   methods: {
-    async getList() {
+    async getList(isLoadMore = false) {
+      if (this.loading) return; // 防止重复请求
+
+      this.loading = true;
+
+      try {
         const res = await listCheckoutAlert({
-        pageNum: 1,
-        pageSize: 10,
+          pageNum: this.pageNum,
+          pageSize: this.pageSize,
         });
-      this.list = res.rows;
-      console.log(res, "res");
 
-      // if (res.code === 200) {
-      //   this.list = this.page === 1 ? res.data : [...this.list, ...res.data];
-      //   this.finished = res.data.length < this.pageSize;
-      //   this.refreshing = false;
-      // }
+        console.log("列表数据:", res);
+
+        if (res.code === 200) {
+          const newList = res.rows || [];
+
+          if (isLoadMore) {
+            // 上拉加载更多：追加数据
+            this.list = [...this.list, ...newList];
+          } else {
+            // 下拉刷新或首次加载：替换数据
+            this.list = newList;
+          }
+
+          // 判断是否还有更多数据
+          this.finished = newList.length < this.pageSize;
+
+          // 如果还有数据，页码+1，为下次加载做准备
+          if (newList.length > 0) {
+            this.pageNum++;
+          }
+        } else {
+          uni.showToast({ title: res.msg || "获取数据失败", icon: "none" });
+        }
+      } catch (error) {
+        console.error("获取列表失败:", error);
+        uni.showToast({ title: "网络异常", icon: "none" });
+      } finally {
+        this.loading = false;
+        this.refreshing = false; // 结束刷新状态
+      }
     },
 
     // 下拉刷新
-    onRefresh() {
-      this.page = 1;
-      this.finished = false;
-      this.getList();
+    async onRefresh() {
+      this.refreshing = true;
+      this.pageNum = 1; // 重置页码
+      this.finished = false; // 重置完成状态
+      await this.getList(false); // 不是加载更多
     },
-    // 上拉加载
-    loadMore() {
-      if (this.finished) return;
-      this.page++;
-      this.getList();
+    // 上拉加载更多
+    async loadMore() {
+      if (this.finished || this.loading) return; // 已完成或正在加载则返回
+      await this.getList(true); // 是加载更多
     },
+
     goDetail(item) {
       uni.setStorageSync("checkoutDetail", {
+        idCard: item.idCard,
         roomNamePath: item.roomNamePath, // 房间
         graduateName: item.graduateName, // 居住人
         gender: item.gender, // 性别
         telephone: item.telephone, // 联系电话
+        checkInDate: item.checkInDate,
         checkOutDate: item.checkOutDate, // 居住日期
       });
       uni.navigateTo({

pagesA/force/index/index.vue

@@ -57,8 +57,7 @@
         <view class="desc-card">
           <view class="label-des">说明</view>
           <u-textarea
-            v-model="value"
-            :formatter="formatter"
+            v-model="descRemark"
             ref="textarea"
             placeholder="请输入内容（不超过500字）"
             maxlength="500"
@@ -73,9 +72,9 @@
             @delete="deletePic"
             multiple
             :maxCount="10"
-            accept="image,video"
             uploadIconColor="#12c3c3"
             uploadText="点击上传"
+            previewImage="true"
           >
           </u-upload>
         </view>
@@ -101,6 +100,7 @@
 </template>
 
 <script>
+import { uploadImage } from "../../../pages/api";
 export default {
   data() {
     return {
@@ -116,7 +116,9 @@ export default {
         imageUrl: "",
         pickerValue: "",
       },
+      descRemark: "",
       fileList: [],
+      img1: [],
       showDate: false,
       minDate: "2000-01-01",
       maxDate: "2100-12-31",
@@ -125,20 +127,58 @@ export default {
     };
   },
   methods: {
-    afterRead(event) {
-      // 这里只做本地预览，实际开发中应上传到服务器
-      const file = event.file;
-      this.fileList = [file];
-      this.form.imageUrl = file.url || file.path;
+    // 上传前校验
+    beforeRead(event) {
+      // 可以在这里做文件大小、类型校验
+      const { file } = event;
+      if (file.size > 10 * 1024 * 1024) {
+        // 10MB
+        uni.showToast({ title: "文件过大", icon: "none" });
+        return false;
+      }
+      return true;
     },
-    onDateConfirm(e) {
-      // e.value 是时间戳，格式化为 YYYY-MM-DD
-      const date = new Date(e.value);
-      const y = date.getFullYear();
-      const m = (date.getMonth() + 1).toString().padStart(2, "0");
-      const d = date.getDate().toString().padStart(2, "0");
-      this.form.leaveDate = `${y}-${m}-${d}`;
-      this.showDate = false;
+
+    // 选择文件后上传
+    async afterRead(event) {
+      let lists = [].concat(event.file);
+      let fileListLen = this[`fileList${event.name}`].length;
+      lists.map((item) => {
+        this[`fileList${event.name}`].push({
+          ...item,
+          status: "uploading",
+          message: "上传中",
+        });
+      });
+      for (let i = 0; i < lists.length; i++) {
+        const result = await uploadImage(lists[i].url);
+        let item = this[`fileList${event.name}`][fileListLen];
+
+        this[`fileList${event.name}`].splice(
+          fileListLen,
+          1,
+          Object.assign(item, {
+            status: "success",
+            message: "",
+            url: result.url,
+          })
+        );
+        fileListLen++;
+      }
+      var arry = [];
+      this.fileList.filter((v, i) => {
+        arry.push(v.url);
+      });
+      this.img1 = arry;
+    },
+    // 删除文件
+    deletePic(event) {
+      this[`fileList${event.name}`].splice(event.index, 1);
+      var arry = [];
+      this.fileList.filter((v, i) => {
+        arry.push(v.url);
+      });
+      this.img1 = arry;
     },
     submit() {
       this.$refs.uForm.validate((valid) => {

utils/request.js

@@ -37,3 +37,40 @@ export default function request(options = {}) {
     });
   });
 }
+export function uploadFile(filePath, options = {}) {
+  const token = uni.getStorageSync("token") || "";
+console.log(filePath,'filePath');
+
+  return new Promise((resolve, reject) => {
+    uni.uploadFile({
+      url: baseUrl + "/common/upload",
+      filePath: filePath,
+      name: "file", // 后端接收的参数名
+      header: {
+        Authorization: token ? `Bearer ${token}` : "",
+        ...options.header,
+      },
+      formData: options.formData || {}, // 额外的表单数据
+      success: (res) => {
+        console.log('res::',res)
+        try {
+          const data = JSON.parse(res.data);
+          if (res.statusCode === 200) {
+            console.log('data::',data)
+            resolve(data);
+          } else {
+            uni.showToast({ title: data.msg || "上传失败", icon: "none" });
+            reject(data);
+          }
+        } catch (e) {
+          uni.showToast({ title: "上传失败", icon: "none" });
+          reject(e);
+        }
+      },
+      fail: (err) => {
+        uni.showToast({ title: "网络异常", icon: "none" });
+        reject(err);
+      },
+    });
+  });
+}