hengmei-one/pagesB/doctorDetail/doctorDetail.vue

263 lines
8.9 KiB
Vue
Raw Permalink Normal View History

2021-10-21 09:21:59 +00:00
<template>
<view>
<!-- 状态栏 -->
<status-nav :titleVal="'医生'" :statusTitle="true"></status-nav>
<!-- 自定义二级分类 -->
<!-- 列表 -->
<view :style="{paddingTop: statusHNH+'px'}">
<view v-if="isLoading" class="bacf mar-s20 pad-s20 pad-y32 pad-x40">
<view class="disjb">
2021-12-20 08:03:34 +00:00
<image class="radius10 flexs mar-z30" :src="doctorObj.doctor_extra.headimg || moImg" style="width: 300rpx;height: 300rpx;" mode="aspectFill"></image>
<view class="pad-z20">
2021-10-21 09:21:59 +00:00
<view class="fon28 bold col3">{{doctorObj.doctor_extra.name}}</view>
<view class="disac col80 fon24" style="margin: 6rpx 0;">
<view>{{['未知','男','女'][doctorObj.gender]}}</view>
<view class="doctorx"></view>
<view>从业{{parseFloat(doctorObj.doctor_extra.work_time)}}</view>
<view v-if="doctorObj.doctor_extra.dept_name!='' && doctorObj.doctor_extra.dept_name!=undefined" class="doctorx"></view>
<view>{{doctorObj.doctor_extra.dept_name}}</view>
</view>
2021-11-17 03:02:10 +00:00
<view class="col80 fon24">
2021-10-21 09:21:59 +00:00
<view class="flexs">擅长领域</view>
2021-11-17 03:02:10 +00:00
<view class="dis fw">
<view class="flexs" v-for="(item,index) in doctorObj.diseases" :key="index" style="background-color: #F5F5F5;border-radius: 10rpx;padding: 6rpx 10rpx;margin-top: 10rpx;margin-right: 10rpx;">
<text class="bold pcol">{{item.disease_name}}</text>
2021-10-21 09:21:59 +00:00
</view>
2021-11-17 03:02:10 +00:00
</view>
2021-10-21 09:21:59 +00:00
</view>
</view>
</view>
<view class="mar-z32">
<view class="bbot mar-s30"></view>
2021-12-20 08:03:34 +00:00
<view class="fon28 bold col3 mar-sx20">医生简介</view>
<rich-text class="fon26 col3" :nodes="peopleJian"></rich-text>
</view>
<view class="mar-z32">
<view class="bbot mar-s30"></view>
<view class="fon28 bold col3 mar-sx20">医生详情</view>
<rich-text class="fon26 col3" :nodes="detailInfo"></rich-text>
2021-10-21 09:21:59 +00:00
</view>
</view>
<view id="daoh" :class="isTop?'isTop':''" class="isTops" :style="{top:(statusHNH-10)+'px'}">
<view class="bacf pad-zy32 mar-s20 pad-sx20">
<cate-pu :newCurrent="newCurrent*1" :activeb="publicColor" @choosecateEv="chooseTwo" :newbmo="'#F2F2F2'" :isCenter="false" :newcateList="cateList"></cate-pu>
</view>
</view>
<view class="mar-zy32 mar-s20" v-if="dataList.length!=0"><list-pu @chooseLike="chooseLike" @comfirmev="comfirmev" :list="dataList"></list-pu></view>
<view style="margin-top: 30%;" v-if="dataList.length==0"><list-pu :list="dataList"></list-pu></view>
</view>
<view class="pad-zy20 mar-sx30">
<!-- 返回顶部 -->
<!-- <back-top :showTop="showTop" @backTop="backTop"></back-top> -->
</view>
<!-- 底部客服 -->
<public-customer :nbottom="100"></public-customer>
2021-12-20 08:03:34 +00:00
<!-- 弹框授权 -->
<empower @buttonH="buttonH" :vision="vision" :isWhere="2"></empower>
<!-- 弹框 -->
<auth-phone v-if="isShowP"></auth-phone>
2021-10-21 09:21:59 +00:00
</view>
</template>
<script>
import {collectionEV,cancleCollectionEV} from '@/jsFile/publicAPI.js';
export default {
data() {
return {
statusHNH:uni.getStorageSync('statusHNH'),
publicColor:uni.getStorageSync('publicColor'),//主题颜色
cateList:[
// {title:'问题'},
// {title:'案例日记'},
// {title:'效果模拟'},
// {title:'科普视频'},
],
dataList:[
],
showTop:false,
newCurrent:0,
category_id:0,//栏目ID
moImg:'/static/public/logo.png',
doctorObj:{},//医生详情
page:1,
size:10,
total:'',//总数
isZanw:true,
chuTop:'',
isTop:false,
2021-12-20 08:03:34 +00:00
isLoading:false,
detailInfo:'',
peopleJian:'',
vision:false,
isShowP:false,
2021-10-21 09:21:59 +00:00
}
},
onPageScroll(e) {
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
if((this.chuTop - this.statusHNH) - e.scrollTop*1 <= 0) this.isTop = true
else this.isTop = false
},
onReachBottom() {//触底事件
// console.log(this.total,this.dataList.length);
if(this.total!=this.dataList.length){
this.page++
if(this.category_id==0) this.category_id = this.cateList[0].id
this.checkConList(this.category_id)//调用自主预约列表事件
} else {
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多列表','none',1000)
this.isZanw = false
}
},
onShow() {
this.$toolAll.tools.isLogin()
this.checkConList(this.category_id)
},
onLoad(options) {
this.checkDoD(options.doctor_id)
2021-12-20 08:03:34 +00:00
if(uni.getStorageSync('is_active')!=1){this.vision = true;}
if(options.invite_code!='' && options.invite_code!=undefined){
this.loginEv(options.invite_code);
} else if(options.source_code!='' && options.source_code!=undefined){
this.loginEv('',options.source_code,options.channel);
}
2021-10-21 09:21:59 +00:00
const query = wx.createSelectorQuery()
query.select('#daoh').boundingClientRect((rect) => {
this.chuTop = rect.top
}).exec()
},
methods: {
2021-12-20 08:03:34 +00:00
loginEv(invite_code='',source='',channel=''){
uni.login({
provider: 'weixin',
success: (res)=> {
if (res.code) {
var params = {
code:res.code,
invite_code:invite_code,//用户邀请码
source_code:source,
channel:channel
}
this.$requst.post('user/login',params).then(res => {
if(res.data.token!=''){
if(res.data.is_active==0) {
this.vision = true;
}
}
},error => {})
}
},
});
},
buttonH(e){//授权成功
if(e) {
this.vision = false
this.isShowP = true
}
},
2021-10-21 09:21:59 +00:00
chooseLike(e){//收藏事件
// console.log(this.dataList[e].is_collected);
if(this.dataList[e].is_collected==0){
this.dataList[e].is_collected = 1
// 调用收藏事件
collectionEV({action:'collect',archive_id:this.dataList[e].id})
}
},
comfirmev(e){//确认取消收藏事件
this.dataList[e].is_collected = 0
this.$toolAll.tools.showToast('正在取消...','loading')
// 调用取消收藏事件
cancleCollectionEV({action:'collect',archive_id:this.dataList[e].id})
},
checkDoD(doctor_id){
this.$requst.post('user/doctor-info',{doctor_id:doctor_id}).then(res=>{
// console.log('医生详情:',res);
if(res.code==0){
2021-12-20 08:03:34 +00:00
this.doctorObj = res.data;
// 富文本
this.peopleJian = this.$toolAll.tools.escape2Html(this.doctorObj.doctor_extra.summary);
this.detailInfo = this.$toolAll.tools.escape2Html(this.doctorObj.doctor_extra.content);
this.isLoading = true;
2021-10-21 09:21:59 +00:00
}
},error=>{})
},
checkConList(category_id){//查询收藏列表
let params = {
category_id:category_id,
page:this.page,
size:this.size
}
this.$requst.post('archives/hot',params).then(res=>{
if(res.code==0){
// 栏目类别
if(uni.getStorageSync('cateList')==''){//首次渲染栏目
if(res.data.category.length!=0){
res.data.category.forEach((item,index)=>{
let cateObj = {
id:item.id,//栏目ID
title:item.title,//栏目名称
active:item.active,//是否选中
model_id:item.model_id,//模型ID
model_name:item.model_name,//模型标识
sort:item.sort,
}
this.cateList.push(cateObj)
})
uni.setStorageSync('cateList',this.cateList)
}
} else {
//获取缓存中的栏目
this.cateList = uni.getStorageSync('cateList')
}
// 获取列表
if(this.page==1) this.dataList = []
this.total = res.data.list.total
if(res.data.list.list.length!=0){
res.data.list.list.forEach(item=>{
let fabImg = '';
if(item.published_headimgurl!='' && item.published_headimgurl!=null) fabImg = this.$http + item.published_headimgurl
2021-10-21 09:21:59 +00:00
let tObj = {
category_id:item.category_id,//栏目ID
id:item.id,
is_collected:item.is_collected,//是否已收藏
collects:item.collects,//收藏量
views:item.views,//查看量
main_img:this.$http + item.cover,//封面图
video:this.$http + item.video,//视频地址
title:item.title,//标题
content:item.subtitle,//副标题
head_img:fabImg || '/static/public/logo.png',//发布者头像
name:item.published_by || '恒美植发',//发布者昵称
2021-10-21 09:21:59 +00:00
isVideo:item.video.includes(".mp4")//是否是视频
}
2021-12-20 08:03:34 +00:00
this.dataList.push(tObj);
// if(this.newCurrent==0 && item.category_id==32) this.dataList.push(tObj)
// if(this.newCurrent==1 && item.category_id==33) this.dataList.push(tObj)
// if(this.newCurrent==2 && item.category_id==34) this.dataList.push(tObj)
// if(this.newCurrent==3 && item.category_id==38) this.dataList.push(tObj)
2021-10-21 09:21:59 +00:00
})
}
}
},error=>{})
},
chooseTwo(index){
this.newCurrent = index
this.isZanw = true
this.page = 1
this.category_id = this.cateList[index].id
this.checkConList(this.category_id)
},
backTop(){//回到顶部事件
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
},
}
}
</script>
<style>
</style>