<template>
	<view class="content">
		<view class="bgheight" v-if="!isShowA">
			<view v-if="listA">
				<view class="btn" @tap="handleListx(1)">重新测评</view>
				<view class="box">
					<view class="name">
						<view>本次体质评估结果为</view>
					</view>
					<view class="conbt">
						{{listA.bodytype}}
					</view>
					<view class="conbt">
						{{listA.extinfo}}
					</view>
				</view>
				<view class="box" v-if="listA.list.length">
					<view class="h2">体质解读：</view>
					<view v-for="(item,index) in listA.list" :key="index">
						<view class="title">{{item.bodytype}}</view>
						<view class="con">
							<view class="text" v-show="item.feature"><text>特征：</text>{{item.feature}}</view>
							<view class="text" v-show="item.people"><text>重点人群：</text>{{item.people}}</view>
							<view class="text" v-show="item.sick"><text>患病倾向：</text>{{item.sick}}</view>
							<view class="text" v-show="item.health"><text>调养方式：</text>{{item.health}}</view>
						</view>
					</view>
					<view class="tips" v-if="listA.referlist">
						{{listA.referlist}}
					</view>
				</view>
			</view>
		</view>
		<!-- 评估 -->
		<view class="commonAll" v-else>
			<view class="h2">请根据近一年的体验和感觉，回答以下问题</view>
			<view class="box" v-for="(item,index) in infoListA.slice((currpage-1)*eachpage,currpage*eachpage)"
				:key="index">
				<view v-for="(ite, ind) in item.qalist" :key="ind">
					<view class="h5">{{ite.title}}</view>
					<view class="item">
						<view class="group" v-for="(it, id) in ite.data" :key="id" @click="Changeradio(it)">
							<icon class="iconfont radioimg"
								:class="[dasC.indexOf(it.val)!=-1?'icon-radio':'icon-kongradio']">
							</icon>
							<view>{{it.name}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="page" v-if='!listA'>
			<view class="pre" v-if="currpage>1" @click="pre">上一页</view>
			<view v-if="currpage<pagesum" @click="next">下一页</view>
			<view class="btn" v-if="currpage==pagesum" @click="handlesub">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from "vuex";
	export default {
		computed: {
			...mapState(["user"]),
			info() {
				return this.user
			}
		},
		onShow() {
			let that = this
			that.handleTypeInfo()
		},
		methods: {
			//测评结果
			handleTypeInfo() {
				let that = this
				that.$model.getbodyinfo({
					familyid: that.user.familyid,
				}).then(res => {
					if (res.code != 0) {
						that.handleListx(1)
						return
					}
					that.listA = res.data
					that.isShowA = false
					console.log("计算成功,去查看结果吧！")
				})

			},
			// 重新测评
			handleListx(ind) {
				let that = this
				that.isShowA = true
				that.currpage = 1
				that.dasA = []
				that.dasC = []
				that.listA = ""
				that.tmidlistA = []
				that.infoListA = []
				that.$model.getbodylist({
					isrestart: ind,
					sex: that.user.sex,
					familyid: that.user.familyid,
				}).then(res => {
					console.log(123, res)
					if (res.code != 0) return
					that.pagesum = Math.ceil(res.data.length / that.eachpage);
					that.infoListA = res.data
				})

			},
			// 测评选择
			Changeradio(tmitem) {
				let that = this
				if (that.tmidlistA.indexOf(tmitem.id) == -1) {
					console.log(0)
					that.tmidlistA.push(tmitem.id)
					that.dasC.push(tmitem.val);
					that.dasA.push(tmitem)
				} else {
					for (var n = 0; n < that.tmidlistA.length; n++) {
						if (tmitem.id == that.tmidlistA[n]) {
							console.log(1)
							if (that.dasC.indexOf(tmitem.val) == -1) {
								that.tmidlistA.push(tmitem.id)
								that.dasC.push(tmitem.val);
								that.dasA.push(tmitem)
								console.log(2)
							}
							that.tmidlistA.splice(n, 1)
							that.dasC.splice(n, 1);
							that.dasA.splice(n, 1);
						}
					}
				}
			},
			// 提交
			handlesub() {
				let that = this
				var obj = {}
				let newArr = []
				that.dasA.forEach(function(item, suffix) {
					if (!obj[item.valId]) {
						var arr = {
							id: '',
							list: []
						};
						arr.id = item.valId
						arr.list.push({
							id: item.id,
							score: item.value
						})
						newArr.push(arr);
						obj[item.valId] = item;
					} else {
						for (var q = 0; q < newArr.length; q++) {
							if (newArr[q].id == item.valId) {
								newArr[q].list.push({
									id: item.id,
									score: item.value
								})
							}
						}
					}
				})
				// for (var i = 0; i < that.infoListA.length; i++) {
				//     var arr = {
				//         id: '',
				//         list: []
				//     };
				//     arr.id = that.infoListA[i].id
				//     for (var e = 0; e < that.infoListA[i].qalist.length; e++) {
				//         arr.list.push({
				//             id: that.infoListA[i].qalist[e].Id,
				//             score: 3
				//         })
				//     }
				//     newArr.push(arr)
				// }
				console.log("去计算", newArr)
				// if (newArr.length < 7 || newArr.length < 9) {
				//     that.$api.msg("请先完成问答")
				//     return
				// }
				that.$model.getbodyresultinfo({
						appid: uni.getStorageSync("appid"),
						familyid: that.user.familyid,
						data: newArr
					})
					.then(res => {
						console.log('res', res)
						that.tmidlistA = []
						that.dasA = []
						that.dasC = []
						if (res.code != 0) {
							that.$tools.msg(res.message)
							return
						}
						that.listA = res.data
						that.isShowA = false
						that.currpage = 1
						console.log("计算成功,去查看结果吧！")
					})
			},
			pre() {
				this.currpage--
			},
			next() {
				let that = this
				that.currpage++
			},
		},
		data() {
			return {
				isShowA: true,
				dasA: [],
				dasC: [],
				listA: [],
				infoListA: [],
				tmidlistA: [],
				pagesum: null, //总页数
				currpage: 1, //当前页数
				eachpage: 2, //每页行数
			}
		},
	}
</script>

<style scoped lang="scss">
	.content {
		font-size: 14px;
		color: #666;
		background-color: #fff;
		padding: 15px;
		min-height: calc(100vh - 30px);
	}

	.h2 {
		font-size: 16px;
		font-weight: bold;
	}

	.h5 {
		margin: 15px 0 10px;

	}

	.bgheight {
		.name {
			font-size: 16px;
			font-weight: bold;
			color: #f19601;
			margin-bottom: 15px;
			display: flex;
			justify-content: space-between;
		}

		.conbt {
			font-size: 14px;
			line-height: 25px;
			width: 100%;
			margin-bottom: 8px;
		}

		.box .conbt:nth-last-child(1) text {
			display: none;
		}

		.title {
			width: 100%;
			font-size: 16px;
			text-align: left;
			font-weight: bold;
			margin: 15px 0;
			color: #333;
		}

		.con {
			line-height: 25px;

			text {
				color: #333;
				font-weight: bold;
			}
		}

		.btn {
			display: block;
			height: 30px;
			line-height: 30px;
			border: none;
			background: #f19601;
			color: #fff;
			margin: 0;
			width: 100px;
			border-radius: 10px;
			text-align: center;
			font-size: 14px;
			float: right;
			// margin-bottom: 10px;
		}
	}


	.uni-list-cell {
		display: flex;
		width: 60%;
		margin-bottom: 10px;
		margin-left: 10px;
	}

	:nth-child(even).uni-list-cell {
		width: 30%;
		margin-left: 0;
	}

	.commonAll {
		background-color: #fff;
	}

	.page {
		width: 100%;
		height: 35px;
		text-align: center;
		margin: 20px auto;
		display: flex;
		justify-content: space-around;

		view {
			width: 150px;
			background: #dfdfdf;
			padding: 5px 0;
			border-radius: 5px;
		}

		.btn {
			background: #f19601;
			color: #fff;
			margin: 0;
			height: auto;
			line-height: inherit;
		}
	}


	.item {
		display: flex;
		flex-wrap: wrap;
	}

	.group {
		display: flex;
		align-items: center;
		align-content: center;
		width: 50%;
		justify-content: end;
		flex-wrap: wrap;
		margin-top: 8px;
	}

	.iconfont {
		width: 22px;
		height: 22px;
		font-size: 20px;
		color: #dfdfdf;
		display: flex;
		margin-right: 3px;
	}

	.icon-radio {
		color: #f19601;
	}

	.tips {
		font-size: 12px;
		color: #999;
		margin-top: 10px;
		line-height: 22px;
	}
</style>
