<template>
	<view class="ctime_main">
		<view v-if="combo_name" style="display: flex;justify-content: space-between;padding: 40rpx;">
			<view>
				<view style="font-size: 33rpx;">{{person_name}}</view>
				<view style="font-size: 23rpx;color:#008F96;margin-top: 10rpx;">{{combo_name}}</view>
			</view>
			<view>
				<view style="font-size: 33rpx;">{{doctor_name?doctor_name:"体检医生"}}</view>
				<view class="doctor_button" @click="selectDoctor()">
					<uni-icons type="search" color="#D8EEF3" size="16"></uni-icons>
					<view>请选择</view>
				</view>
			</view>
		</view>
		<view class="zhouli">
			<WeeklyCalendar v-if="weekList" :dataInfo="weekList" :selectedTime="selectedTime" :YuYueInfo="YuYueInfo"
				:TjDTime="tj_date+' '+tj_time" :ItemSelected="itemSelected" @selectDate="selectDateFunc"
				@selectTime="selectTimeFunc" @openMonth="openMonthFunc" />
		</view>
		<view class="dateitem" v-if="orderInfo">
			<view
				style="background-color: #f7f7f7; padding: 20rpx; font-size: 30rpx; border-radius: 20rpx;color: #333;">
				<view>{{orderInfo.name}}</view>
				<view
					style="background-color: #f1f1f1;padding: 20rpx 10rpx; margin-top: 10rpx;border-radius: 14rpx;font-size: 28rpx;color: #666;">
					<view v-if="YuYueInfo.NmrInfo.length>0">
						<view @click="itemClick('nmr',item_nmr,index_nmr)"
							v-for="(item_nmr,index_nmr) in YuYueInfo.NmrInfo" :key="index_nmr" style="padding: 20rpx;"
							:class="(itemSelected.type=='nmr' && itemSelected.index==index_nmr)?'itemSelected':''">

							{{item_nmr.name}} <span v-if="item_nmr.date && item_nmr.time">{{item_nmr.date}}
								{{item_nmr.time}}</span>

						</view>
					</view>

					<view @click="itemClick('tj','',0)" style="margin-top: 10rpx;padding: 20rpx;color: #666;"
						:class="itemSelected.type=='tj'?'itemSelected':''">体检日期 <span
							v-if="tj_date && tj_time">{{tj_date}}
							{{tj_time}}</span></view>

				</view>

			</view>
		</view>
		<view class="pb-100rpx">
			<!-- <view @click="StartYuYue()"
				class="text-#fff text-32rpx rounded-45rpx bg-#239EA3 mt-40rpx ma w-520rpx h-90rpx flex flex-items-center flex-justify-center">
				确定
			</view> -->
			<view @click="StartYuYue()" class="check_done_wrapper">立即预约</view>
		</view>
		<view id="ylrl">
			<uni-calendar :insert="false" :showMonth="false" ref="DoctorMonthCalendar" @confirm="DoctMonthConfirm" />
			<uni-calendar :selected="MonthList" @monthSwitch="monthSwitch" :insert="false" :showMonth="false"
				ref="MonthCalendar" @confirm="MonthConfirm" />
		</view>
	</view>
</template>

