300 lines
7.9 KiB
Vue
300 lines
7.9 KiB
Vue
|
<template>
|
|||
|
|
<view class="content">
|
|||
|
|
|
|||
|
|
<view class="app">
|
|||
|
|
<view class="item" v-for="(item, index) in questiondata.subjectResultList" :key="index">
|
|||
|
|
<view class="title">
|
|||
|
|
{{Number(index)+1}}、{{item.questionName}}
|
|||
|
|
<span v-if="item.questionType == 'MULTIPLE_CHOICE'">（单选题）</span>
|
|||
|
|
<span v-if="item.questionType == 'MULTIPLE_CHOICE_QUESTIONS'">（多选题）</span>
|
|||
|
|
<span v-if="item.questionType == 'SCORING_QUESTIONS'">（打分题）</span>
|
|||
|
|
<span v-if="item.questionType == 'COMBINATION_RADIO_SUBJECT'">（组合单选题）</span>
|
|||
|
|
<span v-if="item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'">（组合多选题）</span>
|
|||
|
|
<span v-if="item.questionType == 'COMBINATION_BLANKS_SUBJECT'">（组合填空题）</span>
|
|||
|
|
<span v-if="item.questionType == 'FILL_IN_THE_BLANKS'">（填空题）</span>
|
|||
|
|
<span v-if="item.questionType == 'COMBINATION_SCORING_SUBJECT'">（组合打分题）</span>
|
|||
|
|
<span v-if="item.questionType == 'DATE_BLANKS_SUBJECT'">（日期填空题）</span>
|
|||
|
|
<span v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">（时间填空题）</span>
|
|||
|
|
</view>
|
|||
|
|
<!-- 单选。组合单选 -->
|
|||
|
|
<u-radio-group v-if="
|
|||
|
|
item.questionType == 'MULTIPLE_CHOICE' ||
|
|||
|
|
item.questionType == 'COMBINATION_RADIO_SUBJECT' ||
|
|||
|
|
item.questionType == 'SCORING_QUESTIONS' ||
|
|||
|
|
item.questionType == 'COMBINATION_SCORING_SUBJECT'
|
|||
|
|
" v-model="item.checked" @change="radioGroupChange($event,item)">
|
|||
|
|
<u-radio @change="radioChange($event,aitem,index)"
|
|||
|
|
v-for="(aitem, aindex) in item.optionResults" :key="aindex" :name="aitem.id">
|
|||
|
|
{{aitem.optionName}}
|
|||
|
|
</u-radio>
|
|||
|
|
</u-radio-group>
|
|||
|
|
<!-- 多选 -->
|
|||
|
|
<u-checkbox-group @change="checkboxGroupChange" v-if="
|
|||
|
|
item.questionType == 'MULTIPLE_CHOICE_QUESTIONS' ||
|
|||
|
|
item.questionType == 'COMBINATION_MULTIPLE_SUBJECT'
|
|||
|
|
">
|
|||
|
|
<u-checkbox @change="checkboxChange" v-model="aitem.checked"
|
|||
|
|
v-for="(aitem, aindex) in item.optionResults" :key="aindex"
|
|||
|
|
:name="aitem.id">{{aitem.optionName}}</u-checkbox>
|
|||
|
|
</u-checkbox-group>
|
|||
|
|
<!-- 填空题、组合填空 -->
|
|||
|
|
<view class="" v-if="
|
|||
|
|
item.questionType == 'FILL_IN_THE_BLANKS' ||
|
|||
|
|
item.questionType == 'COMBINATION_BLANKS_SUBJECT'
|
|||
|
|
">
|
|||
|
|
<u-input placeholder="请输入" v-model="item.fillBlanksAnswer" type="textarea" :height="100"
|
|||
|
|
:customStyle="{lineHeight: '30px'}" placeholder-style="color: #8E8E8E" />
|
|||
|
|
</view>
|
|||
|
|
<!-- 日期填空题、 -->
|
|||
|
|
<view class="datatime" v-if="item.questionType == 'DATE_BLANKS_SUBJECT'">
|
|||
|
|
<text v-if="!item.fillBlanksAnswer">请选择出生日期</text>
|
|||
|
|
<text v-else class="testitem">{{item.fillBlanksAnswer}}</text>
|
|||
|
|
<image src="@/static/huijiantou.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
<!-- 时间填空题 -->
|
|||
|
|
<view class="datatime" v-if="item.questionType == 'TIME_BLANKS_SUBJECT'">
|
|||
|
|
<text v-if="!item.fillBlanksAnswer">请选择时间</text>
|
|||
|
|
<text v-else class="testitem">{{item.fillBlanksAnswer}}</text>
|
|||
|
|
<image src="@/static/huijiantou.png" mode=""></image>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<u-calendar v-model="show" :mode="mode" @change="change"></u-calendar>
|
|||
|
|
<u-picker mode="time" @confirm="Changepicker" :value="index" :params="params" v-model="showtime">
|
|||
|
|
</u-picker>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<u-toast ref="uToast" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
selectQuestionSubmit
|
|||
|
|
} from '@/api/questionnaire/questionnaire.js'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
questiondata: {},
|
|||
|
|
checkeddata: [],
|
|||
|
|
checked: false,
|
|||
|
|
params: {
|
|||
|
|
// year: true,
|
|||
|
|
// month: true,
|
|||
|
|
// day: true,
|
|||
|
|
hour: true,
|
|||
|
|
minute: true,
|
|||
|
|
// second: true,
|
|||
|
|
// timestamp: true
|
|||
|
|
},
|
|||
|
|
time: '',
|
|||
|
|
|
|||
|
|
showtime: false,
|
|||
|
|
|
|||
|
|
show: false,
|
|||
|
|
mode: 'date',
|
|||
|
|
value: '',
|
|||
|
|
list: [{
|
|||
|
|
name: 'apple',
|
|||
|
|
disabled: false
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: 'banner',
|
|||
|
|
disabled: false
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: 'orange',
|
|||
|
|
disabled: false
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
|
|||
|
|
questions: null,
|
|||
|
|
timer: null,
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
this.patientQuestionSubmitResultId = options.patientQuestionSubmitResultId
|
|||
|
|
console.log('this.patientQuestionSubmitResultId')
|
|||
|
|
this.selectScriptInfodata()
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
selectScriptInfodata() {
|
|||
|
|
console.log('9999999999999')
|
|||
|
|
selectQuestionSubmit(this.patientQuestionSubmitResultId).then(res => {
|
|||
|
|
this.questiondata = res.data
|
|||
|
|
this.questiondata.subjectResultList.forEach((e) => {
|
|||
|
|
e.optionResults.forEach((el) => {
|
|||
|
|
if (
|
|||
|
|
(el.optionChooseSign == "0" &&
|
|||
|
|
(e.questionType == "MULTIPLE_CHOICE") ||
|
|||
|
|
e.questionType == "COMBINATION_RADIO_SUBJECT")
|
|||
|
|
) {
|
|||
|
|
e.checked = el.id;
|
|||
|
|
} else if (
|
|||
|
|
el.optionChooseSign == "0" &&
|
|||
|
|
e.questionType == "MULTIPLE_CHOICE_QUESTIONS"
|
|||
|
|
) {
|
|||
|
|
el.checked = true;
|
|||
|
|
// this.checkeddata.push(el.id);
|
|||
|
|
} else if (
|
|||
|
|
el.optionChooseSign == "0" &&
|
|||
|
|
e.questionType == "SCORING_QUESTIONS"
|
|||
|
|
) {
|
|||
|
|
e.checked = el.id;
|
|||
|
|
} else if (
|
|||
|
|
e.questionType == "COMBINATION_MULTIPLE_SUBJECT" &&
|
|||
|
|
el.optionChooseSign == "0"
|
|||
|
|
) {
|
|||
|
|
el.checked = true;
|
|||
|
|
|
|||
|
|
// this.checkeddata.push(el.id);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
console.log(this.questiondata, 'this.questiondata')
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 日期
|
|||
|
|
change(e) {
|
|||
|
|
// this.show=true
|
|||
|
|
console.log(e);
|
|||
|
|
},
|
|||
|
|
// 时间
|
|||
|
|
Changepicker(e, item) {
|
|||
|
|
// console.log(e,item,'909090')
|
|||
|
|
this.time = e.hour + ':' + e.minute
|
|||
|
|
console.log(this.time, '909090')
|
|||
|
|
},
|
|||
|
|
// 选中某个单选框时，由radio时触发
|
|||
|
|
radioChange(e, item, index) {
|
|||
|
|
console.log(e, item, index)
|
|||
|
|
this.list.answers[index].optionId = item.id
|
|||
|
|
console.log(this.list, '---')
|
|||
|
|
},
|
|||
|
|
// 选中任一radio时，由radio-group触发
|
|||
|
|
radioGroupChange(e) {
|
|||
|
|
// console.log(e);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.content {
|
|||
|
|
height: 100vh;
|
|||
|
|
background-color: #F7F5F5;
|
|||
|
|
padding: 30rpx 0 0 0;
|
|||
|
|
overflow: scroll;
|
|||
|
|
|
|||
|
|
.app {
|
|||
|
|
pointer-events: none;
|
|||
|
|
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;
|
|||
|
|
|
|||
|
|
.datatime {
|
|||
|
|
width: 636rpx;
|
|||
|
|
height: 63rpx;
|
|||
|
|
background: #F6F6F6;
|
|||
|
|
margin: 12rpx auto;
|
|||
|
|
border-radius: 5rpx;
|
|||
|
|
display: flex;
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
.testitem {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
font-family: Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #000000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
text {
|
|||
|
|
padding-left: 20rpx;
|
|||
|
|
line-height: 63rpx;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
font-family: Source Han Sans CN;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #8E8E8E;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
width: 9rpx;
|
|||
|
|
height: 17rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
right: 40rpx;
|
|||
|
|
top: 50%;
|
|||
|
|
-webkit-transform: translateY(-50%);
|
|||
|
|
transform: translateY(-50%);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-input__textarea.data-v-fdbb9fe6 {
|
|||
|
|
background: #F6F6F6 !important;
|
|||
|
|
padding-left: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-input {
|
|||
|
|
width: 636rpx;
|
|||
|
|
// height: 63rpx;
|
|||
|
|
background: #F6F6F6;
|
|||
|
|
margin: 12rpx auto;
|
|||
|
|
border: none;
|
|||
|
|
border-radius: 5rpx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-input__input.data-v-fdbb9fe6 {
|
|||
|
|
font-size: 26rpx !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
::v-deep .u-radio-group {
|
|||
|
|
display: inline-grid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-checkbox-group {
|
|||
|
|
display: inline-grid;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-checkbox {
|
|||
|
|
padding: 20rpx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::v-deep .u-radio {
|
|||
|
|
padding: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
padding: 40rpx 0 20rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|