<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="item.id" @click="goPage(item)">
					<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>
				<u-empty :text="noDataText" img-width="120" v-if="list.length == 0 && status != 'loading'" :margin-top="20" mode="list"></u-empty>
				<u-loadmore bg-color="#f8f8f8" v-if="list.length < total || status == 'loading'" :status="status" class="loadmore" />
			</view>
		</view>
	</view>
</template>

<script>
	import { clzConfirm } from '@/libs/tools.js'
	import { findStoreList } from '@/api/store.js'
	import { queryCurrentTaskUsing } from '@/api/task.js'
	export default{
		data(){
			return{
				noDataText: '暂无数据',  //  数据异常提示
				status: 'loadmore',  //  加载中状态
				list: [],  //  数据列表
				total: 0,  //  数据总条数
				pageNo: 1,  //  当前页码
				pageSize: 10,  //  每页条数
			}
		},
		onLoad() {
			this.init()
		},
		methods: {
			//  初始
			init(){
				//  获取门店列表
				findStoreList().then(res => {
					if(res.status == 200){
						this.list = res.data.list
						this.total = res.data.count || 0
					}else{
						this.list = []
						this.total = 0
					}
				})
			},
			//  按门店名称查询
			goSearch(){
				uni.navigateTo({
					url: '/pages/searchPage/searchPage'
				})
			},
			//  按组织机构查询
			goOrgSearch(){
				uni.navigateTo({
					url: '/pages/organization/organization'
				})
			},
			//  开始巡店
			goPage(item){
				//  校验是否有历史巡店记录
				queryCurrentTaskUsing({ storeId: item.tenantId }).then(res => {
					console.log(res)
					if(res.status == 200){
						if(res.data.state){  //  为true有历史巡店记录
							clzConfirm({
							    title: '提示',
							    content: '有进行中的巡店任务，是否继续？',
								confirmText: '继续巡店',
								cancelText: '重新开始',
								buttons: ['继续巡店','重新开始'],
							    success: function (result) {
							        if (result.confirm || result.index==0) {  //  继续巡店
										uni.navigateTo({
											url: '/pages/shopTour/shopTour?storeId=' + item.tenantId + '&taskId='+ res.data.taskId + '&restart=0&types=video'
										})
							        }else{  //  重新开始
										uni.navigateTo({
											url: '/pages/shopTour/shopTour?storeId=' + item.tenantId + '&taskId='+ res.data.taskId + '&restart=1&types=video'
										})
							        }
							    }
							})
						}else{
							uni.navigateTo({
								url: '/pages/shopTour/shopTour?storeId=' + item.tenantId + '&types=video'
							})
						}
					}else{
						uni.showToast({icon: 'none', title: res.message})
					}
				})
			}
		}
	}
</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>
