emoji

pages/conversation/chating/components/ChatingFooter/CustomEditor.vue

@@ -1,14 +1,18 @@
 <template>
 	<view class="editor_wrap">
-		<editor :placeholder="placeholder" id="editor2" @ready="editorReady" @focus="editorFocus" @blur="editorBlur"
+		<editor 
+			:placeholder="placeholder" 
+			id="editor2" 
+			@ready="editorReady" 
+			@focus="editorFocus" 
+			@blur="editorBlur"
 			@input="editorInput" />
 	</view>
 </template>
 
 <script>
-	import {
-		html2Text
-	} from "@/util/common";
+	import { forIn } from "lodash";
+import {html2Text} from "@/util/common";
 	export default {
 		props: {
 			placeholder: {
@@ -20,6 +24,8 @@
 			return {
 				editorCtx: null,
 				lastStr: "",
+				isInsertingEmoji: false, // 标记是否正在插入表情
+				hasFocus: false, // 记录编辑器是否有焦点
 			};
 		},
 		methods: {
@@ -28,17 +34,103 @@
 					.createSelectorQuery()
 					.select("#editor2")
 					.context((res) => {
-						this.$emit("ready", res);
+						//this.$emit("ready", res);
 						this.editorCtx = res.context;
 					})
 					.exec();
 			},
 			editorFocus() {
+				this.hasFocus = true;
+				// 如果正在插入表情，不触发 focus 事件，并立即隐藏键盘
+				if (this.isInsertingEmoji) {
+					// #ifdef APP-PLUS || H5
+					uni.hideKeyboard();
+					// #endif
+					return;
+				}
 				this.$emit("focus");
 			},
 			editorBlur() {
+				this.hasFocus = false;
 				this.$emit("blur");
 			},
+			clear(){
+				this.editorCtx.clear()
+			},
+			insertText(text,successFn,errFn){
+				// 标记正在插入表情，阻止 focus 事件触发
+				this.isInsertingEmoji = true;
+				
+				// 先隐藏键盘，避免插入时键盘弹出
+				// #ifdef APP-PLUS || H5
+				uni.hideKeyboard();
+				// #endif
+				
+				// 如果编辑器当前有焦点，先让它失焦（通过点击外部区域）
+				// 但这种方式可能不太可靠，所以我们主要依赖 isInsertingEmoji 标志
+				
+				// 使用 insertText 插入文本（这是最可靠的方法）
+				// 虽然会触发焦点，但我们已经通过 isInsertingEmoji 标志阻止了 focus 事件
+				this.editorCtx.insertText({
+					text: text,
+					success: (res) => {
+						successFn && successFn.call(this, [res]);
+						console.log("插入文字成功");
+						
+						// 插入后立即隐藏键盘，防止键盘弹出
+						// #ifdef APP-PLUS || H5
+						// 使用多个延迟确保键盘被隐藏
+						setTimeout(() => {
+							uni.hideKeyboard();
+						}, 10);
+						setTimeout(() => {
+							uni.hideKeyboard();
+						}, 50);
+						setTimeout(() => {
+							uni.hideKeyboard();
+						}, 100);
+						// #endif
+						
+						// 延迟重置标志，确保 focus 事件被完全忽略
+						setTimeout(() => {
+							this.isInsertingEmoji = false;
+						}, 300);
+					},
+					fail: (err) => {
+						errFn && errFn.call(this, [err]);
+						console.log("插入文字失败", err);
+						this.isInsertingEmoji = false;
+					}
+				});
+			},
+			delete(){
+				this.editorCtx.getContents({
+					success({html,text,delta}){
+						console.log(html,text,delta);
+					}
+				})
+				return ;
+				//setContents(OBJECT)
+				let emojiStr = this.editorCtx.getContents();
+				let emojiArr = [];
+				emojiStr = emojiStr.replace(/\[([^(\]|\[)]*)\]/g, function(item, index) {
+					emojiArr.unshift(item);
+				});
+				let sendStr ="";
+				if (emojiArr.length > 0) {
+					if (this.sendStr.endsWith(emojiArr[0])) {
+						this.sendStr = this.sendStr.replace(emojiArr[0], "");
+					} else {
+						this.sendStr = this.sendStr.slice(0, this.sendStr.length - 1);
+					}
+				} else {
+					this.sendStr = this.sendStr.slice(0, this.sendStr.length - 1);
+				}
+				this.editorCtx.setContents({    
+					html:sendStr
+				})
+				console.log('delete')
+			},
 			editorInput(e) {
 				let str = e.detail.html;
 				const oldArr = (this.lastStr ?? '').split("");