<template>
	<view class="app">
		<!-- 功能开发中 -->
		<view class="top">
			<u-tabs ref="tabs" :scrollable="false" :list="tabslist" bar-height="6" bar-width="60" active-color="#fff"
				inactive-color="#A09F9F" :active-item-style="activebgk" :is-scroll="false" :current="tabscurrent"
				gutter="50" @change="tabschange"></u-tabs>
		</view>
		<!-- 健康指数 -->
		<view class="health" v-if="tabscurrent==0">
			<healthindex></healthindex>
		</view>
		<!-- 健康处方 -->
		<view class="" v-if="tabscurrent==2">
			<Precords></Precords>
		</view>
		<!-- 疾病预警 -->
		<view class="disease" v-if="tabscurrent==1">
			<view class="btnleftalls">
				<view class="btnleftall">
					<view class="btnleft" @tap="diseasecv(item)">
						脑血管疾病
					</view>
					<view class="btnleft" @tap="diseaselc">
						缺血性心血管疾病风险
					</view>
					<view class="btnleft" @tap="diseaselu">
						肺癌风险
					</view>
					<view class="btnleft" @tap="diseaseck">
						肾功能不全风险
					</view>
				</view>

				<view class="btnright">
					<image :src="require('../images/renti.png')" mode=""></image>
				</view>
			</view>

		</view>
		<!-- 心血管 -->
		<u-popup v-model="lookopen" mode="center" border-radius="30" :closeable='true'>
			<view style="font-size: 30rpx;padding: 0 84px 5px 33px;">未来十年心血管发病风险：
				{{lcdEvaRecord.riskLevel==1?'低危':''}}
				{{lcdEvaRecord.riskLevel==2?'中危':''}}
				{{lcdEvaRecord.riskLevel==3?'高危':''}}
			</view>
			<view style="font-size: 30rpx;">
				危险因素：
			</view>
			<u-table>
				<u-tr>
					<u-th>危险因素</u-th>
					<u-th>结果</u-th>
					<u-th>参考值</u-th>
				</u-tr>
				<u-tr>
					<u-td>年龄</u-td>
					<u-td v-if="lcdEvaRecord.age">{{lcdEvaRecord.age}}</u-td>
					<u-td v-else></u-td>
					<u-td>-</u-td>
				</u-tr>
				<u-tr>
					<u-td>糖尿病病史</u-td>
					<u-td v-if="lcdEvaRecord.disChd">
						{{lcdEvaRecord.disChd==1?'有':''}}
						{{lcdEvaRecord.disChd==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>BMI</u-td>
					<u-td v-if="lcdEvaRecord.bmi">{{lcdEvaRecord.bmi}}</u-td>
					<u-td v-else></u-td>
					<u-td>
						大于等于18.5小于等于24

					</u-td>
				</u-tr>
				<u-tr>
					<u-td>总胆固醇</u-td>
					<!-- 	<u-td>{{cvdEvaRecord.tc}}</u-td> -->
					<u-td v-if="lcdEvaRecord.tc">{{lcdEvaRecord.tc}}</u-td>
					<u-td v-else></u-td>
					<u-td> 小于5.18mmol/L</u-td>
				</u-tr>
				<u-tr>
					<u-td>收缩压</u-td>

					<u-td v-if="lcdEvaRecord.sbp">{{lcdEvaRecord.sbp}}</u-td>
					<u-td v-else></u-td>
					<u-td>小于140mmHg</u-td>
				</u-tr>
				<u-tr>
					<u-td>吸烟情况</u-td>
					<u-td v-if="lcdEvaRecord.smoke">
						{{lcdEvaRecord.smoke==0?'不吸烟':''}}
						{{lcdEvaRecord.smoke==1?'偶尔吸烟':''}}
						{{lcdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>

					<u-td v-else></u-td>
					<u-td>不吸烟</u-td>
				</u-tr>
			</u-table>
		</u-popup>
		<!-- 脑血管 -->
		<u-popup v-model="open" mode="center" border-radius="30" :closeable='true'>
			<view style="font-size: 30rpx;padding: 0 84px 5px 33px;">未来十年脑血管发病风险：
				{{cvdEvaRecord.riskLevel==1?'低危':''}}
				{{cvdEvaRecord.riskLevel==2?'中危':''}}
				{{cvdEvaRecord.riskLevel==3?'高危':''}}
			</view>
			<view style="font-size: 30rpx;">
				危险因素：
			</view>
			<u-table>
				<u-tr>
					<u-th>危险因素</u-th>
					<u-th>结果</u-th>
					<u-th>参考值</u-th>
				</u-tr>
				<u-tr>
					<u-td>年龄</u-td>
					<u-td v-if="cvdEvaRecord.age">{{cvdEvaRecord.age}}</u-td>
					<u-td v-else></u-td>
					<u-td>-</u-td>
				</u-tr>
				<u-tr>
					<u-td>冠心病病史</u-td>
					<u-td v-if="cvdEvaRecord.disChd">
						{{cvdEvaRecord.riskLevel==1?'有':''}}
						{{cvdEvaRecord.riskLevel==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>脑血管疾病家族史</u-td>
					<u-td v-if="cvdEvaRecord.famDisCvd">
						{{cvdEvaRecord.famDisCvd==1?'有':''}}
						{{cvdEvaRecord.famDisCvd==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>BMI</u-td>
					<u-td v-if="cvdEvaRecord.bmi">{{cvdEvaRecord.bmi}}</u-td>
					<u-td v-else></u-td>
					<u-td>
						大于等于18.5小于等于24

					</u-td>
				</u-tr>
				<u-tr>
					<u-td>总胆固醇</u-td>
					<!-- 	<u-td>{{cvdEvaRecord.tc}}</u-td> -->
					<u-td v-if="cvdEvaRecord.tc">{{cvdEvaRecord.tc}}</u-td>
					<u-td v-else></u-td>
					<u-td> 小于5.18mmol/L</u-td>
				</u-tr>
				<u-tr>
					<u-td>收缩压</u-td>

					<u-td v-if="cvdEvaRecord.sbp">{{cvdEvaRecord.sbp}}</u-td>
					<u-td v-else></u-td>
					<u-td>小于140mmHg</u-td>
				</u-tr>
				<u-tr>
					<u-td>吸烟情况</u-td>
					<u-td v-if="cvdEvaRecord.smoke">
						{{cvdEvaRecord.smoke==0?'不吸烟':''}}
						{{cvdEvaRecord.smoke==1?'偶尔吸烟':''}}
						{{cvdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>

					<u-td v-else></u-td>
					<u-td>不吸烟</u-td>
				</u-tr>
				<u-tr>
					<u-td>饮酒情况</u-td>
					<u-td v-if="cvdEvaRecord.smoke">
						{{cvdEvaRecord.drink==0?'不饮酒':''}}
						{{cvdEvaRecord.drink==1?'偶尔饮酒':''}}
						{{cvdEvaRecord.drink==2?'经常饮酒':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>不饮酒</u-td>
				</u-tr>
			</u-table>
		</u-popup>
		<!-- 肺癌 -->
		<u-popup v-model="openfeiai" mode="center" border-radius="30" :closeable='true'>
			<view style="font-size: 30rpx;padding: 0 84px 5px 33px;">未来十年肺癌发病风险：
				{{lucaEvaRecord.riskLevel==1?'低危':''}}
				{{lucaEvaRecord.riskLevel==2?'中危':''}}
				{{lucaEvaRecord.riskLevel==3?'高危':''}}
			</view>
			<view style="font-size: 30rpx;">
				危险因素：
			</view>
			<u-table>
				<u-tr>
					<u-th>危险因素</u-th>
					<u-th>结果</u-th>
					<u-th>参考值</u-th>
				</u-tr>

				<u-tr>
					<u-td>肺癌家族史</u-td>
					<u-td v-if="lucaEvaRecord.famDisLuca">
						{{lucaEvaRecord.famDisLuca==1?'有':''}}
						{{lucaEvaRecord.famDisLuca==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>慢支炎/肺气肿疾病史</u-td>
					<u-td v-if="lucaEvaRecord.disCopd">
						{{lucaEvaRecord.disCopd==1?'有':''}}
						{{lucaEvaRecord.disCopd==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>吸烟情况</u-td>
					<u-td v-if="lucaEvaRecord.smoke">
						{{lucaEvaRecord.smoke==0?'不吸烟':''}}
						{{lucaEvaRecord.smoke==1?'偶尔吸烟':''}}
						{{lucaEvaRecord.smoke==2?'经常吸烟':''}}</u-td>

					<u-td v-else></u-td>
					<u-td>不吸烟</u-td>
				</u-tr>

			</u-table>
		</u-popup>
		<!-- 肾功能不全 -->
		<u-popup v-model="lookopenck" mode="center" border-radius="30" :closeable='true'>
			<view style="font-size: 30rpx;padding: 0 84px 5px 33px;">未来十年肾功能不全发病风险：
				{{ckdEvaRecord.riskLevel==1?'低危':''}}
				{{ckdEvaRecord.riskLevel==2?'中危':''}}
				{{ckdEvaRecord.riskLevel==3?'高危':''}}
			</view>
			<view style="font-size: 30rpx;">
				危险因素：
			</view>
			<u-table>
				<u-tr>
					<u-th>危险因素</u-th>
					<u-th>结果</u-th>
					<u-th>参考值</u-th>
				</u-tr>

				<u-tr>
					<u-td>肾脏疾病家族史</u-td>
					<u-td v-if="ckdEvaRecord.famDisKd">
						{{ckdEvaRecord.famDisKd==1?'有':''}}
						{{ckdEvaRecord.famDisKd==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>高血压疾病史</u-td>
					<u-td v-if="ckdEvaRecord.disHbp">
						{{ckdEvaRecord.disHbp==1?'有':''}}
						{{ckdEvaRecord.disHbp==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>糖尿病疾病史</u-td>
					<u-td v-if="ckdEvaRecord.disDm">
						{{ckdEvaRecord.disDm==1?'有':''}}
						{{ckdEvaRecord.disDm==0?'无':''}}</u-td>
					<u-td v-else></u-td>
					<u-td>无</u-td>
				</u-tr>
				<u-tr>
					<u-td>吸烟情况</u-td>
					<u-td v-if="ckdEvaRecord.smoke">
						{{ckdEvaRecord.smoke==0?'不吸烟':''}}
						{{ckdEvaRecord.smoke==1?'偶尔吸烟':''}}
						{{ckdEvaRecord.smoke==2?'经常吸烟':''}}</u-td>

					<u-td v-else></u-td>
					<u-td>不吸烟</u-td>
				</u-tr>
				<u-tr>
					<u-td>饮酒情况</u-td>
					<u-td v-if="ckdEvaRecord.drink">
						{{ckdEvaRecord.drink==0?'不饮酒':''}}
						{{ckdEvaRecord.drink==1?'偶尔饮酒':''}}
						{{ckdEvaRecord.drink==2?'经常饮酒':''}}</u-td>

					<u-td v-else></u-td>
					<u-td>不吸烟</u-td>
				</u-tr>
			</u-table>
		</u-popup>

		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		riskWarning,
	} from '@/api/pagesB/threeHundredAndSixty/threeHundredAndSixty.js'
	import Precords from '../Precords/Precords.vue'
	import Healthindex from '../Healthindex/Healthindex.vue'
	export default {
		components: {
			Precords,
			Healthindex

		},
		data() {
			return {
				lookopen: false,
				open: false,
				openfeiai: false,
				lookopenck: false,
				chartData: {},
				tabscurrent: 0,
				tabslist: [{
					name: '健康指数',
					orderStatus: '',
				}, {
					name: '疾病预警',
					orderStatus: 'WAIT_PAY',
				}, {
					name: '健康处方',
					orderStatus: 'WAIT_RECEIVED_GOODS',
				}],
				activebgk: {
					background: "#00B4CC"
				},
				background: {
					backgroundColor: '#26A888',
				},
				datalist: null,
				identity: '',
				cvdEvaRecord: {},
				lcdEvaRecord: {},
				ckdEvaRecord: {},
				lucaEvaRecord: {},
			};
		},
		onReady() {},

		methods: {
			goodsOrderinfo() {
				this.identity = uni.getStorageSync('userinfo').cardNo
				// console.log(this.identity)
				riskWarning(this.identity).then(res => {
					console.log(res)
					if (res.code == 200) {
						this.cvdEvaRecord = res.data.cvdEvaRecord
						this.lucaEvaRecord = res.data.lucaEvaRecord
						this.lcdEvaRecord = res.data.lcdEvaRecord
						this.ckdEvaRecord = res.data.ckdEvaRecord
					} else {
						this.$refs.uToast.show({
							title: res.msg,
							type: 'error'
						})
					}

				})
			},
			// 脑
			diseasecv(item) {
				console.log(item)
				console.log(this.cvdEvaRecord)
				if (this.cvdEvaRecord) {
					this.open = true
				} else {
					this.$refs.uToast.show({
						title: '暂无内容',
						type: 'error'
					})
				}
			},
			// 心
			diseaselc() {
				if (this.lcdEvaRecord) {
					this.lookopen = true
				} else {
					this.$refs.uToast.show({
						title: '暂无内容',
						type: 'error'
					})
				}

			},
			// 肺癌
			diseaselu() {
				if (this.lucaEvaRecord) {
					this.openfeiai = true
				} else {
					this.$refs.uToast.show({
						title: '暂无内容',
						type: 'error'
					})
				}
			},
			diseaseck() {
				if (this.ckdEvaRecord) {
					this.lookopenck = true
				} else {
					this.$refs.uToast.show({
						title: '暂无内容',
						type: 'error'
					})
				}

			},
			getServerData() {
				//模拟从服务器获取数据时的延时
				setTimeout(() => {
					//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接
					let res = {
						categories: ["2018", "2019", "2020", "2021", "2022", "2023"],
						series: [{
								name: "成交量A",
								data: [35, 8, 25, 37, 4, 20]
							},
							{
								name: "成交量B",
								data: [70, 40, 65, 100, 44, 68]
							},
							{
								name: "成交量C",
								data: [100, 80, 95, 150, 112, 132]
							}
						]
					};
					this.chartData = JSON.parse(JSON.stringify(res));
				}, 500);
			},

			getServerData1() {
				if (this.echartData) {
					setTimeout(() => {
						// let res = {
						// 	categories: [],
						// 	series: [{
						// 		name: "血糖值",
						// 		data: []
						// 	}]
						// }
						res.series[0].data = this.echartData.list.map(e => e.bg)
						res.categories = this.echartData.list.map(e => e.timename + e.measureTime)
						this.datalist = res
						// let restwo = {
						// 	series: [{
						// 		data: [{
						// 			"name": "偏低" + this.echartData.calc.lowerNum + "次",
						// 			"value": this.echartData.calc.lowerNum
						// 		}, {
						// 			"name": "正常" + this.echartData.calc.normalNum + "次",
						// 			"value": this.echartData.calc.normalNum
						// 		}, {
						// 			"name": "偏高" + this.echartData.calc.higherNum + "次",
						// 			"value": this.echartData.calc.higherNum
						// 		}]
						// 	}]
						// };
						this.datalisttwo = restwo
					}, 500)
				}
			},
			//点击tabs
			tabschange(index) {
				console.log(index)
				this.tabscurrent = index;
				if (this.tabscurrent == 1) {
					this.goodsOrderinfo();
				}
				// this.orderTypeList.orderStatus = this.tabslist[index].orderStatus
			},



		},

	}
</script>

<style lang="scss">
	.app {
		height: 100vh;
		background-color: #fff;
		// padding: 100rpx 40rpx;
		text-align: center;
		font-size: 36rpx;

		.top {
			width: 100%;
			height: 100rpx;

			::v-deep .u-tabs {
				width: 100%;
				position: fixed;
				z-index: 999;
			}

			::v-deep .u-tabs-scroll-flex {
				background: #fff;
			}

			::v-deep .u-tabs__wrapper__nav__item {
				background: #FFFFFF;
			}
		}





		// .healths {
		// 	font-size: 22rpx;
		// }
		// }

		// }

		.health_body {
			width: 100%;

			.healthitem {
				text-align: left;
				padding: 0 0 40rpx 62rpx;

			}

		}

		.zx {
			width: 100%;
			height: 300rpx;
			// background: red;
		}

		// }

		.disease {
			width: 100%;
			position: relative;
			background-color: #fff;

			.btnleftalls {
				display: flex;
				width: 100%;
			}

			.btnleftall {
				width: 30%;
			}

			.btnleft {
				margin-top: 27%;
				margin-left: 2%;
				line-height: 100rpx;
				text-align: center;
				height: 100rpx;
				font-size: 22rpx;
				background-color: #F2F2F2;
			}

			.btnright {
				// position: absolute;
				// left: 5%;
				width: 70%;

				// height: 100rpx;
				// background-color: yellow;
				image {
					height: 362px;
					// position: absolute;
					display: inline-block;
					// left: 21%;
				}
			}
		}
	}
</style>