Merge branch 'master' of http://47.114.134.244:3000/chenkainan/tourGuide

main.js

@@ -8,9 +8,9 @@ import '@/static/js/CommonFunction.js'
 Vue.config.productionTip = false
 
 // 去除生产环境console
-if (uni.getSystemInfoSync().platform !== "devtools") {
+// if (uni.getSystemInfoSync().platform !== "devtools") {
-	console.log = () => {}
+// 	console.log = () => {}
-}
+// }
 
 App.mpType = 'app'
 

pages/index/index.vue

@@ -1,30 +1,515 @@
 <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">
+				立即核销
+				<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/hexiao.png" mode=""></image>
+			</view>
+			<view class="nav-item flex-around">
+				查看订单
+				<image src="https://static.ticket.sz-trip.com/tourGuide/images/index/dingdan.png" mode=""></image>
+			</view>
+		</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">
+				{{item.title}}
+				<view class="type-line" v-if="index == typeIndex"></view>
+			</view>
+		</view>
+
+		<!-- 日历 -->
+		<view class="calendar">
+			<view class="calendar-top flex-between">
+				<view @click="preNextDate(0)">
+					<img src="https://static.ticket.sz-trip.com/tourGuide/images/index/leftIcon.png" class="iconfont"
+						style="margin-right: 13rpx;" />
+					{{ monthShow ? '上一月' : '上一周' }}
+				</view>
+				<view>{{year}}年{{month}}月</view>
+				<view @click="preNextDate(1)">
+					{{ monthShow ? '下一月' : '下一周' }}
+					<img src="https://static.ticket.sz-trip.com/tourGuide/images/index/rightIcon.png" class="iconfont"
+						style="margin-left: 13rpx;" />
+				</view>
+			</view>
+
+			<view class="calendar-bottom">
+				<view class="week-item" v-for="(item,index) in weekList" :key="item + index">
+					{{item}}
+				</view>
+
+				<view v-for="(item, index) in everyDay" :key="item.day" class="day-box flex-center"
+					:class="(nowDay > item.date) ? 'grayDate' : ''" v-if="monthShow">
+					<view :class="['day-item', selectDay == item.date ? 'daySelect' : '']"
+						@click="changeDate(item.date)">
+						{{ nowDay== item.date ? '今日' : item.day }}
+						<view class="day-lunar">{{showLunar(item)}}</view>
+					</view>
+				</view>
+
+				<view v-for="(item, index) in weekDates" :key="item + index" class="day-box flex-center"
+					:class="(nowDay > getNowTime(item)) ? 'grayDate' : ''" v-if="!monthShow">
+					<view :class="['day-item', selectDay == getNowTime(item) ? 'daySelect' : '']"
+						@click="changeDate(getNowTime(item))">
+						{{ nowDay == getNowTime(item) ? '今日' : getNowTime(item).slice(-2) }}
+						<view class="day-lunar">{{showLunar(getNowTime(item))}}</view>
+					</view>
+				</view>
+
+				<view class="" style="width: 100%;height: 50rpx;padding: 20rpx;" @click="changeWeekMonth">
+					<img :src="monthShow ? 'https://static.ticket.sz-trip.com/hsrNewTown/images/calendar/top.png' : 'https://static.ticket.sz-trip.com/hsrNewTown/images/calendar/bottom.png'"
+						class="iconfont" />
+				</view>
+			</view>
+		</view>
 		
