对接部分接口

pages/index/index.vue

@@ -1,5 +1,6 @@
 <template>
 	<view class="content">
+		<z-paging  ref="paging" v-model="datalist" @query="queryList" style="background: #F3F3F3;" empty-view-text='暂无数据!'>
 		<view class="contop">
 			<view class="changeyy"   @click="showlang = true" >
 				<image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}}
@@ -21,11 +22,7 @@
 				</view>
 			</view>
 			<view class="cont">
-				<u-grid :border="false" col="4">
-				    <u-grid-item>
-				        <text class="grid-num">20</text>
-				        <text class="grid-text">{{$t('home.addxs')}}</text>
-				    </u-grid-item>
+				<u-grid :border="false">
 					<u-grid-item>
 					    <text class="grid-num">20</text>
 					    <text class="grid-text">{{$t('home.addkh')}}</text>
@@ -41,35 +38,36 @@
 				</u-grid>
 			</view>
 		</view>
+		
 		<view class="userlist">
-			<u-sticky offset-top="-44">
-				<u-tabs :list="list1"  :scrollable="false"></u-tabs>
+			<u-sticky offset-top="-44" >
+				<view class="tabsbg">
+					<u-tabs :list="list1"  :scrollable="false"></u-tabs>
+				</view>
 			</u-sticky>
-			 <view class="list">
-				 <userlist :list="datalist" @click="godetile">
-					<template v-slot:footer>
-					    <view class="desc">客户想要性价比高，偏爱宝马</view>
-					</template>
-					<template v-slot:footertab>
-					    <view></view>
-					</template>
-				 </userlist>
-			 </view>
+				<view class="list">
+					 <userlist :list="datalist" @click="godetile">
+					 </userlist>
+				</view>
+			
+			 
 		</view>
+		</z-paging>
 		<u-datetime-picker :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" v-model="value1" @confirm="confirm" @cancel="cancel"  mode="year-month"></u-datetime-picker>
 		<u-picker  :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="showlang" :columns="columns" @cancel="cancellang" @confirm="confirmlang" :title="$t('home.langbtn')" keyName="label"></u-picker>
 	</view>
 </template>
 
 <script>
+	import { request,showToast } from '@/api/apiT.js'
 	import userlist from '@/components/userlist/index.vue';
-	// import { request,showToast } from '@/api/apiT.js'
 	export default {
 		components: {
 		    userlist
 		},
 		data() {
 			return {
+				headerBgColor: 'transparent', // 初始背景色为透明
 				home: this.$t('tabbar.home'),
 				value0: 0,
 				show: false,
@@ -77,12 +75,7 @@
 				value1: Number(new Date()),
 				timevalue:this.result(Number(new Date())),
 				time:this.result(Number(new Date())),
-				datalist:[
-					{id:1},
-					{id:2},
-					{id:3},
-					{id:4}
-				],
+				datalist:[],
 				columns:[
 					[{
 						label: '中文',
@@ -109,16 +102,22 @@
 			}
 		},
 		onLoad() {
+			// this.getcustomerlist()
 		},
 		methods: {
-			confirm(e) {
-				// console.log('confirm', e);
-				this.show = false
+			// 处理滚动事件
+			onPageScroll(event) {
+			  const scrollTop = event.scrollTop || 0;
+			  if (scrollTop > 310) { // 吸顶条件
+				this.headerBgColor = '#E6EDFF'; // 吸顶时设置背景色
+			  } else {
+				this.headerBgColor = 'transparent'; // 取消吸顶时恢复背景色
+			  }
 			},
 			cancellang() {
-				// console.log('cancel');
 				this.showlang  = false
 			},
+			//语言切换事件
 			confirmlang(e) {
 				this.$i18n.locale = e.value[0].id
 				this.showlang = false
@@ -146,6 +145,10 @@
 					text: this.$t('tabbar.mine')
 				})
 			},
+			//日期选择组件
+			confirm(e) {
+				this.show = false
+			},
 			cancel() {
 				this.show = false
 			},
@@ -159,6 +162,28 @@
 				this.time=timeFormat(time, 'yyyy-mm')
 				return timeFormat(time, 'yyyy-mm')
 			},
+			//客户列表数据
+			queryList(pageNo, pageSize) {
+				var that = this;
+				request({
+					url:'customer/list',
+					method:'get',
+					data: {
+						page:pageNo,
+						per_page:10
+					}
+				}).then(res => {
+					console.log(res.data)
+					if(res.data.code ==0){
+						var datas = res.data.data.list;
+						this.$refs.paging.complete(datas);
+					}else{
+						// this.$refs.paging.complete(null);
+						// that.listlength=0
+					} 
+					uni.stopPullDownRefresh();
+				})
+			},
 			godetile(item){
 				console.log(item)
 				uni.navigateTo({
@@ -174,6 +199,10 @@
 		width: 18px;
 		height: 18px;
 	}
+	.tabsbg{
+		border-radius: 16px 16px 0px 0px;
+		background:linear-gradient(to bottom, #E6EDFF, #eaeffa);
+	}
 	.changeyy{
 		padding: 10px 15px;
 		border-radius: 50px;
@@ -250,7 +279,7 @@
 				}
 				.grid-text{
 					color: #222222;
-					font-size: 20rpx;
+					font-size: 24rpx;
 				}
 			}