152 lines
3.3 KiB
Vue
152 lines
3.3 KiB
Vue
|
<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>
|