<script setup>
	/**
	 * name：
	 * user：sa0ChunLuyu
	 * date：2023年3月19日 10:46:21
	 */
	import ContrastType1 from '../../../components/contrast_type/type1.vue'
	import ContrastType2 from '../../../components/contrast_type/type2.vue'
	import {
		onMounted,
		ref
	} from 'vue'
	import {
		ReportContrastAction,
		$response
	} from '@/api'
	import {
		onShow
	} from '@dcloudio/uni-app'
	const $props = defineProps({
		type: {
			type: String,
			default: '1'
		},
		r1: {
			type: String,
			default: '1'
		},
		r2: {
			type: String,
			default: '2'
		},
		hospital: {
			type: String,
			default: ''
		}
	});
	const chooseTypeClick = (type) => {
		if (Number($props.type) === type) return
		uni.redirectTo({
			url: `/pages/main/contrast/contrast?hospital=${$props.hospital}&type=${type}&r1=${$props.r1}&r2=${$props.r2}`
		})
	}

	const report_type1_content = ref([])
	const report_type2_content = ref([])
	const ReportContrast = async () => {
		const response = await ReportContrastAction({
			ids: [$props.r1, $props.r2]
		})
		$response(response, () => {
			report_type1_content.value = response.data.report_type1_content
			report_type2_content.value = response.data.report_type2_content
		})
	}
	//设置灰度
	const SysGreyType=ref(0)
	const GetGreySet=()=>{
		uni.getStorage({
			key: 'SysGreytype',
			success: function (res) {
				console.log(res.data);
				if(res.data==1){
					SysGreyType.value=1
				}
			}
		});
	}
	onMounted(() => {
		GetGreySet()
		ReportContrast();
	})
</script>
<template>
	<view>
		<view class="type_group_top_blank_wrapper"></view>
		<view class="type_group_wrapper" :class="SysGreyType==1? 'grey' :''">
			<view @click="chooseTypeClick(1)" class="type_item_wrapper" :class="[
				Number($props.type) === 1 ? 'type_item_active1_wrapper' : ''
			]">
				<view class="type_item_text_wrapper">结论对比</view>
				<view class="type_item_line_wrapper"></view>
			</view>
			<view @click="chooseTypeClick(2)" class="type_item_wrapper " :class="[
				Number($props.type) === 2 ? 'type_item_active2_wrapper' : ''
			]">
				<view class="type_item_text_wrapper">详情对比</view>
				<view class="type_item_line_wrapper"></view>
			</view>
		</view>
		<view class="report_content_wrapper" v-if="Number($props.type) === 1">
			<view class="report_content_item_wrapper" v-for="(i,k) in report_type1_content" :key="k" :class="SysGreyType==1? 'grey' :''">
				<ContrastType1 :info="i" :index="k"></ContrastType1>
			</view>
		</view>
		<view class="report_content_wrapper" v-if="Number($props.type) === 2">
			<view class="report_content_item_wrapper" v-for="(i,k) in report_type2_content" :key="k" :class="SysGreyType==1? 'grey' :''">
				<ContrastType2 :info="i" :index="k"></ContrastType2>
			</view>
		</view>
	</view>
</template>
<style scoped>
	.report_content_wrapper {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		top: 114rpx;
		overflow-y: auto;
		padding-bottom: 20rpx;
	}

	.type_group_top_blank_wrapper {
		height: 15rpx;
	}

	.type_item_text_wrapper {
		font-size: 32rpx;
		font-weight: 500;
		line-height: 1;
		color: #757575;
	}

	.type_item_line_wrapper {
		width: 220rpx;
		height: 3rpx;
		border-radius: 2rpx;
		margin-top: 21rpx;
	}

	.type_group_wrapper {
		width: 750rpx;
		height: 90rpx;
		background: linear-gradient(180deg, #F7F7FF 0%, #F3FAFA 100%);
		display: flex;
		align-items: center;
		justify-content: space-around;
		text-align: center;
	}

	.type_item_active2_wrapper .type_item_text_wrapper {
		color: #157CC5;
	}

	.type_item_active2_wrapper .type_item_line_wrapper {
		background: #63A6D5;
	}

	.type_item_active1_wrapper .type_item_text_wrapper {
		color: #37B9A4;
	}

	.type_item_active1_wrapper .type_item_line_wrapper {
		background: #16C5A9;
	}
	.grey{
			   filter: grayscale(100%);   
		}
</style>
