lex-wxl 1 неделя назад
Родитель
Сommit
44c2dc0091

+ 1 - 0
miniprogram/pages/chat/chat.json

@@ -1,5 +1,6 @@
 {
   "navigationStyle": "custom",
+  "disableScroll": true,
   "usingComponents": {
     "navigation-bar": "/components/navigation-bar/navigation-bar"
   }

+ 34 - 17
miniprogram/pages/chat/chat.less

@@ -11,17 +11,29 @@
 page {
   background: linear-gradient(180deg, #E8F4FC 0%, #F5F9FC 100%);
   height: 100%;
+  overflow: hidden;
 }
 
 .chat-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
   display: flex;
   flex-direction: column;
-  height: calc(100vh - 88px);
   box-sizing: border-box;
+  padding-top: 88px;
 }
 
+/* 聊天滚动区域 - 固定定位,不随键盘变化 */
 .chat-scroll {
-  flex: 1;
+  position: fixed;
+  top: 88px;
+  left: 0;
+  right: 0;
+  bottom: 120rpx;
+  padding-bottom: env(safe-area-inset-bottom);
   overflow-y: auto;
 }
 
@@ -264,10 +276,16 @@ page {
   display: block;
 }
 
-/* 输入区域 - 参考蓝湖 box_10 */
+/* 输入区域 - 固定在底部,跟随键盘移动 */
 .input-area {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
   padding: 20rpx 24rpx;
   padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+  background: linear-gradient(180deg, rgba(245, 249, 252, 0.9) 0%, rgba(232, 244, 252, 0.95) 100%);
+  z-index: 100;
 }
 
 .input-container {
@@ -281,8 +299,10 @@ page {
   align-items: center;
   background-color: #FFFFFF;
   border-radius: 86rpx;
-  padding: 12rpx 24rpx;
+  padding: 0 24rpx;
+  height: 96rpx;
   border: 2rpx solid rgba(255, 255, 255, 1);
+  box-sizing: border-box;
 }
 
 .voice-btn {
@@ -307,7 +327,8 @@ page {
 
 .chat-input {
   flex: 1;
-  height: 48rpx;
+  height: 96rpx;
+  line-height: 96rpx;
   font-size: 30rpx;
   color: rgba(19, 20, 21, 1);
   background: transparent;
@@ -318,26 +339,22 @@ page {
   font-size: 30rpx;
 }
 
-/* 发送按钮 - 参考蓝湖 image-wrapper_2 */
-.image-btn {
-  width: 96rpx;
+/* 发送按钮 */
+.send-btn {
+  width: 120rpx;
   height: 96rpx;
   display: flex;
   align-items: center;
   justify-content: center;
-  background-color: #FFFFFF;
+  background: linear-gradient(135deg, #42A5F5 0%, #2196F3 100%);
   border-radius: 86rpx;
   margin-left: 12rpx;
 }
 
-.image-icon {
-  font-size: 48rpx;
-  color: #666;
-}
-
-.image-icon-img {
-  width: 48rpx;
-  height: 48rpx;
+.send-btn-text {
+  color: #FFFFFF;
+  font-size: 30rpx;
+  font-weight: 500;
 }
 
 /* 加载中状态 */

+ 2 - 3
miniprogram/pages/chat/chat.ts

@@ -203,7 +203,7 @@ Page({
 
     // 获取用户ID(优先使用openid,其次使用token中的用户ID)
     const userInfo = wx.getStorageSync('userInfo') || {};
-    const userId = userInfo.openId || userInfo.userId;
+    const userId = userInfo.openId || userInfo.userId || wx.getStorageSync('openId');
 
     // 构建消息内容(图片发送固定提示语)
     const messageContent = contentType === 'image' ? '我发送了一张图片' : content;
@@ -212,8 +212,7 @@ Page({
       // 调用客服消息接口
       const res: any = await api_cozeAgent({
         message: messageContent,
-        userId: userId,
-        openId: wx.getStorageSync('openId')
+        userId: userId
       });
 
       if (res.code === 200 && res.data) {

+ 4 - 3
miniprogram/pages/chat/chat.wxml

@@ -92,7 +92,6 @@
   <view class="input-area">
     <view class="input-container">
       <view class="input-wrapper">
-        <!-- <image class="voice-icon-img" src="./images/mic-icon.png" mode="aspectFit"></image> -->
         <input
           class="chat-input"
           placeholder="请输入您的问题..."
@@ -101,10 +100,12 @@
           bindinput="onInput"
           confirm-type="send"
           bindconfirm="sendTextMessage"
+          adjust-position
+          cursor-spacing="20"
         />
       </view>
-      <view class="image-btn" bindtap="chooseImage">
-        <image class="image-icon-img" src="./images/send-btn.png" mode="aspectFit"></image>
+      <view class="send-btn" bindtap="sendTextMessage">
+        <text class="send-btn-text">发送</text>
       </view>
     </view>
   </view>