jinNiucourseMall_uniapp/pages_index/index/diseaseDetails.vue

<template>
	<view class="content" v-if="item!=null">
		<view class="detail-cont">
			<view class="title-box">
				<view class="line"></view>
				<view class="title">疾病名称</view>
			</view>
			<view class="desc" v-html="item.diseaseName"></view>
			<view class="title-box">
				<view class="line"></view>
				<view class="title">病情症状</view>
			</view>
			<view class="desc" v-html="item.symptom"></view>
			<view class="title-box">
				<view class="line"></view>
				<view class="title">病情诊断</view>
			</view>
			<view class="desc" v-html="item.diagnose"></view>
			<view class="title-box">
				<view class="line"></view>
				<view class="title">相关检验</view>
			</view>
			<view class="desc" v-html="item.inspect"></view>
		</view>
	</view> 
</template>

<script>
	import {getDiseaseById} from '@/api/disease'
	import { mapGetters } from 'vuex';
	export default {
		data() {
			return {
				diseaseId:null,
				item:{},
			};
		},
		onLoad(option) {
			this.diseaseId=option.diseaseId;
		},
		onShow() {
			this.getDiseaseById();
		},
		computed: {
			...mapGetters(['logoimg']),
		},
		watch: {
		    logoimg: {
		      immediate: true,          // 页面一进入就检查一次
		      handler(val) {
				  return val
		      }
		    },
		},
		onShareAppMessage(res) {
			if(this.utils.isLogin()){
				return {
					title: this.item.diseaseName,
					path: '/pages_index/diseaseDetails?id='+this.diseaseId,
					imageUrl: this.logoimg//分享图标，路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
				}
			}
			
		},
		//分享到朋友圈
		onShareTimeline(res) {
			if(this.utils.isLogin()){
				return {
					title: this.item.diseaseName,
					imageUrl: this.logoimg //分享图标，路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
				}
			}
			
		},
		methods:{
			getDiseaseById(){
				let data = {diseaseId:this.diseaseId};
				getDiseaseById(data).then(
					res => {
						if(res.code==200){
							this.item=res.data;
						}else{
							uni.showToast({
								icon:'none',
								title: "请求失败",
							});
						}
					},
					rej => {}
				);
			},
		}
	}
</script>

<style lang="scss">
	page{
		height: 100%;
	}
 
	.content{
	}
	.detail-cont{
		margin: 20rpx;
		padding: 15rpx;
		box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.05);
		background-color: #fff;
		border-radius: 15rpx;
		.title-box{
			width: 100%;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			.line{
				width: 6rpx;
				height:30rpx;
				background-color: #2BC7B9;
				 
			}
			.title{
				margin-left: 15rpx;
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #333;
			}
			 
		}
		.desc{
			margin-top: 15rpx;
			margin-bottom: 15rpx;
			font-size: 28upx;
			font-family: PingFang SC;
			color: #9a9a9c;
		}
	}
	 
</style>