mabao/pages/doctor_related/doctor_info.vue

<template>
	<view class="main">
		<view>
			<view class="pr det-body">
				<image class="det-bg-img" mode="scaleToFill" src="http://file.supermm.me/miniProgram/images/det/det_bg_01.png"></image>
				<view class="det-head pr plr15 bdr8 m-bg-white mlr15 pt25">
					<view class="m-xstart pr m-bottom-line pb25 margin-bottom-sm">
						<view class="m-flex overflow mr10">
							<view class="m-xend">
								<text class="dpb fb f16">唐艳</text>
								<text class="dpb f14 m-gray-small ml5">华西牙科医生</text>
								<text class="dpb m-flex"></text>
							</view>
							<view class="m-xend mt25">
								<view class="f14 m-gray-big">评分：<text class="m-theme">5.0</text>
									<text class="f11">分</text>
								</view>
								<view class="f14 ml15 m-gray-big">服务：<text class="m-theme">350</text>
									<text class="f11">人</text>
								</view>
								<view class="m-flex"></view>
							</view>
						</view>
						<view class="pr pt5">
							<view bindtap="_goSubscribe" class="tc m-white bdr30 f12 det-attention" v-if="true">+关注</view>
							<view bindtap="_goUnSubscribe" class="tc m-white bdr30 f12 det-attention active" wx:else>
								<icon color="#fff" size="12" type="success_no_circle"></icon>已关注
							</view>
							<u-image shape="circle" width="120rpx" height="120rpx" src="http://file.supermm.me/app/2020-03-26/e5b70e95-0fcf-41a5-9b82-8f421b338e38.jpg"></u-image>
						</view>
					</view>
					<u-read-more :toggle="true" show-height="200" close-text=" " open-text=" ">
						<rich-text :nodes="content"></rich-text>
					</u-read-more>
				</view>
				<!-- <view class="pr mt30 pr15 m-dpflex m-justify-start m-align-center">
					<view bindtap="_selectServer" class="m-ycenter overflow pt8 pb8 overflow bdr4 ml15 plr5 det-item {{serverSelect===index?'active':''}} {{item.is_open===1?'':'disabled'}}"
					 data-cantap="{{item.is_open}}" data-index="{{index}}" style="box-size: border-content;" wx:for="{{docMsg.server}}"
					 wx:key="index">
						<lazy-img class="dpb" size="{{54}}" url="{{item.open_icon}}" wx:if="{{item.is_open===1}}"></lazy-img>
						<lazy-img class="dpb" size="{{54}}" url="{{item.close_icon}}" wx:else></lazy-img>
						<view class="f14 mt6 text">{{item.realname}}</view>
					</view>
				</view> -->
				<!-- <view class="pr mt30 pb8">
					<view class="pr m-xstart mlr15 pb10 m-bottom-line" hidden="{{serverSelect!=index}}" wx:for="{{docMsg.server}}"
					 wx:key="index">
						<image class="dpb mt2" mode="scaleToFill" src="http://file.supermm.me/miniProgram/images/det/det_img_01.png"
						 style="width: 28rpx; height: 32rpx;"></image>
						<view class="m-flex overflow ml15 m-gray-small plineHeight20">
							<rich-text nodes="{{item.descInfo}}" type="node"></rich-text>
						</view>
					</view>
				</view> -->
			</view>
			<!-- <block wx:if="{{docMsg.leaguesCode!='cyek'}}">
				<view class="pr m-bg-gray-ll pt10 pb10" wx:if="{{consultingList.length>0}}">
					<view class="pr m-bg-white pt15 pb15">
						<view class="f18 fb plr15 pb10">咨询服务包</view>
						<view class="package-list plr15">
							<view class="warp">
								<view bindtap="goServiceDetails" class="list" data-item="{{item}}" wx:for="{{consultingList}}">
									<view class="name">{{item.goodsName}}</view>
									<view class="desc">{{item.goodsSubTitle}}</view>
									<view class="price">{{item.goodsPrice}}元/{{item.serviceLimit}}次</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block> -->
			<!-- <view bindtap="goAdrPostion" class="pr m-bg-gray-ll pt10 pb10">
				<view class="pr m-bg-white pt15 pb15">
					<view class="f18 fb plr15">机构地址</view>
					<view class="pr m-xcenter plr15 mt15">
						<image class="dpb" mode="scaleToFill" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAANCAYAAAB/9ZQ7AAABx0lEQVQoU2WSP2gTcRTHv+/dH4IdmkVcFAvSgihNLi1SRKE4uNhek4I6iNLY5AQnB93dpHNBMEltIbgUc5pUF0F0cDBIk2twKiJBBAWHVgOl5u5+TxrINeCbvnz5Pnh8vo8wMBPOE8NXx6YIcpKJfu74Ox/aa9n9foT6IrFYtVjjMkHOHO7TV6Ww6JVm3x94vXBy4fkombGPUMEwEW+oMPRY44QAs0TcDfzwUms1Xe+FrXztJURsIdz0inPPkgsv4t5aZjd5u3qDGGUiqjeK9nmauLo+rOLmDyJuNQr2VMrZWBJR90DacrMwc9/K1+qAmvQDjNB4rnJcg/aN2Kg2ClcyqTuvP0nYnWQ2vM3CjGU5tQpE5gPfP03T0+/036OdLwBinT19bCjmn2JCPoBa6SreHtJpWwTdzvf2WO/mRM7NaqQ/BeFN92949/Oe3z57xBgxTe0xgMuhCm9trWTKfXSUcmquKJUGUQBgF0AcIroQvfKKtg2QRJyt7PpRMmKbosITEWfW2vD3zzVXr/2KOEfFOO4FFu0tRJnE+h8odbFRmmv912DfSObcB8zGI5HgerOYqQy+Q3TGofmQE7nx9FZp3h0MHuh/o0mz0Kcr4U0AAAAASUVORK5CYII="
						 style="width: 10px; height: 12px;"></image>
						<view class="m-flex tl ml5">{{docMsg.outpatient_station_info.stationName}}</view>
					</view>
					<view class="pr m-xcenter plr15 mt10">
						<view class="m-flex tl m-gray-small f12 pl15 mr5">地址：{{docMsg.outpatient_station_info.address}}</view>
						<view class="pt2 pb2 plr10 f12 m-gray-small br-gray-letter bdr30" wx:if="{{isPosition}}">
							{{docMsg.outpatient_station_info.distance}}km
						</view>
						<view class="pt2 pb2 plr10 f12 m-gray-small br-gray-letter bdr30" wx:else>暂无距离</view>
						<text class="dpb iconfont icon-arrow-right m-gray-letter f20"></text>
					</view>
				</view>
			</view> -->
			<!-- <view class="pr plr15 mt30">
				<view class="pr f18 fb">患者评价 <text class="f12 m-gray-letter">({{totalSize}})</text>
				</view>
				<view class="pr pt15 pb15 m-bottom-line" wx:for="{{evaList}}" wx:key="index">
					<view class="m-xcenter m-gray-small">
						<text class="dpb f12">{{item.user_name}}</text>
						<text class="dpb f12 ml10">{{showFormat.getPartStr(item.type,0,2)}}</text>
						<star class="dpb ml20" color="star-orange" num="{{item.star}}" size="26"></star>
						<text class="dpb m-flex tr f12 m-gray-letter">{{item.created_at}}</text>
					</view>
					<view class="f14 m-gray-big plineHeight20 mt10">{{item.content}}</view>
					<view class="pr m-dpflex m-justify-start m-align-center m-wrap" wx:if="{{item.tag.length>0}}">
						<tag-span class="dpb mt15 mr10" wx:for="{{item.tag}}" wx:for-index="i" wx:for-item="tag" wx:key="i">{{tag}}</tag-span>
					</view>
				</view>
			</view> -->
		</view>
		<!-- <view class="m-foot-container">
			<view class="pr m-xcenter m-bg-white">
				<button class="m-gray-small plr20 m-xcenter dpb button-reset" openType="share">
					<text class="iconfont icon-fenxiang dpb f22"></text>
					<text class="f14 dpb ml5 f14">分享</text>
				</button>
				<view class="m-flex overflow">
					<block wx:for="{{docMsg.server}}" wx:key="index">
						<block wx:if="{{serverSelect===1}}">
							<block wx:if="{{item.is_open===1}}">
								<view bindtap="_goNext" class="plr20 pt15 pb15 tc m-white f16 {{item.is_open===1?'m-bg-theme':'m-bg-ccc'}}"
								 data-item="{{item}}" data-msg="{{docMsg}}" hidden="{{serverSelect!=index}}" wx:if="{{schlistLen>0}}">{{item.realname}}</view>
								<view class="plr20 pt15 pb15 tc m-white f16 m-bg-ccc" data-item="{{item}}" data-msg="{{docMsg}}" hidden="{{serverSelect!=index}}"
								 wx:else>暂无排班</view>
							</block>
							<view class="plr20 pt15 pb15 tc m-white f16 m-bg-ccc" data-item="{{item}}" data-msg="{{docMsg}}" hidden="{{serverSelect!=index}}"
							 wx:else>{{item.realname}}</view>
						</block>
						<view bindtap="_goNext" class="plr20 pt15 pb15 tc m-white f16 {{item.is_open===1?'m-bg-theme':'m-bg-ccc'}}"
						 data-item="{{item}}" data-msg="{{docMsg}}" hidden="{{serverSelect!=index}}" wx:else>{{item.realname}}</view>
					</block>
				</view>
			</view>
		</view> -->
		<!-- <wxs module="showFormat" src="../../utils/base-data-set.wxs" /> -->
	</view>
