首页添加跟进提醒

common/locales/en.js

@@ -160,5 +160,17 @@ export default {
 	noresults:'No matching results',
 	keyword:"Please enter search keywords",
 	prompt:'Prompt',
-	restoremsg:'Confirm to restore the current customer data?'
+	restoremsg:'Confirm to restore the current customer data?',
+	onedayn:'Within 1 day',
+	threedayn:'Within 3 day',
+	sevendayn:'Within 7 day',
+	follow:'follow up',
+	timeout:'Timeout',
+	day:'day',
+	hour:'hour',
+	minute:'minute',
+	second:'second',
+	nextgjtime:'Next follow up time',
+	Remindergj:'Follow up reminder',
+	callPhonemsg:'Dial the wrong number！'
 }

common/locales/zh.js

@@ -159,5 +159,17 @@ export default {
 	noresults:'无匹配结果',
 	keyword:"请输入搜索关键词",
 	prompt:'提示',
-	restoremsg:'确认要恢复当前客户数据?'
+	restoremsg:'确认要恢复当前客户数据?',
+	onedayn:'1天内',
+	threedayn:'3天内',
+	sevendayn:'7天内',
+	follow:'跟进',
+	timeout:'已超时',
+	day:'天',
+	hour:'时',
+	minute:'分',
+	second:'秒',
+	nextgjtime:'下次跟进时间',
+	Remindergj:'跟进提醒',
+	callPhonemsg:'拨打号码错误！'
 }

pages/index/customer.vue

@@ -222,7 +222,7 @@
 				var phoneNumber= item.phone
 			    if (!phoneNumber) {
 			        uni.showToast({
-			          title: '请输入电话号码',
+			          title:  this.$t('callPhonemsg'),
 			          icon: 'none',
 			        });
 			        return;

pages/index/index.vue

@@ -1,5 +1,7 @@
 <template>
 	<view class="content">
+		<z-paging  ref="paging" v-model="datalist" @query="queryList"  empty-view-text='暂无数据!'>	
+			<template #top>
 				<view class="contop">
 					<view class="changeyy" @click="showlang = true">
 						<image src="/static/image/change.png" mode=""></image>{{$t('home.langbtn')}}
@@ -10,7 +12,6 @@
 					<view class="num">
 						{{statisticsdata.day}}<text>{{$t('home.day')}}</text>
 					</view>
-		</view>
 					<view class="data-briefing">
 						<view class="top">
 							<text>{{$t('home.databf')}}</text>
@@ -50,19 +51,53 @@
 							</u-grid>
 						</view>
 					</view>
+				</view>
+				<view ></view>
+				<view class="gjtimetop">
+					<view class="title">{{$t('Remindergj')}}</view>
+					<view class="selecttime" @click="showgjtime = true">
+						<view class="">{{secelttime}}</view>
+						<u-icon name="arrow-down" color="#666666" size="16"></u-icon>
+					</view>
+				</view>
+			</template>
+			<view class="gjtime">
+				<view class="contents"  v-for="(item, index) in datalist" :key="index">
+					<view class=""  @click="godetile(item)">
+						<view class="cont">
+							<view class="title">
+								<view class=""><text class="name">{{item.contacts}}</text></view>
+								<countdown :total-seconds="item.follow_remaining" :show-days="true"  @end="onCountdownEnd" />
+							</view>
+							<view class=""><text class="phone">{{item.phone}}</text></view>
+							<view class="">{{$t('nextgjtime')}}：<text>{{item.follow_next}}</text></view>
+						</view>
+					</view>
+					<view class="desc1">
+						<view class=""  @click="callPhone(item)"><image src="/static/image/customer/phone.png" mode=""></image> {{$t('call')}}</view>
+						<view class=""  @click="editClick(item)"><image src="/static/image/customer/edit.png" mode=""></image> {{$t('follow')}}</view>
+					</view>
+				</view>
+				
+			</view>
+		</z-paging>
 		<u-datetime-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" :show="show" @close="close('show')"  v-model="value1"
 			@confirm="confirm" @cancel="cancel" mode="year-month"></u-datetime-picker>
 		<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" @close="close('showlang')" :show="showlang" :columns="columns"
 			@cancel="cancellang" @confirm="confirmlang" :title="$t('home.langbtn')" keyName="label"></u-picker>
+		<u-picker closeOnClickOverlay :cancel-text="$t('cancel')" :confirm-text="$t('confirm')" @close="close('showgjtime')" :show="showgjtime" :columns="columnstime"
+			@cancel="close('showgjtime')" @confirm="confirmgj"  keyName="label"></u-picker>
 	</view>
 </template>
 
 <script>
+	import Countdown from '@/components/Countdown/Countdown.vue';
 	import {
 		request,
 		showToast
 	} from '@/api/apiT.js'
 	export default {
+		components: { Countdown },
 		data() {
 			return {
 				statisticsdata:{},
@@ -71,11 +106,14 @@
 				value0: 0,
 				show: false,
 				showlang: false,
+				showgjtime: false,
+				secelttime:this.$t('all'),
 				value1: Number(new Date()),
 				timevalue: this.result(Number(new Date())),
 				time: this.result(Number(new Date())),
 				datalist: [],
 				follow:'',
+				filter:'',//跟进日期筛选
 				columns: [
 					[{
 						label: this.$t('zh'),
@@ -85,13 +123,27 @@
 						id: 'en'
 					}]
 				],
-				
+				columnstime:[
+					[{
+						label: this.$t('all'),
+						id: ''
+					},{
+						label: this.$t('onedayn'),
+						id: '0'
+					}, {
+						label: this.$t('threedayn'),
+						id: '1'
+					}, {
+						label: this.$t('sevendayn'),
+						id: '2'
+					}]
+				]
 			}
 		},
 		onLoad() {
 			uni.removeStorageSync('location')
 			// this.getcustomerlist()
-			
+			// this.queryList(1,10)
 		},
 		onShow() {
 			uni.setTabBarItem({
@@ -136,6 +188,7 @@
 			},
 			//语言切换事件
 			confirmlang(e) {
+				var that = this
 				uni.setLocale(e.value[0].id)
 				this.$i18n.locale = e.value[0].id
 				// uni.setStorageSync('i18locale', e.value[0].id);
@@ -149,6 +202,27 @@
 						id: 'en'
 					}]
 				];
+				this.columnstime =[
+					[{
+						label: this.$t('all'),
+						id: '0'
+					},{
+						label: this.$t('onedayn'),
+						id: '1'
+					}, {
+						label: this.$t('threedayn'),
+						id: '3'
+					}, {
+						label: this.$t('sevendayn'),
+						id: '7'
+					}]
+				];
+				this.columnstime[0].forEach((item,index) => {
+					if(item.id == that.filter){
+						console.log(item.label)
+						that.secelttime  = item.label
+					}
+				})
 				uni.setTabBarItem({
 					index: 0,
 					text: this.$t('tabbar.home')
@@ -197,6 +271,64 @@
 				this.time = timeFormat(time, 'yyyy-mm')
 				return timeFormat(time, 'yyyy-mm')
 			},
+			//跟进日期选择
+			confirmgj(e){
+				this.showgjtime = false
+				this.secelttime=e.value[0].label
+				this.filter = e.value[0].id 
+				this.datalist=[]
+				this.queryList(1, 10)
+			},
+			onCountdownEnd(){},
+			//客户列表数据
+			queryList(pageNo, pageSize) {
+				var that = this;
+				request({
+					url:'customer/waitFollow',
+					method:'get',
+					data: {
+						page:pageNo,
+						per_page:10,
+						filter:this.filter
+					}
+				}).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();
+				})
+			},
+			// 拨打电话
+			callPhone(item) {
+				var phoneNumber= item.phone
+			    if (!phoneNumber) {
+			        uni.showToast({
+			          title: this.$t('callPhonemsg'),
+			          icon: 'none',
+			        });
+			        return;
+			    }
+			
+			    uni.makePhoneCall({
+			        phoneNumber: phoneNumber,
+			        success: () => {
+			          console.log('拨打电话成功');
+			        },
+			        fail: (err) => {
+			          console.log('拨打电话失败', err);
+			        },
+			    });
+			},
+			editClick(item){
+				uni.navigateTo({
+					url: '/pages/customer/followup?id='+item.id
+				});
+			},
 		}
 	}
 </script>
