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.
381 lines
8.5 KiB
Vue
381 lines
8.5 KiB
Vue
<template>
|
|
<view class="fenzhen_info" v-if="userInfo">
|
|
<view class="header">
|
|
<view class="name">{{userInfo.name}} <span style="font-size: 30rpx;">
|
|
{{userInfo.sex==1?'男':userInfo.sex==2?'女':''}} | {{userInfo.age}}岁</span> <span
|
|
style="font-size: 30rpx;" v-if=" userInfo.reg_number">卡号:{{userInfo.reg_number}}</span></view>
|
|
<view class="daohang_button" @click="daohang()">导航</view>
|
|
<!-- <view class="riqi">体检套餐:{{userInfo.comboName}}</view>
|
|
<view class="riqi">体检日期:{{userInfo.appointment_date}}</view> -->
|
|
</view>
|
|
<!--
|
|
<view class="tiaoma" v-if="userInfo.reg_number">
|
|
<w-barcode :options="{
|
|
width:600,
|
|
height:160,
|
|
code: userInfo.reg_number?userInfo.reg_number:'' ,
|
|
}"></w-barcode>
|
|
|
|
</view> -->
|
|
|
|
<view
|
|
style="font-size: 26rpx;margin-top: 50rpx;color: #d46767;font-weight: 700; border: 1px solid #83c5c5; padding: 30rpx;border-radius: 20rpx;">
|
|
<view v-for="(item,index) in tip">
|
|
{{item}}
|
|
</view>
|
|
</view>
|
|
<view class="xia">
|
|
<view class="xia_row1">
|
|
<view class="xia_title">体检诊室 <span style="font-size: 30rpx;color: #7D7D7D;">共 <span
|
|
class="lanzi">{{keshi_ids.length}}</span> 个</span></view>
|
|
<view style="color: #7D7D7D;">
|
|
已检查 <span class="lanzi">{{wancheng_count}}</span> 个
|
|
</view>
|
|
</view>
|
|
<view v-for="(item,index) in fenzhen_list" :key="index">
|
|
<view class="zhuangtai" v-if="item.status==1">
|
|
<view class="zhuangtai_left bakcolor3">待 排 队</view>
|
|
<view class="zhuangtai_right">
|
|
<view>
|
|
|
|
<view class="keshiname" v-if="item.clinic">{{item.clinic}}</view>
|
|
|
|
<view class="item_k" v-for="(item2,index2) in item.items">
|
|
<view class="zhenshiname">{{item2.name}}</view>
|
|
<view class="itemdesc">{{item2.desc}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="zhuangtai" v-if="item.status==2">
|
|
<view class="zhuangtai_left bakcolor2">队 列 中</view>
|
|
<view class="zhuangtai_right ">
|
|
|
|
|
|
<view>
|
|
|
|
<view class="keshiname">{{item.clinic}}</view>
|
|
|
|
<view class="item_k" v-for="(item2,index2) in item.items">
|
|
<view class="zhenshiname">{{item2.name}}</view>
|
|
<view class="itemdesc">{{item2.desc}}</view>
|
|
</view>
|
|
<view style="display: flex; justify-content: end;">
|
|
<view style="color: #7D7D7D;"> <span class="shuzi">{{item.wait}}</span>人排队</view>
|
|
<view style="color: #7D7D7D;margin-left: 20rpx;"> 预计等待<span
|
|
class="shuzi">{{item.time}}</span>分钟</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view class="zhuangtai" v-if="item.status==3">
|
|
<view class="zhuangtai_left bakcolor1">就 诊 中</view>
|
|
<view class="zhuangtai_right">
|
|
<view>
|
|
<view class="keshiname">{{item.clinic}}</view>
|
|
<view class="item_k" v-for="(item2,index2) in item.items">
|
|
<view class="zhenshiname">{{item2.name}}</view>
|
|
<view class="itemdesc">{{item2.desc}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view style="color: #7D7D7D;">序号{{item.wait_count}}</view> -->
|
|
</view>
|
|
</view>
|
|
<view class="zhuangtai" v-if="item.status==4">
|
|
<view class="zhuangtai_left bakcolor1">已 完 成</view>
|
|
<view class="zhuangtai_right">
|
|
<view>
|
|
<view class="keshiname">{{item.clinic}}</view>
|
|
<view class="item_k" v-for="(item2,index2) in item.items">
|
|
<view class="zhenshiname">{{item2.name}}</view>
|
|
<view class="itemdesc">{{item2.desc}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view style="color: #7D7D7D;"> {{item.wait_count}}</view> -->
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<uni-popup ref="TiShiPopupRef" style="z-index: 999;">
|
|
<view class="tishi_main">
|
|
<view class="tishi_title">选择区域</view>
|
|
<view class="quyu_button" style="background-color: #fc924a;" @click="toMap(1)">男宾区</view>
|
|
<view class="quyu_button" @click="toMap(2)">女宾区</view>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref,
|
|
onMounted,
|
|
nextTick,
|
|
onUnmounted
|
|
} from 'vue'
|
|
import {
|
|
onShow,
|
|
onLoad
|
|
} from '@dcloudio/uni-app'
|
|
import {
|
|
FenZhenGetTiJianLine,
|
|
} from '@/api'
|
|
|
|
|
|
let id_number = ref('');
|
|
let userInfo = ref('');
|
|
let fenzhen_list = ref([]);
|
|
let wancheng_count = ref(0);
|
|
let keshi_ids = ref([])
|
|
let hospital = ref('')
|
|
let refreshInterval = ref(null) // 用于保存定时器引用
|
|
let tip = ref([]);
|
|
let TiShiPopupRef=ref(null)
|
|
const ChaXunFenZhenInfo = async (info) => {
|
|
wancheng_count.value = 0;
|
|
FenZhenGetTiJianLine({
|
|
id_number: id_number.value
|
|
}).then(res => {
|
|
|
|
if (res.status) {
|
|
fenzhen_list.value = res.data.list
|
|
userInfo.value = res.data.info
|
|
tip.value = res.data.tip.split('\r\n');
|
|
fenzhen_list.value.forEach(function(item, index) {
|
|
if (item.status == 4) {
|
|
wancheng_count.value++
|
|
}
|
|
if (keshi_ids.value.includes(item.clinic)) {
|
|
|
|
} else {
|
|
keshi_ids.value.push(item.clinic)
|
|
}
|
|
})
|
|
}
|
|
|
|
})
|
|
}
|
|
// 开始定时刷新
|
|
const startAutoRefresh = () => {
|
|
if (refreshInterval.value) clearInterval(refreshInterval.value) // 防止重复启动
|
|
refreshInterval.value = setInterval(() => {
|
|
ChaXunFenZhenInfo()
|
|
}, 10000) // 每5秒刷新一次
|
|
}
|
|
const daohang=()=>{
|
|
if(userInfo.value.sex==1){
|
|
window.location.href='https://ccty-fz.sixinyun.com/map/nan.jpg'
|
|
}
|
|
if(userInfo.value.sex==2){
|
|
window.location.href='https://ccty-fz.sixinyun.com/map/nv.jpg'
|
|
}
|
|
}
|
|
const toMap=(type)=>{
|
|
// uni.navigateTo({
|
|
// url:'/pages/fenzhen/map?type='+type
|
|
// })
|
|
if(type==1){
|
|
window.location.href='https://ccty-fz.sixinyun.com/map/nan.jpg'
|
|
}
|
|
if(type==2){
|
|
window.location.href='https://ccty-fz.sixinyun.com/map/nv.jpg'
|
|
}
|
|
|
|
}
|
|
onMounted(() => {
|
|
|
|
})
|
|
onLoad((option) => {
|
|
|
|
id_number.value = option.id_number
|
|
|
|
console.log(option)
|
|
ChaXunFenZhenInfo()
|
|
startAutoRefresh()
|
|
|
|
})
|
|
// 组件卸载时清除定时器
|
|
onUnmounted(() => {
|
|
if (refreshInterval.value) {
|
|
clearInterval(refreshInterval.value)
|
|
refreshInterval.value = null
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
.fenzhen_info {
|
|
padding: 30rpx;
|
|
}
|
|
|
|
.header {
|
|
background-color: #30c5be;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx 40rpx;
|
|
color: #fff;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
}
|
|
.daohang_button{
|
|
width: 100rpx;
|
|
border: 1px solid #fff;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
text-align: center;
|
|
border-radius: 20rpx;
|
|
background-color: #fc924a;
|
|
}
|
|
|
|
.shuzi {
|
|
font-weight: 700;
|
|
color: #ff5500;
|
|
}
|
|
|
|
.name {
|
|
font-size: 50rpx;
|
|
}
|
|
|
|
.riqi {
|
|
font-size: 26rpx;
|
|
margin-top: 18rpx;
|
|
}
|
|
|
|
.tiaoma {
|
|
border-radius: 20rpx;
|
|
|
|
padding: 60rpx 40rpx 30rpx 40rpx;
|
|
box-shadow: 0px 5px 5px #ccc;
|
|
}
|
|
|
|
.xia {
|
|
padding: 40rpx 0;
|
|
}
|
|
|
|
.xia_title {
|
|
font-size: #222222;
|
|
font-size: 40rpx;
|
|
}
|
|
|
|
.xia_row1 {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
line-height: 40rpx;
|
|
margin-bottom: 30rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.zhuangtai {
|
|
display: flex;
|
|
box-shadow: 0px 5px 5px #ccc;
|
|
border-radius: 20rpx;
|
|
border: 1px solid #e2e2e2;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.zhuangtai_left {
|
|
|
|
color: #fff;
|
|
padding: 30rpx 20rpx;
|
|
text-align: center;
|
|
/* 文字居中对齐 */
|
|
white-space: nowrap;
|
|
/* 防止文字换行 */
|
|
writing-mode: tb-rl;
|
|
font-size: 30rpx;
|
|
border-radius: 20rpx 0 0 20rpx;
|
|
|
|
}
|
|
|
|
.bakcolor1 {
|
|
background-color: #fc924a;
|
|
}
|
|
|
|
.bakcolor2 {
|
|
background-color: #01cfde;
|
|
}
|
|
|
|
.bakcolor3 {
|
|
background-color: #c6c6c6;
|
|
}
|
|
|
|
.lanzi {
|
|
color: #01cfde;
|
|
}
|
|
|
|
.zhuangtai_right {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
padding: 40rpx;
|
|
}
|
|
|
|
.keshiname {
|
|
font-weight: 500;
|
|
font-size: 40rpx;
|
|
color: #222222;
|
|
}
|
|
|
|
.zhenshiname {
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #6E6E6E;
|
|
margin-top: 12rpx;
|
|
}
|
|
|
|
.tiaoma {
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.tiaoma2 {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
margin-bottom: 15rpx;
|
|
}
|
|
|
|
.item_k {
|
|
border-bottom: 1px solid #ddd;
|
|
padding: 0rpx 16rpx 16rpx 0rpx;
|
|
|
|
}
|
|
|
|
.itemdesc {
|
|
font-size: 26rpx;
|
|
color: #ff573a;
|
|
font-weight: 700;
|
|
}
|
|
.tishi_main{
|
|
background-color: #fff;
|
|
padding: 40rpx 50rpx;
|
|
width:500rpx;
|
|
border-radius: 40rpx;
|
|
}
|
|
.tishi_title{
|
|
text-align: center;
|
|
font-size: 30rpx;
|
|
font-weight: 600;
|
|
color:#2b2827;
|
|
}
|
|
.quyu_button{
|
|
width: 80%;
|
|
background-color: #01cfde;
|
|
text-align: center;
|
|
margin-top: 20rpx;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
color: #fff;
|
|
border-radius: 50rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
}
|
|
</style> |