Преглед на файлове

Merge branch 'deploy' of http://git.chelingzhu.com/chelingzhu-web/storeCheck-app into deploy

lilei преди 4 години
родител
ревизия
54315e3390

+ 18 - 0
pages.json

@@ -37,6 +37,24 @@
 				"navigationBarTitleText": "智能巡店"
 			}
 		},
+		{
+			"path": "pages/videoShopTour/videoShopTour",  //  视频巡店
+			"style": {
+				"navigationBarTitleText": "视频巡店"
+			}
+		},
+		{
+			"path": "pages/searchPage/searchPage",  //  搜索 - 根据门店名称搜索
+			"style": {
+				"navigationBarTitleText": "搜索"
+			}
+		},
+		{
+			"path": "pages/organization/organization",  //  搜索 - 根据组织机构搜索
+			"style": {
+				"navigationBarTitleText": "搜索"
+			}
+		},
 		{
 		    "path" : "pages/shopTour/shopTour",
 		    "style" : {

+ 2 - 1
pages/index/index.vue

@@ -58,7 +58,8 @@ export default {
 					icon: 'xundian',
 					color: '#00aaff',
 					name: '视频巡店',
-					url:'/pages/shopTour/shopTour',
+					// url:'/pages/shopTour/shopTour',
+					url: '/pages/videoShopTour/videoShopTour',
 					target: 'page',
 					auth: true
 				},

+ 55 - 63
pages/myShopTour/myShopTour.vue

@@ -8,7 +8,7 @@
 				</view>
 				<view class="left-icon">我的巡店</view>
 				<view class="right-icon">
-					<u-icon name="more-dot-fill" color="#fff" size="28" @click="openScreen=true"></u-icon>
+					<u-icon name="more-dot-fill" color="#fff" size="28" @click="openScreenFun"></u-icon>
 				</view>
 			</view>
 		</u-navbar>
@@ -19,7 +19,9 @@
 				<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">
-							<view v-show="searchForm.creatTime.length != 0" class="alert-tips">{{searchForm.creatTime[0]}} ~ {{searchForm.creatTime[1]}}</view>
+							<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="item-head">
 									<text class="item-c-tit">{{item.name}}</text>
@@ -64,21 +66,20 @@
 			</swiper>
 		</view>
 		<!-- 筛选弹框 -->
-		<u-popup v-model="openScreen" mode="right" length="60%" class="screenModel-wrap">
+		<u-popup v-model="openScreen" mode="right" length="80%" class="screenModel-wrap">
 			<!-- 条件项 -->
 			<view class="condition-con">
-				<view class="condition-item">
-					<text class="condition-tit">创建时间</text>
-					<view class="condition-val">
-						<text @click="onShowDatePicker('range')">{{range[0] ? range[0] : '请选择'}} ~ {{range[1] ? range[1] : '请选择'}}</text>
-						<u-icon v-show="range.length != 0" name="close-circle" color="#999" size="28" class="close-circle" @click="range=[]"></u-icon>
+				<view class="screen-module">
+					<text class="screen-tit">创建时间:</text>
+					<view class="screen-time-val">
+						<text @click="onShowDatePicker('range')">{{ range.length == 0 ? '请选择' : range[0] + '~' + range[1] }}</text>
+						<u-icon v-show="range.length != 0" name="close-circle-fill" color="#c8c0cc" size="32" class="close-circle" @click="range=[]"></u-icon>
 					</view>
 				</view>
-				<view class="condition-item">
-					<text class="condition-tit">门店</text>
-					<view class="condition-val">
-						<text @click="openStore=!openStore">{{storeName ? storeName : '全部'}}</text>
-						<u-icon v-show="storeName" name="close-circle" color="#999" size="28" class="close-circle" @click="clearStore"></u-icon>
+				<view class="screen-module">
+					<text class="screen-tit">门店:</text>
+					<view class="screen-inp-val">
+						<u-input class="screen-inp" v-model="storeName" :height="52" placeholder="请输入" type="text" :border="true" />
 					</view>
 				</view>
 			</view>
@@ -90,8 +91,6 @@
 		</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" />
-		<!-- 选择门店 -->
-		<u-select v-model="openStore" :default-value="defaultStoreValue" :list="storeList" @confirm="confirmStore" class="choose-store-wrap"></u-select>
 	</view>
 </template>
 
@@ -122,9 +121,9 @@
 				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: '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 },
+					{ 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 },
 				],
 				openScreen: false,  //  是否打开筛选
@@ -133,16 +132,10 @@
 					creatTime: [],  //  创建时间默认筛选近7天
 					store: ''
 				},