+		<!-- 选择场次 -->
+		<view v-for="(item,index) in 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 {
+		lunar
+	} from "../../static/js/lunar.js"
 	export default {
 		data() {
 			return {
-				
+				typeList: [{
+						title: '导游服务',
+						id: ''
+					},
+					{
+						title: '线上咨询',
+						id: ''
+					},
+					{
+						title: '拼团产品',
+						id: ''
+					},
+					{
+						title: '线路产品',
+						id: ''
+					}
+				],
+				typeIndex: 0,
+				weekList: ['日', '一', '二', '三', '四', '五', '六'],
+				monthShow: false,
+				year: 0,
+				month: 0,
+				day: 0,
+				week: '',
+				nowDay: '',
+				selectDay: '',
+				everyDay: [],
+				weekDates: [],
+				sessionList: [
+					{
+						title: '上午场',
+						isChecked: false
+					},
+					{
+						title: '下午场',
+						isChecked: false
+					},
+					{
+						title: '全天场',
+						isChecked: false
+					}
+				],
+				isAllChecked: false
 			}
 		},
 		onLoad() {
-
+			this.year = Number(this.getNowTime(new Date(), 2).slice(0, 4));
+			this.month = Number(this.getNowTime(new Date(), 2).slice(5, 7));
+			this.day = Number(this.getNowTime(new Date(), 2).slice(8, 10));
+			this.nowDay = this.getNowTime(new Date())
+			this.selectDay = this.getNowTime(new Date())
+			this.getWeekDates(new Date())
 		},
 		methods: {
+			// 选择场次
+			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
+					}
+				}
+			},
+			// 选中日期
+			changeDate(item) {
+				if (this.nowDay <= item) {
+					this.year = Number(item.slice(0, 4));
+					this.month = Number(item.slice(5, 7));
+					this.day = Number(item.slice(8, 10));
+					this.selectDay = item
+				}
+			},
+			// 农历
+			showLunar(date) {
+				if(this.monthShow) {
+					if (!date.date) return;
+					var lunarObj = lunar.solar2lunar(date.date.slice(0, 4), date.date.slice(5, 7), date.date.slice(8, 10));
+				}else {
+					var lunarObj = lunar.solar2lunar(date.slice(0, 4), date.slice(5, 7), date.slice(8, 10));
+				}
+
+				return lunarObj.festival || lunarObj.lunarFestival || lunarObj.IDayCn;
+			},
+			// 获取当前日期
+			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;
+			},
+			// 遍历月份日期
+			getEveryDay(data) {
+				let date = new Date(data);
+				let month = date.getMonth();
+				//设置月份
+				date.setMonth(month + 1);
+				//设置一个月的某一天-这里设置为零则取到的日期中的天就会是当月的最后一天（比如，二月份就是28或29，其他月份就是30或31），方便下边的循环
+				date.setDate(0);
+				let dayArry = [];
+				let day = date.getDate(); //获取当前月最后一天是几号
+				for (let i = 1; i <= day; i++) {
+					date.setDate(i); //如果只获取当前选择月份的每一天，则不需要date.setDate(i)只需dayArry.push(i)即可，其中date.setDate(i)是设置当前月份的每一天
+					dayArry.push({
+						day: i,
+						week: this.getWeekday(date.getDay()),
+						date: this.getNowTime(date),
+						flag: 0
+					}); //选中月份的每一天和当天是星期几
+				}
+
+				this.everyDay = dayArry;
+				this.resetDay();
+			},
+			getWeekday(day) {
+				return ['日', '一', '二', '三', '四', '五', '六'][day];
+			},
+			//重置日期与顶部周期相对应
+			resetDay() {
+				let arr = this.weekList;
+				let w = this.everyDay[0].week;
+				arr.forEach((v, index) => {
+					if (v == w) {
+						let id = index;
+						if (id != 0) {
+							for (let i = 0; i < id; i++) {
+								this.everyDay.unshift({
+									day: '',
+									week: ''
+								});
+							}
+						}
+					}
+				});
+			},
+			// 获取周
+			getWeekDates(day) {
+				const currentDayOfWeek = day.getDay(); // 获取今天是星期几( 0 = 周日,...6 = 周六
+				const startDate = new Date(day);
+				startDate.setDate(day.getDate() - currentDayOfWeek);
+				const weekDates = [];
+				for (let i = 0; i < 7; i++) {
+					const date = new Date(startDate);
+					date.setDate(startDate.getDate() + i);
+					weekDates.push(date)
+				}
+				this.weekDates = weekDates
+			},
+			// 切换上一周月、下一周月
+			preNextDate(e) {
+				if (this.monthShow) {
+					if (e) {
+						// 下一月
+						this.month += 1;
+						if (this.month > 12) {
+							this.year += 1;
+							this.month = 1;
+						}
+						if (uni.getSystemInfoSync().platform == 'ios') {
+							this.getEveryDay(this.year + '/' + this.month + '/' + 1);
+						} else {
+							this.getEveryDay(this.year + '-' + this.month);
+						}
+					} else {
+						// 上一月
+						this.month -= 1;
+						if (this.month == 0) {
+							this.year -= 1;
+							this.month = 12;
+						}
+						if (uni.getSystemInfoSync().platform == 'ios') {
+							this.getEveryDay(this.year + '/' + this.month + '/' + 1);
+						} else {
+							this.getEveryDay(this.year + '-' + this.month);
+						}
+					}
+				} else {
+					if (e) {
+						// 下一周
+						this.getNextWeekDates()
+					} else {
+						// 上一周
+						this.getPreviousWeekDates()
+					}
+				}
+			},
+			getPreviousWeekDates() {
+				const today = this.weekDates[0]
+				const previousWeekStartDate = new Date(today);
+				previousWeekStartDate.setDate(today.getDate() - 7); // 上周的开始日期
 
+				const previousWeekDates = [];
+				for (let i = 0; i < 7; i++) {
+					const date = new Date(previousWeekStartDate);
+					date.setDate(previousWeekStartDate.getDate() + i);
+					previousWeekDates.push(date);
+				}
+
+				this.weekDates = previousWeekDates;
+				this.year = Number(this.getNowTime(this.weekDates[0], 2).slice(0, 4));
+				this.month = Number(this.getNowTime(this.weekDates[0], 2).slice(5, 7));
+			},
+			getNextWeekDates() {
+				const today = this.weekDates[0]
+				const nextWeekStartDate = new Date(today);
+				nextWeekStartDate.setDate(today.getDate() + 7); // 下周的开始日期
+
+				const nextWeekDates = [];
+				for (let i = 0; i < 7; i++) {
+					const date = new Date(nextWeekStartDate);
+					date.setDate(nextWeekStartDate.getDate() + i);
+					nextWeekDates.push(date);
+				}
+
+				this.weekDates = nextWeekDates;
+				this.year = Number(this.getNowTime(this.weekDates[0], 2).slice(0, 4));
+				this.month = Number(this.getNowTime(this.weekDates[0], 2).slice(5, 7));
+			},
+			// 更换周/月
+			changeWeekMonth() {
+				this.monthShow = !this.monthShow
+
+				this.month = Number(this.selectDay.slice(5, 7));
+
+				if (this.monthShow) {
+					this.year = Number(this.selectDay.slice(0, 4))
+					if (uni.getSystemInfoSync().platform == 'ios') {
+						this.getEveryDay(this.year + '/' + this.month + '/' + 1);
+					} else {
+						this.getEveryDay(this.year + '/' + this.month);
+					}
+				} else {
+					this.getWeekDates(new Date(this.selectDay))
+				}
+			},
 		}
 	}
 </script>
 
