Browse Source

Merge branch 'beta' of https://git.cocorobo.cn/jack/PPT into beta

lsc 4 days ago
parent
commit
6fdb520891

+ 0 - 3
src/assets/styles/prosemirror.scss

@@ -2,9 +2,6 @@
   outline: 0;
   border: 0;
   font-size: 16px;
-  word-break: break-word;
-  white-space: normal;
-
   &:not(.ProseMirror-static) {
     user-select: text;
   }

+ 5 - 3
src/hooks/useImport.ts

@@ -37,7 +37,7 @@ const convertFontSizePtToPx = (html: string, ratio: number, autoFit: any) => {
   }
   // return html;
   return html.replace(/\s*([\d.]+)pt/g, (match, p1) => {
-    return `${(parseFloat(p1) * ratio - 1) | 0}px `
+    return `${Math.round(parseFloat(p1) * ratio)}px `
   })
 
 }
@@ -791,6 +791,8 @@ export default () => {
     }
   
     let transparentPngBlob: Blob
+    transparentPngBlob = pngBlob
+    /*
     if (alreadyTransparent) {
       // 图片已有透明背景,直接使用原 PNG Blob
       console.log('检测到透明背景,跳过白色变透明处理')
@@ -800,7 +802,7 @@ export default () => {
       // 否则执行白色变透明处理
       transparentPngBlob = await makeWhiteTransparentFromPng(pngBlob, tolerance)
     }
-  
+  */
     const finalFilename = format === 'png' ? filename : filename.replace(/\.[^.]*$/, '') + '.png'
     return new File([transparentPngBlob], finalFilename, { type: 'image/png' })
   }