<script setup>
	import {
		onMounted,
		ref
	} from 'vue';
	import {
		$image,
		$api,
		$response
	} from "@/api";
	import {
		useStore
	} from "@/store";
	const $store = useStore();
	import {
		onShow,
		onLoad
	} from "@dcloudio/uni-app";
	import WeeklyCalendar from '@/common/WeeklyCalendar.vue';
	let nmr_date = ref(null);
	let nmr_time = ref(null);
	let nmr_plan_id = ref(null); //核磁号源id
	let buyInfo = ref({}); // 购买信息
	let yytjInfo = ref({}); // 预约信息

	let tj_date = ref(null);
	let tj_time = ref(null);
	let tj_plan_id = ref(null); //体检号源id

	let weekList = ref(null);

	let doctor_name = ref(null);

	let hospital_id = ref(0);
	let person_id = ref(0)
	let use_type = ref(0)
	let checkup_type_id = ref(0)
	let amount = ref(0)
	let person_name=ref('')
	let combo_name=ref('')
	//查询体检号源
	const GetDayPlanListFunc = async () => {
		uni.showLoading();
		let data = {
			hospital: hospital_id.value,
			person_id: person_id.value,
			date: selectedDate.value,
			use_type:use_type.value,
			checkup_type_id: checkup_type_id.value,
			amount: amount.value,
		}
		const response = await $api("GetDayPlanList", data);
		uni.hideLoading();
		$response(response, () => {
			weekList.value = response.data

		});
	};
	//查询核磁号源
	const NMRGetDayPlanListFunc = async () => {
		uni.showLoading();
		let data = {
			hospital: orderInfo.value.hospital_id,
			date: selectedDate.value,
		}
		const response = await $api("NMRGetDayPlanList", data);
		uni.hideLoading();
		$response(response, () => {
			weekList.value = response.data

		});
	};
	let selectedTime = ref(null);
	let orderInfo = ref(null)
	let YuYueInfo = ref({
		TjInfo: {},
		NmrInfo: {}
	})
	const GetOrderInfo = async () => {
		uni.showLoading();
		const response = await $api("GetOrderDetail", {
			id: OrderId.value
		});
		uni.hideLoading();
		$response(response, () => {
			orderInfo.value = response.data.info
			doctor_name.value = orderInfo.value.doctor

			itemSelected.value.type = 'tj'
			selectedTime.value = orderInfo.value.appointment_time
			selectedDate.value = orderInfo.value.appointment_date

			GetDayPlanListFunc()


			tj_date.value = response.data.today
			tj_time.value = orderInfo.value.appointment_time
			tj_plan_id.value = orderInfo.value.plan_id
			
			hospital_id.value=orderInfo.value.hospital_id
			person_id.value=orderInfo.value.person_id
			use_type.value=orderInfo.value.type
			checkup_type_id.value=orderInfo.value.checkup_type_id
			amount.value=orderInfo.value.true_price
			person_name.value=orderInfo.value.name
			combo_name.value=orderInfo.value.title
		});
	}

	//weekly子组件点击了日期
	let selectedDate = ref(null);
	const selectDateFunc = (date) => {
		if (doctor_name.value) {
			uni.showModal({
				title: '提示',
				content: '已选择医生，切换日期将重新选择医生，是否继续',
				cancelText: '取消',
				confirmText: '确定',
				success: function(res) {
					if (res.confirm) {
						DateChange(date)
					} else if (res.cancel) {

					}
				}
			});
		} else {
			DateChange(date)
		}
	}
	//weekly子组件点击了时间
	let SelectedPlanId = ref(null)
	const selectTimeFunc = (timeinfo) => {
		selectedTime.value = timeinfo.time
		SelectedPlanId.value = timeinfo.id
		if (itemSelected.value.type == 'nmr') {
			YuYueInfo.value.NmrInfo[itemSelected.value.index].time = timeinfo.time
			nmr_plan_id.value = timeinfo.id
		}
		if (itemSelected.value.type == 'tj') {
			tj_time.value = timeinfo.time
			tj_plan_id.value = timeinfo.id
		}
	}
	let itemSelected = ref({
		type: null,
		item: {},
		index: 0
	});
	const itemClick = (type, item, index) => {
		//weekList.value=null

		if (type == 'nmr') {
			//selectedTime.value = nmr_time.value
			//selectedDate.value = nmr_date.value
			selectedTime.value = YuYueInfo.value.NmrInfo[index].time
			selectedDate.value = YuYueInfo.value.NmrInfo[index].date
			NMRGetDayPlanListFunc()
		}
		if (type == 'tj') {
			selectedTime.value = tj_time.value
			selectedDate.value = tj_date.value
			GetDayPlanListFunc()
		}
		itemSelected.value.type = type
		itemSelected.value.item = item
		itemSelected.value.index = index
	}

	let DoctorMonthCalendar = ref(null)
	const selectDoctor = () => {

		if (tj_date.value == null) { //如果没有选定体检日期，则打开日历
			DoctorMonthCalendar.value.open();
		} else {
			uni.navigateTo({
				url: `/pages/main/selectDoctor/selectDoctor?date=${tj_date.value}`,
			});
		}

	}
	//点击医生月历日期后跳转
	const DoctMonthConfirm = (e) => {
		tj_date.value = e.year + "-" + e.month + "-" + e.date
		uni.navigateTo({
			url: `/pages/main/selectDoctor/selectDoctor?date=${tj_date.value}`,
		});
	}
	let MonthCalendar = ref(null)
	let MonthList = ref([]); //月历号源数据
	let currentDate = ref(null); //月历当前日期
	const monthSwitch = (e) => { //月历切换月份
		let ym = e.year + "" + "-" + e.month + ""
		if (itemSelected.value.type == 'nmr') {
			NMRGetMonthPlanListFunc(ym)
		}
		if (itemSelected.value.type == 'tj') {
			GetMonthPlanListFunc(ym)
		}
	}
	const MonthConfirm = (e) => { //月历确认日期
		console.log(e.fulldate)

		if (doctor_name.value) {
			uni.showModal({
				title: '提示',
				content: '已选择医生，切换日期将重新选择医生，是否继续',
				cancelText: '取消',
				confirmText: '确定',
				success: function(res) {
					if (res.confirm) {
						DateChange(e.fulldate)
					} else if (res.cancel) {

					}
				}
			});
		} else {
			DateChange(e.fulldate)
		}


	}
	//获取体检每月号源数量
	const GetMonthPlanListFunc = async (ym = '') => {
		uni.showLoading();
		let data = {
			hospital: hospital_id.value,
			person_id: person_id.value,
			month: ym ? ym : tj_date.value.substring(0, 7),
			use_type:use_type.value,
			checkup_type_id: checkup_type_id.value,
			amount: amount.value,
		}
		const response = await $api("GetMonthPlanCount", data);
		uni.hideLoading();
		$response(response, () => {
			let rlArr = [];
			response.data.list.forEach((item) => {
				let o = {
					date: item.date,
					info: "余号" + item.count,
				};
				rlArr.push(o);
			});
			MonthList.value = rlArr;
			//MonthCalendar.value.open()
		});
	};
	//获取核磁每月号源数量
	const NMRGetMonthPlanListFunc = async (ym = '') => {
		uni.showLoading();
		let data = {
			hospital: orderInfo.value.hospital_id,
			month: ym ? ym : YuYueInfo.value.NmrInfo[itemSelected.value.index].date.substring(0, 7),
		}
		const response = await $api("NMRGetMonthPlanCount", data);
		uni.hideLoading();
		$response(response, () => {
			let rlArr = [];
			response.data.list.forEach((item) => {
				let o = {
					date: item.date,
					info: "余号" + item.count,
				};
				rlArr.push(o);
			});
			MonthList.value = rlArr;
			//MonthCalendar.value.open()
		});
	};
	//打开月历
	const openMonthFunc = async () => {
	 
		if (itemSelected.value.type == 'nmr') {
			await NMRGetMonthPlanListFunc()
		}
		if (itemSelected.value.type == 'tj') {
			await GetMonthPlanListFunc()
		}
		MonthCalendar.value.open()
	}
	//点击提交
	const StartYuYue =  () => {
		if(buyInfo.value.group_id){
			//如果是团检则创建订单
			comfrimyy()
		}else{
			//先前已经创建订单，单纯进行预约
			OnlyYuYue()
		}
	}
	//创建订单
	const comfrimyy = async () => {
		yytjInfo.value = $store.getYytjInfo();
	  let plan_id = "";
	  let plan_nmr_id = "";
	  uni.showLoading();
	  console.log(yytjInfo.value?.nmr_list);
	  for (let i = 0; i < yytjInfo.value?.nmr_list?.length; i++) {
	    if (!yytjInfo.value?.nmr_list[i].id) {
	      uni.$lu.toast("请完善预约时间");
	      uni.hideLoading();
	      return;
	    }
	  }
	  
	
	  if (yytjInfo.value?.nmr_list?.length > 1) {
	    plan_nmr_id = yytjInfo.value?.nmr_list[0]?.id;
	  }
	  if (yytjInfo.value?.nmr_list?.length > 0) {
	    plan_id = yytjInfo.value?.nmr_list[yytjInfo.value?.nmr_list.length - 1]?.id;
	  }
	
	 
	
	  let obj = {
	    person_id: buyInfo.value.person_id,
	    type: buyInfo.value.group_id ? 2 : 1,
	    hospital: buyInfo.value.hospital,
	    group_id: buyInfo.value.group_id,
	    combo_id:buyInfo.value.group_id?"":buyInfo.value?.combo_id,
	    item_ids: buyInfo.value.item_ids,
	    plan_id: plan_id,
	    plan_nmr_info:yytjInfo.value?.nmr_list || null,
	    doctor: yytjInfo.value?.doctor_name || "",
	    duo_xuan_yi: $store.getDuoXuanYi(),
	    jifen: Math.ceil(yytjInfo.value.pointsPrice?yytjInfo.value.pointsPrice:0),
	    yucunkuan: yytjInfo.value.prepaidPrice?yytjInfo.value.prepaidPrice:0,
		coupon_id:yytjInfo.value?.couponId || null,
	    wj: buyInfo.value.wj,
		erxian_info:erxianInfo.value,
		peiou_info:$store.getPeiOuUser()//配偶信息
	  };
	  console.log(obj);
	  const response = await $api("OrderCreate", obj);
	  $response(response, () => {
	    if (response.status) {
	      if (response.data.action == "pay") {
	        StartPay(response.data.orderid);
	      } else {
	        uni.navigateTo({
	          url: "/pages/buy/done/done?id=" + response.data.orderid,
	        });
	      }
	    }
	    uni.hideLoading();
	  });
	};
	//先前已经创建订单，单纯进行预约
	const OnlyYuYue=async()=>{
		if (tj_time.value == null) {
			uni.$lu.toast("请选择体检日期");
			return false
		}
		console.log(tj_plan_id.value);
		uni.showLoading();
		let data = {
			orderid: orderInfo.value.id,
			plan_id: tj_plan_id.value,
			nmr_info: YuYueInfo.value.NmrInfo,
			doctor: doctor_name.value
		}
		console.log(data);
		const response = await $api("StartYuYue", data);
		uni.hideLoading();
		$response(response, () => {
			if (response.status) {
				uni.showToast({
					title: '预约完成'
				});
				setTimeout(() => {
					uni.redirectTo({
						url: '/pages/main/order/order'
					})
				}, 1000)
		
			}
		});
	}
	//改变日期
	const DateChange = (date) => {
		selectedDate.value = date
		selectedTime.value = null
		if (itemSelected.value.type == 'nmr') {
			YuYueInfo.value.NmrInfo[itemSelected.value.index].time = null
			YuYueInfo.value.NmrInfo[itemSelected.value.index].date = date

			tj_time.value = null //如果切换核磁日期则清空体检选择的日期时间
			tj_date.value = null
			doctor_name.value = null //清空体检医生
			NMRGetDayPlanListFunc()
		}
		if (itemSelected.value.type == 'tj') {
			tj_time.value = null
			tj_date.value = date
			doctor_name.value = null //清空体检医生
			GetDayPlanListFunc()
		}
	}

	let temp = null
	onMounted(() => {
		itemSelected.value.type='tj'
		buyInfo.value = $store.getBuyInfo();
		//清空一下缓存的医生，防止出问题
		temp = $store.getYytjInfo()
		temp.doctor_name = ""
		$store.setYytjInfo(temp)
		selectedDate.value = GetToday()
		tj_date.value=GetToday()
		if (OrderId.value) {
			GetOrderInfo()
		} else {
			checkup_type_id.value= buyInfo.value.group_id ?
				$store.getGroupInfo()?.checkup_type_id : $store.getCheckupTypeId()?.id,
			hospital_id.value= buyInfo.value.hospital,
			person_id.value= buyInfo.value.person_id,
			use_type.value= buyInfo.value.group_id ? 2 : 1,
			person_name.value=buyInfo.value.group_id ?$store.getGroupInfo()?.name : '',
			combo_name.value=buyInfo.value.group_id ?$store.getGroupInfo()?.group_name : '',
			GetDayPlanListFunc()
		}

	});
	let OrderId = ref(0)
	onLoad((e) => {
		OrderId.value = e.id
	})
	onShow(() => {

		temp = $store.getYytjInfo()
		if (temp.doctor_name != null && temp.doctor_name != '') {
			doctor_name.value = temp.doctor_name
		}

	})
	const GetToday = () => {
		const date = new Date();
		const year = date.getFullYear();
		const month = String(date.getMonth() + 1).padStart(2, '0');
		const day = String(date.getDate()).padStart(2, '0');
		return `${year}-${month}-${day}`;
	}
