<template>
	<view class="app">
		<view class="content">
			<view class="appointtime">预约时间
			</view>
			<uni-datetime-picker v-if="listitem.sourceType==2" v-model="datetimerange" type="datetimerange"
				rangeSeparator="至" />
			<uni-datetime-picker type="datetime" v-model="datetimesingle" @change="changeLog"
				v-if="listitem.sourceType==1" />
			<view class="submit" @tap="submit">
				提交
			</view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	import {
		detail,
		save
	} from '@/api/pagesC/ServiceAppointment/ServiceAppointment.js'
	export default {
		data() {
			return {
				show: false,
				mode: 'date',
				appointlist: [],
				datetimesingle: [Date.now(), this.todayEndTime()],
				listitem: {
					bookingTime: '',
					identity: '',
				},
				datetimerange: [Date.now(), this.todayEndTime()],
			};
		},
		watch: {
			datetimesingle(newval) {
				console.log("单选:", this.datetimesingle);
				// this.listitem.bookingTime=this.datetimesingle
			},
			// range(newval) {
			// 	console.log("范围选:", this.range);
			// },
			// datetimerange(newval) {
			// 	console.log("范围选:", this.datetimerange);
			// },
		},
		onLoad(e) {
			this.userinfo = uni.getStorageSync('userinfo');
			// this.listitem.identity=this.userinfo.cardNo
			this.appointlist = JSON.parse(e.item)
			this.listitem = this.appointlist
		},
		methods: {
			changeLog(e) {
				this.listitem.bookingTime = e
			},
			change(e) {
				this.listitem.bookingTime = e.result
			},
			todayEndTime() {
				let todayYear = (new Date()).getFullYear();
				let todayMonth = (new Date()).getMonth();
				let todayDay = (new Date()).getDate();
				let todayTime = (new Date(todayYear, todayMonth, todayDay, '23', '59', '59')).getTime();
				return todayTime
			},
			submit() {
				if (this.listitem.sourceType == '1') {
					this.listitem.packageNo = this.appointlist.packageId
					this.listitem.formNo = this.appointlist.projectId
					this.listitem.identity = this.userinfo.cardNo
					this.listitem.formName = this.appointlist.projectName
					// this.$delete(this.listitem, 'projectId')
					// this.$delete(this.listitem, 'projectName')
					if (!this.listitem.bookingTime) {
						this.$refs.uToast.show({
							title: '请选择预约时间',
							type: 'error'
						})
					} else {
						detail(this.listitem).then(res => {
							if (res.code == 200) {
								this.$refs.uToast.show({
									title: '预约成功',
									type: 'success',
								})
							} else if (res.code == '500') {
								this.$refs.uToast.show({
									title: res.msg,
									type: 'error'
								})
							}
						})
					}
				} else if (this.listitem.sourceType == '2') {
					this.listitem.identity = this.userinfo.cardNo
					this.listitem.applyStartTime = this.datetimerange[0]
					this.listitem.applyEndTime = this.datetimerange[1]
					console.log(this.listitem, '555')
					if (!this.listitem.applyStartTime && !this.listitem.applyEndTime) {
						this.$refs.uToast.show({
							title: '请选择预约时间',
							type: 'error'
						})
					} else {
						save(this.listitem).then(res => {
							if (res.code == 200) {
								this.$refs.uToast.show({
									title: '预约成功',
									type: 'success',
								})
								uni.navigateBack({
									delta: 1
								})
							} else if (res.code == '500') {
								this.$refs.uToast.show({
									title: res.msg,
									type: 'error'
								})
							}
						})
					}
				}
			}
		},
	}
</script>

<style lang="scss">
	.app {
		height: 100vh;
		background-color: #F7F5F5;
		padding: 30rpx 0 0 0;

		.content {
			width: 95%;
			height: 100%;
			background: #FFFFFF;
			box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
			border-radius: 5rpx;
			margin: 0 auto;

			.submit {
				width: 496rpx;
				height: 61rpx;

				background: #26A888;
				border-radius: 5rpx;
				line-height: 61rpx;
				color: #FFFFFF;
				text-align: center;
				position: absolute;
				left: 50%;
				transform: translateX(-50%);
				position: fixed;
				bottom: 5%;

			}

			.appointtime {
				font-size: 30rpx;
				padding: 30rpx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #333333;
				line-height: 38rpx;
			}

			.time {
				margin: 0 auto;
				padding: 17rpx;
				width: 80%;
				height: 63rpx;
				background: #F6F6F6;
				border-radius: 5rpx;
				position: relative;

				image {
					width: 36rpx;
					height: 34rpx;
					position: absolute;
					right: 3%;
					top: 50%;
					transform: translateY(-50%);
				}
			}

		}
	}
</style>
