jack 1 неделя назад
Родитель
Сommit
2e4fdbeb37
1 измененных файлов с 76 добавлено и 32 удалено
  1. 76 32
      src/utils/prosemirror/schema/nodes.ts

+ 76 - 32
src/utils/prosemirror/schema/nodes.ts

@@ -182,15 +182,14 @@ const listItem: NodeSpec = {
 
 const paragraph: NodeSpec = {
   attrs: {
-    align: {
-      default: '',
-    },
-    indent: {
-      default: 0,
-    },
-    textIndent: {
-      default: 0,
-    },
+    align: { default: '' },
+    indent: { default: 0 },
+    textIndent: { default: 0 },
+    // 新增 margin 相关属性,以字符串形式存储原始样式值
+    marginTop: { default: '' },
+    marginBottom: { default: '' },
+    marginLeft: { default: '' },
+    marginRight: { default: '' },
   },
   content: 'inline*',
   group: 'block',
@@ -198,26 +197,48 @@ const paragraph: NodeSpec = {
     {
       tag: 'p',
       getAttrs: dom => {
-        const { textAlign, textIndent } = (dom as HTMLElement).style
+        const el = dom as HTMLElement;
+        const style = el.style;
 
-        let align = (dom as HTMLElement).getAttribute('align') || textAlign || ''
-        align = /(left|right|center|justify)/.test(align) ? align : ''
+        // 原有 align 解析逻辑
+        const textAlign = style.textAlign || '';
+        let align = el.getAttribute('align') || textAlign || '';
+        align = /^(left|right|center|justify)$/.test(align) ? align : '';
 
-        let textIndentLevel = 0
-        if (textIndent) {
-          if (/em/.test(textIndent)) {
-            textIndentLevel = parseInt(textIndent)
-          }
-          else if (/px/.test(textIndent)) {
-            textIndentLevel = Math.floor(parseInt(textIndent) / 16)
-            if (!textIndentLevel) textIndentLevel = 1
+        // 原有 textIndent 解析逻辑(转换为数字级别)
+        /*
+        const textIndentStyle = style.textIndent || '';
+        let textIndentLevel = 0;
+        if (textIndentStyle) {
+          if (/em/.test(textIndentStyle)) {
+            textIndentLevel = parseInt(textIndentStyle, 10);
+          } else if (/px/.test(textIndentStyle)) {
+            textIndentLevel = Math.floor(parseInt(textIndentStyle, 10) / 16);
+            if (!textIndentLevel) textIndentLevel = 1;
           }
         }
 
-        const indent = +((dom as HTMLElement).getAttribute('data-indent') || 0)
-      
-        return { align, indent, textIndent }
-      }
+
+        // 原有 indent(数据属性)
+        const indent = +(el.getAttribute('data-indent') || 0);
+        */
+
+        // 新增 margin 解析(直接取原始字符串)
+        const marginTop = style.marginTop || '';
+        const marginBottom = style.marginBottom || '';
+        const marginLeft = style.marginLeft || '';
+        const marginRight = style.marginRight || '';
+        const textIndent = style.textIndent || '';
+
+        return {
+          align,
+          textIndent,
+          marginTop,
+          marginBottom,
+          marginLeft,
+          marginRight,
+        };
+      },
     },
     {
       tag: 'img',
@@ -229,17 +250,40 @@ const paragraph: NodeSpec = {
     },
   ],
   toDOM: (node: Node) => {
-    const { align, indent, textIndent } = node.attrs
-    let style = ''
-    if (align && align !== 'left') style += `text-align: ${align};text-align-last: ${align};`
-    if (textIndent) style += `text-indent: ${textIndent};`
+    const {
+      align,
+      textIndent,
+      marginTop,
+      marginBottom,
+      marginLeft,
+      marginRight,
+    } = node.attrs;
 
-    const attr: Attr = { style }
-    //if (indent) attr['data-indent'] = indent
+    let style = '';
 
-    return ['p', attr, 0]
+    if (align && align !== 'left') {
+      style += `text-align: ${align};text-align-last: ${align};`;
+    }
+
+    // 注意:原有 textIndent 为数字,这里直接输出数字(不带单位)
+    // 如果你希望输出带单位的样式,需根据业务调整(见后文说明)
+    if (textIndent) {
+      style += `text-indent: (100% - ${textIndent});`;
+    }
+
+    // 新增 margin 样式输出
+    if (marginTop) style += `margin-top: ${marginTop};`;
+    if (marginBottom) style += `margin-bottom: ${marginBottom};`;
+    if (marginLeft) style += `margin-left: ${marginLeft};`;
+    if (marginRight) style += `margin-right: ${marginRight};`;
+
+    const attr: Attr = { style };
+    // 原有的 indent 存储方式(根据需要可保留或取消注释)
+    // if (indent) attr['data-indent'] = indent;
+
+    return ['p', attr, 0];
   },
-}
+};
 
 const {
   doc,