</template>

<script>
	export default {
		onLoad(options) {

		},
		data() {
			return {
				content: `浔阳江头夜送客，枫叶荻花秋瑟瑟。主人下马客在船，举酒欲饮无管弦。醉不成欢惨将别，别时茫茫江浸月。
				忽闻水上琵琶声，主人忘归客不发。寻声暗问弹者谁，琵琶声停欲语迟。移船相近邀相见，添酒回灯重开宴。千呼万唤始出来，犹抱琵琶半遮面。转轴拨弦三两声，未成曲调先有情。弦弦掩抑声声思，似诉平生不得志。低眉信手续续弹，说尽心中无限事。轻拢慢捻抹复挑，初为《霓裳》后《六幺》。大弦嘈嘈如急雨，小弦切切如私语。嘈嘈切切错杂弹，大珠小珠落玉盘。间关莺语花底滑，幽咽泉流冰下难。冰泉冷涩弦凝绝，凝绝不通声暂歇。别有幽愁暗恨生，此时无声胜有声。银瓶乍破水浆迸，铁骑突出刀枪鸣。曲终收拨当心画，四弦一声如裂帛。东船西舫悄无言，唯见江心秋月白。
				沉吟放拨插弦中，整顿衣裳起敛容。自言本是京城女，家在虾蟆陵下住。十三学得琵琶成，名属教坊第一部。曲罢曾教善才服，妆成每被秋娘妒。五陵年少争缠头，一曲红绡不知数。钿头银篦击节碎，血色罗裙翻酒污。今年欢笑复明年，秋月春风等闲度。弟走从军阿姨死，暮去朝来颜色故。门前冷落鞍马稀，老大嫁作商人妇。商人重利轻别离，前月浮梁买茶去。去来江口守空船，绕船月明江水寒。夜深忽梦少年事，梦啼妆泪红阑干。
				我闻琵琶已叹息，又闻此语重唧唧。同是天涯沦落人，相逢何必曾相识！我从去年辞帝京，谪居卧病浔阳城。浔阳地僻无音乐，终岁不闻丝竹声。住近湓江地低湿，黄芦苦竹绕宅生。其间旦暮闻何物？杜鹃啼血猿哀鸣。春江花朝秋月夜，往往取酒还独倾。岂无山歌与村笛？呕哑嘲哳难为听。今夜闻君琵琶语，如听仙乐耳暂明。莫辞更坐弹一曲，为君翻作《琵琶行》。感我此言良久立，却坐促弦弦转急。凄凄不似向前声，满座重闻皆掩泣。座中泣下谁最多？江州司马青衫湿。`
			}
		},
		methods: {

		}
	};
