Browse Source

渝快办分页问题

刘拾玖 4 months ago
parent
commit
3e574973a5
2 changed files with 40 additions and 11 deletions
  1. 15 3
      pages/feedback/FeedbackList.vue
  2. 25 8
      pages/feedback/index.vue

+ 15 - 3
pages/feedback/FeedbackList.vue

@@ -30,21 +30,25 @@
 	import { defineProps,ref } from "vue";
 	import { filterApplicationStatus,filterApplicationBgColor } from '@/lib/util'
 
-	const emit = defineEmits(['click']) // 定义 success 事件,用于操作成功后的回调
+	const emit = defineEmits(['click','nextPage']) // 定义 success 事件,用于操作成功后的回调
 	// 定义 props 类型
 	const props = defineProps({
 		listArray: {
 			type: Object,
 			default: () => {}
+		},
+		status: {
+			type: String,
+			default: "loading"
 		}
 	});
 	const pubListScrollRef = ref(null)
 	const loaded = ref(false)
 	const loadText = ref('数据加载中...')
-	const status = ref('loading')
 	
 	const onScrollTolower = ()=> {
 		console.log("下一页了?")
+		emit("nextPage")
 	}
 	const onClick = (item:any)=> {
 		emit("click",item)
@@ -56,7 +60,6 @@
 
 <style lang="scss">
 	.feedback-list-view {
-		overflow-y: auto;
 		background-color: #F6F7F8;
 		height: 100%;
 		.feedback-list {
@@ -120,5 +123,14 @@
 				}
 			}
 		}
+		::v-deep .scroll-view {
+			height: calc(100%);
+			background-color: transparent !important;
+		}
+		::v-deep .no-data {
+			margin-top: 0;
+			padding-top: 160rpx;
+		}
+		
 	}
 </style>

+ 25 - 8
pages/feedback/index.vue

@@ -8,17 +8,17 @@
 		</scroll-view>
 		<!-- 内容 -->
 		<swiper :current="navIndex" @change="tabChange" class="swiper_content">
-			<swiper-item class="swiper_item" style="width: 100%;height: 100%;">
-				<FeedbackList :listArray="listArray" @click="onClick" />
+			<swiper-item class="swiper_item">
+				<FeedbackList :status="status" :listArray="listArray" @click="onClick" @nextPage="onNextPage" />
 			</swiper-item>
-			<swiper-item class="swiper_item" style="width: 100%;height: 100%;">
-				<FeedbackList :listArray="listArray"  @click="onClick"  />
+			<swiper-item class="swiper_item">
+				<FeedbackList :listArray="listArray"  @click="onClick" @nextPage="onNextPage"  />
 			</swiper-item>
-			<swiper-item class="swiper_item" style="width: 100%;height: 100%;">
-				<FeedbackList :listArray="listArray"  @click="onClick"  />
+			<swiper-item class="swiper_item">
+				<FeedbackList :listArray="listArray"  @click="onClick" @nextPage="onNextPage"  />
 			</swiper-item>
-			<swiper-item class="swiper_item"  style="width: 100%;height: 100%;">
-				<FeedbackList :listArray="listArray"  @click="onClick"  />
+			<swiper-item class="swiper_item">
+				<FeedbackList :listArray="listArray"  @click="onClick" @nextPage="onNextPage"  />
 			</swiper-item>
 		</swiper>
 		<!-- 新增 -->
@@ -83,6 +83,9 @@
 					queryParams.value.fkzt = '3'
 					break;
 			}
+			queryParams.value.pageNo = 1
+			list.value = []
+			console.log("内容")
 			getList()
 		}
 	}
@@ -94,6 +97,7 @@
 	const listArray = ref([])
 	const list = ref() //处方列表
 	const total = ref(0)
+	const status = ref('loading')
 	
 	const getList = async () => {
 		try {
@@ -146,6 +150,19 @@
 	  listArray.value = formattedData;
 	};
 	
+	const onNextPage = ()=> {
+		if (!list.value || queryParams.value.pageNo > (total.value / queryParams.value.pageSize)) {
+			return false;
+		}
+		if (queryParams.value.pageNo < total.value / queryParams.value.pageSize) {
+			status.value = "loading";
+		} else {
+			status.value = "noMore"
+			return;
+		}
+		queryParams.value.pageNo++;
+		getList();
+	}
 	
 	const onClick = (e)=> {
 		link.goBJDetails(e.id)