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

798 lines
19 KiB

<template>
<view class="index-page btPadding" v-if="pageShow">
<view class="header-wrapper flex">
<view class="left">
<view class="flex top PfScMedium">
<view class="ft50 over2">{{ doctorInfo.doctor_info.doctor_name }}</view>
<view v-if="doctor_dept">
<view class="over2">{{ doctor_dept }}</view>
</view>
</view>
<view class="bt over2" v-if="doctorInfo.doctor_info.doctor_desc">
{{ doctorInfo.doctor_info.doctor_desc }}
</view>
</view>
<img class="right" :src="doctorInfo.doctor_info.avator" alt=""
@click="enlargePicture(doctorInfo.doctor_info.avator)" v-if="doctorInfo.doctor_info.avator">
</view>
<view class="block desc-wrapper" v-if="doctorInfo.doctor_info.doctor_detail">
<!-- <view class="title-wrapper flex">
<view class="title">
医生简介
</view>
<img :src="cssUrl+'right_bg.png'" alt="">
</view> -->
<view class="con">
{{ doctorInfo.doctor_info.doctor_detail }}
</view>
</view>
<view class="block hospital-wrapper" v-if="hospitals">
<!-- <view class="title-wrapper flex">
<view class="title">
出诊信息
</view>
<img :src="cssUrl+'right_bg.png'" alt="">
</view> -->
<view class="item" v-for="(item, key) in hospitals">
<view class="top flex">
<view class="left">
<view class="title flex">
<text class="over2 PfScMedium hospital_name">{{ item.hospital_name }}</text>
<view class="fixed_hospital" v-if="item.is_fixed == 1">医保定点</view>
</view>
<view class="date over2 over4" v-if="item.address">
{{ item.address }}
</view>
</view>
<view class="right">
<view class="flex right-wrapper" style="justify-content:center;" v-if="item.hospital_pos">
<view class="" @click="toLocation(item)">
<img :src="cssUrl + 'index_nav.svg'" alt="">
<view class="map-wrap">导航</view>
</view>
</view>
</view>
</view>
<view class="center" v-if="item.workdate_desc">
出诊:{{ item.workdate_desc }}
</view>
<uni-collapse ref="collapse" v-model="collapseValue[key]" class="notice-collapse" v-if="item.notice">
<uni-collapse-item title="预约须知">
<view class=" content">
<view class="text" v-html="item.notice"></view>
</view>
</uni-collapse-item>
</uni-collapse>
<view class="bot primary btn btn2" hover-class="hover" @click="toVisitors(item)" v-if="item.type == 0">
开始预约
</view>
</view>
</view>
<view class="block visit-wrapper" v-if="recentAppoint && this.doctorInfo && !this.doctorInfo.is_all_card">
<view class="header flex">
<view class="title-wrapper flex booklist">
<view class="title">
最近预约
</view>
<img :src="cssUrl + 'right_bg.png'" alt="">
</view>
<view class="opt flex" @click="toPrebookList">
查看全部<img :src="cssUrl + 'index_comback2.svg'" alt="">
</view>
</view>
</view>
<pre-book-list class="preg-books" :dataList="recentAppoint" :topnopadding="true"
v-if="this.doctorInfo && !this.doctorInfo.is_all_card"></pre-book-list>
<tabbar current="1" leftButtonText="主页" v-if="!doctorInfo.is_all_card"></tabbar>
<!-- #ifdef MP-WEIXIN -->
<doctorImport v-if="user_type == '1' || user_type == '2'"></doctorImport>
<!-- #endif -->
<uni-popup ref="nameWrap" :safe-area="false">
<view class="popup-container">
<view class="header">
<view class="title PfScMedium">需要填写真实姓名,来确保您账号的唯一性</view>
</view>
<view class="label">真实姓名</view>
<input type="text" class="realName" v-model="realName" placeholder-class="placeholder-style" placeholder="请填写">
<view class="confirm-button-wrapper btPadding">
<view class="confirm-button PfScMedium" @click="handleConfirm">
完成
</view>
</view>
</view>
</uni-popup>
<button class="getphone-box" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-if="!doctorInfo.aid"></button>
</view>
</template>
<script>
import tabbar from '@/components/tabbar.vue'
import preBookList from '@/components/preBookList.vue'
// #ifdef MP-WEIXIN
import doctorImport from '@/components/doctorImport.vue'
// #endif
export default {
data() {
return {
realName:'',
collapseValue: [],
cssUrl: this.cssUrl,
code: '',
pageShow: false,
doctor_id: '',
doctorInfo: false,
doctor_dept: false,
hospitals: false,
recentAppoint: [],
loginToken: false,
state: '',
workdate: [],
user_type: -1,
show_info:false,
showNameDialog: false,
userName: "",
hasRejectedPhone: false, // 记录用户是否拒绝过手机号授权
}
},
components: {
tabbar,
preBookList,
// #ifdef MP-WEIXIN
doctorImport,
// #endif
},
onLoad(option) {
if (option.code && option.state) {
this.code = option.code
this.state = option.state
}
},
async onShow() {
this.doctor_id = getApp().globalData.doctorId
if (!this.doctor_id) return
var title = ''
if (this.code) title = '登录'
uni.setNavigationBarTitle({
title: title
})
var token = this.$token.getToken()
if (this.code && this.state && !token) {
this.login()
return
}
await this.getDoctorInfo()
},
methods: {
handleConfirm(){
if(!this.realName.trim()){
uni.showModal({
title:'提示',
content: '姓名不可为空',
})
return
}
this.$http.req('/api/user/set_realname', { realname:this.realName}, 'POST').then(data => {
if (data == -1) return
this.$refs.nameWrap.close()
});
},
getPhoneNumber(e) {
console.log(e)
if (e.detail.errMsg === 'getPhoneNumber:ok') {
this.$http.req('api/user/bind_phone', {phonecode:e.detail.code}, 'POST').then(data=>{
if(data == -1) return
this.getDoctorInfo()
});
} else {
}
},
toLocation(hospital) {
// #ifdef MP-WEIXIN
var lngLat = hospital.hospital_pos.toString().split(',')
var lng = Number(lngLat[1])
, lat = Number(lngLat[0])
if (typeof wx !== 'undefined' && wx.openLocation) {
wx.openLocation({
latitude: lat,
longitude: lng,
name: hospital.hospital_name || '目的地',
address: hospital.address || '',
scale: 15,
success: () => console.log('打开成功'),
fail: (err) => console.error('失败', err)
});
}
// #endif
// #ifdef H5
var that = this
uni.showActionSheet({
itemList: ['腾讯地图', '百度地图', '高德地图'],
success: function (res) {
var lngLat = hospital.hospital_pos.toString().split(',')
var lng = lngLat[0].toString()
, lat = lngLat[1].toString()
var baiduLngLat = that.qqMapTransBMap(lng, lat)
var mapList = [
'http://apis.map.qq.com/uri/v1/marker?marker=coord:' + lat + ',' + lng + ';addr:' + hospital.hospital_name,
// 'http://apis.map.qq.com/uri/v1/marker?marker=coord:'+ lat+','+lng+';title:'+hospital.hospital_name+ 'addr:'+hospital.address, // new 有title
'http://api.map.baidu.com/marker?location=' + baiduLngLat.lat + ',' + baiduLngLat.lng + '&title=' + hospital.hospital_name + '&content=即将前往目的地&output=html&src=webapp.baidu.openAPIdemo',
'https://m.amap.com/share/index/lnglat=' + hospital.hospital_pos + '&name=' + hospital.hospital_name + '&src=uriapi&innersrc=uriapi',
]
location.href(mapList[res.tapIndex])
},
fail: function (res) {
}
});
// #endif
},
copyAddress(address) {
uni.setClipboardData({
data: address,
success: () => {
uni.showToast({ title: "地址已复制", icon: "none" });
}
});
},
setLoginUserInfo(info) {
this.$setuinfo.setUinfo(JSON.stringify(info))
},
login() {
this.$http.req('api/common/get_user_info', { code: this.code, state: this.state }, 'POST').then(data => {
if (data == -1) return
this.$settoken.setToken(data.jwttoken)
this.setLoginUserInfo(data)
var stat_info = this.state.split('-');
if (stat_info.length > 2) {
uni.removeStorageSync('checkin_depart_id');
this.$nav.navToPath('/pages/visitors/visitors?type=3&depart_id=' + stat_info[2])
return;
}
this.getDoctorInfo()
});
},
async getDoctorInfo() {
await this.$http.req('api/user/index_info', {}, 'GET').then(data => {
if (data == -1) return
// var data = JSON.parse(uni.getStorageSync('doctor_info'));
var checkin_depart_id = uni.getStorageSync('checkin_depart_id');
if (checkin_depart_id) {
uni.removeStorageSync('checkin_depart_id');
this.$nav.navToPath('/pages/visitors/visitors?type=3&depart_id=' + checkin_depart_id)
return;
}
this.pageShow = true;
let visitFlag = true;
this.doctorInfo = data;
this.user_type = this.doctorInfo.user_type;
if(!data.realname && data.aid) {
this.$nextTick(() => {
this.$refs.nameWrap.open('bottom')
})
}
var title = this.doctorInfo.doctor_info.doctor_name + '主页'
uni.setNavigationBarTitle({
title: title
})
if (this.doctorInfo.doctor_info && this.doctorInfo.doctor_info.depart_name && this.doctorInfo.doctor_info.depart_name.length > 0) {
this.doctor_dept = this.doctorInfo.doctor_info.depart_name;
}
if (this.doctorInfo.hospital_departs && this.doctorInfo.hospital_departs.length > 0) {
this.hospitals = this.doctorInfo.hospital_departs;
this.doctor_dept = this.doctorInfo.hospital_departs[0]['depart_name'];
this.doctorInfo.doctor_info.depart_name = this.doctor_dept;
for (var index = 0; index < this.hospitals.length; index++) {
this.collapseValue[index] = []
}
} else {
visitFlag = false;
}
if (this.doctorInfo.visit_list && this.doctorInfo.visit_list.length > 0) {
this.recentAppoint = this.doctorInfo.visit_list;
}
if (this.doctorInfo.workdate && Object.keys(this.doctorInfo.workdate).length > 0) {
this.workdate = this.doctorInfo.workdate;
} else {
visitFlag = false;
}
this.hospital_departs = this.doctorInfo.hospital_departs.map((item, index) => {
if (this.doctorInfo.workdate_desc) item.workdate_desc = this.doctorInfo.workdate_desc[item.depart_id]
return item
})
});
},
enlargePicture(imgUrl) {
var list = new Array();
list[0] = imgUrl;
uni.previewImage({
loop: true,
urls: list
});
},
toVisitors(hospital) {
uni.setStorageSync('depart_id', hospital.depart_id)
uni.setStorageSync('depart', JSON.stringify(hospital))
uni.setStorageSync('doctor_info', JSON.stringify(this.doctorInfo))
this.$nav.navToPath("/pages/visitors/visitors?type=1&is_preview=1")
},
toPrebookList() {
this.$nav.navToPath("/pages/prebook_list/prebook_list")
},
toPrebookDetail() {
this.$nav.navToPath("/pages/visit_detail/visit_detail")
},
qqMapTransBMap(lng, lat) {
let x_pi = 3.14159265358979324 * 3000.0 / 180.0;
let x = lng;
let y = lat;
let z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * x_pi);
let theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * x_pi);
let lngs = z * Math.cos(theta) + 0.0065;
let lats = z * Math.sin(theta) + 0.006;
return {
lng: lngs,
lat: lats
}
}
},
onShareAppMessage() {
return {
title: this.doctorInfo.doctor_info.doctor_name + '的预约挂号',
path: '/pages/index/index?did=' + this.doctor_id
}
}
}
</script>
<style lang="scss" scoped>
.index-page {
.header-wrapper {
min-height: 208rpx;
padding: 27rpx 40rpx 24rpx;
box-sizing: border-box;
.left {
width: 510rpx;
.top {
overflow: hidden;
margin-top: 31rpx;
& view:first-of-type {
color: #333;
letter-spacing: 1.32rpx;
margin-right: 27rpx;
max-width: 250rpx;
font-weight: 500;
}
& view:last-of-type {
view {
width: auto;
padding: 0 15rpx;
margin-top: 5rpx;
justify-content: center;
display: flex;
align-items: center;
height: 42rpx;
font-size: 28rpx;
background: linear-gradient(288deg, #FFEED2 0%, #FED9A6 100%);
border-radius: 8rpx;
color: #7D501F;
}
}
}
.bt {
width: 480rpx;
line-height: 40rpx;
font-size: 28rpx;
color: #666666;
margin-top: 21rpx;
}
}
.right {
flex-grow: 1;
display: block;
border-radius: 100%;
height: 160rpx;
width: 160rpx;
}
}
.block {
background: #FFFFFF;
border-radius: 8rpx;
padding: 36rpx 24rpx;
box-sizing: border-box;
margin: 0 auto;
width: 714rpx;
margin-bottom: 20rpx;
}
.desc-wrapper {
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0, 0, 0, 0.03);
color: #949699;
font-size: 30rpx;
line-height: 50rpx;
.con {
overflow-y: auto;
max-height: 200rpx;
color: #666666;
}
.con::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
}
.title-wrapper {
.title {
width: 117rpx;
height: 42rpx;
padding-left: 13rpx;
margin-bottom: 36rpx;
font-size: 26rpx;
color: #FFFFFF;
line-height: 42rpx;
text-align: center;
border-radius: 8rpx 0rpx 0rpx 8rpx;
background: linear-gradient(98deg, #53C184 0%, #5CD378 100%);
}
&.booklist .title {
margin-bottom: 0rpx;
}
img {
width: 48rpx;
height: 42rpx;
}
}
.hospital-wrapper {
.item {
min-height: 207rpx;
width: 100%;
margin-bottom: 36rpx;
border-bottom: 2rpx solid #F1F1F1;
padding-bottom: 36rpx;
&:last-child {
margin-bottom: 0rpx;
padding-bottom: 0rpx;
border-bottom: none !important;
}
.top {
.left {
flex-grow: 1;
.title {
align-items: center;
flex-wrap: wrap;
column-gap: 20rpx;
row-gap: 12rpx;
.hospital_name {
color: #333;
font-size: 32rpx;
}
img {
width: 20rpx;
height: 32rpx;
}
.fixed_hospital {
border-radius: 6rpx;
background: #F7FCFF;
border: 2rpx solid rgba(9, 131, 208, 0.6);
box-sizing: border-box;
width: 123rpx;
height: 40rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 26rpx;
letter-spacing: 0.69rpx;
color: #0983D0;
}
}
.date {
line-height: 40rpx;
font-size: 28rpx;
color: #949699;
margin-top: 22rpx;
}
}
.right {
width: 172rpx;
flex-shrink: 0;
height: 100%;
color: #666666;
display: flex;
justify-content: flex-end;
.map-wrap {
font-size: 26rpx;
font-weight: normal;
line-height: normal;
letter-spacing: 0.74rpx;
color: #666666;
margin-top: 4rpx;
}
img {
width: 52rpx;
height: 52rpx;
}
.copy_btn {
display: block;
line-height: normal;
text-align: center;
margin-top: 4rpx;
font-size: 24rpx;
color: #30C563;
}
}
}
.center {
justify-content: flex-start;
align-items: center;
width: 100%;
box-sizing: border-box;
min-height: 59rpx;
padding: 10rpx;
display: flex;
z-index: 1;
background: #F8F6F9;
font-size: 28rpx;
line-height: 39rpx;
color: #666666;
margin-top: 22rpx;
margin-bottom: 24rpx;
word-break: break-all;
}
.notice-collapse {
margin-top: 24rpx;
::v-deep {
.uni-collapse-item__title-box {
padding: 0;
display: flex;
justify-content: flex-start;
align-items: center;
height: 40rpx;
line-height: 40rpx;
color: #303133;
font-weight: normal;
margin-top: 0rpx;
}
.uni-collapse-item__title {
border: none !important;
}
.uni-collapse-item__title-arrow {
width: 32rpx;
height: 32rpx;
margin-left: 12rpx;
}
.uni-icons {
width: 32rpx;
height: 32rpx;
}
.uni-collapse-item__title-text {
font-size: 28rpx;
letter-spacing: 0.22rpx;
color: #949699;
}
.uni-collapse-item__title-wrap {
width: auto;
flex: unset;
}
.content {
color: red !important;
}
.uni-collapse-item__wrap-content {
border: none !important;
}
.uni-collapse-item__title.is-open {
margin-bottom: 24rpx;
}
.content {
width: 100%;
height: auto;
padding: 24rpx;
box-sizing: border-box;
background: #F8F6F9;
border-radius: 12rpx;
}
.content .text {
font-size: 28rpx;
font-weight: normal;
line-height: 40rpx;
letter-spacing: 0.22rpx;
color: #666666;
}
}
}
.bot {
margin-top: 16rpx;
font-size: 32rpx;
}
}
}
.visit-wrapper {
margin-bottom: 0;
.header {
justify-content: space-between;
.opt {
align-items: center;
overflow: hidden;
font-size: 26rpx;
color: #949699;
img {
width: 20rpx;
height: 32rpx;
margin-left: 8rpx;
}
}
}
}
.preg-books {
width: 714rpx;
margin: 0 auto;
}
.getphone-box{
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
z-index: 8999999999;
opacity: 0;
}
}
.popup-container {
position: relative;
max-height: calc(100vh - 200rpx);
overflow-y: scroll;
background: #ffffff;
border-radius: 40rpx 40rpx 0px 0px;
padding: 42rpx 48rpx 16rpx;
.header {
position: relative;
text-align: left;
.title {
font-size: 30rpx;
font-weight: 500;
line-height: 42rpx;
letter-spacing: normal;
color: #000000;
}
}
.label {
margin-top: 54rpx;
font-family: PingFang SC;
font-size: 34rpx;
font-weight: 500;
line-height: 47.6rpx;
letter-spacing: normal;
color: #000000;
}
.realName {
color: #000000;
font-size: 34rpx;
line-height: 40rpx;
font-family: PingFang SC;
font-weight: normal;
letter-spacing: normal;
padding: 22rpx 0;
border-bottom: 2rpx solid rgba(0, 0, 0, 0.1);
margin-bottom: 160rpx;
margin-top: 22rpx;
&::placeholder {
opacity: 0.3;
}
}
.placeholder-style {
opacity: 0.3;
}
.confirm-button-wrapper {
display: flex;
align-items: center;
justify-content: center;
.confirm-button {
justify-content: center;
display: flex;
align-items: center;
font-weight: 600;
font-size: 34rpx;
color: #ffffff;
text-align: center;
width: 368rpx;
height: 80rpx;
border-radius: 8rpx;
background: #07C160;
}
}
.date {
margin: 12rpx 36rpx 42rpx;
text-align: center;
color: #000000;
font-size: 26rpx;
font-family: PingFang SC;
}
}
</style>