-				openStore: false,  // 选择门店
-				storeList: [
-					{ value: '1', label: '江' },
-					{ value: '2', label: '河' }
-				],
 				showPicker: false,  //  是否选择创建时间
 				range: [],  //  筛选创建时间的默认值
 				type: 'range',  //  日期时间类型
-				storeName: '',  //  筛选门店名称
-				defaultStoreValue: [],  //  门店默认选中下标
+				storeName: '',  //  筛选的门店名称
 			}
 		},
 		onLoad() {
@@ -229,36 +222,19 @@
 			    }
 			    return m
 			},
-			//  选择门店
-			confirmStore(e){
-				this.storeName = e[0].label
-				this.defaultStoreValue = [this.storeList.findIndex(item => item.value == e[0].value)]
-			},
-			//  情空  筛选门店
-			clearStore(){
-				this.storeName = ''
-				this.defaultStoreValue = []
+			//  打开筛选条件
+			openScreenFun(){
+				this.openScreen = true
 			},
 			//  重置筛选条件
 			resetF(){
 				this.range = this.searchForm.creatTime
-				let ind = [this.storeList.findIndex(item => item.value == this.searchForm.store)]
-				if(ind == -1){
-					this.defaultStoreValue = []
-					this.storeName = ''
-				}else{
-					this.defaultStoreValue = [ind]
-					this.storeName = this.storeList[ind].label
-				}
+				this.storeName = this.searchForm.store
 			},
 			//  确定筛选
 			submitF(){
 				this.searchForm.creatTime = this.range
-				if(this.storeName){
-					this.searchForm.store = this.storeList[this.defaultStoreValue[0]].value
-				}else{
-					this.searchForm.store = ''
-				}
+				this.searchForm.store = this.storeName
 				this.openScreen = false
 			},
 		}
