sadjv3_jishi/pages/my/mangshi.vue

<template>
	<view>
		<view class="timeView">
			<view class="timeView-top">
				<span class="dx_title">是否接单
					<!-- <text class="switchTxt">{{switchTxt=='true'?'接单':'不接单'}}</text> --></span>
				<switch :checked='isTrue' style="transform:scale(0.7)" color="#029d88" @change="switch1Change" />
			</view>
			<view class="selectTimt">
				<view class="dx_title">选择接单时间</view>
				<view class="listTime">
					<view class="selectTimt-bottom">
						<view @click="showPopup">
							<uni-title type="h4" title="开始时间" align="center" ></uni-title>
							<scrollbarPicker :select.sync='starTime'  @Time='bindTimeChange'/>
							<!-- <view class="uni-input">{{starTime}}</view> -->
						</view>
						<!-- 弹出层本身 -->
						<!-- <scrollbarPicker :visibleShow.sync="pickerVisible" @Time='bindTimeChange'/> -->
					</view>
					<view class="selectTimt-bottom">
						<view @click="showEndPopup">
							<uni-title type="h4" title="结束时间" align="center" ></uni-title>
							<scrollbarEndPicker :select.sync='endTime'  @Time='bindTimeChangeEndTime'/>
							<!-- <view class="uni-input">
								<span>{{endTime}}</span>
							</view> -->
						</view>
						<!-- 弹出层本身 -->
						<!-- <scrollbarEndPicker :visibleShow.sync="pickerEndVisible" @Time='bindTimeChangeEndTime'/> -->
					</view>
				</view>
				<view class="sub" @click="saveJd()">保存接单</view>
			</view>
			<view class="container-top">
				<span>设置不可接单时间</span>
				<span>(只能设置近3天的时间)</span>
			</view>
			<scroll-view class="scroll-view_H b-t b-b" scroll-x>
				<block v-for="(item,index) in dateArr" :key="index">
					<div class="flex-box" @click="selectDateEvent(index,item)" :class="{ borderb: index==dateActive}">
						<view class="date-box" :style="{color:index==dateActive?selectedTabColor:'#333'}">
							<text class="fontw">{{item.week}}</text>
							<text>{{item.date}}</text>
						</view>
					</div>
				</block>
			</scroll-view>
			<view class="time-box">
				<view class="item" v-for="(item,index) in today" :key="index" @click="selectTime(index,item)">
					<view class="item-box" :class="[item.isSelected==false?'disable':'active']">
						<text>{{item.artificerTime}}</text>
						<text class="all">{{item.title}}</text>
					</view>
				</view>
			</view>
			<view class="sub" @click="saveBjd()">保存不接单</view>
			<!-- <view class="push-button">
				<view class="detail-btn" @click="sub()">
					保存选择
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import scrollbarPicker from '@/pages/my/scrollbarPicker.vue'
	import scrollbarEndPicker from '@/pages/my/scrollbarEndPicker.vue'
	import {
		tomorrow,
		dayAfterTomorrow,
		initData,
		initTime,
		timeStamp,
		currentTime,
		dayAfterTomorrowD
	} from '../../utils/date.js'
	import times from '@/components/pretty-times/pretty-times.vue'
	export default {
		components: {
			uniPopup,
			scrollbarPicker,
			scrollbarEndPicker,
			times,
		},
		data() {
			return {
				isPopupShow: false,
				pickerVisible:false,
				pickerEndVisible:false,
				Iselect:false,
				today: [{
					artificerTime: '00:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date

				}, {
					artificerTime: '00:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '01:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '01:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '02:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '02:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '03:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '03:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '04:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '04:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '05:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '05:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '06:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '06:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '07:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '07:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '08:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '08:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '09:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '09:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '10:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '10:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '11:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '11:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '12:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '12:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '13:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '13:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '14:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '14:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '15:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '15:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '16:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '16:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '17:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '17:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '18:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '18:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '19:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '19:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '20:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '20:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '21:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '21:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '22:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '22:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '23:00',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}, {
					artificerTime: '23:30',
					isSelected: false,
					disable: false,
					title: '可预约',
					createTime: currentTime().date
				}],
				checkbox1: [],
				selectedTabColor: 'rgb(40, 186, 146)',
				dateActive: 0, //选中的日期索引
				dateArr: [], //日期数据
				multiSelector: '',
				isTrue: true,
				starTime: '00:00',
				endTime: '23:30',
				appointTime: [],
				disableTimeSlot: [],
				newmsList: [],
				msList: [],
				startTime: '',
				yearsDate: '',
				switchTxt: '',
				timeCurrent: '',
				tomorrowTime: '',
				selected: [],
				timeData: [],
				timeList: ''
			}
		},
		onLoad() {

			if (this.timeCurrent == '') {
				this.timeCurrent = currentTime().date + ' ' + this.starTime;
			}
			if (this.tomorrowTime == '') {
				this.tomorrowTime = currentTime().date + ' ' + this.endTime;
			}
			// this.tomorrowTime=currentTime().date+' '+currentTime().times;
			this.timeList = currentTime().date;
			this.getMsTime(currentTime().date);
			this.initOnload();
			this.getTimeMs(currentTime().myDate)
		},
		methods: {
			showPopup() {
				this.pickerVisible = true;
			},
			showEndPopup(){
				this.pickerEndVisible = true;
			},
			selectItem(item) {
				console.log('选中的项目:', item);
				// 处理选中项逻辑
				// ...
				this.isPopupShow = false;
			},

			isToday(date) {
				const today = new Date();
				return date.getDate() === today.getDate() // 比较日期
					&&
					date.getMonth() === today.getMonth() // 比较月份
					&&
					date.getFullYear() === today.getFullYear(); // 比较年份
			},
			getTimeMs(someDate) {
				// const someDate = new Date(); // 假设你有一个日期对象
				var data = [];
				if (this.isToday(someDate)) {
					var time = currentTime().times
					for (var i = 0; i < this.today.length; i++) {
						if (time <= this.today[i].artificerTime) {
							data.push({
								artificerTime: this.today[i].artificerTime,
								isSelected: true,
								disable: true,
								title: '可预约',
								createTime: currentTime().date
							})
						} else {
							data.push({
								artificerTime: this.today[i].artificerTime,
								isSelected: false,
								disable: false,
								title: '不可预约',
								createTime: currentTime().date
							})
						}
					}
					this.today = data
				} else {
					for (var i = 0; i < this.today.length; i++) {
						data.push({
							artificerTime: this.today[i].artificerTime,
							isSelected: true,
							disable: true,
							title: '可预约',
							createTime: this.timeList
						})
					}
					this.today = data;
					console.log("这个日期不是今天");
				}

			},
			selectTime(index, item) {
				var data = [];
				if (item.disable == true) {
					if (item.isSelected == true) {
						item.isSelected = false;
						item.title = '不可预约';

					} else {
						item.isSelected = true;
						item.title = '可预约';
					}
					var index = this.selected.indexOf(item);
					if (item.huixian == false) { //回显的时候反选
						item.huixian = true
						this.selected.splice(index, 1);
					} else {
						if (index === -1) {
							this.selected.push(item);
						} else {
							this.selected.splice(index, 1);
						}
					}

					this.timeData = this.selected;
					console.log("this.timeData", this.timeData)
				} else {
					console.log("时间过了")
				}
			},
			// 日期选择事件
			selectDateEvent(index, item) {
				const today = new Date();
				this.dateActive = index
				this.selectDate = item.week
				if (item.week == '明天') {
					this.selected = [];
					this.timeList = tomorrow().tomorrow;
					this.getTimeMs(tomorrow().todayT)
				} else if (item.week == '后天') {
					this.selected = [];
					this.timeList = dayAfterTomorrow().dayAfterTomorrow;
					this.getTimeMs(dayAfterTomorrow().todayD)
				} else {
					this.selected = [];
					this.timeList = currentTime().date;
					this.getTimeMs(today)
				}
				this.initOnload()
				this.getMsTime(this.timeList)
			},
			initOnload() {
				var danqian = initData() // 日期栏初始化
				// this.dateArr = initData() // 日期栏初始化
				let newObj = [];
				for (let i = 0; i < 3; i++) {
					let key = danqian[i];
					if (key.week == '今天') {
						key.week = "今天"
					} else if (key.week == "明天") {
						key.week = "明天"

					} else if (key.week == '后天') {
						key.week = "后天";

					}
					newObj.push(key)
				}
				this.dateArr = newObj

			},
			bindTimeChange: function(e) { // 当天接单开始时间
				console.log(e);
				this.starTime = e;
				this.timeCurrent = currentTime().date + ' ' + this.starTime;
				console.log(this.timeCurrent);
			},
			bindTimeChangeEndTime(e) { //次日接单结束时间
				this.endTime = e;
				this.tomorrowTime = currentTime().date + ' ' + this.endTime;
				console.log(this.tomorrowTime);
			},
			switch1Change: function(e) {
				this.switchTxt = e.detail.value
				var time = ''
				if (this.switchTxt == true) {
					time = '1'
				} else {
					time = '2'
				}
				this.sfJdan(time)

			},
			sfJdan(time) { //是否接单
				var data = {
					flag: time,
					artificerId: uni.getStorageSync('artificerId')
				}
				this.$Request.postT('/app/artificerTime/setArtificerAccept', data).then(res => {
					if (res.code == 0) {
						this.$queue.showToast('设置成功！')
						this.getMsTime(this.timeList)
					} else {
						this.$queue.showToast(res.msg);
					}
				});
			},
			getTime(time) {
				this.msList = time;
			},
			scrollTo(titleNo) {
				let index = this.list.indexOf(titleNo);
				index -= 2;
				let num = index * this.itemHeight;
				this.$refs.scrollMenuRef.wrap.scrollTop = num;
			},
			sub() {
				if (this.endTime >= this.starTime) {
					this.saveMangShi();
				} else {
					this.$queue.showToast('开始时间需早于结束时间！');
				}
				// if (this.msList.length == 0) {
				// if(this.yearsDate === ''){
				// 	this.$queue.showToast('请先添加待选时间！');
				// 	return;
				// }
				// uni.showModal({
				// 	title: '温馨提示',
				// 	content: '是否将待选区的时间设置为忙时？',
				// 	showCancel: true,
				// 	cancelText: '取消',
				// 	confirmText: '确认',
				// 	success: res => {
				// 		if (res.confirm) {
				// 			this.saveMangShi();
				// 		}
				// 	}
				// });
			},
			//删除规格
			bindupdata(index1, item) {
				let over = false;
				for (var i = 0; i < this.newmsList.length; i++) {
					if (this.newmsList[i].artificerTime === item) {
						if (this.newmsList[i].classify == 1) {
							over = true;
							break;
						}
					}
				}
				if (!over) {
					this.msList.splice(index1, 1)
				} else {
					ithis.$queue.showToast('当前时间已被用户下单，禁止删除！')
				}
			},
			saveMangShi() {
				console.log(this.starTime);
				console.log(this.endTime);
				console.log(this.timeCurrent);
				console.log(this.tomorrowTime);
				this.$queue.showLoading('设置中...');
				var time = [];
				for (var i = 0; i < this.timeData.length; i++) {
					time.push(
						this.timeData[i].createTime + ' ' + this.timeData[i].artificerTime
					)
				}
				var data = {
					idleTime: this.timeCurrent + ',' + this.tomorrowTime,
					busyTime: time.toString(),
					artificerId: uni.getStorageSync('artificerId')
				}
				if (this.selectDate == '明天') {
					data.idleTime = (this.timeList + ' ' + this.starTime) + ',' + (dayAfterTomorrow().dayAfterTomorrow +
						' ' + this.endTime);
				} else if (this.selectDate == '后天') {
					data.idleTime = (this.timeList + ' ' + this.starTime) + ',' + (dayAfterTomorrowD().dayAfterTomorrowD +
						' ' + this.endTime);
				}
				this.$Request.postT('/app/artificerTime/setArtificerTime', data).then(res => {
					if (res.code == 0) {
						this.$queue.showToast('设置成功！')
						this.getMsTime(this.timeList)
					} else {
						this.$queue.showToast(res.msg);
					}
				});
			},
			saveJd() {
				this.$queue.showLoading('设置中...');
				var data = {
					idleTime: this.timeCurrent + ',' + this.tomorrowTime,
					artificerId: uni.getStorageSync('artificerId')
				}
				if (this.selectDate == '明天') {
					data.idleTime = (this.timeList + ' ' + this.starTime) + ',' + (dayAfterTomorrow().dayAfterTomorrow +
						' ' + this.endTime);
				} else if (this.selectDate == '后天') {
					data.idleTime = (this.timeList + ' ' + this.starTime) + ',' + (dayAfterTomorrowD().dayAfterTomorrowD +
						' ' + this.endTime);
				}
				this.$Request.postT('/app/artificerTime/setArtificerJdTime', data).then(res => {
					if (res.code == 0) {
						this.$queue.showToast('设置成功！')
						this.getMsTime(this.timeList)
					} else {
						this.$queue.showToast(res.msg);
					}
				});
			},
			saveBjd() {
				var time = [];
				for (var i = 0; i < this.timeData.length; i++) {
					time.push(
						this.timeData[i].createTime + ' ' + this.timeData[i].artificerTime
					)
				}
				var data = {
					busyTime: time.toString(),
					artificerId: uni.getStorageSync('artificerId')
				}
				this.$Request.postT('/app/artificerTime/setArtificerBjdTime', data).then(res => {
					if (res.code == 0) {
						this.$queue.showToast('设置成功！')
						this.getMsTime(this.timeList)
					} else {
						this.$queue.showToast(res.msg);
					}
				});
			},
			getMsTime(artificerDate) {
				// this.yearsDate = artificerDate;
				this.$Request.getT('/app/artificerTime/selectArtificerTimeByArtificerId?artificerId=' + uni.getStorageSync(
					'artificerId') + '&artificerDate=' + artificerDate).then(res => {
					if (res.code == 0) {
						if (res.data != '') {
							var data = [];
							for (var i = 0; i < res.data.length; i++) {
								data.push({
									artificerTime: res.data[i].artificerTime,
									isSelected: false,
									disable: true,
									title: '不可预约',
									createTime: res.data[i].artificerDate,
								})
							}
							this.today.forEach(item1 => {
								let item2 = data.find(item => item.artificerTime == item1.artificerTime);
								if (item2) {
									item1.isSelected = false;
									item1.title = '不可预约';
									item1.huixian = false;
								} else {
									item1.isSelected = true
									item1.title = '可预约'
									item1.huixian = true;
								}
							});
						}

						var jintian = currentTime().date; //今天
						var mingtian = tomorrow().tomorrow; //明天
						var houtian = dayAfterTomorrow().dayAfterTomorrow; //后天
						if (res.acceptOrders == 1) {
							this.isTrue = true
						} else if (res.acceptOrders == 2) {
							this.isTrue = false
						}
						if (res.startTime) {
							this.starTime = res.startTime.slice(0, 5);
							this.timeCurrent = jintian + ' ' + this.starTime;
						} else {
							// 获取当前时间
							const now = new Date();
							// 格式化时间为时分
							const hours = now.getHours();
							const minutes = now.getMinutes();
							// 将分钟划分为半小时
							let halfHour = false;
							if (minutes >= 30) {
								halfHour = true;
							}
							// 格式化输出
							this.starTime = `${hours.toString().padStart(2, '0')}:${halfHour ? '30' : '00'}`;
							this.timeCurrent = jintian + ' ' + this.starTime;
						}
						this.endTime = res.endTime.slice(0, 5);
						//this.Iselect = true;
					} else {
						this.isTrue = false
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container-top span:nth-child(1) {
		font-size: 14px;
		font-weight: bold;
		margin-right: 5px;
		margin-left: 20rpx;
	}

	.container-top span:nth-child(2) {
		font-size: 13px;
		color: #ccc;
	}

	.container-top {
		width: 100%;
		display: flex;
		flex-direction: row;
		background: #fff;
		padding-top: 10px;
		padding-left: 5px;
	}

	.active {
		border: 1px solid #28ba92;
		font-weight: bold;
		color: rgb(40, 186, 146);
	}

	.disable {
		border: 1px solid #EEEEEE;
		background: #F1F3F6 !important;
		color: #999;
	}

	/deep/.checkbox__inner {
		display: none;
	}

	.all {
		white-space: nowrap;
		font-size: 10px;
		padding-top: 5px;
	}

	.item-box {
		width: 100%;
		height: 50px;
		padding: 0 21px;
		background: #fff;
		font-size: 13px;
		border-radius: 4px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.item {
		width: 25%;
		padding: 0 4px;
		margin: 6px 0;
	}

	.time-box {
		width: 100%;
		padding: 13px 5px 12px;
		display: flex;
		flex-wrap: wrap;
		background-color: #fff;
	}

	.flex-box .date-box {
		border: none;
		display: flex;
		height: 50px;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		font-size: 14px;
		color: #818181;
	}

	.flex-box {
		display: inline-block;
		height: 60px;
		width: 33%;
		margin: 0 3px 0 3px;
		box-sizing: border-box;
	}

	/deep/.uni-scroll-view-content {
		display: flex;
	}

	/deep/.scroll-view_H {
		width: 100%;
		white-space: nowrap;
		height: 75px;
		background-color: #fff;
		position: relative;
		padding-top: 10px;
	}

	.borderb {
		border-bottom: 2px solid rgb(40, 186, 146);
	}

	.selectTimt-time-title {
		text-align: center;
		margin-bottom: 5px;
	}

	/deep/.uni-input {
		text-align: center;
		color: #28BA92;
	}

	.selectTimt-time {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.selectTimt-bottom {
		margin-top: 10px;
		width: 100%;
	}

	.selectTimt {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 10px 5px;
		background: #fff;
		margin: 10px auto;
	}

	.dx_title {
		font-size: 14px;
		font-weight: bold;
		margin-left: 20rpx;
	}

	.switchTxt {
		font-size: 13px;
		font-weight: 400;
		margin-left: 5px;
		color: #28BA92;
	}

	.timeView-top {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: 10px 5px;
		background: #fff;
		margin: 10px auto;
	}

	page {
		background: #f7f7f7;
	}

	.dx_view {
		background: #FFFFFF;
		border-radius: 8rpx;
		padding: 20rpx 20rpx 40rpx;
		width: 710rpx;
		margin-top: 20rpx;

		.dx_title {
			font-size: 30rpx;
			font-weight: bold;
		}
	}

	.timeView {
		display: flex;
		width: 750rpx;
		flex-wrap: wrap;

		.timeview_item {
			background: #F7F7F7;
			border-radius: 15rpx;
			width: 120rpx;
			height: 140rpx;
			text-align: center;
			padding-top: 14rpx;
			margin: 20rpx 20rpx 20rpx 6rpx;
		}

		.timeview_acitem {
			width: 120rpx;
			height: 140rpx;
			text-align: center;
			background: #E8F9EF;
			border: 1px solid #00B88F;
			color: #00B88F;
			border-radius: 15rpx;
			padding-top: 14rpx;
			margin: 20rpx 20rpx 20rpx 6rpx;
		}

		.item_text {
			width: 120rpx;
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 500;
			margin-top: 6rpx;
		}
	}

	.btn {
		border: 1upx solid #CCCCCC;
		border-radius: 28px;
		padding: 15rpx 30rpx;
		margin-right: 25rpx;
	}

	.btns {
		border: 1upx dashed #333333;
		border-radius: 28px;
		padding: 10rpx 30rpx;
		margin-right: 25rpx;
	}



	.topView {
		width: 750rpx;
		height: 180rpx;
		background: #FFFFFF;

		.topview_item {
			width: 160rpx;
			height: 120rpx;
			text-align: center;
			padding-top: 14rpx;
			margin: 0rpx 10rpx;
		}

		.topview_acitem {
			width: 160rpx;
			height: 120rpx;
			text-align: center;
			background: #E8F9EF;
			border: 1px solid #00B88F;
			color: #00B88F;
			border-radius: 20rpx;
			padding-top: 14rpx;
			margin: 0rpx 10rpx;
		}

		.item_text {
			width: 160rpx;
			font-size: 20rpx;
			font-family: PingFang SC;
			font-weight: bold;
			margin-top: 6rpx;
		}
	}

	.sub {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 696rpx;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 50rpx;
		margin: 20rpx auto 20rpx auto;
		color: #FFFFFF;
		font-size: 30rpx;
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
	}

	.push-button {
		width: 100%;
		height: 48px;
		position: fixed;
		bottom: 0px;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 0 auto;
	}

	.detail-btn {
		display: inline-block;
		width: 92%;
		text-align: center;
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
		height: 40px;
		border-radius: 28px;
		color: #ffffff;
		line-height: 40px;
		margin-top: 4px;
		font-size: 34rpx;
	}

	.list {
		background-color: #fff;

		/deep/ .uni-scroll-view-content {
			display: flex;
			flex-flow: column;
			align-items: center;
			overflow-x: hidden;
		}

	}

	.list-item {
		height: 40px;
		box-sizing: border-box;
		line-height: 40px;
		color: #bfc2c9;
	}

	.active_li {
		color: #000;
		border-top: 1px solid #bfc2c9;
		border-bottom: 1px solid #bfc2c9;
	}

	.popup-content {
		display: flex;
		justify-content: space-between;
	}
	.listTime{
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
	}
</style>