完善ai问诊页面2

pages/mall/merchant/ai-consultation.uvue

@@ -1,6 +1,8 @@
 <!-- 机构端 - AI问诊页面 -->
 <template>
 	<view class="ai-page">
+		<!-- ===== 顶部固定区 ===== -->
+		<view class="top-fixed">
 			<!-- #ifdef MP-WEIXIN -->
 			<view class="detail-navbar">
 				<view class="detail-navbar-back" @click="uni.navigateBack()">
@@ -17,8 +19,17 @@
 				<text class="risk-banner-icon">⚠️</text>
 				<text class="risk-banner-text">AI问诊仅供参考，不能代替专业医生诊断，紧急情况请立即拨打120</text>
 			</view>
+		</view>
 
-		<!-- 症状快捷选择 -->
+		<!-- ===== 中间自适应聊天区 ===== -->
+		<view class="middle-flex">
+			<scroll-view
+				class="chat-scroll"
+				direction="vertical"
+				:scroll-into-view="lastMsgId"
+				:scroll-with-animation="true"
+			>
+				<!-- 症状快捷选择（在聊天区顶部，随聊天区滚动） -->
 				<view v-if="!hasConversation" class="quick-select-area">
 					<text class="qs-title">请选择主要症状（可多选）</text>
 					<view class="qs-tags">
@@ -37,13 +48,6 @@
 					</view>
 				</view>
 
-		<!-- 对话区域 -->
-		<scroll-view
-			class="chat-scroll"
-			direction="vertical"
-			:scroll-into-view="lastMsgId"
-			:scroll-with-animation="true"
-		>
 				<!-- 欢迎提示 -->
 				<view class="welcome-msg" v-if="messages.length === 0 && !hasConversation">
 					<view class="welcome-avatar">🤖</view>
@@ -113,10 +117,25 @@
 
 				<view id="msg-bottom" style="height: 20rpx;"></view>
 			</scroll-view>
+		</view>
 
-		<!-- 快捷问题（有对话后显示） -->
+		<!-- ===== 底部固定区 ===== -->
-		<view v-if="hasConversation && quickReplies.length > 0" class="quick-replies">
+		<view class="bottom-fixed">
-			<scroll-view direction="horizontal" class="qr-scroll">
+			<!-- 快捷问题模块 -->
+			<view v-if="quickReplies.length > 0" class="quick-replies">
+				<view class="quick-replies-header" @click="toggleQuickReplies">
+					<view class="qr-header-left">
+						<text class="qr-header-icon">💬</text>
+						<text class="qr-title">快捷问题</text>
+					</view>
+					<view class="qr-toggle">
+						<text class="qr-toggle-text">{{ quickRepliesExpanded ? '收起' : '展开' }}</text>
+						<text class="qr-toggle-icon">{{ quickRepliesExpanded ? '▾' : '▸' }}</text>
+					</view>
+				</view>
+				<view v-if="quickRepliesExpanded" class="quick-replies-body">
+					<scroll-view class="qr-scroll" :scroll-x="true" :scroll-y="false">
+						<view class="qr-scroll-inner">
 							<view
 								v-for="qr in quickReplies"
 								:key="qr"
@@ -125,8 +144,10 @@
 							>
 								{{ qr }}
 							</view>
+						</view>
 					</scroll-view>
 				</view>
+			</view>
 
 			<!-- 输入区 -->
 			<view class="input-bar">
@@ -150,6 +171,7 @@
 				</view>
 			</view>
 		</view>
+	</view>
 </template>
 
 <script lang="uts">
@@ -194,7 +216,8 @@
 				lastMsgId: '' as string,
 				selectedSymptoms: [] as string[],
 				symptomOptions: ['头晕', '胸痛', '发烧', '呼吸困难', '腹痛', '跌倒', '意识模糊', '血压异常', '血糖异常', '情绪异常'] as string[],
-				quickReplies: ['症状加重了', '需要上门服务', '联系家属', '转诊医生', '今日用药'] as string[]
+				quickReplies: ['症状加重了', '需要上门服务', '联系家属', '转诊医生', '今日用药'] as string[],
+				quickRepliesExpanded: false as boolean
 			}
 		},
 
@@ -282,11 +305,16 @@
 							this.messages = []
 							this.hasConversation = false
 							this.lastMsgId = ''