@@ -304,18 +280,28 @@ page {
 					height: 100%;
 					// 列表
 					.record-con{
-						padding-top: 20upx;
+						padding-top: 74upx;
+						position: relative;
 						.alert-tips{
-							font-size: 24upx;
-							padding: 4upx 10upx;
-							margin: 0upx 30upx 10upx;
-							border: 1upx solid #fcbd71;
-							background-color: #fdf6ec;
-							border-radius: 6upx;
+							position: fixed;
+							top: 0upx;
+							left: 0;
+							width: 100%;
+							z-index: 3;
+							padding: 20upx 30upx 10upx;
+							background-color: #fff;
+							text{
+								display: block;
+								font-size: 24upx;
+								padding: 4upx 10upx;
+								border: 1upx solid #fcbd71;
+								background-color: #fdf6ec;
+								border-radius: 6upx;
+							}
 						}
 						.record-item{
 							background-color: #fff;
-							margin: 0upx 30upx 20upx;
+							margin: 20upx 30upx 20upx;
 							padding: 14upx 30upx 20upx;
 							border-radius: 12upx;
 							.item-head{
@@ -341,7 +327,7 @@ page {
 									display: inline-block;
 									position: absolute;
 									left: 0;
-									top: 10upx;
+									top: 8upx;
 								}
 								.item-val{
 									display: inline-block;
@@ -384,15 +370,14 @@ page {
 		padding-bottom: 80upx;
 		.condition-con{
 			padding: 20upx 30upx;
-			.condition-item{
-				.condition-tit{
-					display: block;
+			.screen-module{
+				margin: 0 0 20upx;
+				.screen-tit{
+					color: #464646;
 					font-size: 26upx;
-					margin: 20upx 0;
 				}
-				.condition-val{
-					display: block;
-					font-size: 24upx;
+				.screen-time-val{
+					font-size: 26upx;
 					background-color: #f4f4f4;
 					border-radius: 12upx;
 					padding: 10upx 14upx;
@@ -408,6 +393,13 @@ page {
 						vertical-align: bottom;
 					}
 				}
+				.screen-inp-val{
+					margin: 10upx 0;
+					.screen-inp{
+						color: #464646;
+						font-size: 26upx;
+					}
+				}
 			}
 		}
 		.btns{

+ 129 - 0
pages/organization/organization.vue

@@ -0,0 +1,129 @@
+<template>
+	<view class="organization-wrap">
+		<u-sticky>
+			<!-- 组织结构根节点 -->
+			<view class="organization-root-tit">车领主</view>
+			<!-- 组织结构子节点 -->
+			<view class="organization-node-con">
+				<view class="organization-node-item">
+					<text class="organization-node-item-name">贷安抚记卡的</text>
+					<u-icon class="organization-node-item-icon" name="arrow-right" color="#999" size="28"></u-icon>
+				</view>
+				<view class="organization-node-item">
+					<text class="organization-node-item-name">贷安抚记卡的</text>
+					<u-icon class="organization-node-item-icon" name="arrow-right" color="#999" size="28"></u-icon>
+				</view>
+			</view>
+		</u-sticky>
+		<!-- 门店列表 -->
+		<view class="list-con">
+			<view class="list-tit">门店列表</view>
+			<!-- 列表数据 -->
+			<view class="listData-con">
+				<view class="listData-item" v-for="(item, index) in list" :key="index">
+					<view class="listData-item-l">
+						<u-icon class="listData-item-l-icon" name="mendian" custom-prefix="xd-icon" size="40" color="#888"></u-icon>
+						<text class="listData-item-l-name">{{item.name}}</text>
+					</view>
+					<view class="listData-item-r">
+						<u-icon class="listData-item-r-icon" name="yuanchengxundian" custom-prefix="xd-icon" size="40" color="#2b85e4"></u-icon>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				list: [
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+				]
+			}
+		},
+		methods: {}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #f8f8f8;
+		height: calc(100vh - 44px);
+	}
+	.organization-wrap{
+		.organization-root-tit{
+			padding: 20upx 30upx;
+			background-color: #fff;
+			border-bottom: 20upx solid #f8f8f8;
+		}
+		.organization-node-con{
+			padding: 0 30upx;
+			background-color: #fff;
+			.organization-node-item{
+				display: flex;
+				padding: 20upx 0;
+				border-bottom: 1upx dashed #f8f8f8;
+				&-name{
+					flex-grow: 1;
+				}
+				&-icon{
+					flex-shrink: 0;
+				}
+			}
+		}
+		// 门店列表
+		.list-con{
+			background-color: #fff;
+			margin-top: 20upx;
+			.list-tit{
+				padding: 20upx 30upx;
+				border-bottom: 1upx solid #f8f8f8;
+			}
+			.listData-con{
+				padding: 0 30upx;
+				.listData-item{
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					padding: 20upx 0;
+					border-bottom: 1upx dashed #f8f8f8;
+					&-l{
+						flex-grow: 1;
+						padding-right: 10upx;
+						position: relative;
+						padding-left: 50upx;
+						&-icon{
+							vertical-align: sub;
+							padding-right: 8upx;
+							position: absolute;
+							left: 0;
+							top: -4upx;
+						}
+					}
+					&-r{
+						flex-shrink: 0;
+					}
+				}
+			}
+		}
+	}
+</style>

+ 60 - 0
pages/searchPage/searchPage.vue

@@ -0,0 +1,60 @@
+<template>
+	<view class="searchPage-wrap">
+		<!-- 搜索 -->
+		<u-search shape="square" placeholder="请输入门店名称搜索" v-model="keyword" action-text="取消" @change="change" @search="search" @custom="custom"></u-search>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				keyword: ''
+			}
+		},
+		methods: {
+			//  用户点击右侧控件时触发
+			custom(val){
+				
+			},
+			//  输入框内容发生变化时触发
+			change(val){
+				let i = this.throttle(this.handle(), 1000)
+				// console.log(i)
+			},
+			//  用户确定搜索时触发,用户按回车键,或者手机键盘右下角的"搜索"键时触发
+			search(val){
+				
+			},
+			// 节流throttle代码(时间戳+定时器)
+			throttle(fn,delay){
+			    let valid = true
+			    return function() {
+			       if(!valid){
+			           //休息时间 暂不接客
+			           return false 
+			       }
+			       // 工作时间,执行函数并且在间隔期内把状态位设为无效
+			        valid = false
+			        setTimeout(() => {
+			            fn()
+			            valid = true;
+			        }, delay)
+			    }
+			},
+			handle(){
+				console.log(12)
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #f8f8f8;
+		height: calc(100vh - 44px);
+	}
+	.searchPage-wrap{
+		
+	}
+</style>

+ 303 - 35
pages/shopTourRecord/shopTourRecord.vue

@@ -1,55 +1,195 @@
 <template>
 	<view class="shopTourRecord-wrap">
-		<!-- 顶部筛选条件 -->
-		<u-dropdown ref="uDropdown" class="uDropdown">
-			<u-dropdown-item v-model="searchForm.isAll" title="全部" :options="options1"></u-dropdown-item>
-			<u-dropdown-item v-model="searchForm.inspectionMethod" title="检查方式" :options="options2"></u-dropdown-item>
-			<u-dropdown-item v-model="searchForm.state" title="状态" :options="options2"></u-dropdown-item>
-			<u-dropdown-item title="筛选">
-				<view class="slot-content" style="background-color: #FFFFFF;">
-					<scroll-view scroll-y="true" style="height: 200upx;">
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">无言独上西楼</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">月如钩</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">寂寞梧桐深院锁清秋</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">剪不断</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">理还乱</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">是离愁</view>
-						<view class="u-text-center u-content-color u-m-t-20 u-m-b-20">别是一般滋味在心头</view>
-					</scroll-view>
-					<u-button type="primary" @click="closeDropdown">确定</u-button>
+		<u-sticky offset-top="0">
+			<!-- 顶部筛选条件 -->
+			<u-dropdown ref="uDropdown" class="uDropdown">
+				<u-dropdown-item v-model="searchForm.isAll" title="全部" :options="screenClass"></u-dropdown-item>
+				<u-dropdown-item v-model="searchForm.inspectionMethod" title="检查方式" :options="screenMethod"></u-dropdown-item>
+				<u-dropdown-item v-model="searchForm.state" title="状态" :options="screenState"></u-dropdown-item>
+				<u-dropdown-item title="筛选" class="screen-dropdown">
+					<view class="slot-content">
+						<scroll-view class="scroll-view" scroll-y="true">
+							<view class="screen-module">
+								<text class="screen-tit">时间区间:</text>
+								<view class="screen-time-val">
+									<text @click="onShowDatePicker('range')">{{ range.length == 0 ? '请选择' : range[0] + '~' + range[1] }}</text>
+									<u-icon v-show="range.length != 0" name="close-circle-fill" color="#c8c0cc" size="32" class="close-circle" @click="range=[]"></u-icon>
+								</view>
+							</view>
+							<view class="screen-module">
+								<text class="screen-tit">门店:</text>
+								<view class="screen-inp-val">
+									<u-input class="screen-inp" v-model="searchForm.store" :height="52" placeholder="请输入" type="text" :border="true" />
+								</view>
+							</view>
+							<view class="screen-module">
+								<text class="screen-tit">巡店人:</text>
+								<view class="screen-inp-val">
+									<u-input class="screen-inp" v-model="searchForm.shopInspector" :height="52" placeholder="请输入" type="text" :border="true" />
+								</view>
+							</view>
+						</scroll-view>
+						<u-button type="primary" @click="closeDropdown">确定</u-button>
+					</view>
+				</u-dropdown-item>
+			</u-dropdown>
+		</u-sticky>
+		<!-- 列表数据 -->
+		<view class="list-con">
+			<scroll-view scroll-y class="scroll-con" @scrolltolower="onreachBottom">
+				<view class="record-con">
+					<u-sticky offset-top="80">
+						<view v-show="searchForm.creatTime.length != 0" class="alert-tips">
+							<text>{{searchForm.creatTime[0]}} ~ {{searchForm.creatTime[1]}}</text>
+						</view>
+					</u-sticky>
+					<view class="record-item" v-for="(item,index) in list" :key="index">
+						<view class="item-head">
+							<text class="item-c-tit">{{item.name}}</text>
+							<u-tag class="item-c-type" :text="item.orderStatus" type="primary" />
+						</view>
+						<view class="item-main">
+							<text class="item-tit">巡店人:</text>
+							<text class="item-val">{{item.shopInspector}}</text>
+						</view>
+						<view class="item-main">
+							<text class="item-tit">创建时间:</text>
+							<text class="item-val">{{item.creatTime}}</text>
+						</view>
+						<u-grid class="item-grid" :col="4" hover-class="none">
+							<u-grid-item>
+								<text class="grid-num text-blue">18</text>
+								<text class="grid-text">检查项</text>
+							</u-grid-item>
+							<u-grid-item>
+								<text class="grid-num text-green">13</text>
+								<text class="grid-text">合格</text>
+							</u-grid-item>
+							<u-grid-item>
+								<text class="grid-num text-red">3</text>
+								<text class="grid-text">不合格</text>
+							</u-grid-item>
+							<u-grid-item>
+								<text class="grid-num text-yellow">2</text>
+								<text class="grid-text">不适用</text>
+							</u-grid-item>
+						</u-grid>
+					</view>
 				</view>
-			</u-dropdown-item>
-		</u-dropdown>
+				<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" />
+			</scroll-view>
+		</view>
+		
+		<!-- 选择时间区间 -->
+		<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" />
 	</view>
 </template>
 
 <script>
+	import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"
 	export default{
+		components: { MxDatePicker },
 		data(){
 			return{
-				value1: 1,
-				value2: 2,
-				options1: [
-					{ label: '默认排序', value: 1, },
-					{ label: '距离优先', value: 2, },
-					{ label: '价格优先', value: 3, }
+				screenClass: [
+					{ label: '全部', value: 1, },
+					{ label: '我的巡店', value: 2, }
 				],
-				options2: [
-					{ label: '去冰', value: 1, },
-					{ label: '加冰', value: 2, },
+				screenMethod: [
+					{ label: '现场巡店', value: 1, },
+					{ label: '视频巡店', value: 2, },
+					{ label: '点检任务', value: 3, }
+				],
+				screenState: [
+					{ label: '全部', value: 1, },
+					{ label: '待处理', value: 2, },
+					{ label: '进行中', value: 3, },
+					{ label: '已完成', value: 4, },
+					{ label: '已过期', value: 5, }
 				],
 				searchForm: {
-					isAll: '',
-					inspectionMethod: '',
-					state: '',
-					screen: ''
-				}
+					isAll: '1',  //  全部(全部、我的巡店)
+					inspectionMethod: '',  //  检查方式(现场巡店、视频巡店、点检任务)
+					state: '1',  //  状态(全部、待处理、进行中、已完成、已过期)
+					creatTime: '',  //  时间区间(天)
+					store: '',  //  门店
+					shopInspector: ''  //  巡店人
+				},
+				showPicker: false,  //  是否选择创建时间
+				range: [],  //  筛选创建时间的默认值
+				type: 'range',  //  日期时间类型
+				pageNo: 1,  //  当前页码
+				pageSize: 15,  //  一页多少条
+				total: 0,  //  总条数
+				// status: 'loading',  //  加载状态
+				status: 'loadmore',  //  加载状态
+				noDataText: '暂无数据',  //  列表数据为空时提示文字
+				list: [  //  数据列表
+					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', shopInspector: '张三' },
+					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'invalid', shopInspector: '李四' },
+					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'haveInHand', shopInspector: '王五' },
+					{ name: '常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', shopInspector: '王权富贵' },
+					{ name: '常青二店', creatTime: '2020-09-08 09:16', orderStatus: 'completed', shopInspector: '钱六' },
+				],
 			}
 		},
+		onLoad() {
+			this.pageInit()
+		},
 		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
+			},
+			//  获取近几天的数据
+			get7day(day){
+				let today = new Date()
+				let targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day
+				today.setTime(targetday_milliseconds)  //注意,这行是关键代码
+				let tYear = today.getFullYear()
+				let tMonth = today.getMonth()
+				let tDate = today.getDate()
+				tMonth = this.doHandleMonth(tMonth + 1)
+				tDate = this.doHandleMonth(tDate)
+				return tYear + "-" + tMonth + "-" + tDate
+			},
+			//  月份
+			doHandleMonth(month){
+			    let m = month
+			    if(month.toString().length == 1){
+					m = "0" + month
+			    }
+			    return m
+			},
+			// scroll-view到底部加载更多
+			onreachBottom() {
+				// if(this.list.length < this.total){
+				// 	this.pageNo += 1
+				// 	this.pageInit()
+				// }else{
+				// 	this.status = "nomore"
+				// }
+			},
+			//  关闭筛选
 			closeDropdown() {
 				this.$refs.uDropdown.close()
-			}
+			},
+			//  显示日期选择
+			onShowDatePicker(type){
+				this.type = type
+				this.showPicker = true
+				this.searchForm.creatTime = this[type]
+			},
+			//  日期选择
+			onSelected(e) {
+				this.showPicker = false
+				if(e) {
+					this[this.type] = e.value
+				}
+			},
 		}
 	}
 </script>
@@ -60,8 +200,136 @@
 		height: calc(100vh - 44px);
 	}
 	.shopTourRecord-wrap{
+		// 筛选条件
 		.uDropdown{
-			
+			background-color: #fff;
+			.screen-dropdown{
+				.slot-content{
+					background-color: #fff;
+					.scroll-view{
+						height: 300upx;
+						.screen-module{
+							margin: 20upx 30upx 20upx;
+							display: flex;
+							align-items: center;
+							.screen-tit{
+								color: #464646;
+								font-size: 26upx;
+								width: 140upx;
+								flex-shrink: 0;
+							}
+							.screen-time-val{
+								flex-grow: 1;
+								font-size: 26upx;
+								background-color: #f4f4f4;
+								border-radius: 12upx;
+								padding: 10upx 14upx;
+								margin: 10upx 0;
+								text-align: center;
+								text{
+									display: inline-block;
+									width: 85%;
+								}
+								.close-circle{
+									display: inline-block;
+									padding-left: 3%;
+									vertical-align: bottom;
+								}
+							}
+							.screen-inp-val{
+								flex-grow: 1;
+								.screen-inp{
+									color: #464646;
+									font-size: 26upx;
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+		// 列表数据
+		.list-con{
+			.scroll-con{
+				height: 100%;
+				// 列表
+				.record-con{
+					.alert-tips{
+						padding: 20upx 30upx 10upx;
+						background-color: #fff;
+						text{
+							display: block;
+							font-size: 24upx;
+							padding: 4upx 10upx;
+							border: 1upx solid #fcbd71;
+							background-color: #fdf6ec;
+							border-radius: 6upx;
+						}
+					}
+					.record-item{
+						background-color: #fff;
+						margin: 20upx 30upx 20upx;
+						padding: 14upx 30upx 20upx;
+						border-radius: 12upx;
+						.item-head{
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+							padding: 10upx 0;
+							.item-c-tit{
+								flex-grow: 1;
+								padding-right: 18upx;
+								font-weight: bold;
+							}
+							.item-c-type{
+								flex-shrink: 0;
+							}
+						}
+						.item-main{
+							font-size: 26upx;
+							line-height: 48upx;
+							padding: 6upx 0;
+							position: relative;
+							.item-tit{
+								display: inline-block;
+								position: absolute;
+								left: 0;
+								top: 8upx;
+							}
+							.item-val{
+								display: inline-block;
+								padding-left: 130upx;
+							}
+						}
+						.item-grid{
+							margin-top: 10upx;
+							.text-blue{
+								color: #2979ff;
+							}
+							.text-green{
+								color: #19be6b;
+							}
+							.text-red{
+								color: #fa3534;
+							}
+							.text-yellow{
+								color: #ff9900;
+							}
+							.grid-num{
+								font-weight: bold;
+							}
+							.grid-text{
+								font-size: 26upx;
+								padding-top: 10upx;
+								color: #666;
+							}
+						}
+					}
+				}
+				.loadmore{
+					padding: 30upx;
+				}
+			}
 		}
 	}
 </style>

+ 129 - 0
pages/videoShopTour/videoShopTour.vue

@@ -0,0 +1,129 @@
+<template>
+	<view class="videoShopTour-wrap">
+		<u-sticky>
+			<!-- 搜索方式 -->
+			<u-grid :col="2" class="search-type-con" hover-class="none">
+				<u-grid-item class="search-module" @click="goSearch">
+					<u-icon class="search-icon" name="xundianguanli" custom-prefix="xd-icon" size="80" color="#2b85e4"></u-icon>
+					<view class="search-txt">按门店名称查询</view>
+				</u-grid-item>
+				<u-grid-item class="search-module" @click="goOrgSearch">
+					<u-icon class="search-icon" name="zuzhijigou" custom-prefix="xd-icon" size="80" color="#19be6b"></u-icon>
+					<view class="search-txt">按组织机构查询</view>
+				</u-grid-item>
+			</u-grid>
+		</u-sticky>
+		<!-- 门店列表 -->
+		<view class="list-con">
+			<view class="list-tit">门店列表</view>
+			<!-- 列表数据 -->
+			<view class="listData-con">
+				<view class="listData-item" v-for="(item, index) in list" :key="index">
+					<view class="listData-item-l">
+						<u-icon class="listData-item-l-icon" name="mendian" custom-prefix="xd-icon" size="40" color="#888"></u-icon>
+						<text class="listData-item-l-name">{{item.name}}</text>
+					</view>
+					<view class="listData-item-r">
+						<u-icon class="listData-item-r-icon" name="yuanchengxundian" custom-prefix="xd-icon" size="40" color="#2b85e4"></u-icon>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				list: [
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店常青青二路店常路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+					{ name: '常青二路店' },
+				]
+			}
+		},
+		methods: {
+			//  按门店名称查询
+			goSearch(){
+				uni.navigateTo({
+					url: '/pages/searchPage/searchPage'
+				})
+			},
+			//  按组织机构查询
+			goOrgSearch(){
+				uni.navigateTo({
+					url: '/pages/organization/organization'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #f8f8f8;
+		height: calc(100vh - 44px);
+	}
+	.videoShopTour-wrap{
+		// 搜索方式
+		.search-type-con{
+			.search-module{
+				.search-txt{
+					font-size: 26upx;
+					padding-top: 6upx;
+				}
+			}
+		}
+		// 门店列表
+		.list-con{
+			background-color: #fff;
+			margin-top: 20upx;
+			.list-tit{
+				padding: 20upx 30upx;
+				border-bottom: 1upx solid #f8f8f8;
+			}
+			.listData-con{
+				padding: 0 30upx;
+				.listData-item{
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					padding: 20upx 0;
+					border-bottom: 1upx dashed #f8f8f8;
+					&-l{
+						flex-grow: 1;
+						padding-right: 10upx;
+						position: relative;
+						padding-left: 50upx;
+						&-icon{
+							vertical-align: sub;
+							padding-right: 8upx;
+							position: absolute;
+							left: 0;
+							top: -4upx;
+						}
+					}
+					&-r{
+						flex-shrink: 0;
+					}
+				}
+			}
+		}
+	}
+</style>