工单

pages/sys/workbench/earlyWarning/earlyWarning.vue

@@ -1,10 +1,12 @@
 <template>
 	<view class="warn-container">
+		<!-- 顶部导航 -->
 		<view class="warn-navbar">
 			<image src="/static/ic_back.png" class="warn-back" @click="goBack" />
 			<text class="warn-title">预警处理</text>
 			<text class="warn-right-txt" @click="goStatistics">预警统计</text>
 		</view>
+
 		<!-- tab栏 -->
 		<view class="warn-tabs">
 			<view v-for="(tab, idx) in tabs" :key="idx" :class="['warn-tab', { active: idx === activeTab }]"
@@ -15,13 +17,13 @@
 		</view>
 
 		<!-- 列表区 -->
-		<scroll-view scroll-y class="warn-list">
+		<scroll-view class="warn-list" scroll-y refresher-enabled refresher-background="#f7f7f7"
+			:refresher-triggered="refresherTriggered" @refresherrefresh="onRefresh" @scrolltolower="loadMore"
+			:lower-threshold="50">
 			<view v-for="(item, idx) in list" :key="idx" class="warn-card" @click="goDetail2(item)">
 				<view class="warn-row">
 					<view class="warn-no">{{item.smallTypeName}}</view>
-					<view class="warn-status">
-						{{item.levelName}}
-					</view>
+					<view class="warn-status">{{item.levelName}}</view>
 				</view>
 				<image class="warn-line-image" src="/static/ic_my_repair_03.png" />
 				<view class="warn-info">预警内容：{{ item.description }}</view>
@@ -32,6 +34,15 @@
 					<view class="warn-eval-btn">去处理</view>
 				</view>
 			</view>
+
+			<!-- 底部加载提示 -->
+			<view v-if="loading" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
+				加载中...
+			</view>
+			<view v-if="noMore[activeTab]" style="text-align:center;color:#999;font-size:26rpx;padding:20rpx;">
+				没有更多数据了
+			</view>
+
 		</scroll-view>
 	</view>
 </template>
@@ -42,56 +53,75 @@
 			return {
 				tabs: ["待处理", "全部"],
 				activeTab: 0,
+
 				tabData: [
 					[],
 					[]
-				],
-				tabLoaded: [false, false],
+				], // 每个 tab 的数据
+				pageNum: [1, 1], // 每个 tab 当前页码
+				pageSize: 10,
+				noMore: [false, false], // 每个 tab 是否没有更多数据
+				tabLoaded: [false, false], // tab 是否加载过
 				loading: false,
-				lastScrollTop: 0,
-
+				refresherTriggered: false
 			};
 		},
 		computed: {
 			list() {
 				return this.tabData[this.activeTab];
-			},
-		},
-		onShow() {
-			uni.$once('refreshData',s=> {
-				this.loadTabData(this.activeTab);
-			});
+			}
 		},
 		created() {
-			this.loadTabData(this.activeTab);
+			this.onRefresh()
 		},
 		methods: {
 			goBack() {
 				uni.navigateBack();
 			},
-
+			// 切换 tab
 			async changeTab(idx) {
 				this.activeTab = idx;
 				if (!this.tabLoaded[idx]) {
-					await this.loadTabData(idx);
+					this.onRefresh()
 				}
 			},
+			// 下拉刷新
+			async onRefresh() {
+				this.refresherTriggered = true;
+				this.pageNum[this.activeTab] = 1;
+				this.noMore[this.activeTab] = false;
+				this.tabData[this.activeTab] = [];
+				await this.loadTabData(this.activeTab);
+				this.refresherTriggered = false;
+			},
+			// 滚动加载更多
+			async loadMore() {
+				if (this.loading || this.noMore[this.activeTab]) return;
+				this.pageNum[this.activeTab]++;
+				await this.loadTabData(this.activeTab);
+			},
+			// 请求数据
 			async loadTabData(idx) {
 				this.loading = true;
-				let params = {};
-				if (idx == 0) {
-					params = {
-						'states': [20, 30, 31, 32]
-					}
+				let params = {
+					pageNum: this.pageNum[idx],
+					pageSize: this.pageSize
+				};
+				// 待处理
+				if (idx === 0) {
+					params.states = [20, 30, 31, 32];
 				}
 				let res = await this.$u.api.getWarns(params);
 				if (res.code == "200") {
-					this.$set(this.tabData, idx, res.rows);
+					let rows = res.rows || [];
+					if (rows.length < this.pageSize) {
+						this.noMore[idx] = true;
+					}
+					this.$set(this.tabData, idx, [...this.tabData[idx], ...rows]);
 				}
-				this.$set(this.tabLoaded, idx, true);
+				this.tabLoaded[idx] = true;
 				this.loading = false;
 			},
-
 			goDetail(item) {
 				const itemStr = encodeURIComponent(JSON.stringify(item));
 				uni.navigateTo({
@@ -101,7 +131,7 @@
 			goDetail2(item) {
 				const itemStr = encodeURIComponent(JSON.stringify(item));
 				uni.navigateTo({
-					url: "/pages/sys/workbench/earlyWarning/warnDetail?item=" + itemStr+"&pageType=detail",
+					url: "/pages/sys/workbench/earlyWarning/warnDetail?item=" + itemStr + "&pageType=detail",
 				});
 			},
 			goStatistics() {
@@ -109,7 +139,7 @@
 					url: "/pages/sys/workbench/earlyWarning/warnStatistics"
 				});
 			}
-		},
+		}
 	};
 </script>