<template>
	<view class="app" v-if='list'>
		<view class="item" v-for="(item,index) in list.questions" :key="index">
			<view class="title">
				{{Number(index)+1}}、{{item.questionName}}
			</view>
			<u-radio-group v-model="list.answers[index].optionContent" @change="radioGroupChange($event,item)">
				<u-radio @change="radioChange($event,aitem,index)" v-for="(aitem, aindex) in item.options" :key="aindex"
					:name="aitem.optionName">
					{{aitem.optionName}}
				</u-radio>
			</u-radio-group>
		</view>
		<view class="btns" @tap='updata'>
			提交
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: null,
			};
		},
		methods: {
			updata() {
				this.list.answers.forEach(e => {
					if (!e.optionId) {
						this.$refs.uToast.show({
							title: '请选择完全部选项',
							type: 'error',
						})
						return
					}
				})
				var arr = []
				if (this.list.answers[0].optionContent == '是') {
					arr.push('糖尿病风险')
				}
				if (this.list.answers[1].optionContent == '是') {
					arr.push('高血压风险')
				}
				if (this.list.answers[2].optionContent == '是') {
					arr.push('脑卒中风险')
				}
				this.list.evaluateResult = "";
				for (var i = 0; i < arr.length; i++) {
					this.list.evaluateResult += arr[i] + ",";
				}
				//去掉最后一个逗号(如果不需要去掉，就不用写)
				if (this.list.evaluateResult.length > 0) {
					this.list.evaluateResult = this.list.evaluateResult.substr(0, this.list.evaluateResult.length - 1);
				}
				console.log(this.list)
			},
			// 选中某个单选框时，由radio时触发
			radioChange(e, item, index) {
				this.list.answers[index].optionId = item.id
			},
			// 选中任一radio时，由radio-group触发
			radioGroupChange(e) {
				// console.log(e);
			}
		},
		onLoad(options) {
			let list = JSON.parse(decodeURIComponent(options.item))
			list.answers = []
			list.questions.forEach(e => {
				e.name = '请选择'
				var obj = {
					"questionId": e.id,
					"optionId": null,
					"optionContent": null,
				}
				list.answers.push(obj)
			})
			this.list = {
				userId: uni.getStorageSync('patientId'),
				surveyId: list.id,
				surveySubject: list.surveySubject,
				evaluateResult: null,
				advice: null,
				questions: list.questions,
				answers: list.answers
			}
		}
	}
</script>

<style lang="scss">
	.app {
		width: 96%;
		margin: 16rpx auto;
		background: #FFFFFF;
		box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
		border-radius: 5rpx;
		padding-bottom: 200rpx;

		.btns {
			width: 90%;
			margin: 100rpx auto;
			background-color: #26A888;
			text-align: center;
			line-height: 60rpx;
			height: 60rpx;
			color: #fff;
		}

		.item {
			width: 90%;
			margin: 0 auto;
			padding: 30rpx 0;

			::v-deep .u-radio {
				padding: 20rpx;
			}

			.title {
				padding: 40rpx 0 20rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #333333;
			}

			::v-deep .uni-picker-container {
				width: 100%;
				height: 63rpx;
				background: #A7A7A7;
				line-height: 63rpx;
				opacity: 0.1;
				border-radius: 5rpx;
			}
		}
	}
</style>