添加吴门医述

2024-06-24 10:47:24 +08:00
parent 89a8a3e405
commit 8dca4bd5de
13 changed files with 2504 additions and 23 deletions
--- a/pages/medicaldes/medicaldesDetail.vue
+++ b/pages/medicaldes/medicaldesDetail.vue
@@ -0,0 +1,174 @@
+<template>
+	<view class="container">
+		<!-- 公共组件-每个页面必须引入 -->
+		<public-module></public-module>
+		<z-nav-bar :title="prescriptDetail.name"></z-nav-bar>
+		<view class="uni-margin-wrap"
+			v-if="prescriptDetail && prescriptDetail.images && prescriptDetail.images.length > 0">
+			<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
+				:duration="duration">
+				<swiper-item v-for="(item, index) in prescriptDetail.images" :key="index">
+					<view class="swiper-item">
+						<image :src="item" mode="aspectFit" @click="previewImage(item)"></image>
+					</view>
+				</swiper-item>
+			</swiper>
+		</view>
+		<view class="contentBox">
+			<view class="content">
+				<uni-section class="mb-10" titleFontSize="18px" title="姓名" type="line">
+					<view class="item">
+						{{prescriptDetail.name}}
+					</view>
+				</uni-section>
+				<uni-section class="mb-10" titleFontSize="18px" title="城市" type="line"
+					v-if="prescriptDetail.city_name && prescriptDetail.city_name != ''">
+					<view class="item" v-html="prescriptDetail.city_name">
+					</view>
+				</uni-section>
+				<uni-section class="mb-10" titleFontSize="18px" title="详细介绍" type="line"
+					v-if="prescriptDetail.content && prescriptDetail.content != ''">
+					<view class="item" v-html="prescriptDetail.content">
+					</view>
+				</uni-section>
+
+				<!-- <uni-section class="mb-10" titleFontSize="18px" title="配伍" type="line">
+					<view class="item" v-if="prescriptDetail.compatibility && prescriptDetail.compatibility != ''" v-html="prescriptDetail.compatibility">
+					</view>
+					<view class="item" v-else>
+						暂无
+					</view>
+				</uni-section>
+				
+				<uni-section class="mb-10" titleFontSize="18px" title="文献" type="line">
+					<view class="item" v-if="prescriptDetail.literature && prescriptDetail.literature != ''" v-html="prescriptDetail.literature">
+					</view>
+					<view class="item" v-else>
+						暂无
+					</view>
+				</uni-section> -->
+
+			</view>
+		</view>
+		<music-play :playData="playData"></music-play>
+		<!-- <z-navigation></z-navigation> -->
+	</view>
+</template>
+
+<script>
+	import musicPlay from '@/components/music.vue'
+	import $http from '@/config/requestConfig.js';
+	export default {
+		data() {
+			return {
+				playData: {},
+				prescriptDetail: {
+					images: []
+				},
+				id: null,
+				indicatorDots: true,
+				autoplay: true,
+				interval: 5000,
+				duration: 500,
+			}
+		},
+		onLoad(e) {
+			this.id = e.id
+		},
+		onShow() {
+			this.getDetail()
+		},
+		methods: {
+			// 放大图片
+			previewImage(url) {
+				console.log(url)
+				uni.previewImage({
+					urls: [url],
+					longPressActions: {
+						itemList: ['很抱歉，暂不支持保存图片到本地'],
+						success: function(res) {
+							// console.log(res,'+++++')
+						}
+					}
+				});
+			},
+			// 方剂详情
+			getDetail() {
+				$http.request({
+					url: "book/medicaldes/getInheritById?id=" + this.id,
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						// loadAnimate: 'none', // 请求加载动画
+						// 'prescriptId': this.prescriptId
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					console.log(res, '内容获取成功')
+					if (res.code == 0) {
+						this.prescriptDetail = res.result
+						if (this.prescriptDetail.img) {
+							this.prescriptDetail.images = this.prescriptDetail.img.split(';');
+						}
+					}
+				}).catch(e => {
+					// this.titleList = []		
+					console.log(e)
+				})
+			},
+
+		},
+		components: {
+			musicPlay
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.contentBox {
+		padding-bottom: 20rpx;
+	}
+
+	.mb-10 {
+		margin-bottom: 10px;
+	}
+
+	.content {
+		font-size: 28rpx;
+	}
+
+	.swiper-item {
+		image {
+			margin: 0 auto;
+			height: 250rpx;
+		}
+
+	}
+
+	.uni-margin-wrap {
+		margin-bottom: 20rpx;
+		padding-top: 20rpx;
+		background-color: #fff;
+	}
+
+	.container {
+		padding: 10rpx;
+
+		// background-color: #fff;
+		.item {
+			color: #666;
+			padding: 10rpx 20rpx;
+			padding-bottom: 20rpx;
+			line-height: 46rpx;
+		}
+	}
+
+	.flexbox {
+		display: flex;
+	}
+
+	/deep/ .uni-section-header__decoration.line {
+		background-color: #18bc37;
+	}
+</style>