</script>

<style scoped lang="scss">
	.ctime_main {
		background-color: #D8EEF3;
		height: calc(100vh - 80rpx);
	}

	.top {
		background-color: #fff;
		border-radius: 20rpx;
		margin-bottom: 20rpx;
		padding: 20rpx;
	}

	.zhouli {
		padding: 40rpx;
		background-color: #fff;

	}

	.itemSelected {
		background-color: #e0fafa;
		border-radius: 10rpx;

	}

	.dateitem {
		display: none;
		padding: 20rpx;
		background-color: #fff;
		border-radius: 20rpx;
		margin-top: 20rpx;
	}

	::v-deep #ylrl {

		.uni-calendar__header,
		.uni-calendar__weeks-day {
			border: none;
		}

		.uni-calendar-item--checked {
			background-color: transparent;

			.uni-calendar-item__weeks-box-item {
				background-color: #239ea3 !important;
				border-radius: 12rpx;

				.uni-calendar-item--extra {
					color: #fff !important;
				}
			}
		}

		.uni-calendar-item--isDay {
			background-color: #239ea3 !important;
			border-radius: 12rpx;
			color: #fff !important;
		}

		.uni-calendar-item--extra {
			color: #239ea3;
		}

		.uni-calendar-item__weeks-box {
			// padding: 10rpx;
			box-sizing: border-box;
		}

		.uni-calendar-item__weeks-box-circle {
			background-color: rgba(0, 0, 0, 0);
		}

		.uni-calendar-item--isDay-text {
			color: #333;
		}

		.uni-calendar-item__weeks-box-text {
			font-size: 26rpx;
		}

		.uni-calendar-item__weeks-lunar-text {
			font-size: 16rpx;
		}

		.uni-calendar-item__weeks-box-item {
			width: 100%;
		}

		.uni-calendar__backtoday {
			display: none;
		}
	}

	.doctor_button {
		display: flex;
		background-color: #fff;
		padding-left: 10rpx;
		padding-top: 2rpx;
		height: 40rpx;
		line-height: 40rpx;
		border-radius: 24rpx;
		margin-top: 10rpx;
		color: #9E9E9F;
		font-size: 20rpx;
		text-align: center;
		width: 120rpx;
	}

	.check_done_wrapper {
		width: 660rpx;
		height: 70rpx;
		line-height: 70rpx;
		margin: 80rpx auto 0;
		border-radius: 20rpx 20rpx 0rpx 0rpx;
		background: #00939B;
		font-weight: 700;
		font-size: 29rpx;
		color: #F6FDFD;
		text-align: center;
		position: absolute;
		bottom: 40rpx;
		left: 45rpx;

	}
</style>