wxservice-web/src/views/hospital-service/assessments/InpatientSatisfiedAssessment.vue

<template>
    <window-size>
        <div class="question-box">
            <p>1-1、您对住院科室护理人员服务满意吗？</p>
            <div style="margin-top: 4px">
                <van-radio-group v-model="answer.item1" direction="horizontal">
                    <van-radio name="A">满意</van-radio>
                    <van-radio name="B">不满意</van-radio>
                </van-radio-group>
            </div>
            <div v-show="answer.item1 === 'B'">
                <p style="margin-top: 6px">1-2、您对住院科室护理人员哪些服务不满意？</p>
                <van-checkbox-group v-model="answer.item2Arr" direction="horizontal">
                    <van-checkbox
                            shape="square"
                            v-for="child in checkboxOptions1"
                            :key="child.key"
                            :name="child.key"
                            style="margin-top: 5px"
                    >{{ child.label }}
                    </van-checkbox>
                </van-checkbox-group>
            </div>
        </div>
        <div class="question-box">
            <p>2-1、您对住院科室医生服务满意吗？</p>
            <div style="margin-top: 4px">
                <van-radio-group v-model="answer.item3" direction="horizontal">
                    <van-radio name="A">满意</van-radio>
                    <van-radio name="B">不满意</van-radio>
                </van-radio-group>
            </div>
            <div v-show="answer.item3 === 'B'">
                <p style="margin-top: 6px">2-2、您对住院科室医生哪些服务不满意？</p>
                <van-checkbox-group v-model="answer.item4Arr" direction="horizontal">
                    <van-checkbox
                            shape="square"
                            v-for="child in checkboxOptions2"
                            :key="child.key"
                            :name="child.key"
                            style="margin-top: 5px"
                    >{{ child.label }}
                    </van-checkbox>
                </van-checkbox-group>
            </div>
        </div>
        <div class="question-box">
            <p>3-1、您对医院环境卫生满意吗？</p>
            <div style="margin-top: 4px">
                <van-radio-group v-model="answer.item5" direction="horizontal">
                    <van-radio name="A">满意</van-radio>
                    <van-radio name="B">不满意</van-radio>
                </van-radio-group>
            </div>
            <div v-show="answer.item5 === 'B'">
                <p style="margin-top: 6px">3-2、您对医院环境卫生哪些项目不满意？</p>
                <van-checkbox-group v-model="answer.item6Arr" direction="horizontal">
                    <van-checkbox
                            shape="square"
                            v-for="child in checkboxOptions3"
                            :key="child.key"
                            :name="child.key"
                            style="margin-top: 5px"
                    >{{ child.label }}
                    </van-checkbox>
                </van-checkbox-group>
            </div>
        </div>
        <div class="question-box">
            <p>4-1、您对医院食堂满意吗？</p>
            <div style="margin-top: 4px">
                <van-radio-group v-model="answer.item7" direction="horizontal">
                    <van-radio name="A">满意</van-radio>
                    <van-radio name="B">不满意</van-radio>
                    <van-radio name="C">未接触</van-radio>
                </van-radio-group>
            </div>
            <div v-show="answer.item7 === 'B'">
                <p style="margin-top: 6px">4-2、您对医院环境卫生哪些项目不满意？</p>
                <van-checkbox-group v-model="answer.item8Arr" direction="horizontal">
                    <van-checkbox
                            shape="square"
                            v-for="child in checkboxOptions4"
                            :key="child.key"
                            :name="child.key"
                            style="margin-top: 5px"
                    >{{ child.label }}
                    </van-checkbox>
                </van-checkbox-group>
            </div>
        </div>
        <div v-for="(item, index) in headQuestions" :key="item.key" class="question-box">
            <p>{{ item.label }}</p>
            <div style="margin-top: 4px">
                <van-radio-group v-model="answer['item' + item.key]" direction="horizontal">
                    <van-radio name="A">满意</van-radio>
                    <van-radio name="B">不满意</van-radio>
                    <van-radio name="C">未接触</van-radio>
                </van-radio-group>
            </div>
            <div v-show="answer['item' + item.key] === 'B'">
                <p style="margin-top: 6px">{{ tailQuestions[index].label }}</p>
                <van-checkbox-group v-model="answer['item' + (item.key + 1) + 'Arr']" direction="horizontal">
                    <van-checkbox
                            shape="square"
                            v-for="child in (item.key === 11 ? checkboxOptions2 : checkboxOptions)"
                            :key="child.key"
                            :name="child.key"
                            style="margin-top: 5px"
                    >{{ child.label }}
                    </van-checkbox>
                </van-checkbox-group>
            </div>
        </div>
        <div style="height: 20px"></div>
        <van-button type="primary" block :disabled="disableSubmitButton" @click="submitAnswer">提交</van-button>
    </window-size>
