From 6e08e1db2da0c529322afc0278dd982fdf3645fe Mon Sep 17 00:00:00 2001
From: yanwenlong <yanwenlong@quesoar.com>
Date: Mon, 18 Dec 2023 10:26:40 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B9=E5=89=82=E6=A3=80=E7=B4=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                          |  14 +
 pages/peanut/home.vue               |   6 +-
 pages/prescript/prescript.vue       | 512 ++++++++++++++++++++++++++++
 pages/prescript/prescriptDetail.vue | 168 +++++++++
 4 files changed, 697 insertions(+), 3 deletions(-)
 create mode 100644 pages/prescript/prescript.vue
 create mode 100644 pages/prescript/prescriptDetail.vue

diff --git a/pages.json b/pages.json
index 50c161c..aeb19e6 100644
--- a/pages.json
+++ b/pages.json
@@ -496,6 +496,20 @@
 				"enablePullDownRefresh": false
 			}
 		},
+		{
+			"path": "pages/prescript/prescript",
+			"style": {
+				"navigationBarTitleText": "方剂检索",
+				"enablePullDownRefresh": false
+			}
+		},
+		{
+			"path": "pages/prescript/prescriptDetail",
+			"style": {
+				"navigationBarTitleText": "方剂详情",
+				"enablePullDownRefresh": false
+			}
+		},
 		{
 			"path": "pages/luck/luck",
 			"style": {
diff --git a/pages/peanut/home.vue b/pages/peanut/home.vue
index 534cd6c..4e34d04 100644
--- a/pages/peanut/home.vue
+++ b/pages/peanut/home.vue
@@ -16,10 +16,10 @@
 						<image src="../../static/icon/five1.png" mode="aspectFit" ></image>
 						<text>经穴检索</text>
 					</div>
-					<!-- <div class="item item1">
+					<div class="item item1" @click="onPageJump('../prescript/prescript')">
 						<image src="../../static/icon/five2.png" mode="aspectFit"></image>
-						<text>方药检索</text>
-					</div> -->
+						<text>方剂检索</text>
+					</div>
 					 <div class="item item1">
 					<div class="item item1" @click="onPageJump('../luck/luck')">
 						<image src="../../static/icon/five4.png" mode="aspectFit"></image>
diff --git a/pages/prescript/prescript.vue b/pages/prescript/prescript.vue
new file mode 100644
index 0000000..5ec6a01
--- /dev/null
+++ b/pages/prescript/prescript.vue
@@ -0,0 +1,512 @@
+<template>
+	<view class="container">
+		<!-- 公共组件-每个页面必须引入 -->
+		<public-module></public-module>
+		<z-nav-bar title="方剂检索"></z-nav-bar>
+		<!-- <uni-search-bar @confirm="search" :focus="true" v-model="searchValue" @blur="blur" @focus="focus" @input="input"
+			@cancel="cancel" @clear="clear">
+		</uni-search-bar> -->
+		<view class="search_box" v-if="oneCateList.length > 0">
+			<!-- <u-search :disabled="userMes.pointPower == 0 && oneCateList[curOneCateIndex].id == 3 || userMes
+					.pointPower == 0 && oneCateList[curOneCateIndex].id == 6 ? true : false" @click="checkDisable" placeholder="请输入方剂名" @focus="focus" @clear="clear"
+				v-model="searchValue" @input="input" @blur="blur" @search="search"></u-search> -->
+				<u-search  @click="checkDisable" placeholder="请输入方剂名" @focus="focus" @clear="clear"
+				v-model="searchValue" @input="input" @blur="blur" @search="search"></u-search>
+		</view>
+		<view class="searchList" v-show="showSearchList">
+			<view class="itemBox" v-if="searchList.length > 0">
+				<view class="item" v-for="(item, index) in searchList" :key="index" @click="gotoDetail(item)">
+					{{item.title}}
+				</view>
+			</view>
+			<view v-else class="">
+				<u-divider text="未找到相关方剂哦~"></u-divider>
+			</view>
+		</view>
+		<view v-show="!showSearchList" class="contentBox">
+			<!-- <scroll-view class="scroll-view_H oneCateList" scroll-x="true" scroll-left="0"> -->
+			<view class="oneCateList flexbox">
+				<text :class="[curOneCateIndex == index ? 'cur' : '']" @click="setOneCateIndex(item,index)"
+					v-for="(item, index) in oneCateList" :key="item.prescriptCategoryId">{{item.title}}</text>
+			</view>
+			<!-- </scroll-view> -->
+			<view class="grid twoCateList" v-if="twoCateList.length > 0">
+				<u-grid :col="3" border class="u-grid-list">
+					<u-grid-item v-for="(item, index) in twoCateList" :key="item.prescriptCategoryId"
+						@click="setTwoCateIndex(item, index)">
+						<view :class="['grid-text',curTwoCateIndex == index ? 'cur' : '']">{{item.title}}</view>
+					</u-grid-item>
+				</u-grid>
+			</view>
+			<view class="titleList" v-if="oneCateList[curOneCateIndex].prescriptCategoryId != 3">
+				<u-grid :col="3" v-if="titleList.length > 0">
+					<u-grid-item v-for="(item, index) in titleList" :key="item.prescriptId" @click="gotoDetail(item)">
+						<view :class="['titleItem']">{{item.title}}</view>
+					</u-grid-item>
+				</u-grid>
+				<u-divider v-else text="暂无方剂数据哦~"></u-divider>
+			</view>
+			<view class="titleList" v-else>
+				<u-grid :col="1" v-if="titleList">
+					<u-grid-item v-for="(item, index) in titleList" :key="index">
+						<view :class="['titleItem']">{{index}}</view>
+						<u-grid-item v-for="(item1, index1) in item" :key="item1.prescriptId" >
+							<view :class="['JFtitleItem']" @click="gotoDetail(item1)">{{item1.title}}</view>
+						</u-grid-item>
+					</u-grid-item>
+				</u-grid>
+				<u-divider v-else text="暂无方剂数据哦~"></u-divider>
+			</view>
+		</view>
+
+
+		<!-- <view class="search_box flexbox" @click="">
+			<view class="search">
+				<text class="icon_search"></text>
+				<text class="prompt">请输入方剂名</text>
+			</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';
+	import {
+		mapState
+	} from 'vuex';
+	export default {
+		data() {
+			return {
+				playData: {},
+				searchValue: '',
+				oneCateList: [], // 一级分类标题1
+				twoCateList: [], // 二级分类标题
+				titleList: [], // 方剂标题
+				curOneCateIndex: 0, // 当前选中的一级分类
+				curTwoCateIndex: 0, // 当前选中的二级分类
+				searchList: [], // 搜索结果数组
+				showSearchList: false,
+				userMes: {}, // 用户信息
+				searchDisable: false, // 搜索不可用
+
+			}
+		},
+		onLoad() {
+			this.getUserInfo()
+			// this.getCateList()
+
+		},
+		onHide() {
+			this.showSearchList = false
+			this.searchList = []
+		},
+		computed: {
+			...mapState(['userInfo']),
+		},
+		methods: {
+			// 检查是有权限使用搜索功能
+			checkDisable() {
+				console.log('点击了')
+				// if (this.userMes.pointPower == 0 && this.oneCateList[this.curOneCateIndex].prescriptCategoryId == 3 || this.userMes
+				// 	.pointPower == 0 && this.oneCateList[this.curOneCateIndex].prescriptCategoryId == 6) { // 等于0 就是没有权限
+				// 	this.showNoRights()
+				// }
+			},
+			// 显示无权限弹窗
+			// showNoRights() {
+			// 	let that = this
+			// 	uni.showModal({
+			// 		content: "购买 手模 或 脚模 后方可使用此功能",
+			// 		confirmText: '好的',
+			// 		showCancel: false,
+			// 		success: function(res) {
+			// 			if (res.confirm) {
+			// 				// console.log('用户点击确定');
+			// 				that.clear()
+			// 			}
+			// 		}
+			// 	})
+			// },
+			// 获取用户详情
+			getUserInfo() {
+				// 用户详情
+				if (this.userInfo.id != undefined) {
+					this.$http
+						.post('book/user/info/' + this.userInfo.id)
+						.then(res => {
+							this.userMes = res.user
+							this.getCateList()
+							console.log(this.userMes, '呼呼')
+						});
+				}
+			},
+			// 方剂详情
+			gotoDetail(item) {
+
+				// if (this.userMes.pointPower == 0 && this.oneCateList[this.curOneCateIndex].prescriptCategoryId == 3 || this.userMes
+				// 	.pointPower == 0 && this.oneCateList[this.curOneCateIndex].prescriptCategoryId == 6) { // 等于0 就是没有权限
+				// 	this.showNoRights()
+				// } else {
+					// 等于1 就是有权限
+					uni.navigateTo({
+						url: "./prescriptDetail?id=" + item.prescriptId
+					})
+				// }
+
+			},
+			// 获取方剂名称
+			getTitles(id) {
+				$http.request({
+					url: "book/prescript/prescriptList",
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						// loadAnimate: 'none', // 请求加载动画
+						'prescriptCategoryId': id,
+						"limit": 1000,
+						"page": 1
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					console.log(res, '内容获取成功')
+					if (res.code == 0 && res.page.records.length > 0) {
+						this.titleList = res.page.records
+					} else {
+						this.titleList = []
+					}
+				}).catch(e => {
+					this.titleList = []
+					console.log(e)
+				})
+			},
+			setTwoCateIndex(item, index) {
+				let id = item.prescriptCategoryId
+				this.curTwoCateIndex = index
+				this.getTitles(id)
+			},
+			setOneCateIndex(item, index) {
+				// if(this.userMes.tgdzPower == 0){
+				// 	let that = this
+				// 	uni.showModal({
+				// 		content: "购买 针灸六经法要上册和下册 后方可使用此功能",
+				// 		confirmText: '好的',
+				// 		showCancel: false,
+				// 		success: function(res) {
+				// 			if (res.confirm) {
+				// 				// console.log('用户点击确定');								
+				// 			}
+				// 		}
+				// 	})
+				// 	return
+				// }
+				// if(item.title == "时辰取穴"){					
+				// 	uni.navigateTo({
+				// 		url: "../timeAcupoint/timeAcupoint"
+				// 	})
+				// 	return 
+				// }
+				let id = item.prescriptCategoryId
+				this.curOneCateIndex = index
+				this.curTwoCateIndex = 0
+				if(index!=2){
+					this.getTowCateList(id)
+				} else {
+					this.getJFList(id)
+				}
+			},
+			getTowCateList(id) {
+				$http.request({
+					url: "book/prescript/prescriptCategoryList",
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						loadAnimate: 'none', // 请求加载动画
+						'categoryId': id
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					console.log(res, '二级分类获取成功')
+					if (res.code == 0 && res.list.length > 0) {
+						this.twoCateList = res.list
+						this.getTitles(this.twoCateList[0].prescriptCategoryId)
+					} else {
+						this.twoCateList = []
+						this.titleList = []
+					}
+				}).catch(e => {
+					this.twoCateList = []
+					this.titleList = []
+					console.log(e)
+				})
+			},
+			transformData(inputData) {
+				const result = {};
+				inputData.forEach(item => {
+					const { letter } = item;
+					if (!result[letter]) {
+					result[letter] = [];
+					}
+					result[letter].push(item);
+				});
+				// const finalResult = Object.keys(result).map(key => ({ [key]: result[key] }));
+				return result;
+			},
+			getJFList(id) {
+				$http.request({
+					url: "book/prescript/prescriptListForJF",
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						loadAnimate: 'none', // 请求加载动画
+						'categoryId': id
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					if (res.code == 0 && res.list.length > 0) {
+						this.twoCateList = []
+						this.titleList = this.transformData(res.list)
+						console.log('JF经方',this.titleList)
+						// this.getTitles(this.twoCateList[0].prescriptCategoryId)
+					} else {
+						this.twoCateList = []
+						this.titleList = []
+					}
+				}).catch(e => {
+					this.twoCateList = []
+					this.titleList = []
+					console.log(e)
+				})
+			},
+			getCateList(id) {
+				id ? '' : id = 0
+				this.twoCateList = []
+				this.curTwoCateIndex = 0
+				// 0为获取顶级分类，其他为搜索下级分类，目前的逻辑，顶级是写死的，所以可能只会涉及到搜索第二级
+				$http.request({
+					url: "book/prescript/prescriptCategoryList",
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						loadAnimate: 'none', // 请求加载动画
+						'categoryId': id
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					console.log(res, '脉穴分类获取成功')
+					if (res.code == 0 && res.list.length > 0) {
+						this.oneCateList = res.list
+						this.getTowCateList(this.oneCateList[0].prescriptCategoryId)
+					} else {
+						this.oneCateList = []
+					}
+				}).catch(e => {
+					this.oneCateList = []
+					console.log(e)
+				})
+			},
+			getSearch() {
+				$http.request({
+					url: "book/point/searchPointList",
+					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
+					data: {
+						loadAnimate: 'none', // 请求加载动画
+						'keywords': this.searchValue
+					},
+					header: { //默认 无 说明：请求头
+						'Content-Type': 'application/json'
+					},
+				}).then(res => {
+					console.log(res, '搜索结果')
+					if (res.code == 0 && res.points.length > 0) {
+						this.searchList = res.points
+					}
+				}).catch(e => {
+					// this.titleList = []	
+					this.searchList = []
+					console.log(e)
+				})
+			},
+			search(res) {
+				console.log(res, 'res')
+				// uni.showToast({
+				// 	title: '搜索：' + res,
+				// 	icon: 'none'
+				// })
+
+			},
+			input(res) {
+				console.log('----input:', res)
+				if (res == '') {
+					this.searchList = []
+				} else {
+					this.getSearch()
+				}
+			},
+			clear(res) {
+				// uni.showToast({
+				// 	title: 'clear事件，清除值为：',
+				// 	icon: 'none'
+				// })
+				this.searchValue = ''
+				this.showSearchList = false
+			},
+			blur(res) {
+				if (res == '') {
+					this.showSearchList = false
+					this.searchList = []
+				} else {
+					this.getSearch()
+				}
+			},
+			focus(e) {
+				// uni.showToast({
+				// 	title: 'focus事件，输出值为：' + e.value,
+				// 	icon: 'none'
+				// })
+				// 等于1 就是有权限
+				this.showSearchList = true
+
+			},
+			// cancel(res) {
+			// 	uni.showToast({
+			// 		title: '点击取消，输入值为：' + res.value,
+			// 		icon: 'none'
+			// 	})
+			// }
+		},
+		onBackPress() {
+			// #ifdef APP-PLUS
+			plus.key.hideSoftKeybord();
+			// #endif
+		},
+		components: {
+			musicPlay
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.searchList {
+		.item {
+			font-size: 28rpx;
+			padding: 20rpx;
+			border-bottom: 1px solid #dadbde;
+		}
+	}
+
+	.scroll-view_H {
+		background-color: #fff;
+		white-space: nowrap;
+		padding: 10rpx;
+	}
+
+	.contentBox {
+		.oneCateList {
+			justify-content: space-between;
+
+			text {
+				text-align: center;
+				display: inline-block;
+				width: 32%;
+				padding: 20rpx 0;
+				font-size: 34rpx;
+				border-radius: 10rpx;
+			}
+
+			.cur {
+				background-color: #55aa7f;
+				color: #fff;
+			}
+		}
+
+		.twoCateList {
+			font-size: 28rpx;
+			margin-top: 20rpx;
+
+			.grid-text {
+				padding: 30rpx 20rpx;
+				text-align: center;
+			}
+
+			.cur {
+				color: #55aa7f;
+			}
+
+			// .u-grid-list{border: 0.5px solid #dadbde;}
+		}
+
+		.titleList {
+			font-size: 26rpx;
+			margin-top: 20rpx;
+			padding: 10rpx;
+			border-radius: 10rpx;
+			background-color: #f8f9fa;
+
+			.titleItem {
+				padding: 20rpx 10rpx;
+			}
+			.JFtitleItem{
+				background-color: #ffffff;
+				padding: 20rpx 10rpx;
+				width: 100%;
+				border-bottom: 0.5px solid #f8f9fa;
+			}
+		}
+	}
+
+
+	.container {
+		padding: 10rpx;
+		height: 100vh;
+		background-color: #fff;
+	}
+
+	.search_box {
+		margin: 0 auto;
+		overflow: hidden;
+		margin-top: 20rpx;
+		align-items: center;
+		width: calc(100% - 10px);
+		margin-top: 0;
+		margin-bottom: 40rpx;
+
+		.search {
+			height: 56upx;
+			display: flex;
+			width: 86%;
+			margin: 0 auto;
+			align-items: center;
+			padding: 0upx 40upx;
+			background-color: #fff;
+			border-radius: 20upx;
+			box-shadow: 0 0px 10px 1px #54a96633;
+		}
+
+		.prompt {
+			color: #838383;
+			font-size: 24rpx;
+
+		}
+
+		.icon_search {
+			background-image: url('@/static/icon/map_ic_search.png');
+			background-position: center center;
+			background-repeat: no-repeat;
+			background-size: cover;
+			width: 36upx;
+			height: 36upx;
+			margin-right: 20upx;
+		}
+	}
+
+	.flexbox {
+		display: flex;
+	}
+</style>
\ No newline at end of file
diff --git a/pages/prescript/prescriptDetail.vue b/pages/prescript/prescriptDetail.vue
new file mode 100644
index 0000000..4d634f0
--- /dev/null
+++ b/pages/prescript/prescriptDetail.vue
@@ -0,0 +1,168 @@
+<template>
+	<view class="container">
+		<!-- 公共组件-每个页面必须引入 -->
+		<public-module></public-module>
+		<z-nav-bar :title="prescriptDetail.title"></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.title}}
+					</view>
+				</uni-section>
+				<uni-section class="mb-10" titleFontSize="18px" title="出处" type="line" v-if="prescriptDetail.source && prescriptDetail.source != ''" >
+					<view class="item" v-html="prescriptDetail.source">
+					</view>
+				</uni-section>
+				
+				<uni-section class="mb-10" titleFontSize="18px" title="古代计量" type="line" v-if="prescriptDetail.doseOld && prescriptDetail.doseOld != ''" >
+					<view class="item" v-html="prescriptDetail.doseOld">
+					</view>
+				</uni-section>
+				
+				<uni-section class="mb-10" titleFontSize="18px" title="现代计量（仅供参考）" type="line" v-if="prescriptDetail.doseNow && prescriptDetail.doseNow != ''" >
+					<view class="item" v-html="prescriptDetail.doseNow">
+					</view>
+				</uni-section>
+				
+				<uni-section class="mb-10" titleFontSize="18px" title="煎服法" type="line" v-if="prescriptDetail.preUsage && prescriptDetail.preUsage != ''">
+					<view class="item" v-html="prescriptDetail.preUsage">
+					</view>
+				</uni-section>
+				
+				<uni-section class="mb-10" titleFontSize="18px" title="方歌" type="line" v-if="prescriptDetail.preSong && prescriptDetail.preSong != ''">
+					<view class="item" v-html="prescriptDetail.preSong">
+					</view>
+				</uni-section>
+
+				<uni-section class="mb-10" titleFontSize="18px" title="主治" type="line" v-if="prescriptDetail.indications && prescriptDetail.indications != ''">
+					<view class="item" v-html="prescriptDetail.indications">
+					</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:[]
+				},
+				prescriptId: null,
+				indicatorDots: true,
+				autoplay: true,
+				interval: 5000,
+				duration: 500
+			}
+		},
+		onLoad(e) {
+			this.prescriptId = 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/prescript/prescriptDetail",
+					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.prescript
+						if(this.prescriptDetail.images){
+							this.prescriptDetail.images = JSON.parse(this.prescriptDetail.images)
+						}
+					}
+				}).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>
\ No newline at end of file