Sfoglia il codice sorgente

上传文件至 '项目'

Gorilla 3 mesi fa
parent
commit
9d85611edf
5 ha cambiato i file con 1559 aggiunte e 0 eliminazioni
  1. 728 0
      项目/ai.vue
  2. 141 0
      项目/health_tip.vue
  3. 116 0
      项目/health_tip_collect.vue
  4. 373 0
      项目/img_process.vue
  5. 201 0
      项目/img_process_history.vue

+ 728 - 0
项目/ai.vue

@@ -0,0 +1,728 @@
+<template>
+	<view>
+		<view class="box-1">
+			<view class="talk-list">
+				<view v-for="(item,index) in talkList" :key="index" :id="`msg-${item.id}`">
+					<view class="item flex_col" :class=" item.type == 1 ? 'push':'pull' ">
+						<image v-if="item.pic" :src="item.pic" mode="aspectFill" class="pic"></image>
+						<view class="content">{{item.content}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="box-2">
+			<view class="flex_col" :style="{position: 'relative',bottom:inputHeight+'px'}">
+				<image @click="openpopup" class="history" src="/static/img/ai.png"></image>
+				<view class="flex_grow">
+					<input @confirm="send" :adjust-position="false" @focus="inputBindFocus" @blur="inputBindBlur" type="text" class="content" v-model="content" placeholder="请输入聊天内容" placeholder-style="color:#DDD;" :cursor-spacing="6">
+				</view>
+				<button class="send" @tap="send">发送</button>
+			</view>
+		</view>
+		
+		<uv-popup ref="popup" mode="left" bgColor="#f5f5f5" style="overflow-y: scroll;" >
+			<scroll-view class="popup scroll-Y" scroll-y="true">
+				<view class="chart-con">
+					<view class="chart-wrap">
+						<view v-if="ai_talk_history && Object.keys(ai_talk_history).length > 0" class="flex justify-between">
+							<view class="title">
+								<view class="ver-line"></view>
+								<text>AI 问诊记录</text>
+							</view>
+							<button @click="check_delAllHistoryMsg" class="del-button button-all center">删除所有记录</button>
+						</view>
+						
+						<view v-else class="no-data center">暂无数据</view>
+						
+						<uv-gap height="10"></uv-gap>
+						
+						<view @longpress="check_delHistoryMsg(key)" @click="getHistoryMsg(key)" class="history_item" v-if="refresh" v-for="(value, key) in ai_talk_history" :key="key">
+							<view>
+								<text class="block">{{value['timeString']}}</text>
+								<div class="block talk-text"><text style="color: #99d7ff;">{{name}}:</text>{{value['talkList'][1]['content']}}</div>
+								<view class="divider"></view>
+								<div class="block talk-text"><text style="color: #adecaf;">AI:</text>{{value['talkList'][2]['content']}}</div>
+								<view class="divider"></view>
+							</view>
+						</view>
+						<view v-else style="height: 3000px;"></view>
+						<!-- {{ai_talk_history}} -->
+					</view>
+				</view>
+				
+				<button @click="new_talk" class="button-all center new-button">新建对话</button>
+			</scroll-view>
+		</uv-popup>
+	</view>
+</template>
+
+<script>
+	import send_message_ai from "@/data/medical_ai.js"
+	export default {
+		onPullDownRefresh() {
+			setTimeout(() => {uni.stopPullDownRefresh();}, 1000);
+		},
+		onShow() {
+			// 获取全局变量
+			const ai_history = uni.getStorageSync('ai_history');
+			if(ai_history){
+				uni.setStorageSync('ai_history', false);
+				this.openpopup();
+			}
+			
+			// 设置医生性别
+			let doctor_gender = uni.getStorageSync('doctor_gender');
+			if(doctor_gender === 0) this.doctor_gender = 0;
+			else this.doctor_gender = 1;
+			
+			// 设置用户名
+			this.name = uni.getStorageSync("name");
+		},
+		data() {
+			return {
+				
+				doctor_woman: '/static/img/女医生.png',
+				doctor_man: '/static/img/男医生.png',
+				doctor_gender: 1,
+				
+				name: '微信用户',
+				content: '',
+				talkList: [],
+				ai_talk_history: null,
+				timestamp: null,
+				
+				request: 1,
+				// ajax:{
+				// 	rows:20,	//每页数量
+				// 	page:1,	//页码
+				// 	flag:true,	// 请求开关
+				// 	loading:true,	// 加载中
+				// 	loadText:'正在获取消息'
+				// },
+				
+				inputHeight: 0,
+				refresh: true,
+			}
+		},
+		mounted() {
+			this.new_talk();
+			// this.$nextTick(()=>{
+			// 	this.getHistoryMsg();
+			// });
+		},
+		onPageScroll(e){
+			// if(e.scrollTop<5){
+			// 	this.getHistoryMsg();
+			// }
+		},
+		methods: {
+			new_talk(){
+				this.timestamp = Date.now();
+				this.talkList = [{"id":1,"content":"请问有什么需要帮助的吗?"
+				,"type":0,"pic":this.doctor_gender == 1 ? this.doctor_woman : this.doctor_man}];
+			},
+			openpopup(){
+				this.$refs.popup.open();
+				this.ai_talk_history = this.$util.reversedObject(uni.getStorageSync('ai_talk_history'));
+			},
+			inputBindFocus(e) {
+				if(e.detail.height) {
+					this.inputHeight = e.detail.height - this.getBottomBarHeight(); //这个高度就是软键盘的高度
+					console.log('this.inputHeight: ',this.inputHeight);
+				}
+			},
+			inputBindBlur(){
+				this.inputHeight = 0;
+			},
+			getBottomBarHeight() {
+				let res = uni.getSystemInfoSync();
+				const windowHeight = res.windowHeight; // 屏幕可用高度
+				const screenHeight = res.screenHeight; // 屏幕总高度
+				let bottomBarHeight = screenHeight - windowHeight - getTopHeight();
+				bottomBarHeight = bottomBarHeight > 0 ? bottomBarHeight : 0;
+				
+				console.log('Bottom Bar Height:',bottomBarHeight);
+				return bottomBarHeight;
+				
+				function getTopHeight(){
+					// 状态栏高度
+					const statusBarHeight = uni.getSystemInfoSync().statusBarHeight
+					
+					// #ifdef MP-WEIXIN
+					// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
+					const custom = wx.getMenuButtonBoundingClientRect()
+					// console.log(custom)
+					
+					// 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
+					const navigationBarHeight = custom.height + (custom.top - statusBarHeight) * 2
+					// console.log("导航栏高度:"+navigationBarHeight)
+					
+					// 总体高度 = 状态栏高度 + 导航栏高度
+					const navHeight = navigationBarHeight + statusBarHeight
+					
+					// #endif
+					
+					console.log(navHeight);
+					return navHeight;
+				}
+			},
+			check_delAllHistoryMsg(){
+				uni.showModal({
+					title: '清除历史纪录',
+					content: '是否要清除全部历史纪录?',
+					success: (res) => { 
+						if (res.confirm) 
+							this.delAllHistoryMsg(); 
+					}  
+				})
+			},
+			delAllHistoryMsg(){
+				this.new_talk();
+				
+				this.ai_talk_history = null;
+				
+				uni.setStorageSync('ai_talk_history', {});
+			},
+			check_delHistoryMsg(key){
+				uni.showModal({
+					title: '删除历史纪录',
+					content: '是否要删除此历史纪录?',
+					success: (res) => { 
+						if (res.confirm) 
+							this.delHistoryMsg(key); 
+					}  
+				})	
+			},
+			delHistoryMsg(key){
+				if(this.timestamp == key) this.new_talk();
+				
+				let ai_talk_history = uni.getStorageSync('ai_talk_history');
+				delete ai_talk_history[key];
+				
+				this.ai_talk_history = ai_talk_history;
+				uni.setStorageSync('ai_talk_history', ai_talk_history);
+			},
+			// 获取历史消息
+			getHistoryMsg(key){
+				console.log('key: ',key);
+				this.timestamp = key;
+				this.talkList = this.ai_talk_history[key]['talkList'];
+				this.$refs.popup.close();
+				
+				// if(!this.ajax.flag){
+				// 	return; //
+				// }
+				
+				// // 此处用到 ES7 的 async/await 知识,为使代码更加优美。不懂的请自行学习。
+				// let get = async ()=>{
+				// 	this.hideLoadTips();
+				// 	this.ajax.flag = false;
+				// 	let data = await this.joinHistoryMsg();
+					
+				// 	console.log('----- 模拟数据格式,供参考 -----');
+				// 	console.log(data);	// 查看请求返回的数据结构 
+					
+				// 	// 获取待滚动元素选择器,解决插入数据后,滚动条定位时使用
+				// 	let selector = '';
+										
+				// 	if(this.ajax.page>1){
+				// 		// 非第一页,则取历史消息数据的第一条信息元素
+				// 		selector = `#msg-${this.talkList[0].id}`;
+				// 	}else{
+				// 		// 第一页,则取当前消息数据的最后一条信息元素
+				// 		selector = `#msg-${data[data.length-1].id}`;
+				// 	}
+					
+				// 	// 将获取到的消息数据合并到消息数组中
+				// 	this.talkList = [...data,...this.talkList];	
+					
+				// 	// 数据挂载后执行,不懂的请自行阅读 Vue.js 文档对 Vue.nextTick 函数说明。
+				// 	this.$nextTick(()=>{
+				// 		// 设置当前滚动的位置
+				// 		this.setPageScrollTo(selector);
+						
+				// 		this.hideLoadTips(true);
+												
+				// 		if(data.length < this.ajax.rows){
+				// 			// 当前消息数据条数小于请求要求条数时,则无更多消息,不再允许请求。
+				// 			// 可在此处编写无更多消息数据时的逻辑
+				// 		}else{
+				// 			this.ajax.page ++;
+							
+				// 			// 延迟 200ms ,以保证设置窗口滚动已完成
+				// 			setTimeout(()=>{
+				// 				this.ajax.flag = true;
+				// 			},200)
+				// 		}
+						
+				// 	})
+				// }
+				// get();
+			},
+			// 拼接历史记录消息,正式项目可替换为请求历史记录接口
+			joinHistoryMsg(){
+				// let join = ()=>{
+				// 	let arr = [];
+					
+				// 	//通过当前页码及页数,模拟数据内容
+				// 	let startIndex = (this.ajax.page-1) * this.ajax.rows;
+				// 	let endIndex = startIndex + this.ajax.rows;
+				// 	for(let i = startIndex; i < endIndex; i++){
+				// 		arr.push({
+				// 			"id":i,	// 消息的ID
+				// 			"content":`这是历史记录的第${i+1}条消息`,	// 消息内容
+				// 			"type":Math.random() > 0.5 ? 1 : 0	,// 此为消息类别,设 1 为发出去的消息,0 为收到对方的消息,
+				// 			"pic": this.doctor_gender == 1 ? this.doctor_woman : this.doctor_man	// 头像
+				// 		})
+				// 	}
+					
+				// 	/*
+				// 		颠倒数组中元素的顺序。将最新的数据排在本次接口返回数据的最后面。
+				// 		后端接口按 消息的时间降序查找出当前页的数据后,再将本页数据按消息时间降序排序返回。
+				// 		这是数据的重点,因为页面滚动条和上拉加载历史的问题。
+				// 	 */
+				// 	arr.reverse();
+					
+				// 	return arr;
+				// }
+				
+				// // 此处用到 ES6 的 Promise 知识,不懂的请自行学习。
+				// return new Promise((done,fail)=>{
+				// 	// 无数据请求接口,由 setTimeout 模拟,正式项目替换为 ajax 即可。
+				// 	setTimeout(()=>{
+				// 		let data = join();
+				// 		done(data);
+				// 	},1500);
+				// })
+			},
+			// 设置页面滚动位置
+			setPageScrollTo(selector){
+				let view = uni.createSelectorQuery().in(this).select(selector);
+				view.boundingClientRect((res) => {
+					uni.pageScrollTo({
+					    scrollTop:res.top - 30,	// -30 为多显示出大半个消息的高度,示意上面还有信息。
+					    duration: 0
+					});
+				}).exec();
+			},
+			// 隐藏加载提示
+			hideLoadTips(flag){
+				if(flag){
+					this.ajax.loadText = '消息获取成功';
+					setTimeout(()=>{
+						this.ajax.loading = false;
+					},300);
+				}else{
+					this.ajax.loading = true;
+					this.ajax.loadText = '正在获取消息';
+				}
+			},
+			// 发送信息
+			send(){
+				if(!this.content){
+					uni.showToast({
+						title:'请输入有效的内容',
+						icon:'none'
+					});
+					return;
+				}
+				
+				if(this.request == 0){
+					uni.showToast({duration:1000,icon:'none',title: '消息发送中,请稍等...'});
+					setTimeout(() => uni.showLoading({title:'正在发送...'}), 1500);
+					return;
+				}
+				
+				this.request = 0;
+				uni.showLoading({title:'正在发送...'});
+				
+				// 将当前发送信息 添加到消息列表。
+				let data = {
+					"id":new Date().getTime(),
+					"content":this.content,
+					"type":1,
+					"pic":null
+				}
+				this.talkList.push(data);
+				
+				let content = this.content;
+				this.$nextTick(()=>{
+					// 清空内容框中的内容
+					this.content = '';
+					uni.pageScrollTo({
+						scrollTop: 999999,	// 设置一个超大值,以保证滚动条滚动到底部
+						duration: 500
+					});
+				});
+				
+				send_message_ai(content).then(res => {
+					console.log('send: res: ',res);
+					let data = {
+						"id":new Date().getTime(),
+						"content":res,
+						"type":0,
+						"pic":this.doctor_gender == 1 ? this.doctor_woman : this.doctor_man
+					}
+					this.talkList.push(data);
+					uni.hideLoading();
+					uni.pageScrollTo({
+						scrollTop: 999999,	// 设置一个超大值,以保证滚动条滚动到底部
+						duration: 500
+					});
+					this.request = 1;
+					
+					this.save_talk(this.talkList, this.timestamp);
+				}).catch(err => {
+					console.log('send: err: ',err);
+					uni.hideLoading();
+					this.imgshow = false;
+					this.request = 1;
+				});
+			},
+			save_talk(talkList, timestamp){
+				let timeString = this.$util.formatDateTime(timestamp);
+				let talkData = {talkList, timeString};
+				
+				let ai_talk_history = uni.getStorageSync('ai_talk_history');
+				if(ai_talk_history) ai_talk_history[timestamp] = talkData;
+				else{
+					ai_talk_history = {};
+					ai_talk_history[timestamp] = talkData;
+				}
+				uni.setStorageSync('ai_talk_history', ai_talk_history);
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	@import "talk.scss";
+	page{
+		background-color: #f5f5f5;
+		font-size: 28rpx;
+	}
+	.scroll-Y {
+		/* #ifndef MP */
+		height: calc(100vh - 155px);
+		/* #endif */
+		
+		/* #ifdef MP */
+		height: calc(100vh - 65px);
+		/* #endif */
+	}
+	.popup{
+		padding: 10px;
+		width: 75vw;
+		
+		.new-button{
+			color: #666;
+			position: fixed;
+			bottom: 15px;
+			background-color: #d4f4c2;
+			height: 50px;
+			width: calc(100% - 20px);
+			font-size: 15px;
+			font-weight: 550;
+			border-radius: 25px;
+		}
+		
+		.history_item{
+			margin-bottom: 10px;
+			background-color: #fff;
+			border-radius: 20px;
+			padding: 10px 20px 20px;
+			color: #666;
+			font-size: 14px;
+			
+			text{
+				margin: 10px 0;
+			}
+			
+			.talk-text{
+				margin: 10px 0 5px;
+				color: #565;
+				font-weight: 550;
+				font-size: 18px;
+				overflow-wrap: break-word;
+				text-overflow: ellipsis;
+				overflow: hidden;
+				white-space: nowrap;
+			}
+		}
+		.history_item:active{
+			opacity: 0.5;
+		}
+	}
+	.history{
+		width: 32px;
+		height: 32px;
+		margin-right: 5px;
+	}
+	.history:active {
+		opacity: 0.5;
+	}
+	
+	/* 加载数据提示 */
+	.tips{
+		position: fixed;
+		left: 0;
+		top:var(--window-top);
+		width: 100%;
+		z-index: 9;
+		color: #333;
+		// background-color: rgba(0,0,0,0.15);
+		height: 72rpx;
+		line-height: 72rpx;
+		transform:translateY(-80rpx);
+		transition: transform 0.3s ease-in-out 0s;
+		
+		&.show{
+			transform:translateY(0);
+		}
+	}
+	
+	.box-1{
+		width: 100%;
+		height: auto;
+		padding-bottom: 100rpx;
+		box-sizing: content-box;
+		
+		/* 兼容iPhoneX */
+		margin-bottom: 0;  
+		margin-bottom: constant(safe-area-inset-bottom);  
+		margin-bottom: env(safe-area-inset-bottom);  
+	}
+	.box-2{
+		position: fixed;
+		left: 0;
+		width: 100%;
+		bottom: 0;
+		height: auto;
+		z-index: 2;
+		// border-top: #e5e5e5 solid 1px;
+		box-sizing: content-box;
+		background-color: #f5f5f5;
+		
+		/* 兼容iPhoneX */
+		padding-bottom: 0;  
+		padding-bottom: constant(safe-area-inset-bottom);  
+		padding-bottom: env(safe-area-inset-bottom);  
+		
+		>view{
+			padding: 0 20rpx;
+			height: 100rpx;
+		}
+		
+		.content{
+			background-color: #fff;
+			height: 64rpx;
+			padding: 0 20rpx;
+			border-radius: 32rpx;
+			font-size: 28rpx;
+		}
+		
+		.send{
+			background-color: #b7d7a5;
+			color: #fff;
+			height: 64rpx;
+			margin-left: 20rpx;
+			border-radius: 32rpx;
+			padding: 0;
+			width: 120rpx;
+			line-height: 62rpx;
+			
+			&:active{
+				opacity: 1;
+				filter: brightness(80%);
+				transform: translateY(1px) translateX(1px);
+			}
+		}
+	}
+	
+	.talk-list{
+		padding-bottom: 20rpx;
+		
+		/* 消息项,基础类 */
+		.item{
+			padding: 20rpx 20rpx 0 20rpx;
+			align-items:flex-start;
+			align-content:flex-start;
+			color: #333;
+			
+			.pic{
+				width: 92rpx;
+				height: 92rpx;
+				border-radius: 50%;
+				border: #fff solid 1px;
+			}
+			
+			.content{
+				padding: 20rpx;
+				border-radius: 4px;
+				max-width: 500rpx;
+				word-break: break-all;
+				line-height: 52rpx;
+				position: relative;
+			}
+			
+			/* 收到的消息 */
+			&.pull{
+				.content{
+					margin-left: 32rpx;
+					background-color: #fff;
+					
+					&::after{
+						content: '';
+						display: block;
+						width: 0;
+						height: 0;
+						border-top: 16rpx solid transparent;
+						border-bottom: 16rpx solid transparent;
+						border-right: 20rpx solid #fff;
+						position: absolute;
+						top: 30rpx;
+						left: -18rpx;
+					}
+				}
+			}
+			
+			/* 发出的消息 */
+			&.push{
+				/* 主轴为水平方向,起点在右端。使不修改DOM结构,也能改变元素排列顺序 */
+				flex-direction: row-reverse;
+				
+				.content{
+					margin-right: 32rpx;
+					background-color: #c7e7b5;
+					
+					// &::after{
+					// 	content: '';
+					// 	display: block;
+					// 	width: 0;
+					// 	height: 0;
+					// 	border-top: 16rpx solid transparent;
+					// 	border-bottom: 16rpx solid transparent;
+					// 	border-left: 20rpx solid #c7e7b5;
+					// 	position: absolute;
+					// 	top: 30rpx;
+					// 	right: -18rpx;
+					// }
+				}
+			}
+		}
+	}
+</style>
+
+<style lang="scss" scoped>
+	.no-data{
+		height: 30vw;
+		font-size: 24px;
+		color: #777;
+		padding: 10px;
+	}
+	.del-button{
+		height: 30px;
+		width: 250px;
+		margin-right: 10px;
+		color: #666;
+		background-color: #ffffff;
+	}
+	.chart-con {
+		width: 100%;
+		box-sizing: border-box;
+
+		.chart-wrap {
+			width: 100%;
+			box-sizing: border-box;
+			background-color: #f5f5f5;
+			padding: 32rpx 0rpx;
+			border-radius: 20rpx;
+
+			.title {
+				box-sizing: border-box;
+				width: 100%;
+				padding: 0rpx 28rpx;
+				display: flex;
+				flex-direction: row;
+				justify-content: flex-start;
+				align-items: center;
+			}
+
+			.ver-line {
+				height: 30rpx;
+				width: 8rpx;
+				border-radius: 10rpx;
+				background-color: #4e9d77;
+				margin-right: 5px;
+			}
+
+			.title-desc {
+				font-size: 30rpx;
+				color: #222222;
+				margin-left: 22rpx;
+				font-weight: bold;
+			}
+
+			
+			.line-chart-con {
+				width: 100%;
+				box-sizing: border-box;
+				padding: 0rpx 28rpx;
+
+				.fun-tabs {
+					margin-top: 42rpx;
+					display: flex;
+					flex-direction: row;
+					justify-content: space-between;
+					align-self: center;
+					width: 100%;
+					box-sizing: border-box;
+
+					.tab-item {
+						width: 200rpx;
+						height: 120rpx;
+						border-radius: 10rpx;
+						padding-left: 20rpx;
+						background: #ffffff;
+						border: 1rpx solid #ececec;
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						align-items: flex-start;
+						box-sizing: border-box;
+
+						.item-name {
+							color: #6e6e6e;
+							font-size: 20rpx;
+						}
+
+						.item-val {
+							color: #222222;
+							font-size: 24rpx;
+							font-weight: bold;
+							margin-top: 20rpx;
+						}
+					}
+
+					.selected {
+						background: #edf5f1 !important;
+						border: 1rpx solid #4e9d77 !important;
+
+						.item-name {
+							color: #4e9d77 !important;
+						}
+
+						.item-val {
+							color: #4e9d77 !important;
+						}
+					}
+				}
+				.line-chart {
+					margin-top: 30rpx;
+					height: 380rpx;
+				}
+			}
+		}
+	}
+</style>

+ 141 - 0
项目/health_tip.vue

@@ -0,0 +1,141 @@
+<template>
+	<view v-if="health_tip" class="content">
+		<view>
+			<text class="title">健康小知识</text>
+		</view>
+		
+		<uv-gap height="50"></uv-gap>
+		
+		<view class="tip center">
+			<div class="long-text center" v-html="health_tip"></div>
+		</view>
+		
+		<view @click="change_favor" class="flex justify-end relative" style="top: -55vw;">
+			<text v-if="favor" class="favor cuIcon-favorfill text-red"></text>
+			<text v-else class="favor cuIcon-favor"></text>
+		</view>
+		
+		<uv-gap height="50"></uv-gap>
+		
+		<view class="flex justify-between">
+			<button @click="get_health_tip(index - 1)" class="button-all">上一条</button>
+			<button @click="get_health_tip(index + 1)" class="button-all">下一条</button>
+		</view>
+	</view>
+	<view v-else class="no_data"></view>
+</template>
+
+<script>
+	import health_tips from '@/static/health_tip.js'
+	export default {
+		onShow() {
+			this.get_random_health_tip();
+		},
+		data() {
+			return {
+				health_tip: null,
+				index: null,
+				favor: false
+			}
+		},
+		methods: {
+			change_favor(){
+				let favor_health_list = uni.getStorageSync('favor_health_list');
+				if(favor_health_list){
+					if(favor_health_list.includes(this.index)) 
+						favor_health_list.splice(favor_health_list.indexOf(this.index), 1);
+					else favor_health_list.unshift(this.index);
+				}
+				else favor_health_list = [this.index];
+				
+				uni.setStorageSync('favor_health_list',favor_health_list);
+				
+				this.favor = !this.favor;
+			},
+			get_health_tip(index){
+				if(index < 0 || index >= health_tips.length){
+					uni.showToast({duration:1000,icon:'none',title: '到顶了'});
+					return ;
+				}
+				const health_tip = health_tips[index];
+				// 输出随机选取的元素
+				console.log(health_tip);
+				
+				this.favor = false;
+				let favor_health_list = uni.getStorageSync('favor_health_list');
+				if(favor_health_list){
+					if(favor_health_list.includes(index)) this.favor = true;
+				}
+				
+				this.index = index;
+				
+				this.health_tip = formatHealthTip(health_tip);
+				
+				function formatHealthTip(health_tip) {
+				    const totalLength = health_tip.length;
+				    const numRows = Math.ceil(totalLength / 10); // 计算总行数
+				    const charsPerRow = Math.ceil(totalLength / numRows); // 计算每行字符数
+				
+				    let formattedTip = '';
+				    for (let i = 0; i < totalLength; i += charsPerRow) {
+				        formattedTip += health_tip.slice(i, i + charsPerRow) + '<br>';
+				    }
+				
+				    // 去掉最后一行多余的 <br>
+				    formattedTip = formattedTip.slice(0, -4);
+				
+				    return formattedTip;
+				}
+			},
+			get_random_health_tip(){
+				// 获取数组的长度
+				const length = health_tips.length;
+				
+				// 使用 Math.random() 生成一个 [0, length) 范围内的随机索引值
+				const randomIndex = Math.floor(Math.random() * length);
+				
+				this.get_health_tip(randomIndex);
+			}
+		}
+	}
+</script>
+
+<style>
+	page{
+		background-color: #fff;
+	}
+	button{
+		background-color: aliceblue;
+	}
+	.content{
+		padding: 20px;
+	}
+	.tip{
+		height: 55vw;
+		background-color: #f1f3f2;
+		border: none;
+		border-radius: 30px;
+		padding: 20px;
+		letter-spacing: 2px;
+		margin-bottom: 20px;
+		font-weight: 1000;
+		color: #666;
+		font-size: 27px;
+	}
+	.title{
+		color: #777;
+		font-size: 20px;
+		font-weight: 600;
+	}
+	.favor{
+		font-size: 24px;
+		margin-right: 5vw;
+	}
+	.long-text{
+		width: 100vw;
+		overflow: scroll;
+		height: calc(55vw - 40px);
+		overflow-wrap: break-word;
+		text-align: center;
+	}
+</style>

+ 116 - 0
项目/health_tip_collect.vue

@@ -0,0 +1,116 @@
+<template>
+	<view v-if="favor_health_list" class="content">
+		<view v-for="(value, key) in favor_health_list" :key="value" class="tip-group">
+			<view class="tip-item flex justify-between">
+				<div class="center" v-html="formatHealthTip(health_tips[value])"></div>
+				<view @click="change_favor(value,key)" class="flex justify-end relative">
+					<text v-if="change_favor_list[key]" class="favor cuIcon-favorfill text-red"></text>
+					<text v-else class="favor cuIcon-favor"></text>
+				</view>
+			</view>
+		</view>
+	</view>
+	<view v-else class="no_data"></view>
+</template>
+
+<script>
+	import health_tips from '@/static/health_tip.js'
+	export default {
+		onLoad() {
+			let favor_health_list = uni.getStorageSync('favor_health_list');
+			if(favor_health_list && Object.keys(favor_health_list).length != 0) this.favor_health_list = favor_health_list;
+			
+			this.change_favor_list = new Array(favor_health_list.length).fill(1);
+		},
+		data() {
+			return {
+				health_tips,
+				favor_health_list: null,
+				change_favor_list: null
+			}
+		},
+		methods: {
+			formatHealthTip(health_tip) {
+			    const totalLength = health_tip.length;
+			    const numRows = Math.ceil(totalLength / 15); // 计算总行数
+			    const charsPerRow = Math.ceil(totalLength / numRows); // 计算每行字符数
+			
+			    let formattedTip = '';
+			    for (let i = 0; i < totalLength; i += charsPerRow) {
+			        formattedTip += health_tip.slice(i, i + charsPerRow) + '<br>';
+			    }
+			
+			    // 去掉最后一行多余的 <br>
+			    formattedTip = formattedTip.slice(0, -4);
+			
+			    return formattedTip;
+			},
+			change_favor(index,key){
+				console.log('index: ',index);
+				console.log('key: ',key);
+				let favor_health_list = uni.getStorageSync('favor_health_list');
+				
+				if(favor_health_list){
+					if(favor_health_list.includes(index)) 
+						favor_health_list.splice(favor_health_list.indexOf(index), 1);
+					else favor_health_list.unshift(index);
+				}
+				else favor_health_list = [index];
+				
+				uni.setStorageSync('favor_health_list',favor_health_list);
+				
+				if(this.change_favor_list[key] == 1) this.change_favor_list[key] = 0;
+				else this.change_favor_list[key] = 1;
+				this.$forceUpdate();
+			},
+		}
+	}
+</script>
+
+<style lang="less">
+	page{
+		background-color: #f5f5f5;
+	}
+	text{
+		font-size: 18px;
+		display: flex;
+		justify-content: center; /* 水平居中 */
+		align-items: center;    /* 垂直居中 */
+	}
+	
+	.content {
+		padding:5px 20px;
+		border: none;
+	}
+	.tip-group{
+		border: none;
+		border-radius: 15px;
+		width: 100%;
+		background-color: #ffffff;
+		margin-bottom: 10px;
+		
+		:first-child{
+			border-radius: 15px 15px 0% 0%;
+		}
+		:last-child{
+			border-radius:0% 0% 15px 15px;
+		}
+		:only-child {
+		    border-radius: 15px;
+		}
+	}
+	.tip-item{
+		font-size: 18px;
+		border: 0px;
+		height: 14vw;
+		padding: 0 10px;
+		background-color: #ffffff;
+	}
+	.tip-item::after {
+	    display: none;
+	}
+	.favor{
+		font-size: 24px;
+		margin-right: 5px;
+	}
+</style>

+ 373 - 0
项目/img_process.vue

@@ -0,0 +1,373 @@
+<template>
+	<view class="content">
+		<text v-if="process_show" class="title">x胸腔图病症识别器</text>
+		<text v-else style="color: #666;">{{timeString}}</text>
+		<view class="history">
+			<image @click="$util.navigateTo('/pages/img_process/img_process_history/img_process_history')" src="@/static/img/history_bmi.png"></image>
+			<p style="text-align: center;" class="head-text">历史</p>
+		</view>
+		<uv-gap height="10"></uv-gap>
+		<view v-if="process_show" class="flex justify-center" style="align-items: center; padding: 20px;">
+			<view class="flex justify-between align-center">
+				<uv-upload
+					@oversize="tip()"
+					maxSize=2097152
+					:compressed='false'
+					:fileList="fileList1" 
+					name="1" 
+					:maxCount="1" 
+					@afterRead="afterRead"
+					@delete="deletePic"
+					:previewFullImage="true"
+					width="100" 
+					height="100">
+				</uv-upload>
+				
+				<image v-if="img_url" class="arrow" src="/static/img/右箭头.png" mode="widthFix" style="background-color: #fff;"></image>
+				<image v-if="img_url" :src="img_url" mode="widthFix"></image>
+				
+			</view>
+		</view>
+		
+		<uv-gap v-if="process_show" height="10"></uv-gap>
+		
+		<view v-if="process_show" class="flex justify-center">
+			<uv-button @click="processImg()" color="#1678ff" text="确定" customStyle="width:85vw" customTextStyle="font-weight: 1000;"></uv-button>
+		</view>
+		
+		<uv-gap height="10"></uv-gap>
+		
+		<view v-if="resInfo">
+			<view v-if="resInfo['code']">
+				<h3 v-if="process_show" style="font-weight: 1000;color: #53c21d;">处理成功:</h3>
+				
+				<uv-gap height="5"></uv-gap>
+				
+				<view style="font-size: 16px;">
+					<text style="color: #666;">识别结果:</text>
+					<text style="color: #f56c6c;margin-right: 10px;" v-for="(diseaseValue, diseaseKey) in resInfo['data']['disease']" :key="diseaseKey">{{diseaseValue}}</text>
+				</view>
+				
+				<uv-gap v-if="!process_show" height="20"></uv-gap>
+				
+				<uv-gap height="10"></uv-gap>
+				
+				<view class="diseaseItem" v-for="(diseaseValue, diseaseKey) in resInfo['data']['disease']" :key="diseaseKey">
+				    <text>{{diseaseValue}}:</text>
+					<view>
+				        <text>饮食建议:</text>
+				        <view v-for="(dietValue, dietKey) in resInfo['data'][diseaseValue]['饮食建议']" :key="dietKey">
+				            <text>{{dietValue}}</text>
+				        </view>
+				    </view>
+				    <view>
+				        <text>锻炼建议:</text>
+				        <view v-for="(exerciseValue, exerciseKey) in resInfo['data'][diseaseValue]['锻炼建议']" :key="exerciseKey">
+				            <text>{{exerciseValue}}</text>
+				        </view>
+				    </view>
+				    <view>
+				        <text>睡眠建议:</text>
+				        <view v-for="(sleepValue, sleepKey) in resInfo['data'][diseaseValue]['睡眠建议']" :key="sleepKey">
+				            <text>{{sleepValue}}</text>
+				        </view>
+				    </view>
+				    <view>
+				        <text>用药建议:</text>
+				        <view v-for="(medicationValue, medicationKey) in resInfo['data'][diseaseValue]['用药建议']" :key="medicationKey">
+				            <text>{{medicationValue}}</text>
+				        </view>
+				    </view>
+				</view>
+				
+				<view class="aiSuggest" v-if="aiSuggest">
+					<text>AI 建议</text>
+					<view>
+						<text>{{aiSuggest}}</text>
+					</view>
+				</view>
+				<view v-else class="aiSuggest button-all center" style="height: 50vw;" @click="getAiSuggest">获得ai建议</view>
+				<uv-gap height="30"></uv-gap>
+				<uv-divider text="我是有底线的"></uv-divider>
+				<uv-gap height="30"></uv-gap>
+			</view>
+			<view v-if="!resInfo['code']">
+				<p style="color: #f56c6c; font-size: 18px;">处理失败</p>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import img_api from '@/data/img_api';
+	import send_message_ai from "@/data/medical_ai.js"
+	import disease_suggest from '@/static/disease_suggest.js'
+	
+	export default {
+		onLoad(options) {
+			// 获取传递的对象参数,使用decodeURIComponent解码,并转为对象
+			if ('timestamp' in options) {
+				this.process_show = false;
+				
+				let timestamp = JSON.parse(decodeURIComponent(options.timestamp));
+				this.timestamp = timestamp;
+				console.log('timestamp: ',timestamp);
+				
+				let img_process_history = uni.getStorageSync('img_process_history');
+				
+				let img_process = img_process_history[timestamp];
+				let resInfo = {code: 1, data: {disease: img_process['disease']}};
+				
+				for (let disease of img_process['disease']) {
+					resInfo['data'][disease] = disease_suggest[disease];
+				}
+				this.resInfo = resInfo;
+				
+				this.timeString = img_process['time_string'];
+				
+				if(img_process['ai_suggest']) this.aiSuggest = img_process['ai_suggest'];
+				
+			}
+		},
+		data() {
+			return {
+				process_show: true,
+				uploading: false,
+				style:null,
+				fileList1: [],
+				resInfo: null,
+				img_url: null,
+				request: 1,
+				aiSuggest: null,
+				timestamp: null,
+				timeString: null
+			}
+		},
+		methods: {
+			getAiSuggest(){
+				let disease = '';
+				for (let value of this.resInfo['data']['disease']) disease += '、' + value;
+				
+				// 去掉第一个多余的 "、"
+				disease = disease.substring(1);
+				
+				const content = '通过x胸腔图,已知患者有' + disease + "症状,请给出一些建议";
+				console.log('content: ',content);
+				
+				if(this.request == 0){
+					uni.showToast({duration:1000,icon:'none',title: '消息发送中,请稍等...'});
+					setTimeout(() => uni.showLoading({title:'正在发送...'}), 1500);
+					return ;
+				}
+				
+				this.request = 0;
+				uni.showLoading({title:'正在发送...'});
+				
+				send_message_ai(content).then(res => {
+					console.log('send: res: ',res);
+					this.aiSuggest = res;
+					uni.hideLoading();
+					this.request = 1;
+					
+					let img_process_history = uni.getStorageSync('img_process_history');
+					img_process_history[this.timestamp]['ai_suggest'] = res;
+					uni.setStorageSync('img_process_history', img_process_history);
+				}).catch(err => {
+					console.log('send: err: ',err);
+					uni.hideLoading();
+					uni.showToast({duration:1500,icon:'error',title: '获得失败'});
+					this.request = 1;
+				});
+			},
+			// 删除图片
+			deletePic(event) {
+				uni.showModal({
+					title: '提示',
+					content: '确定要删除这个照片吗?',
+					cancelText: '再看看',
+					confirmText: '删除',
+					success: res => {
+						if (res.confirm) {
+							this[`fileList${event.name}`].splice(event.index, 1)
+						}
+					}
+				})
+			}, 
+			// 新增图片
+			async afterRead(event) {
+				// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
+				let lists = [].concat(event.file)
+				let fileListLen = this[`fileList${event.name}`].length
+				lists.map((item) => {
+					this[`fileList${event.name}`].push({
+						...item,
+						status: 'uploading',
+						message: '上传中'
+					})
+				})
+				for (let i = 0; i < lists.length; i++) {
+					const result = '';
+					let item = this[`fileList${event.name}`][fileListLen]
+					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
+						status: 'success',
+						message: '',
+						url: result
+					}))
+					fileListLen++;
+				}
+			},
+			tip(){
+				uni.showToast({
+					icon:"error",
+					title: '图片不能超过2M',
+				})
+			},
+			processImg() {
+				if(!this.request){
+					uni.showToast({
+						icon:"none",
+						title: '图片处理中,请稍后...',
+					});
+				}
+				else if(!this.fileList1.length){
+					uni.showToast({
+						icon:"error",
+						title: '请选择图片',
+					})
+				}
+				else{
+					this.request = 0;
+					uni.showLoading({title: '图片处理中...'});
+					img_api(this.fileList1[0]['thumb']).then(res => {
+						console.info('processImg: res: ',res);
+						this.request = 1;
+						this.resInfo = res;
+						this.img_url = 'data:image/png;base64,' + res['data']['image'];
+						uni.hideLoading();
+						uni.showToast({icon:'success',title: '处理成功',duration:1500});
+						
+						let img_process_history = uni.getStorageSync('img_process_history');
+						const timestamp = Date.now();
+						this.timestamp = timestamp;
+						
+						if(!img_process_history || Object.keys(img_process_history).length === 0) img_process_history = {};
+						
+						img_process_history[timestamp] = {disease: res['data']['disease'], time_string: this.$util.formatDateTime(timestamp)};
+						
+						uni.setStorageSync('img_process_history', img_process_history);
+						
+					}).catch(err => {
+						this.request = 1;
+						this.resInfo = err;
+						
+						console.error('processImg: err: ',err);
+						uni.hideLoading();
+						if(err === 'img_api: 没有token') uni.showToast({icon:'error',title: '未登陆',duration:1500});
+						else uni.showToast({icon:'error',title: '处理失败',duration:1500});
+					});
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="less">
+	image{
+		height: 100px;
+		width: 100px;
+		background-color: #fff;
+	}
+	.history{
+		position: fixed;
+		top: 10px;
+		right: 20px;
+		background-color: rgba(0, 0, 0, 0);
+		font-size: 12px;
+		color: #666;
+		
+		image{
+			width: 35px;
+			height: 35px;
+			background-color: rgba(0, 0, 0, 0);
+		}
+	}
+	.history:active{
+		opacity: 0.6;
+	}
+	.content{
+		padding:20px;
+	}
+	.arrow{
+		height: 30px;
+		width: 30px;
+		margin: 20px;
+	}
+	.title{
+		color: #777;
+		font-size: 20px;
+		font-weight: 600;
+	}
+	.diseaseItem{
+		background-color: #f1f3f2;
+		border-radius: 30px;
+		padding: 20px;
+		color: #333;
+		letter-spacing: 1px;
+		margin-bottom: 20px;
+		
+		> text{
+			color: #000;
+			font-size: 18px;
+			font-weight: 600;
+		}
+		
+		> view{
+			border-radius: 20px;
+			margin: 15px 0 5px;
+			background-color: #ffffff;
+			border-radius: 20px;
+			padding: 15px;
+			
+			> text{
+				font-size: 16px;
+				color: #222;
+			}
+			view{
+				padding: 1px 0;
+				text{
+					font-size: 15px;
+				}
+			}
+		}
+	}
+	
+	.aiSuggest{
+		background-color: #f1f3f2;
+		border: none;
+		border-radius: 30px;
+		padding: 20px;
+		letter-spacing: 1px;
+		margin-bottom: 20px;
+		font-weight: 1000;
+		color: #666;
+		font-size: 28px;
+		
+		> text{
+			color: #000;
+			font-size: 18px;
+			font-weight: 600;
+		}
+		
+		> view{
+			border-radius: 20px;
+			margin: 10px 0;
+			background-color: #ffffff;
+			border-radius: 20px;
+			padding: 15px;
+			
+			> text{
+				font-size: 15px;
+			}
+		}
+	}
+</style>

+ 201 - 0
项目/img_process_history.vue

@@ -0,0 +1,201 @@
+<template>
+	<view class="content">
+		<view v-if="!img_process_history || Object.keys(img_process_history).length === 0" class="no_data"></view>
+		<view v-else v-for="(value, key) in img_process_history" :key="key" class="img-history-item">
+			<view @longpress="check_del_img_history(key)" @click="$util.navigateTo(`/pages/img_process/img_process?timestamp=${key}`)" class="flex justify-between">
+				<view>
+					<view class="flex justify-start margin-bottom-xs">
+						<text class="title center">检测结果:</text>
+						<text class="result center" v-for="(value, key) in value['disease']">{{value}}</text>
+					</view>
+					
+					<view class="time align-center">{{value['time_string']}}</view>
+				</view>
+				
+				<view @click.stop="openpopup(key)" class="center relationship">
+					<text v-if="value['relationship']">{{family_list[value['relationship']]['name']}}</text>
+					<text v-else style="text-decoration: underline; color: #666;">关联成员</text>
+				</view>
+			</view>
+		</view>
+		<uv-popup ref="popup" mode="right" bgColor="#f5f5f5" style="overflow-y: scroll;" >
+			<scroll-view class="popup scroll-Y" scroll-y="true">
+				<view v-if="!family_list" class="no-data center">暂无成员</view>
+				<view v-else v-for="(value, key) in family_list" :key="key" class="family-item">
+					<view @click="addrelationship(key)" class="flex justify-between">
+						<view>
+							<view class="flex justify-start margin-bottom-xs">
+								<text class="name center">{{value['name']}}</text>
+								<text v-if="value['relationship']" class="relationship center">{{value['relationship']}}</text>
+							</view>
+							
+							<text class="gender">性别:{{ value['gender'] === 0 ? '男' : (value['gender'] === 1 ? '女' : '未知') }}</text>
+							
+							<text v-if="value['age']" class="age">年龄:{{value['age']}}岁</text>
+						</view>
+						<text class="cuIcon-right center"></text>
+					</view>
+				</view>
+			</scroll-view>
+		</uv-popup>
+	</view>
+</template>
+
+<script>
+	export default {
+		onShow() {
+			let img_process_history = uni.getStorageSync('img_process_history');
+			this.img_process_history = this.$util.reversedObject(img_process_history);
+			
+			this.family_list = uni.getStorageSync('family_list');
+		},
+		onPullDownRefresh() {
+			let img_process_history = uni.getStorageSync('img_process_history');
+			this.img_process_history = this.$util.reversedObject(img_process_history);
+			
+			this.family_list = uni.getStorageSync('family_list');
+		},
+		data() {
+			return {
+				img_process_history: null,
+				family_list: null,
+				selectitem: null,
+			}
+		},
+		methods: {
+			addrelationship(key){
+				let img_process_history = uni.getStorageSync('img_process_history');
+				
+				img_process_history[this.selectitem]['relationship'] = key;
+				
+				uni.setStorageSync('img_process_history', img_process_history);
+				this.img_process_history = this.$util.reversedObject(img_process_history);
+				
+				this.$refs.popup.close();
+			},
+			openpopup(selectitem){
+				this.selectitem = selectitem;
+				this.$refs.popup.open();
+			},
+			check_del_img_history(key){
+				uni.showModal({
+					title: '删除记录',
+					content: ' 是否要删除此记录?',
+					success: (res) => { 
+						if (res.confirm) this.del_img_history(key); 
+					}  
+				})	
+			},
+			del_img_history(key){
+				let img_process_history = uni.getStorageSync('img_process_history');
+				delete img_process_history[key];
+				
+				this.img_process_history = this.$util.reversedObject(img_process_history);
+				uni.setStorageSync('img_process_history', img_process_history);
+				
+				this.$forceUpdate();
+			},
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+	.popup{
+		padding: 10px;
+		width: 75vw;
+		
+		.family-item{
+			background-color: #fff;
+			border-radius: 20px;
+			height: 80px;
+			margin-bottom: 10px;
+			padding: 10px 18px;
+			
+			color: #666;
+			letter-spacing: 1px;
+			
+			.name{
+				letter-spacing: 2px;
+				font-size: 20px;
+				font-weight: 550;
+				color: #555;
+			}
+			
+			.gender{
+				margin-right: 20px;
+			}
+			
+			.relationship{
+				color: #555;
+				font-size: 16px;
+				height: 24px;
+				width: 60px;
+				border-radius: 10px;
+				letter-spacing: 0px;
+				margin-left: 20px;
+				background-color: #ebf6ff;
+			}
+		}
+	}
+	.no-data{
+		height: 30vw;
+		font-size: 24px;
+		color: #777;
+		padding: 10px;
+		background-color: #fff;
+		border-radius: 20px;
+	}
+	.content{
+		padding: 10px 20px;
+		border: none;
+		background-color: #f6f6f6;
+		height: 100vh;
+	}
+	.scroll-Y {
+		/* #ifndef MP */
+		height: calc(100vh - 155px);
+		/* #endif */
+		
+		/* #ifdef MP */
+		height: calc(100vh - 65px);
+		/* #endif */
+	}
+	.relationship{
+		z-index: 100;
+		color: #666;
+		font-size: 16px;
+		margin: 5px 0;
+		width: 85px;
+		border-radius: 10px;
+		letter-spacing: 0px;
+		background-color: #ebf6ff;
+	}
+	.img-history-item{
+		background-color: #fff;
+		border-radius: 20px;
+		height: 80px;
+		margin-bottom: 20px;
+		padding: 15px;
+		
+		color: #666;
+		letter-spacing: 1px;
+		
+		.title{
+			letter-spacing: 2px;
+			font-size: 18px;
+			font-weight: 550;
+			color: #555;
+		}
+		
+		.result{
+			font-size: 17px;
+			font-weight: 550;
+			color: #f56c6c;
+			margin-right: 10px;
+		}
+		
+		.time{
+			margin-top: 8px;
+		}
+	}
+</style>