巡检点上传图片修正

wuye-manager-uniapp/pageSubPack/instrument/replacement_record.vue

@@ -1,36 +1,41 @@
 <template>
-  <view class="page_container replacement_record_box flex flex-col">
-    <view class="nav flex items-center">
-      <view class="line"></view>
-      <text class="title">仪表换新记录</text>
-    </view>
-    <TabsComponents :tabslist="tabslist" @update="handleChangeTabs"></TabsComponents>
-    <view class="instrument_body flex-1 flex">
-      <scroll-view scroll-y lower-threshold="160" @scrolltolower="scrolltolower">
-        <view
-          class="instrument_items flex items-center flex-between"
-          v-for="(item, index) in infolist"
-          :key="index"
-        >
-          <view class="flex items-center">
-            <image src="/static/imgs/home.png" class="icon" mode=""></image>
-            <view class="instrument_info">
-              <view class="instrument_title">
-                <text>{{ item.title }}</text>
-              </view>
-              <view class="instrument_time">
-                <text>换新时间时间：{{ item.time }}</text>
+  <view class="page_padding">
+    <view class="replacement_record_box flex-1 flex flex-col">
+      <view class="nav flex items-center">
+        <view class="line"></view>
+        <text class="title">仪表换新记录</text>
+      </view>
+      <TabsComponents :tabslist="tabslist" @update="handleChangeTabs"></TabsComponents>
+      <view class="instrument_body flex-1 flex">
+        <scroll-view scroll-y lower-threshold="160" @scrolltolower="scrolltolower">
+          <view
+            class="instrument_items flex items-center flex-between"
+            v-for="(item, index) in infolist"
+            :key="index"
+          >
+            <view class="flex items-center">
+              <image lazy-load src="/static/imgs/home.png" class="icon" mode=""></image>
+              <view class="instrument_info">
+                <view class="instrument_title">
+                  <text>{{ item.title }}</text>
+                </view>
+                <view class="instrument_time">
+                  <text>换新时间时间：{{ item.time }}</text>
+                </view>
               </view>
             </view>
+            <view class="instrument_type">
+              <text v-if="item.type === 2">电表</text>
+              <text v-else>水表</text>
+            </view>
           </view>
-          <view class="instrument_type">
-            <text v-if="item.type === 2">电表</text>
-            <text v-else>水表</text>
-          </view>
-        </view>
-        <!-- 底部加载状态提示 -->
-        <uni-load-more :status="statusmore"></uni-load-more>
-      </scroll-view>
+          <!-- 底部加载状态提示 -->
+          <uni-load-more :status="statusmore"></uni-load-more>
+        </scroll-view>
+      </view>
+      <view class="action_btn" @tap="handleClick">
+        <text>新增</text>
+      </view>
     </view>
   </view>
 </template>
@@ -73,54 +78,74 @@ function handleChangeTabs(val: number) {
   getlist()
 }
 // ---------------------------------------------------------------------
+const infolist = ref([])
 const queryParmas = ref({
   pageNum: 1,
-  pageSize: 15
+  pageSize: 10
 })
-const infolist = ref([])
+const total = ref(21)
 function scrolltolower() {
-  if (hasMore.value) {
-    queryParmas.value.pageNum += 1
-    getlist()
+  // 必须加这两个判断！
+  if (isLoading.value || !hasMore.value) {
+    return
   }
+  queryParmas.value.pageNum += 1
+  getlist()
 }
-
 function getlist() {
-  uni.showLoading({
-    title: '加载中',
-    mask: true
-  })
   // 1. 如果正在加载或没有更多数据，直接返回
   if (isLoading.value || !hasMore.value) return
   // 2. 开启锁
   isLoading.value = true
-  const all = queryParmas.value.pageNum * queryParmas.value.pageSize
-  if (all > 50) {
-    isLoading.value = false
-    uni.hideLoading()
-    hasMore.value = false
-    return
-  }
-  const arr = Array.from({ length: all }).map((_, index) => {
+  uni.showLoading({
+    title: '加载中',
+    mask: true
+  })
+  const { pageNum, pageSize } = queryParmas.value
+
+  const startId = (pageNum - 1) * pageSize + 1
+  const arr = Array.from({ length: pageSize }).map((_, index) => {
+    const realId = startId + index // ✅ 修复 ID 错误
+
+    // ✅ 随机生成 0、1、2
+    const randomStatus = Math.floor(Math.random() * 2)
     return {
-      title: 'M2栋3单元18' + index + '室（M2-3-1801）',
+      title: 'M2栋3单元18' + realId + '室（M2-3-1801）',
       time: '2023-08-01 10:05:46',
-      type: 1 //1水表 2电表
+      type: randomStatus //1水表 2电表
     }
   })
-  hasMore.value = true
-  nextTick(() => {
-    infolist.value = [...infolist.value, ...arr]
-    isLoading.value = false
-    uni.hideLoading()
-  })
+
+  // 追加数据（正确方式）
+  infolist.value = [...infolist.value, ...arr]
+  // 判断是否还有更多
+  hasMore.value = infolist.value.length < total.value
+  isLoading.value = false
+  uni.hideLoading()
 }
 getlist()
+function resetList() {
+  infolist.value = []
+  queryParmas.value.pageNum = 1
+  hasMore.value = true
+  getlist()
+}
+
+function handleClick() {
+  uni.navigateTo({
+    url: '/pageSubPack/instrument/addreplacement'
+  })
+}
 </script>
 
 <style scoped lang="scss">
 .replacement_record_box {
   background: #f9f9f9;
+  padding: 20rpx 40rpx;
+  position: relative;
+  flex: 1;
+  overflow: hidden;
+  box-sizing: border-box;
   .nav {
     margin-bottom: 40rpx;
     font-weight: 550;
@@ -139,7 +164,6 @@ getlist()
     overflow: hidden;
     margin-top: 20rpx;
     box-sizing: border-box;
-    background-color: #4d5dfa;
     .instrument_items {
       box-sizing: border-box;
       background: #ffffff;
@@ -174,5 +198,18 @@ getlist()
       }
     }
   }
+
+  .action_btn {
+    width: 100%;
+    height: 80rpx;
+    background: #4d5dfa;
+    border-radius: 8rpx;
+    text-align: center;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #ffffff;
+    line-height: 80rpx;
+    margin-top: 20rpx;
+  }
 }
 </style>