tourGuide/pages/index/index.vue

<template>
	<view class="content">
		<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/topImg.png" class="topImg"></image>

		<view class="title" style="margin-top: 40rpx;">·快捷入口</view>

		<view class="flex-between">
			<view class="nav-item flex-around" @click="goHX()">
				立即核销
				<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/hexiao.png" mode=""></image>
			</view>
			<view class="nav-item flex-around" @click="gotoPath('/subPackages/order/orderList')">
				查看订单
				<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/dingdan.png" mode=""></image>
			</view>
		</view>

		<!-- <view class="title">·我的打卡</view>
		<view class="rule">打卡规则</view> -->

		<view class="title">·我的排班</view>

		<view class="type-box">
			<view v-for="(item,index) in typeList" :key="index"
				:class="['type-item', {'type-active': index == typeIndex}]" @click="typeIndex = index;getList()">
				{{item.title}}
				<view class="type-line" v-if="index == typeIndex"></view>
			</view>
		</view>

		<!-- 日历 -->
		<calendarVue :isShowLunar="true" @changeDate="getDate"></calendarVue>

		<!-- 选择场次 -->
		<view v-for="(item,index) in typeIndex ? sessionLists : sessionList" :key="index"
			class="session-item flex-between">
			{{item.title}}
			<switch :checked="item.isChecked" color="#96684F" @change="switchChange(item,index)" />
		</view>
	</view>
</template>

<script>
	import calendarVue from '../../components/calendar.vue';
	export default {
		components: {
			calendarVue
		},
		data() {
			return {
				typeList: [{
						title: '导游服务',
						id: ''
					},
					// {
					// 	title: '线上咨询',
					// 	id: ''
					// },
					// {
					// 	title: '拼团产品',
					// 	id: ''
					// },
					{
						title: '线路产品',
						id: ''
					}
				],
				typeIndex: 0,
				selectDay: '',
				sessionList: [{
						title: '上午场',
						isChecked: false
					},
					{
						title: '下午场',
						isChecked: false
					},
					{
						title: '全天场',
						isChecked: false
					}
				],
				sessionLists: [{
					title: '当天状态',
					isChecked: false
				}],
				isAllChecked: false,
			}
		},
		onLoad() {
			this.selectDay = this.getNowTime(new Date())
			this.getList()
		},
		onShow() {
			this.checkLocation()
		},
		methods: {
			// 检查用户是否已经授权定位权限
			checkLocation() {
				if (navigator.geolocation) {
					navigator.geolocation.getCurrentPosition(
						(position) => {
							console.log(111,position.coords)
						},
						(error) => {
							let locationStatus = ''
							switch (error.code) {
								case 1:
									locationStatus = '定位未开启，用户拒绝了定位请求';
									break;
								case 2:
									locationStatus = '定位信息不可用';
									break;
								case 3:
									locationStatus = '定位请求超时';
									break;
								case 4:
									locationStatus = '定位出现未知错误';
									break;
							}
							console.log(error)
							uni.showToast({
								title: locationStatus,
								icon: 'none'
							})
						}
					);
				} else {
					console.log('浏览器不支持地理定位功能')
					// 浏览器不支持地理定位
					uni.showToast({
						title: '浏览器不支持地理定位功能',
						icon: 'none'
					})
				}
			},
			goHX() {
				uni.switchTab({
					url: '/pages/verification/index'
				})
			},
			// 选择场次
			switchChange(item, index) {
				item.isChecked = !item.isChecked

				// if(index == 2) {
				// 	for (let i = 0; i < 2; i++) {
				// 		this.sessionList[i].isChecked = this.sessionList[2].isChecked
				// 	}
				// }else {
				// 	if(this.sessionList[0].isChecked && this.sessionList[1].isChecked) {
				// 		this.sessionList[2].isChecked = true
				// 	}else {
				// 		this.sessionList[2].isChecked = false
				// 	}
				// }

				let url = this.typeIndex ? '/api/Merchants/updateGuideSched' : '/api/Merchants/updateGuideSchedService'

				this.Post({
					date: this.selectDay,
					online_type: item.isChecked ? 1 : 0, // 开关
					date_half: this.typeIndex ? '' : index + 1, // 导游服务 1上午 2下午 3全天
					classify: this.typeIndex ? 2 : '' // 1拼团，2线路
				}, url).then(res => {

				})
			},
			getDate(date) {
				console.log('传递过来的日期', date)
				this.selectDay = date

				this.sessionList.forEach(item => item.isChecked = false)
				this.sessionLists[0].isChecked = false

				this.getList()
			},
			changeWork(date) {
				// // 导游服务值班状态 date_half：分类（1上午，2下午，3全天）
				// this.Post({
				// 	date: date,
				// 	date_half
				// },'/api/Merchants/updateGuideSchedService').then(res => {

				// })
			},
			getList() {
				// 获取排班列表 classify：分类（1拼团，2线路，3导游服务）
				this.Post({
					start_date: this.selectDay,
					end_date: this.selectDay,
					classify: this.typeIndex ? 2 : 3
				}, '/api/Merchants/getGuideSchedList').then(res => {
					if (res.data && res.data.length > 0) {
						let data = res.data[0]
						if (this.typeIndex) {
							// 线路
							this.sessionLists[0].isChecked = data.online_type ? true : false
						} else {
							// 导游
							this.sessionList[0].isChecked = data.morning_type ? true : false
							this.sessionList[1].isChecked = data.afternoon_type ? true : false
							this.sessionList[2].isChecked = data.day_type ? true : false
						}
					}
				})
			},
			// 获取当前日期
			getNowTime(time, type) {
				var date = time,
					year = date.getFullYear(),
					month = date.getMonth() + 1,
					day = date.getDate(),
					hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
					minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
					second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				month >= 1 && month <= 9 ? (month = "0" + month) : "";
				day >= 0 && day <= 9 ? (day = "0" + day) : "";
				if (type == 1) {
					if (uni.getSystemInfoSync().platform == 'ios') {
						var timer = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second;
					} else {
						var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
					}
				} else {
					var timer = year + '/' + month + '/' + day;
				}

				return timer;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		background: #FFFFFF;
		min-height: 100vh;
		padding: 40rpx 26rpx 200rpx;
	}

	.topImg {
		width: 299.33rpx;
		height: 70rpx;
		display: flex;
		margin: auto;
	}

	.title {
		font-weight: bold;
		font-size: 35rpx;
		color: #000000;
		margin: 68rpx 0 34rpx;
	}

	.rule {
		font-weight: 500;
		font-size: 31rpx;
		color: #96684F;
		text-align: right;
	}

	.nav-item {
		font-weight: 500;
		font-size: 32rpx;
		color: #000000;
		width: 338rpx;
		height: 118rpx;
		background: #F5F5F5;
		border-radius: 20rpx;
		padding: 0 15rpx;

		image {
			width: 80.67rpx;
			height: 80.67rpx;
		}
	}

	.type-box {
		display: flex;

		.type-item {
			margin-right: 44rpx;
			font-weight: 500;
			font-size: 32rpx;
			color: #000000;
		}

		.type-active {
			color: #96684F;
		}

		.type-line {
			width: 117rpx;
			height: 6rpx;
			background: #96684F;
			border-radius: 3rpx;
			margin: 4rpx auto 0;
		}
	}

	.session-item {
		width: 697rpx;
		height: 93rpx;
		background: #F5F5F5;
		border-radius: 47rpx;
		margin: 28rpx auto 0;
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #000000;
		padding: 0 28rpx;
	}
</style>