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.
 
 
 
 
 
 

380 lines
9.4 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.name}}</view>
<view v-if="doctor_dept">
<view class="over2">{{doctor_dept}}</view>
</view>
</view>
<view class="bt over2" v-if="doctorInfo.brief">
{{doctorInfo.brief}}
</view>
</view>
<img class="right" :src="doctorInfo.photo" alt="" @click="enlargePicture(doctorInfo.photo)" v-if="doctorInfo.photo">
</view>
<view class="block desc-wrapper" v-if="doctorInfo.intro">
<view class="title-wrapper flex">
<view class="title">
医生简介
</view>
<img :src="cssUrl+'right_bg.png'" alt="">
</view>
<view class="con over2 over4">
{{doctorInfo.intro}}
</view>
</view>
<view class="block hospital-wrapper" v-if="hospitals">
<view class="item" v-for="(item,key) in hospitals">
<view class="top flex">
<view class="left">
<view class="title flex">
<text class="over2">{{item.hospital_name}}</text>
<img :src="cssUrl+'index_comback.svg'" v-if="item.hospital_location" @click="toLocation(item)">
</view>
<view class="date over2" v-if="item.visit_day_text">
出诊:{{item.visit_day_text}}
</view>
</view>
<view class="right">
<view class="flex right-wrapper" style="justify-content:flex-end;" v-if="item.hospital_location">
<view class="" @click="toLocation(item)">
<img :src="cssUrl+'index_nav.svg'" alt="">
<view>导航</view>
</view>
</view>
</view>
</view>
<view class="bot primary btn btn2" hover-class="hover" @click="toVisitors">
预约看诊
</view>
</view>
</view>
<view class="block visit-wrapper" v-if="recentAppoint">
<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"></pre-book-list>
<tabbar current="1"></tabbar>
</view>
</template>
<script>
import tabbar from '@/components/tabbar.vue'
import preBookList from '@/components/preBookList.vue'
export default {
data() {
return {
cssUrl:this.cssUrl,
code:'',
pageShow:false,
doctor_id:'',
doctorInfo:false,
doctor_dept:false,
hospitals:false,
recentAppoint:[]
}
},
components:{
tabbar,
preBookList,
},
onLoad(option) {
if(option.code) this.code = option.code
},
onShow() {
this.doctor_id = getApp().globalData.doctorId
if(!this.doctor_id) return;
var title = '李静医生预约就诊'
if(this.code) title = '登录'
uni.setNavigationBarTitle({
title:title
})
var token = uni.getStorageSync('token')
if(this.code && !token) {
var rebackPagePath = uni.getStorageSync('rebackPagePath')
this.login()
return
}
this.getDoctorInfo()
},
methods: {
toLocation(hospital){
var that = this
uni.showActionSheet({
itemList: ['腾讯地图', '百度地图', '高德地图'],
success: function (res) {
var lngLat = hospital.hospital_location.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://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_location+'&name='+hospital.hospital_name+'&src=uriapi&innersrc=uriapi',
]
console.log(mapList[res.tapIndex])
// return;
location.href = mapList[res.tapIndex]
},
fail: function (res) {
}
});
},
login() {
this.$http.req('client/user/login', {code:this.code}, 'POST').then(data=>{
if(data == -1) return
uni.setStorageSync('token', data.token)
var rebackPagePath = uni.getStorageSync('rebackPagePath')
if(rebackPagePath){
uni.navigateTo({
url:rebackPagePath
})
}
});
},
getDoctorInfo() {
this.$http.req('client/user/doctorpage/'+this.doctor_id, {}, 'GET').then(data=>{
if(data == -1) return
this.pageShow = true
this.keywords = data
this.doctorInfo = data
if(this.doctorInfo.visit_hospital && this.doctorInfo.visit_hospital.length>0){
this.doctor_dept = this.doctorInfo.visit_hospital[0].hospital_dept_name
}
if(this.doctorInfo.visit_hospital && this.doctorInfo.visit_hospital.length>0){
this.hospitals = this.doctorInfo.visit_hospital
}
if(this.doctorInfo.appoint_record && this.doctorInfo.appoint_record.length>0){
this.recentAppoint = this.doctorInfo.appoint_record
}
});
},
enlargePicture(imgUrl) {
var list = new Array();
list[0] = imgUrl;
uni.previewImage({
loop: true,
urls: list
});
},
toVisitors(){
uni.navigateTo({
url:"/pages/visitors/visitors?type=1"
})
},
toPrebookList(){
uni.navigateTo({
url:"/pages/prebook_list/prebook_list"
})
},
toPrebookDetail(){
uni.navigateTo({
url:"/pages/book_detail/book_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
}
}
}
}
</script>
<style lang="scss" scoped>
.index-page{
.header-wrapper{
min-height: 208rpx;
padding: 24rpx 40rpx 24rpx;
box-sizing: border-box;
.left{
width: 510rpx;
.top{
overflow: hidden;
margin-top: 31rpx;
& view:first-of-type{
color: #000000;
letter-spacing: 1rpx;
margin-right: 27rpx;
max-width: 250rpx;
}
& view:last-of-type{
view{
width: auto;
padding: 0 15rpx;
min-width: 125rpx;
margin-top: 14rpx;
line-height: 42rpx;
text-align: center;
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: #38503F;
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{
height: auto;
}
}
.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{
&:last-child{
margin-bottom: 0rpx;
}
min-height: 207rpx;
width: 100%;
margin-bottom: 36rpx;
.top{
min-height: 102rpx;
.left{
flex-grow: 1;
.title{
align-items: center;
img{
width: 20rpx;
height: 32rpx;
}
}
.date{
line-height: 40rpx;
font-size: 28rpx;
color: #666666;
margin-top: 14rpx;
}
}
.right{
width: 200rpx;
height: 100%;
img{
width: 52rpx;
height: 52rpx;
background: #F4F4F4;
border-radius: 6rpx;
margin-right: 7rpx;
}
text{
width: 60rpx;
height: 54rpx;
display: block;
font-size: 26rpx;
color: #666666;
line-height: 37rpx;
text-align: center;
margin-top: 5rpx;
}
}
}
.bot{
margin-top: 16rpx;
}
}
}
.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-top: 8rpx;
margin-left: 8rpx;
}
}
}
}
.preg-books{
width: 714rpx;
margin: 0 auto;
}
}
</style>