-<style>
+<style lang="scss" scoped>
 	.content {
+		background: #FFFFFF;
+		min-height: 100vh;
+		padding: 40rpx 26rpx 100rpx;
+	}
+
+	.topImg {
+		width: 299.33rpx;
+		height: 70rpx;
 		display: flex;
-		flex-direction: column;
+		margin: auto;
-		align-items: center;
+	}
-		justify-content: center;
+
+	.title {
+		font-weight: bold;
+		font-size: 35rpx;
+		color: #000000;
+		margin: 68rpx 0 34rpx;
+	}
+
+	.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;
+		}
+	}
+
+	.calendar {
+		.calendar-top {
+			font-size: 27rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #000000;
+			padding: 59rpx 0 38rpx;
+
+			view:nth-child(2) {
+				font-size: 35rpx;
+				font-weight: bold;
+			}
+
+			.iconfont {
+				width: 11rpx;
+				height: 20rpx;
+				vertical-align: inherit;
+			}
+		}
+
+		.calendar-bottom {
+			display: flex;
+			flex-wrap: wrap;
+			padding: 33rpx 0 40rpx;
+			width: 697rpx;
+			height: auto;
+			background: #FFFFFF;
+			border-radius: 20rpx;
+			position: relative;
+
+			.week-item {
+				width: 14%;
+				text-align: center;
+				font-size: 24rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #666666;
+			}
+
+			.day-box {
+				width: 14%;
+				height: 100rpx;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+
+				.day-item {
+					font-size: 29rpx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #000000;
+					display: flex;
+					flex-direction: column;
+					justify-content: space-around;
+					text-align: center;
+					
+					.day-lunar {
+						font-weight: 500;
+						font-size: 17rpx;
+						color: #999999;
+						text-align: center;
+					}
+				}
+
+				.daySelect {
+					width: 80rpx;
+					height: 80rpx;
+					text-align: center;
+					background: #96684F;
+					border-radius: 27rpx;
+					color: #fff;
+					
+					.day-lunar {
+						color: #fff;
+					}
+				}
+			}
+
+			.grayDate {
+				.day-item {
+					color: #999999;
+				}
+			}
+
+			.iconfont {
+				width: 20rpx;
+				height: 20rpx;
+				display: block;
+				margin: 0 auto;
+			}
+		}
+	}
+	
+	.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>
+</style>

