feat(编辑器): 实现富文本编辑功能并优化交互体验

添加富文本编辑功能，包括插入图片、表情和标签
优化键盘事件处理，支持特殊文本块操作
增加编辑器空状态提示和样式优化
修复光标定位和滚动行为问题

css/index.css

@@ -49,6 +49,7 @@ editor {
   min-height: 100vh;
   background-color: #f5f5f5;
   padding-bottom: 3.2rem;
+  padding-bottom: 8.6667rem;
   padding-top: 0.4rem;
 }
 .container .title-box {
@@ -66,6 +67,11 @@ editor {
   line-height: 0.56rem;
   outline: none;
   border: none;
+  resize: none;
+  font-size: 0.36rem;
+}
+.container .title-box .input::placeholder {
+  color: #757575;
 }
 .container .editor-box {
   width: 9.4rem;
@@ -81,18 +87,47 @@ editor {
   border: none;
   outline: none;
   overflow: auto;
+  font-size: 0.36rem;
+  color: #555555;
+  line-height: 0.56rem;
+  white-space: break-spaces;
+  position: relative;
+}
+.container .editor-box .editor.empty:before {
+  content: "输入正文";
+  pointer-events: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  color: #757575;
+}
+.container .editor-box .editor h2 {
+  font-size: 0.48rem;
+  color: #000000;
+  line-height: normal;
 }
 .container .editor-box .editor img {
-  width: 8.6rem;
+  width: 90%;
   display: block;
+  margin: auto;
+}
+.container .editor-box .editor .blue {
+  color: #026277;
+  margin: 0 0.1rem;
+}
+.container .editor-box .editor .cursor {
+  background-color: red;
+  width: 1px;
+  height: 1px;
+  display: inline-block;
 }
 .container .editor-box .label {
   white-space: nowrap;
-  width: 100vw;
-  height: 0.64rem;
-  margin-bottom: 0.4rem;
+  /* height: 0.84rem; */
+  margin-bottom: 0.2rem;
   width: 9.4rem;
   overflow: auto;
+  padding-bottom: 0.2rem;
 }
 .container .editor-box .label .item {
   width: fit-content;
@@ -129,6 +164,7 @@ editor {
   color: #555555;
   padding: 0 0.24rem;
   margin-right: 0.2rem;
+  position: relative;
 }
 .container .editor-box .btn-list .item.pitch {
   background-color: #f6f6bd;
@@ -138,6 +174,26 @@ editor {
   height: 0.4rem;
   margin-right: 0.14rem;
 }
+.container .editor-box .btn-list .item .file {
+  opacity: 0;
+  /* 隐藏输入框 */
+  background: transparent;
+  border: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+}
+.container .editor-box .btn-list .item .file::after {
+  content: "";
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
 .container .editor-box .btn-list .unfold {
   width: 0.72rem;
   height: 0.72rem;