tijiao

uni_modules/hb-comment/components/hb-comment/hb-comment.vue

@@ -196,10 +196,7 @@
     <!-- 无评论-start -->
     <view
       class="comment-none"
-      @click="
-        showInput = false;
-        commentContent = '';
-      "
+      
       v-if="!isDisable"
       style="background-color: #fafafa"
     >
@@ -252,50 +249,37 @@
       </view>
       <view
         class="input-container"
-        :style="{ bottom: keyboardHeight + 'px' }"
+        :style="{ bottom: (show?205:0) + 'px' }"
         v-if="showInput"
       >
-        <view style="overflow: hidden; margin-bottom: 4rpx; font-size: 28rpx"
+        <view style="overflow: hidden; margin-bottom: 4rpx; font-size: 32rpx"
           ><text
             @click.stop="
               showInput = false;
               commentContent = '';
             "
-            style="float: left"
+            style="float: left;margin-top:4rpx"
             >取消</text
           >
 
-          <text @click.stop="sendComment" style="float: right; color: #1985fd"
+          <text @click.stop="sendComment" style="float: right; color: #1985fd;margin-right:20rpx;margin-top:4rpx;"
             >发送</text
           >
-          <image v-if="!show"
+          <image 
             src="./emoji.png"
             @click.stop="emojichet()"
             mode=""
             style="
-              height: 52rpx;
-              width: 52rpx;
+              height: 50rpx;
+              width: 50rpx;
               object-fit: fill;
               float: right;
-              margin-right: 2%;
-              margin-top: -4rpx;
-            "
-          ></image
-        >
-          <image v-else
-            src="./jianpan.png"
-            @click.stop="emojichet()"
-            mode=""
-            style="
-              height: 52rpx;
-              width: 52rpx;
-              object-fit: fill;
-              float: right;
-              margin-right: 2%;
-              margin-top: -4rpx;
+              margin-right: 30rpx;
+              margin-top: 0rpx;
             "
           ></image
         >
+       
       
       
       
@@ -303,13 +287,14 @@
         <view>
           <textarea
             auto-height
+			 
             style="max-height: 200rpx; overflow-y: auto; padding: 14rpx"
             v-model="commentContent"
             class="comment-input"
             maxlength="-1"
             :placeholder="placeholder ? placeholder : '发表评论...'"
             @focus.stop="onInputFocus"
-            @blur.stop="onInputBlur"
+           
             :auto-focus="showInput"
           />
         </view>
@@ -317,11 +302,11 @@
         <view
           class="emoji_box"
           v-if="show"
-          :style="{ height: keyboardHeight + 'px' }"
+        
         >
           <scroll-view class="scrool" scroll-y="true">
             <view class="emojis">
-              <text
+              <text 
                 @click.stop="tap(item)"
                 v-for="(item, index) in list"
                 :key="index"
@@ -447,7 +432,7 @@ export default {
         "😉",
         "😊",
         "😇",
-        "🥰",
+        
         "😍",
         "🤩",
         "😘",
@@ -469,7 +454,7 @@ export default {
         "🤓",
         "🤠",
         "😎",
-        "🥳",
+       
         "😵",
         "🤧",
         "🤕",
@@ -487,14 +472,14 @@ export default {
         "🙄",
         "😬",
         "🤥",
-        "😶‍🌫️",
-        "😮‍🌫️",
+        "😶",
+        "😮",
         "😴",
         "🤮",
         "❤️",
         "💯",
         "💔",
-        "💩",
+        
         "🤡",
         "🤖",
         "👻",
@@ -504,7 +489,7 @@ export default {
         "💣",
         "💋",
         "😡",
-        "🤬",
+       
         "😠",
       ],
       pId: 0,
@@ -533,12 +518,7 @@ export default {
     this.placeholder = "发表评论...";
     this.commentContent = "";
 
-    this.keyboardListener = uni.onKeyboardHeightChange((res) => {
-      this.keyboardHeight = res.height;
-    });
-    uni.onKeyboardHeightChange((res) => {
-      this.KeyboardHeight = res.height;
-    });
+    
   },
   onUnload() {
     // 移除监听
@@ -548,8 +528,14 @@ export default {
   },
   methods: {
     tap(item) {
-      console.log("item at line 515:", item);
-      this.commentContent += item;
+         this.$nextTick(() => {
+              // 在页面渲染完成后获取textarea并设置焦点
+          this.showInput = true;
+
+            });
+      this.commentContent += item;  // 更新文本框内容
+      this.focus = true; // 更新焦点状态
+
 
       // this.$emit("emoji", item); // 触发 emoji 事件，将选择的 emoji 传给父组件
     },
@@ -557,7 +543,12 @@ export default {
     emojichet() {
       // this.reply("", "", 0);
       
-      this.show = !this.show; // 打开 emoji 列表
+      this.show = true; // 打开 emoji 列表
+	  // if(this.show){
+		 //  this.focus = false;
+	  // }else{
+		 //   this.focus = true;
+	  // }
     },
 
     scrollToView(callback) {
@@ -572,17 +563,18 @@ export default {
         .exec();
     },
     onInputFocus() {
+		  console.log(11111111111);
       // 可以在这里添加额外的逻辑，如滚动到输入框位置
     },
 
     // 输入框失去焦点
     onInputBlur() {
       console.log(11111111111);
-      setTimeout(() => {
-        if (!this.commentContent.trim() && !this.show) {
+     
+        if (!this.commentContent.trim()) {
           this.showInput = false;
         }
-      }, 200);
+   
 
       // 如果输入框为空，点击空白处关闭输入框
     },
@@ -615,9 +607,15 @@ export default {
     stopPrevent() {},
     // 回复评论
     reply(pUser, reUser, pId) {
+		this.show=false
       if (this.isDisable) {
         return false;
       }
+	this.keyboardListener = uni.onKeyboardHeightChange((res) => {
+	  console.log(res);  // 打印返回值，查看其中的内容
+	  this.keyboardHeight = res.height;
+	});
+
       this.pUser = pUser;
       this.commentReq.pId = pId;
       this.pId = pId;
@@ -647,7 +645,7 @@ export default {
         confirmText: "确认删除",
         success: function (res) {
           if (res.confirm) {
-            that.$emit("del", commentId);
+            // that.$emit("del", commentId);
           }
         },
       });
@@ -1061,7 +1059,7 @@ export default {
 }
 
 .emoji_box {
-  height: 440rpx;
+  height: 400rpx;
   background: #f6f6f6;
   position: fixed;
   bottom: 0;
@@ -1077,10 +1075,10 @@ export default {
 .emojis {
   width: 95%;
   margin: 0 auto;
-  font-size: 40rpx;
+  font-size: 46rpx;
   display: flex;
   flex-wrap: wrap;
-  gap: 10rpx 25rpx;
+  gap: 20rpx 30rpx;
   flex-shrink: 3;
   // padding-bottom: 50rpx;
 }