<script setup>
	/**
	 * name：
	 * user：sa0ChunLuyu
	 * date：2024年9月11日 19:24:50
	 */
	import {
		ref
	} from 'vue'
	import {
		$api,
		$response
	} from '@/api'
	import {
		onShow
	} from '@dcloudio/uni-app'
	import {
		useStore
	} from '@/store'
	const $store = useStore()
	const $props = defineProps({
		id: {
			type: String,
			default: '0'
		}
	});

	const getUserInfo = async () => {
		const response = await $api('UserInfo')
		$response(response, () => {
			$store.setUser(response.data.info);
			getQuestionLogInfo()
		})
	}

	const mountedAction = () => {
		getUserInfo()
	}
	const question_info = ref(false)
	const getQuestionLogInfo = async () => {
		const response = await $api('QuestionLogInfo', {
			id: $props.id,
			person: $store.user.person_id,
		})
		$response(response, () => {
			question_info.value = response.data
		})
	}

	const config_ref = ref(null)
	const configRef = (e) => {
		if (!config_ref.value) {
			config_ref.value = e
			mountedAction()
		}
	}

	const toPath = (path) => {
		uni.navigateTo({
			url: `/pages/main/question${path}`
		})
	}

	const QuestionLogDelete = async () => {
		const response = await $api('QuestionLogDelete', {
			id: $props.id,
			person: $store.user.person_id,
		})
		$response(response, () => {
			uni.redirectTo({
				url: `/pages/main/question/list/list`
			})
		})
	}

	const itemShow = (type) => {
		const id = question_info.value.check_items_array[type].combo
		const mergedArray = [...new Set([
			...question_info.value.items,
			...question_info.value.check_items_array[type].items,
			...question_info.value.check_items_array[type].combo_items,
		])]
		if (mergedArray.length !== 0) {
			let query = "?wj=1&itemIds=" + mergedArray.join(',');
			uni.navigateTo({
				url: "/pages/main/tj/tjxq" + query,
			});
		}
	}

	onShow(() => {
		if (!!config_ref.value) {
			mountedAction()
		}
	})
</script>
<template>
	<view>
		<view v-if="!!$store.config">
			<view :ref="configRef"></view>
		</view>
		<view v-if="!!question_info">
			<view class="tip_wrapper">
				根据风险评估结果，为您制定了以下不同档次的体检方案，档次越高，检查越深入
			</view>
			<view class="items_list_wrapper">
				<view class="items_item_wrapper">
					<view class="items_title_wrapper">
						<view class="items_title_text_wrapper">基础推荐方案</view>
						<view class="items_title_count_wrapper">
							<text>{{ question_info.count.jichu }}项</text>
							<view class="count_icon_wrapper">
								<uni-icons type="right" size="20"></uni-icons>
							</view>
						</view>
					</view>
					<view class="items_line_wrapper"></view>
					<view class="items_tip_wrapper">
						本方案根据您的身体状况进行基础检查，经济实用，避免过度检查
					</view>
					<!-- <view class="price_wrapper">
						<view>¥ {{ question_info.price.jichu }}</view>
						<view class="original_price_wrapper">原价 ¥{{ question_info.original_price.jichu }}</view>
					</view> -->
					<view class="item_button_wrapper">
						<view @click="itemShow('jichu')" class="button_wrapper">查看详细方案</view>
					</view>
				</view>

				<view v-if="Number(question_info.check_items_array.tuijian.combo) !== 0" class="items_item_wrapper">
					<view class="items_title_wrapper">
						<view class="items_title_text_wrapper">中等推荐方案</view>
						<view class="items_title_count_wrapper">
							<text>{{ question_info.count.tuijian }}项</text>
							<view class="count_icon_wrapper">
								<uni-icons type="right" size="20"></uni-icons>
							</view>
						</view>
					</view>
					<view class="items_line_wrapper"></view>
					<view class="items_tip_wrapper">
						本方案根据您的身体状况进行基础检查，经济实用，避免过度检查
					</view>
					<!-- <view class="price_wrapper">
						<view>¥ {{ question_info.price.tuijian }}</view>
						<view class="original_price_wrapper">原价 ¥{{ question_info.original_price.tuijian }}</view>
					</view> -->
					<view class="item_button_wrapper">
						<view @click="itemShow('tuijian')" class="button_wrapper">查看详细方案</view>
					</view>
				</view>

				<view v-if="Number(question_info.check_items_array.gaoduan.combo) !== 0" class="items_item_wrapper">
					<view class="items_title_wrapper">
						<view class="items_title_text_wrapper">高端推荐方案</view>
						<view class="items_title_count_wrapper">
							<text>{{ question_info.count.gaoduan }}项</text>
							<view class="count_icon_wrapper">
								<uni-icons type="right" size="16"></uni-icons>
							</view>
						</view>
					</view>
					<view class="items_line_wrapper"></view>
					<view class="items_tip_wrapper">
						本方案根据您的身体状况进行基础检查，经济实用，避免过度检查
					</view>
					<!-- <view class="price_wrapper">
						<view>¥ {{ question_info.price.gaoduan }}</view>
						<view class="original_price_wrapper">原价 ¥{{ question_info.original_price.gaoduan }}</view>
					</view> -->
					<view class="item_button_wrapper">
						<view @click="itemShow('gaoduan')" class="button_wrapper">查看详细方案</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<style scoped>
	.button_wrapper {
		width: 230rpx;
		height: 80rpx;
		background: #FFFFFF;
		border-radius: 40rpx;
		border: 1px solid #E5E5E5;
		font-weight: 400;
		font-size: 28rpx;
		color: #239EA3;
		line-height: 80rpx;
		text-align: center;
		margin-right: 41rpx;
	}

	.item_button_wrapper {
		display: flex;
		align-items: center;
		justify-content: end;
		margin-top: 2rpx;
	}

	.price_wrapper {
		font-weight: 500;
		font-size: 28rpx;
		color: #E95515;
		line-height: 1;
		margin-top: 40rpx;
		margin-left: 37rpx;
		display: flex;
		align-items: center;
	}

	.original_price_wrapper {
		margin-left: 20rpx;
		text-decoration: line-through;
		opacity: 0.8;
	}

	.items_tip_wrapper {
		width: 624rpx;
		font-weight: 400;
		font-size: 28rpx;
		color: #4A5060;
		line-height: 48rpx;
		margin: 31rpx auto 0;
	}

	.items_line_wrapper {
		margin: 0 auto;
		width: 653rpx;
		height: 1rpx;
		background: #E3E3E4;
	}

	.count_icon_wrapper {
		margin-left: 10rpx;
	}

	.items_title_count_wrapper {
		display: flex;
		align-items: center;
		font-weight: 400;
		font-size: 30rpx;
		color: #4A5060;
		line-height: 48rpx;
	}

	.items_title_text_wrapper {
		font-weight: 500;
		font-size: 34rpx;
		color: #0C0C0C;
		line-height: 1;
	}

	.items_title_wrapper {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 106rpx;
		width: calc(100% - 60rpx);
		margin: 0 auto;
	}

	.items_list_wrapper {
		margin-top: 25rpx;
	}

	.items_item_wrapper {
		width: 710rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
		border-radius: 15rpx;
		margin: 15rpx auto 0;
		padding-bottom: 18rpx;
	}

	.tip_wrapper {
		width: 659rpx;
		font-family: OPPOSans;
		font-weight: 400;
		font-size: 30rpx;
		color: #4A5060;
		line-height: 48rpx;
		margin: 43rpx auto 0;
		text-align: center;
	}
</style>