From 971a70e566099f754a68cbc67699c9db8fb44391 Mon Sep 17 00:00:00 2001
From: shaoyongjun <mylomen.shao@freebrio.com>
Date: Wed, 6 Nov 2024 14:07:30 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=A4=9A=E8=A1=8C=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/css/myEdit.css                        |  8 +++
 static/js/common/ctx.js                      |  4 ++
 static/js/event/impl/MutationObserverImpl.js | 51 +++++++++++++++++---
 static/js/index.js                           |  8 ++-
 4 files changed, 62 insertions(+), 9 deletions(-)

diff --git a/static/css/myEdit.css b/static/css/myEdit.css
index 59f6a7c..baf1bec 100644
--- a/static/css/myEdit.css
+++ b/static/css/myEdit.css
@@ -171,6 +171,14 @@ main {
     flex: 1 1 100%;
 }
 
+#yxl_note p span{
+    /*border: 1px rgb(248, 245, 245) solid;*/
+    margin: 0 0;
+    padding: 0 0;
+    /* border: none;  */
+    width: 100%;
+    height: 100%;
+}
 
 #testInput {
     width: 60%;
diff --git a/static/js/common/ctx.js b/static/js/common/ctx.js
index 91d1ef3..c0d213f 100644
--- a/static/js/common/ctx.js
+++ b/static/js/common/ctx.js
@@ -66,6 +66,10 @@ define(function (require, exports, module) {
             return this.rowNo++;
         }
 
+        getCurRowNo(){
+            return this.rowNol
+        }
+
         getScreenWidth() {
             return window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
         }
diff --git a/static/js/event/impl/MutationObserverImpl.js b/static/js/event/impl/MutationObserverImpl.js
index eb37d43..62a4aef 100644
--- a/static/js/event/impl/MutationObserverImpl.js
+++ b/static/js/event/impl/MutationObserverImpl.js
@@ -15,6 +15,9 @@ define(function (require, exports, module) {
                 case "characterData":
                     updateText(mutation);
                     break;
+                case "attributes":
+                    //暂时忽略属性变化
+                    break
                 default: {
                     other(mutation);
                 }
@@ -46,20 +49,54 @@ define(function (require, exports, module) {
     function addNewP(mutation) {
         let target = mutation.target;
         if (target.nodeName === "DIV" && mutation.previousSibling !== null) {
+            let targetP = mutation.previousSibling.nextSibling;
             console.log(
-                "target: ", target,
+                "addNewP target: ", target,
                 "\nnodeType: ", target.nodeType,
                 "\nnodeName: ", target.nodeName,
                 "\ndata: ", target.value,
-                "\n next: ", mutation.previousSibling.nextSibling
+                "\n next: ", targetP
             )
 
+
             let utils = require("../../common/utils");
             let ctx = require("../../common/ctx");
-            let curP = mutation.previousSibling.nextSibling;
-            if (curP !== undefined && curP !== null) {
-                curP.id = utils.Uuid(ctx.usn, ctx.docType);
-                curP.setAttribute("data-order", ctx.incrementNumThenReturn());
+            if (ctx.getCurRowNo() === 0) {
+                return
+            }
+            if (targetP !== undefined && targetP !== null) {
+                targetP.id = utils.Uuid(ctx.usn, ctx.docType);
+                targetP.setAttribute("data-order", ctx.incrementNumThenReturn());
+
+                let newParagraph = document.getElementById(targetP.id);
+                //前置 span
+                let preSpan = newParagraph.querySelector("span[data-flag='span_pre']");
+                if (preSpan === undefined || preSpan === null) {
+                    preSpan = document.createElement("span");
+                    preSpan.setAttribute("contenteditable", "false")
+                    preSpan.setAttribute("data-flag", "span_pre")
+                    newParagraph.appendChild(preSpan);
+                }
+
+                //内置span
+                let spanContent = newParagraph.querySelector("span[data-flag='span_content']");
+                if (spanContent === undefined || spanContent === null) {
+                    spanContent = document.createElement("span");
+                    spanContent.append(document.createElement("br"));
+                    spanContent.setAttribute("data-flag", "span_content")
+                    newParagraph.appendChild(spanContent);
+                }
+
+                // newParagraph.innerHTML = '<span contenteditable="false" data-flag="span_pre"></span><span data-flag="span_content"><br/></span>'
+
+                // newParagraph.insertAdjacentHTML('beforeend',
+                //     '<span contenteditable="false" data-flag="span_pre"></span><span data-flag="span_content"><br></span>');
+                console.log("newParagraph addChildren ", newParagraph)
+                //收起选区到一个点，光标落在一个可编辑元素上
+                // utils.GetSelection().removeAllRanges();
+                // utils.GetSelection().setPosition(newParagraph, 0);
+                utils.GetSelection().setPosition(spanContent, 0);
+                spanContent.focus();
             }
         }
 
@@ -81,8 +118,6 @@ define(function (require, exports, module) {
             // let curP = target.parentNode.parentNode;
 
 
-
-
         } else {
             other(mutation);
         }
diff --git a/static/js/index.js b/static/js/index.js
index 8a5fb78..075c258 100644
--- a/static/js/index.js
+++ b/static/js/index.js
@@ -8,6 +8,11 @@ define(function (require) {
 
     // 初始化第一个输入框
     let newParagraph = document.createElement("p");
+    //前置 span
+    let preSpan = document.createElement("span");
+    preSpan.setAttribute("contenteditable","false")
+    preSpan.setAttribute("data-flag","span_pre")
+    newParagraph.append(preSpan);
     //内置span
     let span = document.createElement("span");
     span.append(document.createElement("br"));
@@ -16,7 +21,8 @@ define(function (require) {
     //添加一行
     ctx.MyRoot().append(newParagraph);
     //收起选区到一个点，光标落在一个可编辑元素上
-    utils.GetSelection().setPosition(newParagraph, 0);
+    utils.GetSelection().setPosition(span, 0);
+    span.focus();
 
 
 })
\ No newline at end of file