fix: 用户、志愿者订单列表增加分页显示

pages/classify.vue

@@ -15,7 +15,7 @@
       >
       </up-tabs>
       <view class="list">
-        <List :data="data" v-if="data && data.length > 0" @refresh="getList" ref="listRef"/>
+        <List :data="data" v-if="data && data.length > 0" @refresh="getList" ref="listRef" :total="pages.total"/>
         <view v-else>
           <NoneView value="您还没有相关订单" />
         </view>
@@ -104,33 +104,40 @@ const column = computed(() => {
   return userType === 1 ? user : admin
 })
 
-async function getList() {
+const pages = ref({
+	current: 1,
+	pageSize: 10,
+	total: 0,
+})
+async function getList(type) {
   try {
-    uni.showLoading({
-      title: '数据加载中...',
-    })
-
+  
+    console.log(data.value.length, pages.value.total);
+    
+    if(type ==='bottom'  ){
+      if(data.value.length < pages.value.total){
+        listRef.value && listRef.value.handleBottom(true);
+        pages.value.current++;
+      }else {
+        listRef.value && listRef.value.handleBottom(false)
+        return;
+      }
+    }else{
+      uni.showLoading({
+        title: '数据加载中...',
+      })
+    }
+  
     const listApi = userType === 1 ? userMainOrderList : getVolunteerOrderList
     const res = await listApi({
       orderStatus: tab.value,
+      pageNum: pages.value.current,
+			pageSize: pages.value.pageSize,
     })
-    data.value =res.rows ||  res.data
+    data.value =[...data.value,...res.rows];
+    pages.value.total = res.total;
 
-    // 判断 userType 来决定调用哪个接口
-    // let res
-    // if (userType === 1) {
-    //   // 如果 userType 是 1，调用 userMainOrderList 接口
-    //   // res = await getListData()
-    //    res = await userMainOrderList({
-    //     orderStatus:  tab.value
-    //   })
-    // } else if (userType === 2) {
-    //   // 如果 userType 是 2，调用 getVolunteerOrderList 接口
-    //   res = await getVolunteerOrderList({
-    //     orderStatus: tab.value,
-    //   })
-    // }
-    // data.value = res.data
+    type ==='bottom'&& listRef.value && listRef.value.handleBottom(false);
   } catch (error) {
     console.log('error', error)
     uni.showToast({
@@ -138,10 +145,10 @@ async function getList() {
       icon: 'error',
     })
   } finally {
-    if(listRef.value && listRef.value.handleRefreshing){
+    if(listRef.value && listRef.value.handleRefreshing && type ==='top'){
       listRef.value.handleRefreshing(false)
     }
-    uni.hideLoading()
+    type !=='bottom' && uni.hideLoading()
   }
 }
 
@@ -173,17 +180,19 @@ function btnClick(row, type) {
 provide('onClick', btnClick)
 
 function onChange(tabItem) {
-  tab.value = tabItem.value
+  tab.value = tabItem.value;
+  pages.value.current = 1;
+  data.value = [];
   getList()
 }
 
 onMounted(() => {
-  getList()
+  // getList()
 })
 
 onShow(() => {
   const params = getApp().globalData.switchTabParams || {}
-  tabKey.value = params.tabKey || 0
+  tabKey.value = params.tabKey || 1
   onChange(column.value[tabKey.value])
   // 使用后建议清除参数，避免重复读取
   getApp().globalData.switchTabParams = null

pages/common/orderList/index.vue

@@ -1,12 +1,16 @@
 <template>
     <scroll-view refresher-enabled :refresher-triggered="isRefreshing" @refresherrefresh="onCustomRefresh"
-        class="scroll-view-class" scroll-y>
+        class="scroll-view-class" @scrolltolower="scrolltolower" scroll-y>
         <view class="list-page">
             <view v-for="(item, index) in data" :key="index">
                     <ListItem :data="item" v-if="userType === 2"/>
                     <UserItem :data="item" v-else/>
                 </view>
-                <up-loadmore :line="true" status="nomore"></up-loadmore>
+                <!-- <up-loadmore :line="true" status="nomore"></up-loadmore> -->
+
+                <up-loadmore style="margin-top: 40rpx;" :status="loadmoreInfo.status"
+				:loadmoreText="loadmoreInfo.loadingText" :loadingText="loadmoreInfo.loadmoreText"
+				:nomoreText="loadmoreInfo.nomoreText" @loadmore="handleLoadmore" />
         </view>
     </scroll-view>
 </template>
@@ -31,23 +35,37 @@ const emit = defineEmits(['refresh']);
 const userType = uni.getStorageSync('userType') //读取本地存储
 const isRefreshing = ref(false)
 
+const isBottom = ref(false);
 
+const loadmoreInfo = ref({
+	status: 'loadmore',
+	loadingText: '努力加载中...',
+	loadmoreText: '点击加载更多~',
+	nomoreText: '已经到底啦～'
+})
 const scrolltolower = () => {
     console.log('底部');
-    // emit('refresh');
+    emit('refresh','bottom');
 };
 
 const onCustomRefresh = () => {
     console.log('下拉刷新');
     isRefreshing.value = true;
-    emit('refresh');
+    emit('refresh','top');
 };
-
+//上拉刷新
 const handleRefreshing = (status) => {
     isRefreshing.value = status;
 }
+
+//下拉刷新
+const handleBottom = (value) => {
+    isBottom.value = value;
+    loadmoreInfo.value.status = value?'loading':'nomore';
+}
 defineExpose({
-    handleRefreshing
+    handleRefreshing,
+    handleBottom
 });
 
 </script>

pages_mine/pages/income/index.vue

@@ -107,7 +107,7 @@ const init = async () => {
                 createTime: dayjs(datetime.value).format('YYYY-MM-DD')
             });
             console.log(1, res);
-            data.value = res.data;
+            res.data &&  (data.value = res.data);
         }
     } catch (error) {
         console.log('error', error);