|
|
<script setup>
|
|
|
/**
|
|
|
* name：
|
|
|
* user：sa0ChunLuyu
|
|
|
* date：2023年6月9日 02:10:34
|
|
|
*/
|
|
|
import {
|
|
|
ref
|
|
|
} from 'vue'
|
|
|
import {
|
|
|
QuestionSaveAction,
|
|
|
HospitalExtraInfoAction,
|
|
|
QuestionPushAction,
|
|
|
QuestionListAction,
|
|
|
$image,
|
|
|
$response
|
|
|
} from '@/api'
|
|
|
import {
|
|
|
onShow
|
|
|
} from '@dcloudio/uni-app'
|
|
|
import {
|
|
|
useStore
|
|
|
} from '@/store'
|
|
|
const $store = useStore()
|
|
|
const $props = defineProps({
|
|
|
hospital: {
|
|
|
type: String,
|
|
|
default: '0'
|
|
|
}
|
|
|
});
|
|
|
const order_type_config = ref(false)
|
|
|
const HospitalExtraInfo = async () => {
|
|
|
const response = await HospitalExtraInfoAction({
|
|
|
hospital: $store.buy_info.hospital,
|
|
|
mark: 'order_type'
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
order_type_config.value = response.data.info
|
|
|
QuestionList()
|
|
|
})
|
|
|
}
|
|
|
const question_list = ref([])
|
|
|
const QuestionList = async () => {
|
|
|
const response = await QuestionListAction({
|
|
|
...$props,
|
|
|
type: 2,
|
|
|
sex: before_data.value.sex === 1 ? '男' : '女'
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
question_list.value = response.data.list.map((item) => {
|
|
|
item.answer = []
|
|
|
return item
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
const before_data = ref({
|
|
|
name: '',
|
|
|
sex: 1,
|
|
|
age: '1'
|
|
|
})
|
|
|
const user_info = ref(false)
|
|
|
const ageComputed = (date) => {
|
|
|
let birthday = new Date(date);
|
|
|
let today = new Date();
|
|
|
let age = today.getFullYear() - birthday.getFullYear();
|
|
|
if (today.getMonth() < birthday.getMonth() ||
|
|
|
(today.getMonth() == birthday.getMonth() && today.getDate() < birthday.getDate())) {
|
|
|
age--;
|
|
|
}
|
|
|
return age
|
|
|
}
|
|
|
const getUserInfo = () => {
|
|
|
console.log(JSON.stringify($store.buy_info))
|
|
|
const person = $store.buy_info.person[0]
|
|
|
before_data.value = {
|
|
|
name: person.name,
|
|
|
sex: person.sex,
|
|
|
age: ageComputed(person.birthday),
|
|
|
}
|
|
|
HospitalExtraInfo()
|
|
|
}
|
|
|
const done_active = ref(false)
|
|
|
const sexClick = (sex) => {
|
|
|
if (before_data.value.sex !== sex) {
|
|
|
before_data.value.sex = sex
|
|
|
QuestionList()
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const chooseItemClick = (question, key, answer, kk) => {
|
|
|
let index = question.answer.indexOf(answer['选项序号'])
|
|
|
if (index !== -1) {
|
|
|
question.answer.splice(index, 1)
|
|
|
} else {
|
|
|
switch (question['题目类型']) {
|
|
|
case '单选':
|
|
|
question.answer = [answer['选项序号']]
|
|
|
break;
|
|
|
case '多选':
|
|
|
question.answer.push(answer['选项序号'])
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const saveClick = (e) => {
|
|
|
if (!before_data.value.name) {
|
|
|
uni.$lu.toast(`请输入您的姓名`)
|
|
|
anchor('-3')
|
|
|
return
|
|
|
}
|
|
|
if (!before_data.value.sex) {
|
|
|
uni.$lu.toast(`请选择您的性别`)
|
|
|
anchor('-2')
|
|
|
return
|
|
|
}
|
|
|
if (!before_data.value.age || Number(before_data.value.age) <= 0) {
|
|
|
uni.$lu.toast(`请输入您的年龄`)
|
|
|
anchor('-1')
|
|
|
return
|
|
|
}
|
|
|
let must = {}
|
|
|
for (let i in question_list.value) {
|
|
|
must[`Q${question_list.value[i]['题目序号']}`] = Number(i)
|
|
|
}
|
|
|
let link = {}
|
|
|
for (let i in question_list.value) {
|
|
|
for (let ii in question_list.value[i]['选项列表']) {
|
|
|
if (!!question_list.value[i]['选项列表'][ii]['关联题目序号列表']) {
|
|
|
if (`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}` in must) {
|
|
|
link[`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`] = must[
|
|
|
`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`]
|
|
|
delete must[`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`]
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
for (let i in question_list.value) {
|
|
|
for (let ii in question_list.value[i]['选项列表']) {
|
|
|
if (!!question_list.value[i]['选项列表'][ii]['关联题目序号列表']) {
|
|
|
let index = question_list.value[i].answer.indexOf(question_list.value[i]['选项列表'][ii]['选项序号'])
|
|
|
if (index !== -1) {
|
|
|
must[`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`] = link[
|
|
|
`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`]
|
|
|
delete link[`Q${question_list.value[i]['选项列表'][ii]['关联题目序号列表']}`]
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
let save = {}
|
|
|
for (let i in must) {
|
|
|
let info = question_list.value[must[i]]
|
|
|
if (!info.answer.length) {
|
|
|
uni.$lu.toast(`请回答第${info['题目序号']}题`)
|
|
|
anchor(must[`Q${info['题目序号']}`])
|
|
|
return
|
|
|
}
|
|
|
save[info['题目序号']] = info.answer
|
|
|
}
|
|
|
QuestionPush(save)
|
|
|
}
|
|
|
|
|
|
const anchor = (key) => {
|
|
|
uni.createSelectorQuery()
|
|
|
.select('#anchor--4')
|
|
|
.boundingClientRect((rect) => {
|
|
|
let top = rect.top
|
|
|
uni.createSelectorQuery()
|
|
|
.select(`#anchor-${key}`)
|
|
|
.boundingClientRect((rect) => {
|
|
|
scroll_top.value = rect.top - top
|
|
|
})
|
|
|
.exec()
|
|
|
})
|
|
|
.exec()
|
|
|
}
|
|
|
const scroll_top = ref(0)
|
|
|
const scrollAction = (e) => {
|
|
|
scroll_top.value = e.target.scrollTop
|
|
|
}
|
|
|
const choose_result = ref([])
|
|
|
const QuestionPush = async (choose) => {
|
|
|
const response = await QuestionPushAction({
|
|
|
hospital: $props.hospital,
|
|
|
age: before_data.value.age,
|
|
|
sex: before_data.value.sex,
|
|
|
choose
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
choose_result.value = []
|
|
|
for (let i in response.data.list) {
|
|
|
// if (!!response.data.list[i]['可选']) {
|
|
|
choose_result.value.push(response.data.list[i])
|
|
|
// }
|
|
|
}
|
|
|
done_active.value = true
|
|
|
})
|
|
|
}
|
|
|
|
|
|
const clearClick = () => {
|
|
|
choose_result.value = []
|
|
|
}
|
|
|
|
|
|
const delClick = (key) => {
|
|
|
choose_result.value.splice(key, 1)
|
|
|
}
|
|
|
|
|
|
const doneClick = () => {
|
|
|
if (order_type_config.value.item === 1 && choose_result.value.length) {
|
|
|
let items = []
|
|
|
for (let i in choose_result.value) {
|
|
|
items.push(choose_result.value[i]['Id'])
|
|
|
}
|
|
|
$store.buy_info.items = items
|
|
|
uni.redirectTo({
|
|
|
url: '/pages/buy/info/info'
|
|
|
})
|
|
|
} else {
|
|
|
uni.redirectTo({
|
|
|
url: '/pages/main/home/home'
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const QuestionSave = async (content) => {
|
|
|
const response = await QuestionSaveAction({
|
|
|
content: JSON.stringify(content),
|
|
|
type: 1
|
|
|
})
|
|
|
$response(response, () => {
|
|
|
done_active.value = true
|
|
|
})
|
|
|
}
|
|
|
onShow(() => {
|
|
|
getUserInfo()
|
|
|
})
|
|
|
</script>
|
|
|
<template>
|
|
|
<view>
|
|
|
<view>
|
|
|
<view class="question_title_wrapper">健康问卷</view>
|
|
|
<view v-if="done_active">
|
|
|
<view class="question_tip_wrapper question_done_wrapper">
|
|
|
问卷已提交，{{ (order_type_config.item === 1 && !!choose_result.length) ? '为您推荐以下检测项目。' : '谢谢！' }}</view>
|
|
|
<view v-if="order_type_config.item === 1 && !!choose_result.length" class="item_content_wrapper">
|
|
|
<view class="items_items_wrapper">
|
|
|
<view class="title_wrapper">
|
|
|
<view class="title_line_wrapper"></view>
|
|
|
<view class="title_text_wrapper">自选项目</view>
|
|
|
<view @click="clearClick()" class="clear_button_wrapper">
|
|
|
<view class="clear_button_icon_wrapper">
|
|
|
<image :src="$image('/storage/assets/mp/combo/清空.png')"></image>
|
|
|
</view>
|
|
|
<view class="clear_button_text_wrapper">清空</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="items_list_wrapper">
|
|
|
<view class="items_list_item_wrapper" v-for="(i,k) in choose_result" :key="k">
|
|
|
<view class="items_list_item_text_wrapper">{{ k+1 }}.{{ i['名称'] }}</view>
|
|
|
<view class="items_list_item_right_wrapper">
|
|
|
<view class="items_list_item_price_wrapper">￥{{ Number(i['价格']).toFixed(2) }}</view>
|
|
|
<view @click="delClick(k)" class="items_list_item_del_wrapper">
|
|
|
<image :src="$image('/storage/assets/mp/combo/删除.png')"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view @click="doneClick()" class="save_wrapper">
|
|
|
{{ (order_type_config.item === 1 && !!choose_result.length) ? '开始预约' : '退出问卷' }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-else class="question_wrapper">
|
|
|
<scroll-view :scroll-top="scroll_top" style="height: 100%;" scroll-y="true" >
|
|
|
<view :id="`anchor--4`"></view>
|
|
|
<view :id="`anchor--3`" class="question_item_wrapper">
|
|
|
<view class="question_item_title_wrapper">请输入您的姓名</view>
|
|
|
<view class="question_item_item_wrapper">
|
|
|
<input type="text" v-model="before_data.name" class="question_item_item_input_wrapper">
|
|
|
</view>
|
|
|
</view>
|
|
|
<view :id="`anchor--2`" class="question_item_wrapper">
|
|
|
<view class="question_item_title_wrapper">请选择您的性别</view>
|
|
|
<view class="question_item_item_wrapper">
|
|
|
<view @click="sexClick(1)" class="question_item_item_choose_wrapper">
|
|
|
<view class="question_item_item_choose_checkbox_wrapper">
|
|
|
<uni-icons v-if="before_data.sex === 1" color="#24ba2d" type="checkmarkempty"
|
|
|
size="40rpx"></uni-icons>
|
|
|
</view>
|
|
|
<view class="question_item_item_choose_text_wrapper">男</view>
|
|
|
</view>
|
|
|
<view @click="sexClick(2)" class="question_item_item_choose_wrapper">
|
|
|
<view class="question_item_item_choose_checkbox_wrapper">
|
|
|
<uni-icons v-if="before_data.sex === 2" color="#24ba2d" type="checkmarkempty"
|
|
|
size="40rpx"></uni-icons>
|
|
|
</view>
|
|
|
<view class="question_item_item_choose_text_wrapper">女</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view :id="`anchor--1`" class="question_item_wrapper">
|
|
|
<view class="question_item_title_wrapper">请输入您的年龄</view>
|
|
|
<view class="question_item_item_wrapper">
|
|
|
<input type="text" v-model="before_data.age" class="question_item_item_input_wrapper">
|
|
|
</view>
|
|
|
</view>
|
|
|
<view :id="`anchor-${k}`" class="question_item_wrapper" v-for="(i,k) in question_list" :key="k">
|
|
|
<view class="question_item_title_wrapper">{{ i['题目序号'] }}. {{ i['题干'] }}</view>
|
|
|
<view v-for="(ii,kk) in i['选项列表']" :key="kk" class="question_item_item_wrapper">
|
|
|
<view @click="chooseItemClick(i,k,ii,kk)" class="question_item_item_choose_wrapper">
|
|
|
<view class="question_item_item_choose_checkbox_wrapper">
|
|
|
<uni-icons v-if="i.answer.indexOf(ii['选项序号']) !== -1" color="#24ba2d" type="checkmarkempty"
|
|
|
size="40rpx"></uni-icons>
|
|
|
</view>
|
|
|
<view class="question_item_item_choose_text_wrapper">
|
|
|
{{ ii['选项序号'] }}. {{ ii['内容'] }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view @click="saveClick" class="save_wrapper">提交</view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
<view class="blank_break_wrapper"></view>
|
|
|
</view>
|
|
|
<view class="blank_wrapper"></view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<style>
|
|
|
page {
|
|
|
background: #ffffff;
|
|
|
}
|
|
|
</style>
|
|
|
<style scoped>
|
|
|
.title_wrapper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: 95rpx;
|
|
|
width: 750rpx;
|
|
|
background: #ffffff;
|
|
|
border-bottom: 2rpx solid #EBEBEB;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
.title_line_wrapper {
|
|
|
width: 7rpx;
|
|
|
height: 27rpx;
|
|
|
border-radius: 999rpx;
|
|
|
margin-left: 30rpx;
|
|
|
}
|
|
|
|
|
|
.clear_button_text_wrapper {
|
|
|
margin-left: 21rpx;
|
|
|
}
|
|
|
|
|
|
.clear_button_wrapper {
|
|
|
position: absolute;
|
|
|
top: 50%;
|
|
|
right: 30rpx;
|
|
|
transform: translateY(-50%);
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
font-size: 26rpx;
|
|
|
font-weight: 500;
|
|
|
color: #7D7D7D;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.clear_button_icon_wrapper image {
|
|
|
width: 24rpx;
|
|
|
height: 26rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
|
|
|
.clear_button_icon_wrapper {
|
|
|
width: 24rpx;
|
|
|
height: 26rpx;
|
|
|
}
|
|
|
|
|
|
.items_list_item_del_wrapper image {
|
|
|
width: 24rpx;
|
|
|
height: 26rpx;
|
|
|
display: block;
|
|
|
}
|
|
|
|
|
|
.items_list_item_del_wrapper {
|
|
|
width: 24rpx;
|
|
|
height: 26rpx;
|
|
|
margin-right: 13rpx;
|
|
|
}
|
|
|
|
|
|
.items_list_item_right_wrapper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
.items_list_item_price_wrapper {
|
|
|
font-size: 30rpx;
|
|
|
font-weight: 500;
|
|
|
color: #F02E50;
|
|
|
line-height: 1;
|
|
|
position: absolute;
|
|
|
left: 500rpx;
|
|
|
}
|
|
|
|
|
|
.items_list_item_text_wrapper {
|
|
|
margin-left: 22rpx;
|
|
|
font-size: 30rpx;
|
|
|
font-weight: 500;
|
|
|
color: #222222;
|
|
|
line-height: 1;
|
|
|
max-width: 450rpx;
|
|
|
overflow: hidden;
|
|
|
white-space: nowrap;
|
|
|
text-overflow: ellipsis;
|
|
|
}
|
|
|
|
|
|
.items_list_item_wrapper {
|
|
|
width: 690rpx;
|
|
|
height: 94rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
border-bottom: 1rpx solid #EBEBEB;
|
|
|
margin: 0 auto;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
.title_text_wrapper {
|
|
|
font-size: 30rpx;
|
|
|
font-weight: 500;
|
|
|
color: #222222;
|
|
|
line-height: 1;
|
|
|
margin-left: 15rpx;
|
|
|
}
|
|
|
|
|
|
.items_items_wrapper {
|
|
|
background: #ffffff;
|
|
|
}
|
|
|
|
|
|
.question_wrapper {
|
|
|
position: fixed;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
top: 130rpx;
|
|
|
bottom: calc(20rpx + var(--safe-area-inset-bottom));
|
|
|
}
|
|
|
|
|
|
.question_item_item_choose_text_wrapper {
|
|
|
width: 550rpx;
|
|
|
}
|
|
|
|
|
|
.question_done_wrapper {
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
.blank_break_wrapper {
|
|
|
height: 200rpx;
|
|
|
}
|
|
|
|
|
|
.save_wrapper {
|
|
|
width: 600rpx;
|
|
|
height: 80rpx;
|
|
|
background: linear-gradient(-90deg, #23D3AF, #0DC5CF);
|
|
|
font-size: 30rpx;
|
|
|
line-height: 80rpx;
|
|
|
text-align: center;
|
|
|
color: #ffffff;
|
|
|
border-radius: 999rpx;
|
|
|
margin: 150rpx auto 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
.image_wrapper image {
|
|
|
position: absolute;
|
|
|
width: 300rpx;
|
|
|
height: 200rpx;
|
|
|
display: block;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
z-index: 999;
|
|
|
}
|
|
|
|
|
|
.image_wrapper {
|
|
|
position: relative;
|
|
|
width: 300rpx;
|
|
|
height: 200rpx;
|
|
|
background: #f7f7f7;
|
|
|
border: 1rpx #33333340 solid;
|
|
|
margin: 20rpx auto 0;
|
|
|
font-size: 28rpx;
|
|
|
line-height: 200rpx;
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
.question_item_item_choose_wrapper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
width: 600rpx;
|
|
|
margin: 20rpx auto 0;
|
|
|
}
|
|
|
|
|
|
.question_item_item_choose_checkbox_wrapper {
|
|
|
width: 30rpx;
|
|
|
height: 30rpx;
|
|
|
background: #f7f7f7;
|
|
|
border: 1rpx #33333340 solid;
|
|
|
line-height: 30rpx;
|
|
|
margin-right: 20rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
.question_item_item_input_wrapper {
|
|
|
border: 1rpx #cccccc solid;
|
|
|
height: 60rpx;
|
|
|
border-radius: 10rpx;
|
|
|
width: 580rpx;
|
|
|
padding-left: 20rpx;
|
|
|
margin: 30rpx auto 0;
|
|
|
}
|
|
|
|
|
|
.question_item_title_wrapper {
|
|
|
font-size: 30rpx;
|
|
|
margin-top: 50rpx;
|
|
|
width: 600rpx;
|
|
|
margin: 30rpx auto 0;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
.question_tip_wrapper {
|
|
|
font-size: 26rpx;
|
|
|
margin-top: 50rpx;
|
|
|
width: 600rpx;
|
|
|
margin: 30rpx auto 0;
|
|
|
}
|
|
|
|
|
|
.question_title_wrapper {
|
|
|
font-size: 40rpx;
|
|
|
font-weight: bold;
|
|
|
text-align: center;
|
|
|
margin-top: 50rpx;
|
|
|
}
|
|
|
</style> |