chenrui 4 years ago
parent
commit
4cb9c697f4

+ 2 - 1
components/w-picker/w-picker.vue

@@ -290,6 +290,7 @@
 		  visibility: hidden;
 		  opacity: 0;
 		  transition: all 0.3s ease;
+		  z-index: 999999;
 		}
 		.mask.visible{
 			visibility: visible;
@@ -302,7 +303,7 @@
 		  width: 100%;
 		  transition: all 0.3s ease;
 		  transform: translateY(100%);
-		  z-index: 3000;
+		  z-index: 999999;
 		  background-color: #fff;
 		}
 		.w-picker-cnt.visible {

+ 15 - 1
pages.json

@@ -121,7 +121,21 @@
 		{
 			"path": "pages/myShopTour/myShopTour", //  我的巡店
 			"style": {
-				"navigationStyle": "custom" // 隐藏系统导航栏
+				"navigationBarTitleText": "我的巡店",
+				"app-plus": {
+					"bounce": "none", //关闭窗口回弹效果
+					"titleNView": {
+						"buttons": [ //原生标题栏按钮配置,
+							{
+								"text": "\ue67c", //原生标题栏增加过滤按钮,点击事件可通过页面的 onNavigationBarButtonTap 函数进行监听
+								"fontSize": 16,
+								"color": "#eee",
+								"width": "25px",
+								"fontSrc": "/static/iconfont/iconfont.ttf"
+							}
+						]
+					}
+				}
 			}
 		},
 		{

+ 86 - 94
pages/myShopTour/myShopTour.vue

@@ -1,17 +1,5 @@
 <template>
 	<view class="myShopTour-wrap">
-		<!-- 自定义标题 -->
-		<u-navbar :is-back="false" :border-bottom="false" :background="background" id="navbar">
-			<view class="slot-wrap">
-				<view class="back-icon" @click="goBack">
-					<u-icon name="arrow-left" color="#fff" size="32"></u-icon>
-				</view>
-				<view class="left-icon">我的巡店</view>
-				<view class="right-icon">
-					<u-icon name="more-dot-fill" color="#fff" size="28" @click="openScreenFun"></u-icon>
-				</view>
-			</view>
-		</u-navbar>
 		<!-- 内容 -->
 		<view class="myShopTour-con">
 			<u-tabs-swiper ref="uTabs" :list="tabList" name="dispName" :current="current" @change="tabsChange" :is-scroll="false" swiperWidth="750"></u-tabs-swiper>
@@ -19,10 +7,11 @@
 				<swiper-item class="swiper-item" v-for="(tabs, index) in tabList" :key="index">
 					<scroll-view scroll-y class="scroll-con" @scrolltolower="onreachBottom">
 						<view class="record-con">
+							<!-- 筛选日期,近7天 -->
 							<view v-show="searchForm.creatTime.length != 0" class="alert-tips">
 								<text>{{searchForm.creatTime[0]}} ~ {{searchForm.creatTime[1]}}</text>
 							</view>
-							<view class="record-item" v-for="(item,index) in list" :key="index">
+							<view class="record-item" v-if="index==current" v-for="(item,sindex) in list" :key="item.id">
 								<view class="item-head">
 									<text class="item-c-tit">{{item.name}}</text>
 									<u-tag class="item-c-type" :text="item.status" type="primary" />
@@ -90,21 +79,28 @@
 			</view>
 		</u-popup>
 		<!-- 选择创建时间 -->
-		<mx-date-picker class="choose-date-wrap" :show="showPicker" :type="type" :value="searchForm.creatTime" :show-tips="true" :begin-text="'开始'" :end-text="'结束'" :show-seconds="true" @confirm="onSelected" @cancel="onSelected" />
+		<!-- <mx-date-picker class="choose-date-wrap" :show="showPicker" :type="type" :value="searchForm.creatTime" :show-tips="true" :begin-text="'开始'" :end-text="'结束'" :show-seconds="true" @confirm="onSelected" @cancel="onSelected" /> -->
+		<w-picker
+			:visible.sync="showPicker"
+			mode="range" 
+			startYear="2017" 
+			endYear="2030"
+			:value="searchForm.creatTime"
+			:current="false"
+			@confirm="onSelected($event,'range')"
+			@cancel="onSelected"
+			ref="range"></w-picker>
 	</view>
 </template>
 
 <script>
+	import wPicker from "@/components/w-picker/w-picker.vue"
 	import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"
 	import { queryMyTask } from '@/api/task.js'
 	export default {
-		components: { MxDatePicker },
+		components: { MxDatePicker, wPicker },
 		data() {
 			return {
-				background: {
-					// 渐变色
-					backgroundImage: 'linear-gradient(45deg, rgb(85, 170, 255), rgb(21, 102, 223))'
-				},
 				tabList: [  //  tab切换  类型
 					{ dispName: '全部', code:'' },
 					{ dispName: '待处理', code:'0' },
@@ -119,13 +115,7 @@
 				total: 0,  //  总条数
 				status: 'loading',  //  加载状态
 				noDataText: '暂无数据',  //  列表数据为空时提示文字
-				list: [  //  数据列表
-					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
-					{ name: '常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
-					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'invalid', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
-					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
-					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', completionTime: '2020-09-08 09:16', timeConsuming: '5小时18分钟', inspectionItems: 18, qualified: 14, unqualified: 2, notApplicable: 2 },
-				],
+				list: [],  //  数据列表
 				openScreen: false,  //  是否打开筛选
 				dateMode: 'range',  //  date单个日期  range日期范围
 				searchForm: {  //  查询条件
@@ -136,94 +126,116 @@
 				range: [],  //  筛选创建时间的默认值
 				type: 'range',  //  日期时间类型
 				storeName: '',  //  筛选的门店名称
+				typeId: '',  //  记录状态
+				action:'swiperChange', // 操作类型,上划分页,或左右滑动
 			}
 		},
 		onLoad() {
-			this.pageInit()
+			this.resetPage()
+			this.range = [ this.get7day(-6), this.get7day(0) ]
+			this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
+			uni.$on("updatePointTaskList",()=>{
+				this.resetPage()
+			})
+		},
+		onUnload() {
+			uni.$off("updatePointTaskList")
 		},
 		methods: {
-			//  返回
-			goBack() {
-				uni.navigateBack({
-					delta: 1
-				});
-			},
-			pageInit(){
-				this.range = [ this.get7day(-6), this.get7day(0) ]
-				this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
-				this.status = 'loading'
-				queryMyTask({
+			// 查询列表
+			pageInit(pageNo){
+				if (pageNo) {
+					this.pageNo = pageNo
+				}
+				let params = {
 					pageNo: this.pageNo,
 					pageSize: this.pageSize,
 					beginDate: this.searchForm.creatTime[0],
 					endDate: this.searchForm.creatTime[1],
-					storeName: this.searchForm.store
-				}).then(res => {
-					console.log(res)
+					storeName: this.searchForm.store,
+					status: this.typeId==''?'':this.typeId // 任务状态
+				}
+				this.status = 'loading'
+				queryMyTask(params).then(res => {
 					if(res.status == 200){
 						if(this.pageNo>1){
 							this.list = this.list.concat(res.data.list || [])
 						}else{
 							this.list = res.data.list || []
 						}
-						this.noDataText = '暂无数据'  //  有列表数据时不显示,因此只用默认设置为无数据时所需显示的'暂无数据'即可
 						this.total = res.data.count || 0
 					}else{
 						this.list = []
-						this.noDataText = res.message
 						this.total = 0
+						this.noDataText = res.message || '暂无数据'
 					}
 					this.status = 'loadmore'
+					
 				})
 			},
 			// tabs通知swiper切换
 			tabsChange(index) {
 				this.swiperCurrent = index
-				this.list = []
-				this.status = "loading"
 			},
-			swiperChange(event){
-				this.list = []
-				this.status = "loading"
+			swiperChange(e) {
+				this.action = 'swiperChange'
+				this.status = 'loading'
+				this.typeId = this.tabList[e.detail.current].code
 			},
 			// swiper-item左右移动,通知tabs的滑块跟随移动
 			transition(e) {
-				let dx = e.detail.dx;
-				this.$refs.uTabs.setDx(dx);
+				let dx = e.detail.dx
+				this.$refs.uTabs.setDx(dx)
 			},
 			// 由于swiper的内部机制问题,快速切换swiper不会触发dx的连续变化,需要在结束时重置状态
 			// swiper滑动结束,分别设置tabs和swiper的状态
 			animationfinish(e) {
 				let current = e.detail.current
-				if(current != this.current){
-					this.$refs.uTabs.setFinishCurrent(current)
-					this.swiperCurrent = current
-					this.current = current
-					this.pageInit()
+				let isCurtab = this.current == current
+				if(this.status!="nomore"){
+					let loadData = this.action == 'swiperChange' ? !isCurtab : isCurtab
+					if(loadData){
+						this.$refs.uTabs.setFinishCurrent(current)
+						this.swiperCurrent = current
+						this.current = current
+						this.resetPage()
+					}
 				}
 			},
 			// scroll-view到底部加载更多
 			onreachBottom() {
-				if(this.list.length < this.total){
+				this.action = 'onreachBottom'
+				if (this.list.length < this.total) {
 					this.pageNo += 1
-					this.pageInit()
-				}else{
-					this.status = "nomore"
+				} else {
+					this.status = 'nomore'
 				}
 			},
-			//  显示日期选择
-			onShowDatePicker(type){
-				this.type = type
-				this.showPicker = true
-				this.searchForm.creatTime = this[type]
+			//  初始化数据
+			resetPage(){
+				this.status = 'loading'
+				// 上划分页
+				if(this.action == 'onreachBottom'){
+					this.pageInit()
+				}
+				// 左右切换tab
+				if(this.action == 'swiperChange'){
+					this.list = []
+					this.pageInit(1)
+				}
 			},
-			//  日期选择
-			onSelected(e) {
+			//  选择日期范围
+			onSelected(e){
 				this.showPicker = false
 				if(e) {
-					this[this.type] = e.value
+					this.range = e.value
 				}
 			},
+			//  显示日期选择
+			onShowDatePicker(type){
+				this.showPicker = true
+				this.searchForm.creatTime = this.range
+			},
 			//  获取近几天的数据
 			get7day(day){
 				let today = new Date()
@@ -245,7 +257,8 @@
 			    return m
 			},
 			//  打开筛选条件
-			openScreenFun(){
+			onNavigationBarButtonTap(e) {
+				this.resetF()
 				this.openScreen = true
 			},
 			//  重置筛选条件
@@ -271,36 +284,18 @@ page {
 }
 .myShopTour-wrap {
 	height: 100%;
-	/* 自定义导航栏样式 */
-	.slot-wrap {
-		display: flex;
-		align-items: center;
-		/* 如果您想让slot内容占满整个导航栏的宽度 */
-		flex: 1;
-		/* 如果您想让slot内容与导航栏左右有空隙 */
-		padding: 0 30rpx;
-		color: #fff;
-		font-size: 28upx;
-		.left-icon {
-			flex-grow: 1;
-			font-size: 32upx;
-			margin-right: 10upx;
-			text-align: center;
-		}
-		.right-icon {
-			padding-left: 50upx;
-		}
-		.uni-icons {
-			margin-right: 10upx;
-		}
-	}
 	// 内容
 	.myShopTour-con{
 		.data-list{
 			height: calc(100vh - 84px);
 			.swiper-item{
+				height: 100%;
+				width: 100%;
+				overflow: hidden;
 				.scroll-con{
 					height: 100%;
+					width: 100%;
+					overflow: auto;
 					// 列表
 					.record-con{
 						padding-top: 74upx;
@@ -438,8 +433,5 @@ page {
 			}
 		}
 	}
-	.choose-date-wrap{
-		z-index: 999999;
-	}
 }
 </style>

+ 41 - 18
pages/shopTourRecord/shopTourRecord.vue

@@ -76,8 +76,8 @@
 						</u-grid>
 					</view>
 				</view>
-				<u-empty text="暂无数据" img-width="120" v-if="list.length == 0 && status != 'loading'" mode="list"></u-empty>
-				<u-loadmore bg-color="#f8f8f8" v-if="list.length < total || status == 'loading'" :status="status" class="loadmore" />
+				<u-empty :text="noDataText" img-width="120" v-if="list.length == 0 && status != 'loading'" mode="list"></u-empty>
+				<view style="padding: 20upx;"><u-loadmore v-if="total > pageSize || status == 'loading'" :status="status" /></view>
 			</scroll-view>
 		</view>
 		
@@ -92,16 +92,16 @@
 		components: { MxDatePicker },
 		data(){
 			return{
-				screenClass: [
+				screenClass: [  // 过滤条件  类型
 					{ label: '全部', value: 1, },
 					{ label: '我的巡店', value: 2, }
 				],
-				screenMethod: [
+				screenMethod: [  // 过滤条件  检查方式
 					{ label: '现场巡店', value: 1, },
 					{ label: '视频巡店', value: 2, },
 					{ label: '点检任务', value: 3, }
 				],
-				screenState: [
+				screenState: [  // 过滤条件  状态
 					{ label: '全部', value: 1, },
 					{ label: '待处理', value: 2, },
 					{ label: '进行中', value: 3, },
@@ -122,7 +122,6 @@
 				pageNo: 1,  //  当前页码
 				pageSize: 15,  //  一页多少条
 				total: 0,  //  总条数
-				// status: 'loading',  //  加载状态
 				status: 'loadmore',  //  加载状态
 				noDataText: '暂无数据',  //  列表数据为空时提示文字
 				list: [  //  数据列表
@@ -135,14 +134,36 @@
 			}
 		},
 		onLoad() {
-			this.pageInit()
+			this.range = [ this.get7day(-6), this.get7day(0) ]
+			this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
+			this.pageInit(1)
 		},
 		methods: {
-			pageInit(){
-				this.range = [ this.get7day(-6), this.get7day(0) ]
-				this.searchForm.creatTime = [ this.get7day(-6), this.get7day(0) ]
-				this.total = 0
-				this.pageNo = 1
+			// 查询列表
+			pageInit(pageNo){
+				if (pageNo) {
+					this.pageNo = pageNo
+				}
+				this.status = 'loading'
+				let params = {
+					pageNo: this.pageNo,
+					pageSize: this.pageSize
+				}
+				getTaskList(params).then(res => {
+					if (res.status == 200) {
+						if (this.pageNo > 1) {
+							this.list = this.list.concat(res.data.list || [])
+						} else {
+							this.list = res.data.list || []
+						}
+						this.total = res.data.count || 0
+					} else {
+						this.list = []
+						this.total = 0
+						this.noDataText = res.message
+					}
+					this.status = 'loadmore'
+				});
 			},
 			//  获取近几天的数据
 			get7day(day){
@@ -166,12 +187,12 @@
 			},
 			// scroll-view到底部加载更多
 			onreachBottom() {
-				// if(this.list.length < this.total){
-				// 	this.pageNo += 1
-				// 	this.pageInit()
-				// }else{
-				// 	this.status = "nomore"
-				// }
+				if (this.list.length < this.total) {
+					this.pageNo += 1
+					this.pageInit()
+				} else {
+					this.status = 'nomore'
+				}
 			},
 			//  关闭筛选
 			closeDropdown() {
@@ -252,6 +273,8 @@
 		.list-con{
 			.scroll-con{
 				height: 100%;
+				width: 100%;
+				overflow: auto;
 				// 列表
 				.record-con{
 					.alert-tips{

File diff suppressed because it is too large
+ 0 - 0
unpackage/dist/dev/app-plus/manifest.json


Some files were not shown because too many files changed in this diff