Browse Source

样式优化

htc 9 hours ago
parent
commit
23ca03028f
1 changed files with 30 additions and 63 deletions
  1. 30 63
      pages/dialog.vue

+ 30 - 63
pages/dialog.vue

@@ -56,26 +56,13 @@
 				</div>
 			</div>
 		</template>
-		<div class="ask_box">
+		<div class="ask_box" :style="{'bottom':fixBottom+'px'}">
 			<div class="ask">
 				<div class="a_inp">
-					<u-textarea v-model="question" placeholder="请输入您的问题" autoHeight @confirm="sendQuestion"></u-textarea>
-				</div>
-				<div class="a_btn adfacjb">
-					<div class="ab_l adfac">
-						<!-- <div class="al_pre adfacjc" :class="{'active':chzq}" @tap="changeChzq">
-							<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/06/16/451ac13c-5fdc-4d15-8f35-9f4d238e87c1.png" v-if="!chzq"></image>
-							<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/07/07/724764f9-3b36-4c90-89c9-cc51875c6767.png" v-else></image>
-							<text>创衡增强</text>
-						</div>
-						<div class="al_pre adfacjc" :class="{'active':lwss}" @tap="changeLwss">
-							<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/06/16/d4668dcc-1d28-47ff-8bae-84dc6475794b.png" v-if="!lwss"></image>						   
-							<image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/07/07/017f80b5-9421-4850-a659-38705e514e67.png" v-else></image>
-							<text>联网搜索</text>
-						</div> -->
+					<div class="ai_l">
+						<u-textarea v-model="question" placeholder="请输入您的问题" autoHeight :showConfirmBar="false" :adjustPosition="false" maxlength="999999"></u-textarea>
 					</div>
-					<div class="ab_r">
-						<!-- <image src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/06/16/caf6075c-0967-4c99-a269-ea453537075c.png"></image> -->
+					<div class="ai_r">
 						<image @tap="sendQuestion" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/06/16/2429556b-54b7-4878-97c0-6b440b546ee4.png"></image>
 					</div>
 				</div>
@@ -109,8 +96,18 @@
 				cindex:'',
 				chzq:false,
 				lwss:false,
+				fixBottom: 0
 			}
 		},
+		onReady() {
+		    uni.onKeyboardHeightChange(res => {
+		      this.fixBottom = res.height||0;
+		    });
+		},
+		onUnload() {
+		    uni.offKeyboardHeightChange();
+			this.fixBottom = 0;
+		},
 		methods:{
 			toBack(){
 				uni.reLaunch({
@@ -323,12 +320,12 @@
 		padding: 0 !important;
 	}
 	::v-deep .u-textarea textarea{
-		min-height: 96rpx !important;
+		min-height: 64rpx !important;
 	}
 	
 	.page{
 		background: linear-gradient( 227deg, #EEEFF8 0%, #F6ECF4 100%, #F6ECF4 100%);
-		padding: 0 30rpx 302rpx;
+		padding: 0 30rpx 200rpx;
 		box-sizing: border-box;
 		
 		.welcome{
@@ -429,66 +426,36 @@
 		}
 		.ask_box{
 			width: 100%;
-			height: 282rpx;
+			min-height: 176rpx;
 			background: linear-gradient( 227deg, #EEEFF8 0%, #F6ECF4 100%, #F6ECF4 100%);
-			padding: 0 30rpx 72rpx;
+			padding: 0 30rpx 60rpx;
 			position: fixed;
 			left: 0;
-			bottom: 0;
 			box-sizing: border-box;
 		}
 	
 		.ask{
-			height: 210rpx;
+			min-height: 116rpx;
 			background: #FFFFFF;
 			border-radius: 24rpx;
 			border: 2rpx solid #F0F2F8;
-			display: flex;
-			flex-direction: column;
 			padding: 24rpx;
 			box-sizing: border-box;
 			.a_inp{
-				flex: 1;
+				display: flex;
+				align-items: flex-end;
+				max-height: 300rpx;
 				overflow-y: auto;
-			}
-			.a_btn{
-				padding-top: 20rpx;
-				height: 54rpx;
-				.ab_l{
-					.al_pre{
-						width: 162rpx;
-						height: 54rpx;
-						background: #FFFFFF;
-						border-radius: 27rpx;
-						border: 1rpx solid #E0E0E0;
-						margin-right: 24rpx;
-						image{
-							width: 24rpx;
-							height: 24rpx;
-						}
-						text{
-							font-family: PingFangSC, PingFang SC;
-							font-weight: 400;
-							font-size: 22rpx;
-							color: #393939;
-							line-height: 22rpx;
-							margin-left: 10rpx;
-						}
-						&.active{
-							background: rgba(118,30,106,0.06);
-							border-radius: 27px;
-							border: 1px solid #761E6A;
-							text{
-								color: #761E6A;
-							}
-						}
-					}
+				.ai_l{
+					width: calc(100% - 64rpx);
+					padding-right: 20rpx;
+					box-sizing: border-box;
 				}
-				.ab_r{
+				.ai_r{
+					width: 64rpx;
 					image{
-						width: 48rpx;
-						height: 48rpx;
-						margin-left: 30rpx;
+						width: 64rpx;
+						height: 64rpx;
 					}
 				}
 			}