You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

721 lines
16 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<script setup>
import DraggableButton from "@/pages/components/goHome.vue";
/**
* name
* usersa0ChunLuyu
* date2024年9月11日 19:24:50
*/
import {
ref
} from "vue";
import {
$api,
$response
} from "@/api";
import {
onShow
} from "@dcloudio/uni-app";
import wx from 'weixin-js-sdk'
import {
useStore
} from "@/store";
const $store = useStore();
const $props = defineProps({
id: {
type: String,
default: "0",
},
});
const fenzhen_list = ref(false);
const getFenzhenList = async (loading = true) => {
if (!!loading) {
uni.showLoading();
}
const response = await $api("FenzhenList", {
id: $props.id,
});
uni.hideLoading();
$response(response, () => {
fenzhen_list.value = response.data;
console.log(window.location.href)
setTimeout(() => {
if (!!window.location.href.includes('/pages/user/fenzhen/fenzhen') &&
!window.location.href.includes('192.168.31.84:5173')) {
getFenzhenList(false)
}
}, 1000 * 10)
});
};
const mountedAction = () => {
getFenzhenList();
};
const config_ref = ref(null);
const configRef = (e) => {
if (!config_ref.value) {
config_ref.value = e;
mountedAction();
}
};
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'
})
}
const toRouter = (clinic) => {
uni.navigateTo({
url: "/pages/user/fenzhen/xindiantu?id=" + $props.id + '&clinic=' + clinic,
});
};
const fenzhen_active = ref(-1)
const fenzhen_info = ref(false)
const infoShowClick = (clinic) => {
if (clinic !== fenzhen_active.value) {
fenzhen_info.value = false
getFenzhenInfo(clinic)
} else {
fenzhen_active.value = -1
}
}
const qijian = (item) => {
uni.navigateTo({
url: `/pages/user/fenzhen/qijian?id=${$props.id}&xmid=${item.id}&tj_number=${fenzhen_list.value.info.tj_number}`,
});
};
const getFenzhenInfo = async (clinic) => {
fenzhen_active.value = clinic
uni.showLoading();
const response = await $api("FenzhenInfo", {
id: $props.id,
clinic: clinic,
});
uni.hideLoading();
$response(response, () => {
fenzhen_info.value = response.data;
});
};
const useTimeShow = (time) => {
return Math.ceil(Number(time))
}
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>
<view class="tip_time_wrapper tip_endtime_wrapper">
<view class="tip_time_text_wrapper">预计结束</view>
<view class="tip_time_value_wrapper">{{
timeShow(fenzhen_list.info.yuji_end_time)
}}</view>
<view class="tip_time_text_wrapper">— 预计用时</view>
<view class="tip_time_value_wrapper">{{
useTimeShow(fenzhen_list.info.yuji_use_time)
}}</view>
<view class="tip_time_text_wrapper">分钟</view>
</view>
<view class="tip_time_wrapper tip_endtime_wrapper">
<view class="tip_time_text_wrapper">结束时间</view>
<view class="tip_time_value_wrapper">{{
timeShow(fenzhen_list.info.end_time)
}}</view>
<view class="tip_time_text_wrapper">— 实际用时</view>
<view class="tip_time_value_wrapper">{{
useTimeShow(fenzhen_list.info.use_time)
}}</view>
<view class="tip_time_text_wrapper">分钟</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 v-for="(i, k) in fenzhen_list.list" :key="k">
<view class="time_line_item_wrapper" :class="[`time_line_item-${i.status}_wrapper`]">
<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="infoShowClick(i.more)">查看详情>>
</view>
</view>
<view class="more_wrapper mt-20rpx" v-if="i.more === fenzhen_active && !!fenzhen_info">
<template v-for="(item, index) in fenzhen_info.list" :key="index">
<view class="between h-90rpx b-0 b-b-1 b-solid b-#EAEAEA" v-if="item.status == 1">
<view class="text-#000000 text-30rpx">{{ item.name }}</view>
<view class="center">
<text @click="qijian(item)"
class="rounded-full text-28rpx center w-105rpx h-48rpx text-#E95515 bg-#FAECE6">弃检</text>
</view>
</view>
<view class="between h-90rpx b-0 b-b-1 b-solid b-#EAEAEA" v-if="item.status == 4">
<view class="text-#000000 text-30rpx">{{ item.name }}</view>
<view class="center">
<text
class="rounded-full text-28rpx center w-105rpx h-48rpx mr-30rpx text-#239EA3 bg-#E5F3F2">完成</text>
<text class="text-#141414 text-28rpx">{{ item.time }}</text>
</view>
</view>
<view class="item_desc_wrapper b-0 b-b-1 b-solid b-#EAEAEA pb-5rpx">{{ item.desc }}</view>
</template>
</view>
</view>
</view>
</view>
<view class="report_wrapper">
<view v-if="fenzhen_list.report != -1" @click="toReport()" class="report_button_wrapper">
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<style scoped>
.item_desc_wrapper {
font-size: 14rpx;
color: red;
margin-top: 10rpx;
}
.more_wrapper {
padding: 20rpx;
}
.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;
flex-shrink: 0;
}
.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;
margin-left: 20rpx;
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;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex-shrink: 0;
}
.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_endtime_wrapper {
margin-top: 20rpx;
}
.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>