合同记录增加分页

manifest.json

@@ -2,7 +2,7 @@
     "name" : "抖火",
     "appid" : "__UNI__C305C03",
     "description" : "纵有疾风起，人生不言弃",
-    "versionName" : "1.4.2",
+    "versionName" : "1.4.3",
     "versionCode" : 104,
     "transformPx" : false,
     /* 5+App特有相关 */

pages/user/signLog.vue

@@ -1,5 +1,16 @@
 <template>
 	<view class="content">
+		<block v-if="logs.length <= 0">
+			<view class="null-pages">
+				<u-empty
+					mode="history"
+					icon="http://cdn.uviewui.com/uview/empty/history.png"
+					text="暂无合同签约记录"
+				>
+				</u-empty>
+			</view>
+		</block>
+		<block v-else>
 			<view class="log-blcok" v-for="(item, index) in logs" :key="index" @click="onInfo(item.business_order_id)">
 				<view class="flex">
 					<label>订单编号：</label>
@@ -16,6 +27,10 @@
 					<view class="val">{{item.created_at}}</view>
 				</view>
 			</view>
+			<view class="pages-loding" v-if="isLoding">
+				<u-loadmore :status="status" loadingIcon="semicircle" />
+			</view>
+		</block>
 	</view>
 </template>
 
@@ -24,7 +39,10 @@
 	export default {
 		data() {
 			return {
-				logs: [],
+				status	: 'loading',
+				isLoding: false,
+				logs	: [],
+				page	: { current	: 0 }
 			};
 		},
 		created() {
@@ -37,10 +55,14 @@
 					mask : true
 				})
 				getSignLogs({
-					page: 1
+					page: this.page.current
 				}).then(res => {
-					this.logs = res.data
-					this.page = res.page
+					let { data, page }  = res;
+					let atArr		    = page.current == 1 ? [] : this.getLog
+					this.logs 			= atArr.concat(data)
+					this.page 			= page
+					this.status 		= !page.has_more ? 'nomore': 'loading'
+					this.isLoding		= !page.has_more
 					uni.hideLoading()
 				}).catch(err => {
 					uni.showToast({
@@ -55,6 +77,13 @@
 					params	: { id }
 				})
 			}
+		},
+		onReachBottom(){
+			this.isLoding = true
+			if(this.page.has_more){
+				this.page.current++
+				this.getLog()
+			}
 		}
 	}
 </script>
@@ -68,6 +97,7 @@
 		border-radius: $radius;
 		padding: $padding;
 		position: relative;
+		margin-bottom: 20rpx;
 		// .log-icon{ position: absolute; right: $margin; top: 50%; margin-top: -14rpx; }
 		.flex{
 			display: flex;
@@ -77,4 +107,10 @@
 			label{ color: gray; }
 		}
 	}
+	
+	// 分页加载
+	.pages-loding{ padding: 10rpx; }
+	
+	// 记录为空
+	.null-pages{ display: flex; align-items: center;  justify-content: space-around; height: 80vh;}
 </style>