<template>
|
<view class="container">
|
<form @submit="submit">
|
<view :class="item.type==4?'input-group-cloume':'input-group-row'" v-for="item in formList">
|
<text class="label" :class="item.type==5?'font-bold font-15 blue':''">{{item.question}}</text>
|
<!-- 文本输入框 -->
|
<template v-if="item.type==1">
|
<input v-model="item.answerText" type="text" maxlength="100" placeholder="请填写" placeholder-class='placeholder'/>
|
</template>
|
<!-- 单选 -->
|
<template v-if="item.type==2">
|
<view class="right-text">
|
<picker mode="selector" range-key="answer" :range="item.answers" @change="selectChange($event, item)">
|
<view>
|
<text class="gray" v-if="!item.answerText">请选择</text>
|
<text v-else>{{item.answerText}}</text>
|
<text class="iconfont iconjiantouarrow486 gray"></text>
|
</view>
|
</picker>
|
</view>
|
</template>
|
<!-- 多选 -->
|
<template v-if="item.type==3">
|
<view class="right-text flex justify-end">
|
<ld-select bgColor="#FFFFFF" selectColor="#518EFF" :multiple="true" :list="item.answers"
|
list-key="answer" value-key="answer"
|
placeholder="请选择"
|
v-model="item.answerIdArr"
|
@change="mulSelectChange($event, item)"></ld-select>
|
<text class="iconfont iconjiantouarrow486 gray"></text>
|
</view>
|
</template>
|
<!-- 文本域 -->
|
<template v-if="item.type==4">
|
<textarea v-model="item.answerText" maxlength="300" placeholder="请填写" placeholder-class='placeholder' />
|
</template>
|
</view>
|
<view class="sticky-footer" v-if="this.$utils.hasPermission('hyda.edit')">
|
<button form-type="submit" :disabled="isDisabled" class="blue-btn">保存</button>
|
</view>
|
|
</form>
|
</view>
|
</template>
|
|
<script>
|
import ldSelect from '@/components/ld-select/ld-select.vue'
|
export default{
|
components: {
|
ldSelect
|
},
|
data(){
|
return {
|
id: '',
|
formList: [],
|
isDisabled: false
|
}
|
},
|
onLoad(options) {
|
this.id = options.id;
|
this.loadFormList();
|
},
|
methods:{
|
loadFormList(){
|
this.$httpUtils.request('/api/vip/findVipQuestions/'+this.id).then((res) => {
|
if(res.status == 200){
|
let arr = [];
|
this.formList = res.mapInfo.questions.map((item) => {
|
if(item.vipAnswer && item.vipAnswer.answerId){
|
arr = item.vipAnswer.answerId.split(',')
|
}
|
return Object.assign(item, {
|
answerText: item.vipAnswer ? item.vipAnswer.answerText : '',
|
answerId: item.vipAnswer ? item.vipAnswer.answerId : '',
|
answerIdArr: arr
|
})
|
})
|
}
|
})
|
},
|
selectChange(e, item){
|
let result = item.answers[e.detail.value];
|
item.answerId = result.id;
|
item.answerText = result.answer
|
},
|
mulSelectChange(e, item){
|
item.answerIdArr = e;
|
},
|
submit(e){
|
this.isDisabled = true;
|
let items = this.formList.map((item) => {
|
return {
|
answerId: item.type==3?item.answerIdArr.join(','):item.answerId,
|
answerText: item.answerText,
|
questionId: item.id,
|
vipId: this.id
|
}
|
});
|
this.$httpUtils.request('/api/vip/saveVipQuestionsAnswer', {
|
items: items,
|
vipId: this.id
|
}, 'POST').then((res) => {
|
if(res.status == 200){
|
uni.navigateBack()
|
}
|
this.$toast.info(res.info);
|
this.isDisabled = false;
|
}).catch(() => {
|
this.isDisabled = false;
|
})
|
},
|
}
|
}
|
</script>
|
|
<style>
|
.container{
|
padding: 10px 10px 80px;
|
}
|
.sticky-footer{
|
bottom: 0;
|
left: 0;
|
right: 0;
|
padding: 0 10px 20px;
|
background: #FFFFFF;
|
}
|
</style>
|
