|
|
<script setup>
|
|
|
import DraggableButton from "@/pages/components/goHome.vue";
|
|
|
/**
|
|
|
* name：
|
|
|
* user：sa0ChunLuyu
|
|
|
* date：2024年9月11日 19:24:50
|
|
|
*/
|
|
|
import {
|
|
|
ref
|
|
|
} from "vue";
|
|
|
import {
|
|
|
$api,
|
|
|
$response
|
|
|
} from "@/api";
|
|
|
import {
|
|
|
onShow
|
|
|
} from "@dcloudio/uni-app";
|
|
|
import {
|
|
|
useStore
|
|
|
} from "@/store";
|
|
|
const $store = useStore();
|
|
|
const $props = defineProps({
|
|
|
id: {
|
|
|
type: String,
|
|
|
default: "0",
|
|
|
},
|
|
|
});
|
|
|
|
|
|
const fenzhen_list = ref(false);
|
|
|
const getFenzhenList = async () => {
|
|
|
uni.showLoading();
|
|
|
const response = await $api("FenzhenList", {
|
|
|
id: $props.id,
|
|
|
});
|
|
|
uni.hideLoading();
|
|
|
$response(response, () => {
|
|
|
fenzhen_list.value = response.data;
|
|
|
});
|
|
|
};
|
|
|
|
|
|
const mountedAction = () => {
|
|
|
getFenzhenList();
|
|
|
};
|
|
|
|
|
|
const config_ref = ref(null);
|
|
|
const configRef = (e) => {
|
|
|
if (!config_ref.value) {
|
|
|
config_ref.value = e;
|
|
|
mountedAction();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const toRouter = (clinic) => {
|
|
|
uni.navigateTo({
|
|
|
url: "/pages/user/fenzhen/xindiantu?id=" + $props.id + '&clinic=' + clinic,
|
|
|
});
|
|
|
};
|
|
|
|
|
|
const timeShow = (time) => {
|
|
|
let time_array = time.split(":");
|
|
|
return `${time_array[0]}:${time_array[1]}`;
|
|
|
};
|
|
|
|
|
|
const tip_show = ref(false);
|
|
|
const tip_content = ref("");
|
|
|
const getTipContent = async () => {
|
|
|
uni.showLoading();
|
|
|
const response = await $api("GetReadme");
|
|
|
uni.hideLoading();
|
|
|
$response(response, () => {
|
|
|
tip_content.value = response.data.content;
|
|
|
tip_show.value = true;
|
|
|
});
|
|
|
};
|
|
|
const tipShowClick = () => {
|
|
|
if (!!tip_content.value) {
|
|
|
tip_show.value = true;
|
|
|
} else {
|
|
|
getTipContent();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const toReport = () => {
|
|
|
wx.miniProgram.navigateTo({
|
|
|
url: '/pages/other/entry/index?path=/pages/outpatient/doctor-appointment/index&scene=1035&hospitalAreaId=6&departmentCode=A0030077&subDepartmentCode=4773794195699464904'
|
|
|
})
|
|
|
}
|
|
|
|
|
|
onShow(() => {
|
|
|
if (!!config_ref.value) {
|
|
|
mountedAction();
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
<template>
|
|
|
<DraggableButton />
|
|
|
<view>
|
|
|
<view v-if="!!$store.config">
|
|
|
<view :ref="configRef"></view>
|
|
|
</view>
|
|
|
<view class="tip_dialog_wrapper" v-if="!!tip_show">
|
|
|
<view class="tip_dialog_box_wrapper">
|
|
|
<view @click="tip_show = !tip_show" class="tip_dialog_close_wrapper">
|
|
|
<image src="@/static/assets/contrast/close@2x.png"></image>
|
|
|
</view>
|
|
|
<view class="tip_dialog_text_wrapper" v-html="tip_content"></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="!!fenzhen_list">
|
|
|
<view class="order_info_wrapper relative">
|
|
|
<w-qrcode v-if="fenzhen_list.info.qrcode" class="absolute top-20rpx right-15rpx b-1 b-dashed b-#000 p-8rpx"
|
|
|
:options="{
|
|
|
level: 4,
|
|
|
size: 130,
|
|
|
code: fenzhen_list.info.qrcode,
|
|
|
}"></w-qrcode>
|
|
|
<view class="person_name_wrapper">
|
|
|
<view class="person_name_text_wrapper">{{
|
|
|
fenzhen_list.info.name
|
|
|
}}</view>
|
|
|
<view class="person_sex_wrapper">{{
|
|
|
fenzhen_list.info.sex === 1 ? "男士" : "女士"
|
|
|
}}</view>
|
|
|
</view>
|
|
|
<view class="info_box_wrapper">
|
|
|
<view class="info_wrapper">
|
|
|
<view class="info_title_wrapper">体检套餐：</view>
|
|
|
<view class="info_text_wrapper">{{
|
|
|
fenzhen_list.info.combo_name
|
|
|
}}</view>
|
|
|
</view>
|
|
|
<view class="info_wrapper info2_wrapper">
|
|
|
<view class="info_title_wrapper">体检日期：</view>
|
|
|
<view class="info_text_wrapper">{{
|
|
|
fenzhen_list.info.check_date
|
|
|
}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="button_wrapper">
|
|
|
<view @click="tipShowClick()" class="desc_wrapper">体检注意事项</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="tip_wrapper">
|
|
|
<view class="tip_time_wrapper">
|
|
|
<view class="tip_time_text_wrapper">开始体检时间</view>
|
|
|
<view class="tip_time_value_wrapper">{{
|
|
|
timeShow(fenzhen_list.info.start_time)
|
|
|
}}</view>
|
|
|
<view class="tip_time_text_wrapper">— 预计结束时间</view>
|
|
|
<view class="tip_time_value_wrapper">{{
|
|
|
timeShow(fenzhen_list.info.end_time)
|
|
|
}}</view>
|
|
|
</view>
|
|
|
<view class="tip_box_wrapper">
|
|
|
<view class="tip_icon_wrapper">
|
|
|
<image src="@/static/assets/fenzhen/tip@2x.png"></image>
|
|
|
</view>
|
|
|
<view class="tip_text_wrapper">尊敬的客户，为了使您的体检流程更加顺畅，请按以下步骤提
|
|
|
示顺序逐项完成体检。</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="time_line_wrapper">
|
|
|
<view class="time_line_title_wrapper">自助导检</view>
|
|
|
<view class="time_line_box_wrapper">
|
|
|
<view class="time_line_item_wrapper" :class="[`time_line_item-${i.status}_wrapper`]"
|
|
|
v-for="(i, k) in fenzhen_list.list" :key="k">
|
|
|
<view class="time_line_item_time_wrapper">
|
|
|
<view v-if="!!i.time" class="time_line_item_time_value_wrapper">{{
|
|
|
i.time
|
|
|
}}</view>
|
|
|
<view class="time_line_item_time_dot_wrapper">
|
|
|
<view class="time_line_item_time_dot_in_wrapper"></view>
|
|
|
</view>
|
|
|
<view v-if="!!i.time" class="time_line_item_time_line_wrapper"></view>
|
|
|
<view v-if="!i.time" class="time_line_item_time_cover_wrapper"></view>
|
|
|
</view>
|
|
|
<view class="time_line_item_content_wrapper">
|
|
|
<view class="time_line_item_triangle_wrapper"></view>
|
|
|
<view class="time_line_item_flex_wrapper">
|
|
|
<view class="time_line_item_title_wrapper">{{ k + 1 }}.{{ i.name }}</view>
|
|
|
<view class="time_line_item_box_wrapper">{{ i.desc }}</view>
|
|
|
</view>
|
|
|
<view v-if="!!i.time && !!i.tip" class="time_line_item_line_wrapper"></view>
|
|
|
<view v-if="!!i.time && !!i.tip" class="time_line_item_flex_wrapper">
|
|
|
<view class="time_line_item_text_wrapper">{{ i.tip }}</view>
|
|
|
<view v-if="i.more !== 0" class="time_line_item_more_wrapper" @click="toRouter(i.more)">查看详情>></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="fenzhen_list.report !== -1" class="report_wrapper">
|
|
|
<view v-if="fenzhen_list.report !== 0" class="report_tip_wrapper">
|
|
|
已预约 {{ fenzhen_list.report }} 报告解读
|
|
|
</view>
|
|
|
<view v-else @click="toReport()" class="report_button_wrapper">
|
|
|
预约解读
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<style scoped>
|
|
|
.report_tip_wrapper {
|
|
|
font-weight: 500;
|
|
|
font-size: 28rpx;
|
|
|
color: #239EA3;
|
|
|
line-height: 90rpx;
|
|
|
margin-right: 29rpx;
|
|
|
}
|
|
|
|
|
|
.report_wrapper {
|
|
|
display: flex;
|
|
|
justify-content: end;
|
|
|
}
|
|
|
|
|
|
.report_button_wrapper {
|
|
|
width: 200rpx;
|
|
|
height: 60rpx;
|
|
|
background: #239ea3;
|
|
|
border-radius: 30rpx;
|
|
|
font-size: 24rpx;
|
|
|
color: #ffffff;
|
|
|
line-height: 60rpx;
|
|
|
text-align: center;
|
|
|
margin-right: 29rpx;
|
|
|
margin-top: 50rpx;
|
|
|
}
|
|
|
|
|
|
.tip_dialog_text_wrapper {
|
|
|
max-height: calc(100vh - 600rpx);
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
|
|
|
.tip_dialog_wrapper {
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
width: 750rpx;
|
|
|
background: #00000060;
|
|
|
margin: 0 auto;
|
|
|
z-index: 9999;
|
|
|
}
|
|
|
|
|
|
.tip_dialog_close_wrapper {
|
|
|
position: absolute;
|
|
|
top: 30rpx;
|
|
|
right: 40rpx;
|
|
|
width: 26rpx;
|
|
|
height: 26rpx;
|
|
|
}
|
|
|
|
|
|
.tip_dialog_close_wrapper image {
|
|
|
width: 26rpx;
|
|
|
height: 26rpx;
|
|
|
display: block;
|
|
|
object-fit: contain;
|
|
|
}
|
|
|
|
|
|
.tip_dialog_box_wrapper {
|
|
|
position: absolute;
|
|
|
width: 610rpx;
|
|
|
background: #ffffff;
|
|
|
border-radius: 15rpx;
|
|
|
padding-left: 50rpx;
|
|
|
padding-right: 50rpx;
|
|
|
padding-bottom: 90rpx;
|
|
|
padding-top: 130rpx;
|
|
|
left: 50%;
|
|
|
top: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
}
|
|
|
|
|
|
.time_line_item_more_wrapper {
|
|
|
font-size: 22rpx;
|
|
|
color: #239ea3;
|
|
|
line-height: 1;
|
|
|
text-decoration-line: underline;
|
|
|
margin-right: 19rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_text_wrapper {
|
|
|
font-weight: 500;
|
|
|
font-size: 24rpx;
|
|
|
color: #6e6e6e;
|
|
|
line-height: 1;
|
|
|
margin-left: 42rpx;
|
|
|
|
|
|
width: calc(100% - 210rpx);
|
|
|
white-space: nowrap;
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
}
|
|
|
|
|
|
.time_line_item_line_wrapper {
|
|
|
width: 550rpx;
|
|
|
height: 1rpx;
|
|
|
background: #e8e8e8;
|
|
|
border-radius: 1rpx;
|
|
|
margin: 13rpx auto 5rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_box_wrapper {
|
|
|
width: 400rpx;
|
|
|
height: 40rpx;
|
|
|
background: #5a75ca30;
|
|
|
border-radius: 5rpx;
|
|
|
font-weight: 500;
|
|
|
font-size: 24rpx;
|
|
|
color: #5a75ca;
|
|
|
line-height: 40rpx;
|
|
|
text-align: center;
|
|
|
margin-right: 17rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_title_wrapper {
|
|
|
width: 140rpx;
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #0d0d0d;
|
|
|
line-height: 40rpx;
|
|
|
height: 40rpx;
|
|
|
margin-left: 22rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_flex_wrapper {
|
|
|
margin-top: 15rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_cover_wrapper {
|
|
|
position: absolute;
|
|
|
width: 2rpx;
|
|
|
top: -36rpx;
|
|
|
height: 100rpx;
|
|
|
left: 50%;
|
|
|
background: #ffffff;
|
|
|
transform: translateX(-50%);
|
|
|
z-index: 99;
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_line_wrapper {
|
|
|
position: absolute;
|
|
|
width: 2rpx;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
left: 50%;
|
|
|
background: #dedede;
|
|
|
transform: translateX(-50%);
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_dot_wrapper {
|
|
|
position: absolute;
|
|
|
width: 16rpx;
|
|
|
height: 16rpx;
|
|
|
background: #cfcece60;
|
|
|
border-radius: 50%;
|
|
|
left: 50%;
|
|
|
top: 50%;
|
|
|
transform: translate(-50%, calc(-50% + 26rpx));
|
|
|
z-index: 999;
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_dot_in_wrapper {
|
|
|
width: 8rpx;
|
|
|
height: 8rpx;
|
|
|
background: #cfcece;
|
|
|
border-radius: 50%;
|
|
|
position: absolute;
|
|
|
left: 50%;
|
|
|
top: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
}
|
|
|
|
|
|
.time_line_box_wrapper {
|
|
|
margin-top: 28rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_triangle_wrapper {
|
|
|
width: 16rpx;
|
|
|
height: 16rpx;
|
|
|
border-left: 1rpx #e8e8e8 solid;
|
|
|
border-bottom: 1rpx #e8e8e8 solid;
|
|
|
background: #f8f8f8;
|
|
|
position: absolute;
|
|
|
top: 50%;
|
|
|
left: -10rpx;
|
|
|
transform: rotate(45deg);
|
|
|
}
|
|
|
|
|
|
.time_line_item_content_wrapper {
|
|
|
width: 590rpx;
|
|
|
background: #f8f8f8;
|
|
|
border-radius: 5rpx;
|
|
|
margin-left: 12rpx;
|
|
|
position: relative;
|
|
|
border: 1rpx #e8e8e8 solid;
|
|
|
margin-top: 36rpx;
|
|
|
padding-bottom: 15rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_value_wrapper {
|
|
|
width: 90rpx;
|
|
|
height: 55rpx;
|
|
|
background: #e4e4e4;
|
|
|
border-radius: 28rpx;
|
|
|
font-weight: 500;
|
|
|
font-size: 28rpx;
|
|
|
color: #212121;
|
|
|
line-height: 55rpx;
|
|
|
text-align: center;
|
|
|
position: relative;
|
|
|
z-index: 99;
|
|
|
}
|
|
|
|
|
|
.time_line_item_time_wrapper {
|
|
|
width: 90rpx;
|
|
|
position: absolute;
|
|
|
left: 6rpx;
|
|
|
right: 0;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
}
|
|
|
|
|
|
.time_line_item_wrapper {
|
|
|
width: calc(90rpx + 12rpx + 590rpx);
|
|
|
display: flex;
|
|
|
justify-content: end;
|
|
|
margin: 0 auto;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
.time_line_title_wrapper {
|
|
|
width: 180rpx;
|
|
|
height: 60rpx;
|
|
|
background: linear-gradient(90deg, #edf6f5 0%, #bbdfe1 99%);
|
|
|
border-radius: 0rpx 30rpx 30rpx 0rpx;
|
|
|
font-weight: bold;
|
|
|
font-size: 25rpx;
|
|
|
color: #123531;
|
|
|
text-align: center;
|
|
|
line-height: 60rpx;
|
|
|
margin-top: 26rpx;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.time_line_wrapper {
|
|
|
width: 710rpx;
|
|
|
background: #ffffff;
|
|
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
|
|
|
border-radius: 15rpx;
|
|
|
margin: 53rpx auto 0;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
padding-bottom: 30rpx;
|
|
|
}
|
|
|
|
|
|
.tip_text_wrapper {
|
|
|
font-weight: 400;
|
|
|
font-size: 22rpx;
|
|
|
color: #e95515;
|
|
|
line-height: 36rpx;
|
|
|
margin-left: 10rpx;
|
|
|
}
|
|
|
|
|
|
.tip_icon_wrapper {
|
|
|
width: 24rpx;
|
|
|
height: 24rpx;
|
|
|
margin-top: 5rpx;
|
|
|
}
|
|
|
|
|
|
.tip_icon_wrapper image {
|
|
|
width: 24rpx;
|
|
|
height: 24rpx;
|
|
|
display: block;
|
|
|
object-fit: contain;
|
|
|
}
|
|
|
|
|
|
.tip_box_wrapper {
|
|
|
display: flex;
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
|
|
|
.tip_time_value_wrapper {
|
|
|
font-size: 36rpx;
|
|
|
color: #239ea3;
|
|
|
margin: 0 10rpx;
|
|
|
}
|
|
|
|
|
|
.tip_time_text_wrapper {
|
|
|
font-size: 22rpx;
|
|
|
color: #161616;
|
|
|
}
|
|
|
|
|
|
.tip_time_wrapper {
|
|
|
display: flex;
|
|
|
align-items: end;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.tip_wrapper {
|
|
|
width: calc(100% - 50px);
|
|
|
margin: 32rpx auto 0;
|
|
|
}
|
|
|
|
|
|
.info2_wrapper {
|
|
|
margin-top: 30rpx;
|
|
|
}
|
|
|
|
|
|
.info_box_wrapper {
|
|
|
margin-top: 60rpx;
|
|
|
margin-left: 29rpx;
|
|
|
}
|
|
|
|
|
|
.button_wrapper {
|
|
|
display: flex;
|
|
|
justify-content: end;
|
|
|
}
|
|
|
|
|
|
.desc_wrapper {
|
|
|
width: 160rpx;
|
|
|
height: 48rpx;
|
|
|
background: #239ea3;
|
|
|
border-radius: 5rpx;
|
|
|
font-size: 20rpx;
|
|
|
color: #ffffff;
|
|
|
line-height: 48rpx;
|
|
|
text-align: center;
|
|
|
margin-right: 29rpx;
|
|
|
margin-top: 24rpx;
|
|
|
}
|
|
|
|
|
|
.info_wrapper {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
|
|
|
.info_text_wrapper {
|
|
|
font-size: 24rpx;
|
|
|
color: #0f0f0f;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.info_title_wrapper {
|
|
|
font-size: 24rpx;
|
|
|
color: #8b8b8b;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
|
|
|
.order_info_wrapper {
|
|
|
width: 710rpx;
|
|
|
height: 360rpx;
|
|
|
background: #ffffff;
|
|
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
|
|
|
border-radius: 15rpx;
|
|
|
margin: 20rpx auto 0;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.person_name_wrapper {
|
|
|
display: flex;
|
|
|
align-items: end;
|
|
|
margin-top: 72rpx;
|
|
|
margin-left: 29rpx;
|
|
|
}
|
|
|
|
|
|
.person_name_text_wrapper {
|
|
|
font-weight: bold;
|
|
|
font-size: 34rpx;
|
|
|
color: #171717;
|
|
|
}
|
|
|
|
|
|
.person_sex_wrapper {
|
|
|
font-size: 24rpx;
|
|
|
color: #7e7e7e;
|
|
|
margin-left: 15rpx;
|
|
|
}
|
|
|
|
|
|
.time_line_item-2_wrapper .time_line_item_time_value_wrapper,
|
|
|
.time_line_item-1_wrapper .time_line_item_time_value_wrapper {
|
|
|
background: #239ea3;
|
|
|
color: #f8f8f8;
|
|
|
}
|
|
|
|
|
|
.time_line_item-2_wrapper .time_line_item_time_dot_wrapper,
|
|
|
.time_line_item-1_wrapper .time_line_item_time_dot_wrapper {
|
|
|
background: #239ea360;
|
|
|
}
|
|
|
|
|
|
.time_line_item-2_wrapper .time_line_item_time_dot_in_wrapper,
|
|
|
.time_line_item-1_wrapper .time_line_item_time_dot_in_wrapper {
|
|
|
background: #239ea3;
|
|
|
}
|
|
|
|
|
|
.time_line_item-2_wrapper .time_line_item_box_wrapper,
|
|
|
.time_line_item-1_wrapper .time_line_item_box_wrapper {
|
|
|
background: #6cafb230;
|
|
|
color: #239ea3;
|
|
|
}
|
|
|
|
|
|
.time_line_item--1_wrapper .time_line_item_time_value_wrapper {
|
|
|
background: #239ea3;
|
|
|
color: #f8f8f8;
|
|
|
}
|
|
|
|
|
|
.time_line_item--1_wrapper .time_line_item_time_dot_wrapper {
|
|
|
background: #239ea360;
|
|
|
}
|
|
|
|
|
|
.time_line_item--1_wrapper .time_line_item_time_dot_in_wrapper {
|
|
|
background: #239ea3;
|
|
|
}
|
|
|
|
|
|
.time_line_item--1_wrapper .time_line_item_box_wrapper {
|
|
|
background: #e1af6830;
|
|
|
color: #cc913e;
|
|
|
}
|
|
|
</style> |