94 lines
3.0 KiB
Vue
94 lines
3.0 KiB
Vue
|
<template>
|
|||
|
|
<view class="h-full flex flex-col">
|
|||
|
|
<view class="flex-shrink-0 px-10 pt-5 text-base font-semibold text-center truncate">{{ surery.name }}</view>
|
|||
|
|
<view v-if="surery.description"
|
|||
|
|
class="flex-shrink-0 px-10 mt-10 text-sm leading-normal text-gray line-clamp-2 text-center">
|
|||
|
|
{{ surery.description }}
|
|||
|
|
</view>
|
|||
|
|
<view class="flex items-center text-gray text-sm px-10 mt-10">
|
|||
|
|
<view v-if="surery.enableScore">
|
|||
|
|
当前得分：<text class="text-primary text-base font-semibold min-w-5 inline-block">{{ allScore }}
|
|||
|
|
</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="ml-auto">
|
|||
|
|
客户：<text class="text-black text-base font-semibold min-w-5 inline-block">{{ customerName }} </text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="flex-grow relative">
|
|||
|
|
<scroll-view :scroll-y="true" class="absolute inset-0">
|
|||
|
|
<view v-for="(quesiton, index) in list" :key="quesiton.id">
|
|||
|
|
<view v-if="quesiton" class="my-4 text-base px-10 leading-normal">
|
|||
|
|
<text v-if="quesiton.require" class="text-base text-red-500">*</text> {{ index + 1 }}、{{ quesiton.title }}
|
|||
|
|
</view>
|
|||
|
|
<view class="px-10">
|
|||
|
|
<template v-if="quesiton.type === 'radio'">
|
|||
|
|
<view v-for="(opt, idx) in quesiton.options" :key="opt.value" class="flex py-15 border-b"
|
|||
|
|
:class="idx === 0 ? 'border-t' : ''">
|
|||
|
|
<view class="flex-grow pl-4 text-gray leading-normal"
|
|||
|
|
:class="quesiton.value && quesiton.value === opt.value ? 'text-primary' : ''">
|
|||
|
|
{{ opt.label }}
|
|||
|
|
<text v-if="surery.enableScore && opt.score >= 0">
|
|||
|
|
（ {{ opt.score }}分）
|
|||
|
|
</text>
|
|||
|
|
</view>
|
|||
|
|
<uni-icons v-if="quesiton.value && quesiton.value === opt.value" class="ml-1 text-primary flex-shrink-0"
|
|||
|
|
color=" " type="checkbox-filled" size="24"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
<view v-else-if="quesiton.type === 'input'"
|
|||
|
|
class="my-4 p-10 text-base leading-normal border rounded">
|
|||
|
|
{{ quesiton.value || '' }}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
name: 'Question',
|
|||
|
|
props: {
|
|||
|
|
customerName: { type: String, default: '' },
|
|||
|
|
list: { type: Array, default: () => ([]) },
|
|||
|
|
surery: { type: Object, default: () => ({}) }
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
allScore() {
|
|||
|
|
return this.list.reduce((score, item) => {
|
|||
|
|
if (item.type === 'radio') {
|
|||
|
|
const opt = item.options.find(i => i.value && i.value === item.value && item.value)
|
|||
|
|
if (opt && opt.score >= 0) {
|
|||
|
|
score = Math.floor(score * 100 + opt.score * 100) / 100
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return score
|
|||
|
|
}, 0)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.min-w-5 {
|
|||
|
|
min-width: 40rpx
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pt-5 {
|
|||
|
|
padding-top: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.my-4 {
|
|||
|
|
margin-top: 32rpx;
|
|||
|
|
margin-bottom: 32rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.border-t {
|
|||
|
|
border-top: 1px solid #eee;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pl-4 {
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|