@@ -215,7 +347,7 @@
 	}
 
 	.changeyy {
-		padding: 10px 15px;
+		padding: 20rpx 30rpx;
 		border-radius: 50px;
 		background-color: rgba(255, 255, 255, 0.2);
 		margin-bottom: 50rpx;
@@ -238,7 +370,10 @@
 			background-image: url("/static/image/topbg.png");
 			background-size: 100%;
 			background-repeat: no-repeat;
-			padding: 88rpx 30rpx 240rpx;
+			/* #ifdef APP-PLUS */
+				padding: 80rpx 30rpx 0px;
+			/* #endif */
+			padding: 20rpx 30rpx 0px;
 			color: #FFFFFF;
 
 			.title {
@@ -265,7 +400,7 @@
 			margin: 15px;
 			padding: 15px;
 			border-radius: 10px;
-			margin-top: -21%;
+			margin-top:80rpx;
 
 			.top {
 				display: flex;
@@ -308,15 +443,75 @@
 
 
 		}
-
-		.userlist {
-			background: linear-gradient(to bottom, #E6EDFF, #ffffff);
-			background-size: 100%;
-			background-repeat: no-repeat;
-
-			.list {
-				padding: 15px;
 	}
+	.gjtimetop{
+		margin:5px 15px;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		.title{
+			color: #222222;
+			font-size: 32rpx;
+			font-weight: bold;
+		}
+		.selecttime{
+			display: flex;
+			align-items: center;
+			view{
+				margin-right: 5px;
+			}
+			// color: #666666;
+		}
+	}
+	.gjtime{
+		padding: 15px;
+		
+	}
+	.contents{
+		background-color: #FFFFFF;
+		border-radius: 10px;
+		margin: 15px 0px;
+		.cont{
+			padding:15px;
+			font-size: 24rpx;
+			.title{
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				color: #222222;
+				image{
+					width: 18px;
+					height: 18px;
+					// vertical-align: sub;
+					margin-right: 5px;
+				}
+			}
+			.name{
+				font-size: 32rpx;
+				font-weight: bold;
+				margin-right: 10px;
+			}
+			.phone{
+				font-size: 28rpx;
+			}
+			.ststus{
+				color: #666666;
+			}
+		}
+	}
+	.desc1{
+		padding: 0px 15px 10px;
+		color: #3471FF;
+		display: flex;
+		justify-content: right;
+		view{
+			margin-left:15px;
+		}
+		image{
+			width: 14px;
+			height: 14px;
+			// vertical-align: sub;
+			margin-right: 5px;
 		}
 	}
 </style>