</script>

<style scoped>
	@import url("../index/mine.css");

	.det-body {
		z-index: 1;
		padding-top: 80rpx;
	}

	.det-bg-img {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1;
		display: block;
		width: 100%;
		height: 400rpx;
	}

	.det-head {
		z-index: 2;
		box-shadow: 0 0 50rpx 0 rgba(248, 151, 164, 0.13);
	}

	.det-attention {
		position: absolute;
		display: block;
		bottom: -22rpx;
		right: 50%;
		z-index: 1;
		width: 128rpx;
		height: auto;
		margin-right: -64rpx;
		padding: 4rpx 0;
		background-color: #F897A1;
		box-sizing: border-box;
	}

	.det-attention.active {
		background-color: #E6E6E6;
	}

	.det-item {
		width: calc((100% - 120rpx) / 4);
	}

	.det-item.active {
		background-color: rgba(255, 123, 114, 0.24);
	}

	.det-item .text {
		color: rgba(0, 0, 0, 0.54);
	}

	.det-item .price {
		color: rgba(0, 0, 0, 0.40);
	}

	.det-item.active .text,
	.det-item.active .price {
		color: #FF979C;
	}

	.det-item.disabled .text,
	.det-item.disabled .price {
		color: rgba(0, 0, 0, 0.3);
	}

	.button-reset {
		height: 102rpx;
		background: none !important;
		color: rgba(0, 0, 0, 0.54) !important;
	}

	button::after {
		border: none;
	}

	.button-reset::after {
		border: none;
	}

	.package-list {
		width: 100%;
		height: 178rpx;
		overflow: hidden;
	}

	.package-list .warp {
		white-space: nowrap;
		overflow: scroll;
	}

	.package-list .warp .list {
		background: red;
		display: inline-block;
		font-size: 14px;
		width: 266rpx;
		height: 178rpx;
		background: linear-gradient(270deg, rgba(255, 100, 101, 1) 0%, rgba(255, 148, 133, 1) 100%);
		box-shadow: 0px 3px 5px 0px rgba(255, 110, 110, 0.5);
		border-radius: 8rpx;
		margin-right: 18rpx;
		padding: 30rpx 20rpx 24rpx 20rpx;
		overflow: hidden;
	}

	.package-list .warp .list:nth-child(3) {
		margin-right: 0;
	}

	.package-list .warp .list .name {
		font-size: 30rpx;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		line-height: 30rpx;
	}

	.package-list .warp .list .desc {
		font-size: 24rpx;
		font-weight: 400;
		color: rgba(255, 255, 255, .87);
		margin-top: 16rpx;
		line-height: 24rpx;
	}

	.package-list .warp .list .price {
		font-size: 24rpx;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		margin-top: 30rpx;
		line-height: 24rpx;
	}

	.det-desc {
		height: 40px;
		overflow: hidden;
	}

	.det-desc.active {
		height: auto;
	}
</style>