</template>
<script setup>
import {reactive, ref} from "vue";
import {submitInpatientSatisfiedAssessment} from '../../../api/assessments'
import {Dialog} from "vant";
import {useRouter} from "vue-router";

const router = useRouter()
const answer = reactive({
    patientId: router.currentRoute.value.params.patientId
})
const disableSubmitButton = ref(false)

const checkboxOptions1 = [
    {key: 'A', label: '技术水平'},
    {key: 'B', label: '隐私保护'},
    {key: 'C', label: '服务态度'},
    {key: 'D', label: '沟通解释'},
    {key: 'E', label: '病情巡视'},
    {key: 'F', label: '服装礼仪'},
    {key: 'G', label: '其他'},
]

const checkboxOptions2 = [
    {key: 'A', label: '技术水平'},
    {key: 'B', label: '隐私保护'},
    {key: 'C', label: '服务态度'},
    {key: 'D', label: '沟通解释'},
    {key: 'E', label: '按时查房'},
    {key: 'F', label: '服装礼仪'},
    {key: 'G', label: '其他'},
]

const checkboxOptions3 = [
    {key: 'A', label: '卫生情况'},
    {key: 'B', label: '布局不合理'},
    {key: 'C', label: '服务态度'},
    {key: 'D', label: '舒适度'},
    {key: 'E', label: '按时清理'},
    {key: 'F', label: '服装礼仪'},
    {key: 'G', label: '其他'},
]

const checkboxOptions4 = [
    {key: 'A', label: '卫生情况'},
    {key: 'B', label: '口味'},
    {key: 'C', label: '菜品'},
    {key: 'D', label: '服务态度'},
    {key: 'F', label: '服装礼仪'},
    {key: 'G', label: '其他'},
]

const headQuestions = [
    {key: 9, label: '5-1、您对药剂科工作人员服务满意吗？'},
    {key: 11, label: '6-1、您对放射科工作人员服务满意吗？'},
    {key: 13, label: '7-1、您对超声影像科工作人员服务满意吗？'},
    {key: 15, label: '8-1、您对检验科工作人员服务满意吗？'},
    {key: 17, label: '9-1、您对收费窗口工作人员服务满意吗？'},
    {key: 19, label: '10-1、您对门诊医护人员服务满意吗？'},
    {key: 21, label: '11-1、您对急诊医护人员服务满意吗？'},
]

const tailQuestions = [
    {key: 10, label: '5-2、您对药剂科工作人员哪些服务不满意？'},
    {key: 12, label: '6-2、您对放射科工作人员哪些服务不满意？'},
    {key: 14, label: '7-2、您对超声影像科工作人员哪些服务不满意？'},
    {key: 16, label: '8-2、您对检验科工作人员哪些服务不满意？'},
    {key: 18, label: '9-2、您对收费窗口工作人员哪些服务不满意？'},
    {key: 20, label: '10-2、您对门诊医护人员哪些服务不满意？'},
    {key: 22, label: '11-2、您对急诊医护人员哪些服务不满意？'},
]

const checkboxOptions = [
    {key: 'A', label: '叫号服务'},
    {key: 'B', label: '等待时长'},
    {key: 'C', label: '服务态度'},
    {key: 'D', label: '沟通解释'},
    {key: 'E', label: '及时响应'},
    {key: 'F', label: '服装礼仪'},
    {key: 'G', label: '准确率'},
]

const submitAnswer = () => {
    submitInpatientSatisfiedAssessment(answer).then(res => {
        disableSubmitButton.value = true
        Dialog.alert({
            title: '提示',
            message: '提交成功！',
        })
    })
}
</script>

<style scoped>
.question-box {
    padding: 6px 0 12px 6px;
    border-bottom: 1px dashed gray;
}
</style>