|
|
<template>
|
|
|
<view class="page" v-if="showPage">
|
|
|
<view class="pageMain">
|
|
|
<view class="padding-lr-40 padding-tb-30 border-bottom-ed">
|
|
|
<view class="flex margin-bottom-30">
|
|
|
<view class="flex-one margin-right-30">
|
|
|
<view class="text-46 text-33 text-bold">{{detailData.name}}</view>
|
|
|
<view class="margin-top-10 text-77 text-26">{{detailData.brief}}</view>
|
|
|
</view>
|
|
|
<view class="headerImg">
|
|
|
<image :src="detailData.head_img" class="width-100p height-100p" mode="aspectFill">
|
|
|
</image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="flex align-end justify-between">
|
|
|
<view class="flex">
|
|
|
<view class="flex align-center flex-direction margin-right-80">
|
|
|
<view class="text-34 text-33 text-bold">{{detailData.make_number}}</view>
|
|
|
<view class="text-24 text-77">预约量</view>
|
|
|
</view>
|
|
|
<view class="flex align-center flex-direction">
|
|
|
<view class="text-34 text-33 text-bold">{{detailData.follow_number}}</view>
|
|
|
<view class="text-24 text-77">粉丝</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="followBtn" @click="changeFollow">
|
|
|
<text v-if="isFollow == 1">已关注</text>
|
|
|
<text v-if="isFollow == 0" class="tyIcon-jia"
|
|
|
style="font-size: 26rpx;margin-right: 5rpx;"></text>
|
|
|
<text v-if="isFollow == 0">关注</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-tb-40 padding-lr-30">
|
|
|
<view class="flex justify-between align-center margin-bottom-20">
|
|
|
<view class="text-32 text-33 text-bold line-40">在线咨询服务</view>
|
|
|
<view class="text-32 text-ff85 text-bold text-price line-45">{{detailData.price}}</view>
|
|
|
</view>
|
|
|
<view class="text-26 text-33 line-40 margin-bottom-50">
|
|
|
通过文字、图片、视频向专家提问,含1次提问,3次追问
|
|
|
</view>
|
|
|
<view class="text-32 text-33 text-bold line-40 margin-bottom-20">
|
|
|
专家介绍
|
|
|
</view>
|
|
|
<view class="text-26 text-77 line-40 margin-bottom-50">
|
|
|
{{detailData.introduce}}
|
|
|
</view>
|
|
|
<view class="text-32 text-33 text-bold line-40 margin-bottom-20">
|
|
|
资质证书
|
|
|
</view>
|
|
|
<view class="margin-bottom-50">
|
|
|
<image v-for="(item,index) in detailData.certificate_img" :key="index" :src="item" mode="widthFix"
|
|
|
class="width-100p block" :class="index == (detailData.certificate_img.length - 1)?'' : 'margin-bottom-20'"></image>
|
|
|
</view>
|
|
|
<view class="text-32 text-33 text-bold line-40 margin-bottom-20">
|
|
|
主要业绩
|
|
|
</view>
|
|
|
<view class="text-26 text-77 line-40">
|
|
|
{{detailData.achievement}}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="line15"></view>
|
|
|
<!-- 评价 -->
|
|
|
<view class="evaBox padding-lr-30 padding-bottom-35 padding-top-20">
|
|
|
<view class="text-30 text-bold ">
|
|
|
评价
|
|
|
</view>
|
|
|
|
|
|
<block v-if="reviewMsg">
|
|
|
<view class="flex flex-wrap border-bottom-ed margin-top-20">
|
|
|
<view class="text-22 line-50 padding-lr-25 evaBtn2"
|
|
|
@click="go('/pages/expert/evaluateList?index=0&id='+id)">
|
|
|
<text class="margin-right-5">全部</text>
|
|
|
<text>{{numbers.all}}</text>
|
|
|
</view>
|
|
|
<view class="text-22 line-50 padding-lr-25 evaBtn1"
|
|
|
@click="go('/pages/expert/evaluateList?index=1&id='+id)">
|
|
|
<text class="margin-right-5">及时快速</text>
|
|
|
<text>{{numbers.number1}}</text>
|
|
|
</view>
|
|
|
<view class="text-22 line-50 padding-lr-25 evaBtn1"
|
|
|
@click="go('/pages/expert/evaluateList?index=2&id='+id)">
|
|
|
<text class="margin-right-5">很有耐心</text>
|
|
|
<text>{{numbers.number2}}</text>
|
|
|
</view>
|
|
|
<view class="text-22 line-50 padding-lr-25 evaBtn1"
|
|
|
@click="go('/pages/expert/evaluateList?index=3&id='+id)">
|
|
|
<text class="margin-right-5">专业权威</text>
|
|
|
<text>{{numbers.number3}}</text>
|
|
|
</view>
|
|
|
<view class="text-22 line-50 padding-lr-25 evaBtn1"
|
|
|
@click="go('/pages/expert/evaluateList?index=4&id='+id)">
|
|
|
<text class="margin-right-5">详细清楚</text>
|
|
|
<text>{{numbers.number4}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-top-30 padding-bottom-50">
|
|
|
<view class="flex align-center margin-bottom-20">
|
|
|
<view class="userHeader">
|
|
|
<image :src="reviewMsg.head_img" mode="aspectFill" class="width-100p height-100p">
|
|
|
</image>
|
|
|
</view>
|
|
|
<view class="flex-one margin-lr-15">
|
|
|
<view class="text-24 text-33 text-bold margin-bottom-10">{{reviewMsg.nick_name}}</view>
|
|
|
<view class="text-24 text-98">{{reviewMsg.review_time}}</view>
|
|
|
</view>
|
|
|
<view class="flex align-center">
|
|
|
<image src="/static/home/star1.png" v-for="(item,index) in reviewMsg.star" :key="index"
|
|
|
class="starImg margin-left-10"></image>
|
|
|
<image src="/static/home/star0.png" v-for="(item,index) in (5-reviewMsg.star)" :key="index"
|
|
|
class="starImg margin-left-10"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="padding-left-95 text-28 line-40 text-33">{{reviewMsg.content}}</view>
|
|
|
</view>
|
|
|
<view class="flex justify-center">
|
|
|
<view class="text-24 text-33 text-center allReviewBtn"
|
|
|
@click="go('/pages/expert/evaluateList?index=0&id='+id)">
|
|
|
查看全部评价
|
|
|
</view>
|
|
|
</view>
|
|
|
</block>
|
|
|
<block v-else>
|
|
|
<view class="padding-tb-50 text-center text-26 text-77">
|
|
|
暂无评价~
|
|
|
</view>
|
|
|
</block>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="bottomBox justify-between flex align-center border-top-f5">
|
|
|
<view class="flex flex-direction align-center position-relative">
|
|
|
<view class="icon-icon-fenxiang iconfont text-42 margin-bottom-5"></view>
|
|
|
<view class="text-22 text-33">分享</view>
|
|
|
<button open-type="share" class="shareBtn"></button>
|
|
|
</view>
|
|
|
<view class="text-center text-ff text-30 text-bold bottomBtn1" v-if="status == 2" @click="tapOrder">
|
|
|
立即咨询
|
|
|
</view>
|
|
|
<view class="text-30 text-77 text-bold text-center bottomBtn2" v-if="status == 1">
|
|
|
已下架
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
id: '',
|
|
|
isFollow: 0, //0-未关注 1-已关注
|
|
|
|
|
|
|
|
|
status: 1,
|
|
|
|
|
|
detailData: {},
|
|
|
numbers: {},
|
|
|
reviewMsg: {},
|
|
|
showPage: false,
|
|
|
}
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
this.id = options.id;
|
|
|
this.getPageData();
|
|
|
},
|
|
|
onShareAppMessage() {
|
|
|
return{
|
|
|
title:this.detailData.name + ' ' + this.detailData.brief,
|
|
|
imageUrl:this.detailData.head_img,
|
|
|
path : '/pages/expert/detail?id=' + this.id
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
getPageData() {
|
|
|
this.rq.getData('fire/api/Fire/getExpertDetail', {
|
|
|
expert_id: this.id
|
|
|
}).then(res => {
|
|
|
this.detailData = res.data.detail;
|
|
|
this.numbers = res.data.number;
|
|
|
this.reviewMsg = res.data.newest_review;
|
|
|
this.isFollow = res.data.detail.is_follow;
|
|
|
this.status = res.data.detail.is_publish;
|
|
|
this.showPage = true;
|
|
|
})
|
|
|
},
|
|
|
// 关注
|
|
|
changeFollow() {
|
|
|
if (this.cn.isLogin()) {
|
|
|
this.rq.getData('fire/api/Fire/submitExpertFollow', {
|
|
|
expert_id: this.id
|
|
|
}).then(res => {
|
|
|
if (res.code == 0) {
|
|
|
this.isFollow = this.isFollow == 1 ? 0 : 1;
|
|
|
if(this.isFollow){
|
|
|
this.detailData.follow_number++;
|
|
|
}else{
|
|
|
this.detailData.follow_number--;
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
} else {
|
|
|
uni.navigateTo({
|
|
|
url: '/pages/home/login'
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
// 立即下单
|
|
|
tapOrder() {
|
|
|
if (this.cn.isLogin()) {
|
|
|
uni.navigateTo({
|
|
|
url: '/pages/expert/order?id=' + this.id
|
|
|
})
|
|
|
} else {
|
|
|
uni.navigateTo({
|
|
|
url: '/pages/home/login'
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
.pageMain {
|
|
|
width: 100vw;
|
|
|
min-height: 100vh;
|
|
|
background: #fff;
|
|
|
padding-bottom: calc(130rpx + env(safe-area-inset-bottom));
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
.headerImg {
|
|
|
width: 200rpx;
|
|
|
height: 200rpx;
|
|
|
border-radius: 50%;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.followBtn {
|
|
|
width: 160rpx;
|
|
|
height: 64rpx;
|
|
|
background: #2F97FF;
|
|
|
border-radius: 10rpx;
|
|
|
text-align: center;
|
|
|
line-height: 64rpx;
|
|
|
color: #fff;
|
|
|
font-size: 26rpx;
|
|
|
}
|
|
|
|
|
|
.line15 {
|
|
|
width: 100vw;
|
|
|
height: 15rpx;
|
|
|
background: #F5F5F5;
|
|
|
}
|
|
|
|
|
|
.evaBtn2,
|
|
|
.evaBtn1 {
|
|
|
border-radius: 26rpx;
|
|
|
margin-bottom: 20rpx;
|
|
|
margin-right: 20rpx;
|
|
|
}
|
|
|
|
|
|
.evaBtn2 {
|
|
|
color: #FF8534;
|
|
|
background: #fff;
|
|
|
border: 2rpx solid #FF8534;
|
|
|
}
|
|
|
|
|
|
.evaBtn1 {
|
|
|
background: #F5F5F5;
|
|
|
border: 2rpx solid #F5F5F5;
|
|
|
}
|
|
|
|
|
|
.userHeader {
|
|
|
width: 80rpx;
|
|
|
height: 80rpx;
|
|
|
border-radius: 50%;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
.starImg {
|
|
|
width: 30rpx;
|
|
|
height: 30rpx;
|
|
|
}
|
|
|
|
|
|
.allReviewBtn {
|
|
|
width: 200rpx;
|
|
|
line-height: 54rpx;
|
|
|
border-radius: 28rpx;
|
|
|
border: 1rpx solid #CCCCCC;
|
|
|
}
|
|
|
|
|
|
/* 底部 */
|
|
|
.bottomBox {
|
|
|
width: 100vw;
|
|
|
background: #fff;
|
|
|
position: fixed;
|
|
|
left: 0;
|
|
|
bottom: 0;
|
|
|
box-sizing: border-box;
|
|
|
padding: 10rpx 30rpx calc(10rpx + env(safe-area-inset-bottom)) 60rpx;
|
|
|
}
|
|
|
|
|
|
.bottomBtn1,
|
|
|
.bottomBtn2 {
|
|
|
width: 560rpx;
|
|
|
height: 80rpx;
|
|
|
border-radius: 40rpx;
|
|
|
line-height: 80rpx;
|
|
|
}
|
|
|
|
|
|
.bottomBtn1 {
|
|
|
background: #2F97FF;
|
|
|
}
|
|
|
|
|
|
.bottomBtn2 {
|
|
|
background: #E5E5E5;
|
|
|
}
|
|
|
.shareBtn{
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
position: absolute;
|
|
|
left: 0;
|
|
|
top: 0;
|
|
|
opacity: 0;
|
|
|
z-index: 6;
|
|
|
}
|
|
|
</style>
|