@@ -1737,7 +1739,7 @@ export default () => {
                 defaultColor: theme.value.fontColor,
                 content: convertFontSizePtToPx(el.content, ratio, el.autoFit),
                 style: getStyle(convertFontSizePtToPx(el.content, ratio, el.autoFit)),
-                lineHeight: 1.15,
+                lineHeight: 1.5,
                 align: vAlignMap[el.vAlign] || 'middle',
                 outline: {
                   color: el.borderColor,

+ 30 - 26
src/utils/prosemirror/schema/nodes.ts

@@ -101,16 +101,17 @@ const listItem: NodeSpec = {
   group: 'block',
 }
 */
+
 const listItem: NodeSpec = {
   attrs: {
-    align: { default: '' },
+    textAlign: { default: '' },      // 对应 CSS text-align
+    textAlignLast: { default: '' },  // 对应 CSS text-align-last
     textIndent: { default: '' },
     marginTop: { default: '' },
     marginBottom: { default: '' },
     marginLeft: { default: '' },
     marginRight: { default: '' },
     lineHeight: { default: '' },
-    // ✅ 新增 padding 属性
     paddingTop: { default: '' },
     paddingRight: { default: '' },
     paddingBottom: { default: '' },
@@ -133,17 +134,14 @@ const listItem: NodeSpec = {
         const marginLeft = style.marginLeft || '';
         const marginRight = style.marginRight || '';
         const lineHeight = style.lineHeight || '';
-        // ✅ 读取 padding 值
         const paddingTop = style.paddingTop || '';
         const paddingRight = style.paddingRight || '';
         const paddingBottom = style.paddingBottom || '';
         const paddingLeft = style.paddingLeft || '';
 
-        let align = textAlign || textAlignLast || '';
-        align = /^(left|right|center|justify)$/.test(align) ? align : '';
-
         return {
-          align,
+          textAlign,
+          textAlignLast,
           textIndent,
           marginTop,
           marginBottom,
@@ -160,7 +158,8 @@ const listItem: NodeSpec = {
   ],
   toDOM(node) {
     const {
-      align,
+      textAlign,
+      textAlignLast,
       textIndent,
       marginTop,
       marginBottom,
@@ -175,18 +174,20 @@ const listItem: NodeSpec = {
 
     let style = '';
 
-    if (align) {
-      style += `text-align: ${align}; text-align-last: ${align};`;
+    if (textAlign && textAlign !== 'left') {
+      style += `text-align: ${textAlign};`;
+    }
+    if (textAlignLast) {
+      style += `text-align-last: ${textAlignLast};`;
     }
     if (textIndent) {
-      style += `text-indent: ${textIndent};`;
+      style += `text-indent: (100% - ${textIndent});`;
     }
     if (marginTop) style += `margin-top: ${marginTop};`;
     if (marginBottom) style += `margin-bottom: ${marginBottom};`;
     if (marginLeft) style += `margin-left: ${marginLeft};`;
     if (marginRight) style += `margin-right: ${marginRight};`;
-    if (lineHeight) style += `line-height: ${lineHeight};`;
-    // ✅ 输出 padding
+    if (lineHeight) style += `line-height: ${lineHeight * 1.2};`;
     if (paddingTop) style += `padding-top: ${paddingTop};`;
     if (paddingRight) style += `padding-right: ${paddingRight};`;
     if (paddingBottom) style += `padding-bottom: ${paddingBottom};`;
@@ -199,9 +200,12 @@ const listItem: NodeSpec = {
   },
 };
 
+
 const paragraph: NodeSpec = {
+  whitespace: "pre",
   attrs: {
-    align: { default: '' },
+    textAlign: { default: '' },      // 对应 CSS text-align
+    textAlignLast: { default: '' },  // 对应 CSS text-align-last
     indent: { default: 0 },
     textIndent: { default: 0 },
     marginTop: { default: '' },
@@ -209,7 +213,6 @@ const paragraph: NodeSpec = {
     marginLeft: { default: '' },
     marginRight: { default: '' },
     lineHeight: { default: '' },
-    // ✅ 新增 padding 属性
     paddingTop: { default: '' },
     paddingRight: { default: '' },
     paddingBottom: { default: '' },
@@ -225,23 +228,21 @@ const paragraph: NodeSpec = {
         const style = el.style;
 
         const textAlign = style.textAlign || '';
-        let align = el.getAttribute('align') || textAlign || '';
-        align = /^(left|right|center|justify)$/.test(align) ? align : '';
-
+        const textAlignLast = style.textAlignLast || '';
         const marginTop = style.marginTop || '';
         const marginBottom = style.marginBottom || '';
         const marginLeft = style.marginLeft || '';
         const marginRight = style.marginRight || '';
         const textIndent = style.textIndent || '';
         const lineHeight = style.lineHeight || '';
-        // ✅ 读取 padding
         const paddingTop = style.paddingTop || '';
         const paddingRight = style.paddingRight || '';
         const paddingBottom = style.paddingBottom || '';
         const paddingLeft = style.paddingLeft || '';
 
         return {
-          align,
+          textAlign,
+          textAlignLast,
           textIndent,
           marginTop,
           marginBottom,
@@ -266,7 +267,8 @@ const paragraph: NodeSpec = {
   ],
   toDOM: (node: Node) => {
     const {
-      align,
+      textAlign,
+      textAlignLast,
       textIndent,
       marginTop,
       marginBottom,
@@ -281,18 +283,20 @@ const paragraph: NodeSpec = {
 
     let style = '';
 
-    if (align && align !== 'left') {
-      style += `text-align: ${align};text-align-last: ${align};`;
+    if (textAlign && textAlign !== 'left') {
+      style += `text-align: ${textAlign};`;
+    }
+    if (textAlignLast) {
+      style += `text-align-last: ${textAlignLast};`;
     }
     if (textIndent) {
-      style += `text-indent: ${textIndent};`;
+      style += `text-indent: (100% - ${textIndent});`;
     }
     if (marginTop) style += `margin-top: ${marginTop};`;
     if (marginBottom) style += `margin-bottom: ${marginBottom};`;
     if (marginLeft) style += `margin-left: ${marginLeft};`;
     if (marginRight) style += `margin-right: ${marginRight};`;
-    if (lineHeight) style += `line-height: ${lineHeight};`;
-    // ✅ 输出 padding
+    if (lineHeight) style += `line-height: ${lineHeight * 1.2};`;
     if (paddingTop) style += `padding-top: ${paddingTop};`;
     if (paddingRight) style += `padding-right: ${paddingRight};`;
     if (paddingBottom) style += `padding-bottom: ${paddingBottom};`;

+ 2 - 2
src/views/components/element/ShapeElement/BaseShapeElement.vue

@@ -123,7 +123,7 @@ const text = computed<ShapeText>(() => {
   width: 100%;
   height: 100%;
   position: relative;
-
+  line-height: 1.5;
   svg {
     transform-origin: 0 0;
     overflow: visible;
@@ -143,7 +143,7 @@ const text = computed<ShapeText>(() => {
   padding: 5px;
   word-break: break-word;
   pointer-events: none;
-
+  white-space: break-spaces;
   &.editable {
     pointer-events: all;
   }

+ 2 - 0
src/views/components/element/ShapeElement/index.vue

@@ -240,6 +240,7 @@ const startEdit = () => {
   height: 100%;
   position: relative;
   cursor: move;
+  line-height: 1.5;
 
   svg {
     transform-origin: 0 0;
@@ -264,6 +265,7 @@ const startEdit = () => {
   padding: 5px;
   word-break: break-word;
   pointer-events: none;
+  white-space: break-spaces;
 
   &.editable {
     pointer-events: all;

+ 2 - 2
src/views/components/element/TextElement/BaseTextElement.vue

@@ -77,7 +77,7 @@ const { shadowStyle } = useElementShadow(shadow)
 .element-content {
   position: relative;
   padding: 10px;
-  line-height: 1.15;
+  line-height: 1.5;
   word-break: break-word;
 
   .text {
@@ -101,7 +101,7 @@ const { shadowStyle } = useElementShadow(shadow)
   flex-direction: column;
   word-break: break-word;
   pointer-events: none;
-
+  white-space: break-spaces;
   &.editable {
     pointer-events: all;
   }

+ 2 - 2
src/views/components/element/TextElement/index.vue

@@ -195,7 +195,7 @@ watch(isHandleElement, () => {
 .element-content {
   position: relative;
   padding: 10px;
-  line-height: 1.15;
+  line-height: 1.5;
   word-break: break-word;
   cursor: move;
 
@@ -233,7 +233,7 @@ watch(isHandleElement, () => {
   flex-direction: column;
   word-break: break-word;
   pointer-events: none;
-
+  white-space: break-spaces;
   &.editable {
     pointer-events: all;
   }