From 382592c2b688130181430b05d03309135a08ff0a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=91=E5=8B=87=E6=B6=9B?= <yongtaozheng0201@163.com>
Date: Sun, 24 Jul 2022 15:17:39 +0800
Subject: [PATCH 1/2] =?UTF-8?q?'=E8=AF=84=E8=AE=BA=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=A1=A8=E6=83=85=E4=BD=BF=E7=94=A8=E5=BC=80?=
 =?UTF-8?q?=E5=85=B3#I5HV3C'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../examples/views/componentShowViews/JCommentView.vue     | 7 +++++++
 .../packages/JComment/src/JComment.vue                     | 7 +++++++
 2 files changed, 14 insertions(+)

diff --git a/JYeontuComponentWarehouse/examples/views/componentShowViews/JCommentView.vue b/JYeontuComponentWarehouse/examples/views/componentShowViews/JCommentView.vue
index 67cbd8a..365d859 100644
--- a/JYeontuComponentWarehouse/examples/views/componentShowViews/JCommentView.vue
+++ b/JYeontuComponentWarehouse/examples/views/componentShowViews/JCommentView.vue
@@ -15,6 +15,7 @@
                     :showNumber="2"
                     :comment-datas="commentDatas"
                     :orderBy="'create_time'"
+                    :useEmoji="true"
                     @submitComment="submitComment"
                 >
                 </j-comment>
@@ -182,6 +183,12 @@ export default {
                     type: "Boolean",
                     describe: "默认为true"
                 },
+                {
+                    parameter: "useEmoji",
+                    field: "是否使用表情",
+                    type: "Boolean",
+                    describe: "默认为true"
+                },
                 {
                     parameter: "orderBy",
                     field: "排序字段（时间）",
diff --git a/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue b/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
index 5d61330..2619a1d 100644
--- a/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
+++ b/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
@@ -20,6 +20,7 @@
         ></textarea>
         <div v-if="withCommentContent" class="j-comment-content-btns">
             <img
+                v-if="useEmoji"
                 @click.stop="showEmoji"
                 id="comment-emoji"
                 style="width:20px;height:20px;cursor:pointer;"
@@ -83,6 +84,7 @@
             ></textarea>
             <div v-if="item.showReply" class="j-comment-reply-btns">
                 <img
+                    v-if="useEmoji"
                     class="emoji-btn"
                     @click.stop="showEmoji"
                     :id="'emoji-reply-' + index"
@@ -185,6 +187,7 @@
                     ></textarea>
                     <div v-if="children.showReply" class="j-comment-reply-btns">
                         <img
+                            v-if="useEmoji"
                             class="emoji-btn"
                             @click.stop="showEmoji"
                             :id="'emoji-reply-' + index + '-' + childrenIndex"
@@ -252,6 +255,10 @@ export default {
             type: Boolean,
             default: true
         },
+        useEmoji: {
+            type: Boolean,
+            default: true
+        },
         keyMap: {
             type: Object,
             default: () => {
-- 
Gitee


From cb9853b9b932336dde28a9c259a6dc2dc2c590bb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=91=E5=8B=87=E6=B6=9B?= <yongtaozheng0201@163.com>
Date: Sun, 24 Jul 2022 15:45:46 +0800
Subject: [PATCH 2/2] =?UTF-8?q?'=E4=BF=AE=E5=A4=8D=E5=9C=A8=E6=A0=85?=
 =?UTF-8?q?=E6=A0=BC=E5=B8=83=E5=B1=80=E7=9A=84=E6=83=85=E5=86=B5=E4=B8=8B?=
 =?UTF-8?q?=EF=BC=8C=E8=A1=A8=E6=83=85=E5=BC=B9=E5=87=BA=E7=9A=84=E4=BD=8D?=
 =?UTF-8?q?=E7=BD=AE=E4=B8=8D=E5=AF=B9=E7=9A=84=E9=97=AE=E9=A2=98#I5HV2N'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../packages/JComment/src/JComment.vue        | 25 ++++++++++++++++---
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue b/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
index 2619a1d..b4fdefc 100644
--- a/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
+++ b/JYeontuComponentWarehouse/packages/JComment/src/JComment.vue
@@ -287,11 +287,13 @@ export default {
             lastLength: 0,
             showItem: [],
             showVEmojiPicker: false,
-            emojiTextId: ""
+            emojiTextId: "",
+            scrollTop: 0
         };
     },
     created() {
         this.initData();
+        this.initListen();
     },
     watch: {
         commentDatas() {
@@ -300,6 +302,17 @@ export default {
     },
     computed: {},
     methods: {
+        initListen() {
+            window.onscroll = function() {
+                var scrollTop =
+                    document.documentElement.scrollTop ||
+                    document.body.scrollTop;
+                let v = document.getElementById("v-emoji-picker");
+                v.style.top =
+                    parseInt(v.style.top) - (scrollTop - this.scrollTop) + "px";
+                this.scrollTop = scrollTop;
+            };
+        },
         // 表情转码
         utf16toEntities(str) {
             const patt = /[\ud800-\udbff][\udc00-\udfff]/g; // 检测utf16字符正则
@@ -342,8 +355,11 @@ export default {
         },
         showEmoji(el) {
             let v = document.getElementById("v-emoji-picker");
-            v.style.left = el.pageX + 5 + "px";
-            v.style.top = el.pageY + 5 + "px";
+            const srcElement = el.srcElement;
+            v.style.left = el.x + 5 + "px";
+            v.style.top = el.y + 5 + "px";
+            this.scrollTop =
+                document.documentElement.scrollTop || document.body.scrollTop;
             this.showVEmojiPicker = !this.showVEmojiPicker;
             this.emojiTextId = el.target.id;
         },
@@ -549,8 +565,9 @@ export default {
     text-align: left;
     width: 80%;
     padding: 1rem;
+    position: relative;
     #v-emoji-picker {
-        position: absolute;
+        position: fixed;
     }
     .j-comment-content {
         width: 100%;
-- 
Gitee