<template>
	<view class="userinform">
		<view class="userItem">
			<u-collapse :value="item.index" accordion v-for="(item, index) in airdefenceEnumdata" :key="item.index">
				<u-collapse-item :name="item.index" :title="item.name">
					<view class="singleChoice">
						<u-radio-group v-model="form[item.key]"  placement="column" @change="(arr)=>addgroup(arr,item.index)">
							<u-radio :customStyle="{marginBottom: '8px'}" v-for="(items, indexs) in item.dataList"
								iconPlacement="left" size="40" labelSize="24" :key="index" :label="items.name" :name="items.value" >
							</u-radio>
						</u-radio-group>
					</view>
				</u-collapse-item>
			</u-collapse>
		</view>
	</view>
</template>

<script>
	import {
		airdefenceEnum
	} from './enum.js';
	import {
		mapMutations,
		mapGetters
	} from 'vuex';
	export default {
		data() {
			return {
				airdefenceEnumdata: airdefenceEnum,
				form: {
					guarderValue: 0,
					guarderCount: 0,
					guarderCountDetail: undefined,
					guarderCertValue:0,
					guarderCert:0,
					guarderCertDetail:undefined,
					guarderOverValue:0,
					guarderOverAge:0,
					guarderOverAgeDetail:undefined,
					peakGuarValue:0,
					peakGuarderArmed:0,
					peakGuarderArmedDetail:undefined,
					peakProtectValue:0,
					peakProtectScheme:0,
					peakProtectSchemeDetail:undefined,
					peakStaffValue:0,
					peakStaff:0,
					peakStaffDetail:undefined
					
				},

			};
		},
		created() {
			this.form = this.daily
		},
		onLoad(){
			
		},
		computed: {
			// 取数据/
			...mapGetters({
				// 三色预警数据
			 daily: 'daily/getdailyinspection',
			})
		},
		mounted() {},
		methods: {
			// 存vuex数据
			...mapMutations({
				dailyinspectionList: 'daily/dailyinspectionList'
			}),
			addgroup(arr, index) {
				console.log(index);
				let names = '';
				let conuts = 0;
				if (arr && arr != 0) {
					const dataLists = this.airdefenceEnumdata[index].dataList
					console.log(dataLists);
					const _list = dataLists.filter(item => arr == item.value)
					names = _list.map(e => e.name).join(',')
					conuts = _list.map(e => e.num).reduce((a, b) => a + b)
				}
				switch (index) {
					case 0:
						this.form.guarderCountDetail = names;
						this.form.guarderCount = conuts;
						break;
					case 1:
						this.form.guarderCertDetail = names;
						this.form.guarderCert = conuts;
						break;
					case 2:
						this.form.guarderOverAgeDetail = names;
						this.form.guarderOverAge = conuts;
						break;
					case 3:
						this.form.peakGuarderArmedDetail = names;
						this.form.peakGuarderArmed = conuts;
						break;
					case 4:
						this.form.peakProtectSchemeDetail = names;
						this.form.peakProtectScheme = conuts;
						break;
					case 5:
						this.form.peakStaffDetail = names;
						this.form.peakStaff = conuts;
						break;						
				}
				this.dailyinspectionList(this.form)
			},
		}
	};
</script>

<style scoped lang="scss">
	.userinform {
		height: 100%;
		width: 100%;
	}

	.userItem {
		color: #7b7b7b;
		font-size: 14px;
		margin-bottom: 8px;

		.textIndex {
			margin-left: 20rpx;
		}
	}

	.text {
		width: 96%;
	}

	.singleChoice {
		width: 90%;
	}

	.label {
		margin: 0 20px;
	}

	/deep/ .u-radio-group--row {
		display: flex;
		flex-direction: row;
		text-align: center;
		align-content: center;
		justify-content: space-evenly;
	}
</style>