static/css/base.css

@@ -12,6 +12,10 @@ input {
 	border: none;
 }
 
+view {
+	box-sizing: border-box;
+}
+
 .flex-between {
 	display: flex;
 	justify-content: space-between;
@@ -58,6 +62,7 @@ input {
 	display: -webkit-box;
 	-webkit-box-orient: vertical;
 }
+
 .finished-text {
 	text-align: center;
 	font-size: 24upx;

static/js/CommonFunction.js

@@ -59,3 +59,109 @@ Vue.prototype.IsMail = code => {
 	var pattern = /^\w+@[a-z0-9]+\.[a-z]+$/i;
 	return pattern.test(code);
 }
+
+// 图片显示判断
+Vue.prototype.showImg = img => {
+	if(!img) return;
+	if (img.indexOf('https://') != -1 || img.indexOf('http://') != -1) {
+		return img;
+	} else {
+		return 'https://tlgz.sz-trip.com' + img;
+	}
+}
+
+// 获取经纬度
+Vue.prototype.getLocation = () => {
+	uni.startLocationUpdate({
+		success: res => {
+			uni.onLocationChange(data => {
+				uni.setStorageSync('location', {
+					lat: data.latitude,
+					lon: data.longitude
+				});
+			})
+		}
+	})
+}
+
+// 金刚区头图
+Vue.prototype.getHeadImg = type => {
+	return Vue.prototype.Post(
+		{
+			type,
+		},
+		'/api/public_service/getKumgangHeadImgList'
+	).then(res => {
+		return res.data[0].image
+	});
+}
+
+// 路由页面跳转
+Vue.prototype.gotoPath = path => {
+	uni.navigateTo({
+		url: path
+	})
+}
+
+// 返回上一页
+Vue.prototype.goBack = () => {
+	console.log(getCurrentPages())
+	var pages = getCurrentPages();
+	var page = pages[pages.length - 1];
+	if(page.route == 'subPackages/techan/techanList') {
+		uni.switchTab({
+			url: '/pages/index/index'
+		})
+		return;
+	}
+	getCurrentPages().length > 1 ? uni.navigateBack({}) : uni.switchTab({
+		url: '/pages/index/index'
+	})
+}
+
+// 打开地图
+Vue.prototype.openLocation = (lat,lon) => {
+	uni.openLocation({
+		latitude: Number(lat),
+		longitude: Number(lon),
+		success: function () {
+			console.log('success');
+		}
+	});
+}
+
+// 拨打电话
+Vue.prototype.clickPhone = (phone) => {
+	uni.makePhoneCall({
+		phoneNumber:phone
+	})
+}
+
+// 周几
+Vue.prototype.ShowDateDay = day => {
+    let stateTxt = "";
+    switch (day) {
+        case 0:
+            stateTxt = '周日'
+            break;
+        case 1:
+            stateTxt = '周一'
+            break;
+        case 2:
+            stateTxt = '周二'
+            break;
+        case 3:
+            stateTxt = '周三'
+            break;
+        case 4:
+            stateTxt = '周四'
+            break;
+        case 5:
+            stateTxt = '周五'
+            break;
+        case 6:
+            stateTxt = '周六'
+            break;
+    }
+    return stateTxt
+}