+								this.quickRepliesExpanded = false
 						}
 					}
 				})
 			},
 
+			toggleQuickReplies() {
+				this.quickRepliesExpanded = !this.quickRepliesExpanded
+			},
+
 			exportRecord() {
 				uni.showToast({ title: '导出功能开发中', icon: 'none' })
 			},
@@ -309,9 +337,34 @@
 <style>
 	.ai-page {
 		background-color: #f0f2f7;
-		min-height: 100vh;
+		height: 100vh;
 		display: flex;
 		flex-direction: column;
+		overflow: hidden;
+	}
+
+	/* ===== 三段式布局容器 ===== */
+	.top-fixed {
+		flex: none;
+		z-index: 10;
+		background-color: #f0f2f7;
+	}
+
+	.middle-flex {
+		flex: 1;
+		min-height: 0;
+		overflow: hidden;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.bottom-fixed {
+		flex: none;
+		z-index: 10;
+		background-color: #ffffff;
+		border-top-width: 1rpx;
+		border-top-style: solid;
+		border-top-color: #eeeeee;
 	}
 
 	/* ===== 导航栏 ===== */
@@ -444,7 +497,9 @@
 	/* ===== 聊天滚动区 ===== */
 	.chat-scroll {
 		flex: 1;
+		width: 100%;
 		padding: 20rpx 0;
+		box-sizing: border-box;
 	}
 
 	/* ===== 欢迎消息 ===== */
@@ -686,34 +741,98 @@
 		margin: 0 4rpx;
 	}
 
-	/* ===== 快捷回复 ===== */
+	/* ===== 快捷问题模块 ===== */
 	.quick-replies {
-		background-color: #ffffff;
+		flex: none;
+		background-color: #f8f9ff;
 		border-top-width: 1rpx;
 		border-top-style: solid;
-		border-top-color: #f0f0f0;
+		border-top-color: #dde3f8;
+	}
+
+	.quick-replies-header {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		justify-content: space-between;
+		padding: 16rpx 24rpx;
+	}
+
+	.qr-header-left {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+	}
+
+	.qr-header-icon {
+		font-size: 26rpx;
+		margin-right: 10rpx;
+	}
+
+	.qr-title {
+		font-size: 26rpx;
+		font-weight: 600;
+		color: #444444;
+	}
+
+	.qr-toggle {
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		background-color: rgb(66,121,240);
+		border-radius: 24rpx;
+		padding: 8rpx 20rpx;
+	}
+
+	.qr-toggle-text {
+		font-size: 22rpx;
+		color: #ffffff;
+		margin-right: 6rpx;
+	}
+
+	.qr-toggle-icon {
+		font-size: 24rpx;
+		color: #ffffff;
+		line-height: 1;
+	}
+
+	.quick-replies-body {
+		padding-bottom: 12rpx;
 	}
 
 	.qr-scroll {
-		white-space: nowrap;
+		width: 100%;
+	}
+
+	.qr-scroll-inner {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: nowrap;
+		align-items: center;
+		padding: 0 16rpx;
 	}
 
 	.qr-chip {
-		display: inline-flex;
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		flex-shrink: 0;
 		font-size: 24rpx;
 		color: rgb(66,121,240);
-		background-color: #eef2fe;
+		background-color: #ffffff;
-		border-radius: 20rpx;
+		border-width: 1rpx;
-		padding: 10rpx 24rpx;
+		border-style: solid;
-		margin: 12rpx 8rpx;
+		border-color: rgb(66,121,240);
+		border-radius: 24rpx;
+		padding: 10rpx 28rpx;
+		margin: 0 8rpx;
+		height: 60rpx;
+		line-height: 60rpx;
 	}
 
 	/* ===== 输入区 ===== */
 	.input-bar {
 		background-color: #ffffff;
-		border-top-width: 1rpx;
-		border-top-style: solid;
-		border-top-color: #eeeeee;
 		padding-bottom: env(safe-area-inset-bottom);
 	}
 

pages/mall/merchant/members.uvue

@@ -849,7 +849,6 @@
 		background: #eeeeee;
 		color: #666666;
 	}
-
 	.btn.confirm {
 		background: rgb(66, 121, 240);
 		color: #ffffff;