diff --git a/index.html b/index.html index ca1be688..de4f8267 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -
基于 Vue 3.x + TypeScript 的在线演示文稿应用
",rotate:0,defaultFontName:"Microsoft Yahei",defaultColor:"#333"},{type:"line",id:"FnpZs4",left:361,top:238,start:[0,0],end:[549,0],points:["",""],color:"#5b9bd5",style:"solid",width:2}],background:{type:"solid",color:"#ffffff"}}],S={themeColor:"#5b9bd5",fontColor:"#333",fontName:"Microsoft Yahei",backgroundColor:"#fff"},C=n("5530"),N=n("b85c"),x=(n("b0c0"),n("1913"),function(e,t){return Array.isArray(e)&&e.indexOf(t.type)>-1||t.type===e}),T=function(e,t){for(var n=e.depth;n>0;n--){var o=e.node(n);if(t(o))return{pos:n>0?e.before(n):0,start:e.start(n),depth:n,node:o}}},L=function(e){return function(t){return T(t.$from,e)}},w=function(e){return function(t){return L((function(t){return x(e,t)}))(t)}},V=function(e,t){var n=t.schema.nodes[e];return!!w(n)(t.selection)},_=function(e){var t,n,o=e.state,c=o.selection,a=o.doc,r=c.from,l=a.nodeAt(r)||a.nodeAt(r-1);return null!==(t=l)&&void 0!==t&&t.lastChild&&(l=l.lastChild),(null===(n=l)||void 0===n?void 0:n.marks)||[]},B=function(e,t,n){var o,c=Object(N["a"])(e);try{for(c.s();!(o=c.n()).done;){var a=o.value;if(a.type.name===t&&a.attrs[n])return a.attrs[n]}}catch(r){c.e(r)}finally{c.f()}return null},D=function(e,t){var n,o=Object(N["a"])(e);try{for(o.s();!(n=o.n()).done;){var c=n.value;if(c.type.name===t)return!0}}catch(a){o.e(a)}finally{o.f()}return!1},M=function(e,t){var n=e.state,o=n.selection,c=n.doc,a=o.from,r=o.to,l=!0,i="";return c.nodesBetween(a,r,(function(e){return l&&e.attrs[t]&&(l=!1,i=e.attrs[t]),l})),i},A={color:"#000",backcolor:"#000",fontsize:"20px",fontname:"微软雅黑",align:"left"},P=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};t=Object(C["a"])(Object(C["a"])({},A),t);var n=_(e),o=D(n,"strong"),c=D(n,"em"),a=D(n,"underline"),r=D(n,"strikethrough"),l=D(n,"superscript"),i=D(n,"subscript"),u=D(n,"code"),d=B(n,"forecolor","color")||t.color,s=B(n,"backcolor","backcolor")||t.backcolor,f=B(n,"fontsize","fontsize")||t.fontsize,p=B(n,"fontname","fontname")||t.fontname,b=M(e,"align")||t.align,m=V("bullet_list",e.state),v=V("ordered_list",e.state),O=V("blockquote",e.state);return{bold:o,em:c,underline:a,strikethrough:r,superscript:l,subscript:i,code:u,color:d,backcolor:s,fontsize:f,fontname:p,align:b,bulletList:m,orderedList:v,blockquote:O}},R={bold:!1,em:!1,underline:!1,strikethrough:!1,superscript:!1,subscript:!1,code:!1,color:"#000",backcolor:"#000",fontsize:"20px",fontname:"微软雅黑",align:"left",bulletList:!1,orderedList:!1,blockquote:!1},F={activeElementIdList:[],handleElementId:"",activeGroupElementId:"",canvasPercentage:90,canvasScale:1,thumbnailsFocus:!1,editorAreaFocus:!1,disableHotkeys:!1,showGridLines:!1,creatingElement:null,availableFonts:[],toolbarState:"slideStyle",viewportRatio:.5625,theme:S,slides:I,slideIndex:0,selectedSlidesIndex:[],snapshotCursor:-1,snapshotLength:0,ctrlKeyState:!1,shiftKeyState:!1,screening:!1,clipingImageElementId:"",richTextAttrs:R,selectedTableCells:[],isScaling:!1},H=(n("d81d"),n("4de4"),n("caad"),n("2532"),n("7db0"),{currentSlide:function(e){return e.slides[e.slideIndex]||null},currentSlideAnimations:function(e){var t=e.slides[e.slideIndex];if(!t)return null;var n=t.animations;if(!n)return null;var o=t.elements,c=o.map((function(e){return e.id}));return n.filter((function(e){return c.includes(e.elId)}))},activeElementList:function(e){var t=e.slides[e.slideIndex];return t&&t.elements?t.elements.filter((function(t){return e.activeElementIdList.includes(t.id)})):[]},handleElement:function(e){var t=e.slides[e.slideIndex];return t&&t.elements&&t.elements.find((function(t){return e.handleElementId===t.id}))||null},canUndo:function(e){return e.snapshotCursor>0},canRedo:function(e){return e.snapshotCursorPPTIST
',\n rotate: 0,\n defaultFontName: 'Microsoft Yahei',\n defaultColor: '#333'\n },\n {\n type: 'text',\n id: '7stmVP',\n left: 355,\n top: 253.25,\n width: 585,\n height: 56,\n content: '基于 Vue 3.x + TypeScript 的在线演示文稿应用
',\n rotate: 0,\n defaultFontName: 'Microsoft Yahei',\n defaultColor: '#333'\n },\n {\n type: 'line',\n id: 'FnpZs4',\n left: 361,\n top: 238,\n start: [0, 0],\n end: [549, 0],\n points: ['', ''],\n color: '#5b9bd5',\n style: 'solid',\n width: 2,\n },\n ],\n background: {\n type: 'solid',\n color: '#ffffff',\n },\n }\n]","import { SlideTheme } from '@/types/slides'\n\nexport const theme: SlideTheme = {\n themeColor: '#5b9bd5',\n fontColor: '#333',\n fontName: 'Microsoft Yahei',\n backgroundColor: '#fff',\n}","import { Node, NodeType, ResolvedPos, Mark } from 'prosemirror-model'\nimport { EditorState, Selection } from 'prosemirror-state'\nimport { EditorView } from 'prosemirror-view'\n\nconst equalNodeType = (nodeType: NodeType, node: Node) => {\n return Array.isArray(nodeType) && nodeType.indexOf(node.type) > -1 || node.type === nodeType\n}\n\nconst findParentNodeClosestToPos = ($pos: ResolvedPos, predicate: (node: Node) => boolean) => {\n for (let i = $pos.depth; i > 0; i--) {\n const node = $pos.node(i)\n if (predicate(node)) {\n return {\n pos: i > 0 ? $pos.before(i) : 0,\n start: $pos.start(i),\n depth: i,\n node,\n }\n }\n }\n}\n\nexport const findParentNode = (predicate: (node: Node) => boolean) => {\n return (_ref: Selection) => findParentNodeClosestToPos(_ref.$from, predicate)\n}\n\nexport const findParentNodeOfType = (nodeType: NodeType) => {\n return (selection: Selection) => {\n return findParentNode((node: Node) => {\n return equalNodeType(nodeType, node)\n })(selection)\n }\n}\n\nexport const isActiveOfParentNodeType = (nodeType: string, state: EditorState) => {\n const node = state.schema.nodes[nodeType]\n return !!findParentNodeOfType(node)(state.selection)\n}\n\nexport const getMarkAttrs = (view: EditorView) => {\n const { selection, doc } = view.state\n const { from } = selection\n\n let node = doc.nodeAt(from) || doc.nodeAt(from - 1)\n if (node?.lastChild) node = node.lastChild\n\n return node?.marks || []\n}\n\nexport const getAttrValue = (marks: Mark[], markType: string, attr: string) => {\n for (const mark of marks) {\n if (mark.type.name === markType && mark.attrs[attr]) return mark.attrs[attr]\n }\n return null\n}\n\nexport const isActiveMark = (marks: Mark[], markType: string) => {\n for (const mark of marks) {\n if (mark.type.name === markType) return true\n }\n return false\n}\n\nexport const getAttrValueInSelection = (view: EditorView, attr: string) => {\n const { selection, doc } = view.state\n const { from, to } = selection\n\n let keepChecking = true\n let value = ''\n doc.nodesBetween(from, to, node => {\n if (keepChecking && node.attrs[attr]) {\n keepChecking = false\n value = node.attrs[attr]\n }\n return keepChecking\n })\n return value\n}\n\ninterface DefaultAttrs {\n color?: string;\n backcolor?: string;\n fontsize?: string;\n fontname?: string;\n align?: string;\n}\nconst _defaultAttrs: DefaultAttrs = {\n color: '#000',\n backcolor: '#000',\n fontsize: '20px',\n fontname: '微软雅黑',\n align: 'left',\n}\nexport const getTextAttrs = (view: EditorView, defaultAttrs: DefaultAttrs = {}) => {\n defaultAttrs = { ..._defaultAttrs, ...defaultAttrs }\n\n const marks = getMarkAttrs(view)\n\n const isBold = isActiveMark(marks, 'strong')\n const isEm = isActiveMark(marks, 'em')\n const isUnderline = isActiveMark(marks, 'underline')\n const isStrikethrough = isActiveMark(marks, 'strikethrough')\n const isSuperscript = isActiveMark(marks, 'superscript')\n const isSubscript = isActiveMark(marks, 'subscript')\n const isCode = isActiveMark(marks, 'code')\n const color = getAttrValue(marks, 'forecolor', 'color') || defaultAttrs.color\n const backcolor = getAttrValue(marks, 'backcolor', 'backcolor') || defaultAttrs.backcolor\n const fontsize = getAttrValue(marks, 'fontsize', 'fontsize') || defaultAttrs.fontsize\n const fontname = getAttrValue(marks, 'fontname', 'fontname') || defaultAttrs.fontname\n const align = getAttrValueInSelection(view, 'align') || defaultAttrs.align\n const isBulletList = isActiveOfParentNodeType('bullet_list', view.state)\n const isOrderedList = isActiveOfParentNodeType('ordered_list', view.state)\n const isBlockquote = isActiveOfParentNodeType('blockquote', view.state)\n\n return {\n bold: isBold,\n em: isEm,\n underline: isUnderline,\n strikethrough: isStrikethrough,\n superscript: isSuperscript,\n subscript: isSubscript,\n code: isCode,\n color: color,\n backcolor: backcolor,\n fontsize: fontsize,\n fontname: fontname,\n align: align,\n bulletList: isBulletList,\n orderedList: isOrderedList,\n blockquote: isBlockquote,\n }\n}\n\nexport type TextAttrs = ReturnType{{slides}}\n
1,\n 'active': activedCell === `${rowIndex}_${colIndex}`,\n }\"\n :style=\"{\n borderStyle: outline.style,\n borderColor: outline.color,\n borderWidth: outline.width + 'px',\n ...getTextStyle(cell.style),\n }\"\n v-for=\"(cell, colIndex) in rowCells\"\n :key=\"cell.id\"\n :rowspan=\"cell.rowspan\"\n :colspan=\"cell.colspan\"\n :data-cell-index=\"`${rowIndex}_${colIndex}`\"\n v-show=\"!hideCells.includes(`${rowIndex}_${colIndex}`)\"\n @mousedown=\"$event => handleCellMousedown($event, rowIndex, colIndex)\"\n @mouseenter=\"handleCellMouseenter(rowIndex, colIndex)\"\n v-contextmenu=\"el => contextmenus(el)\"\n >\n | \n
\n \n | \n
\n \n | \n
\n \n | \n
基于 Vue 3.x + TypeScript 的在线演示文稿应用
",rotate:0,defaultFontName:"Microsoft Yahei",defaultColor:"#333"},{type:"line",id:"FnpZs4",left:361,top:238,start:[0,0],end:[549,0],points:["",""],color:"#5b9bd5",style:"solid",width:2}],background:{type:"solid",color:"#ffffff"}}],S={themeColor:"#5b9bd5",fontColor:"#333",fontName:"Microsoft Yahei",backgroundColor:"#fff"},C=n("5530"),N=n("b85c"),x=(n("b0c0"),n("1913"),function(e,t){return Array.isArray(e)&&e.indexOf(t.type)>-1||t.type===e}),T=function(e,t){for(var n=e.depth;n>0;n--){var o=e.node(n);if(t(o))return{pos:n>0?e.before(n):0,start:e.start(n),depth:n,node:o}}},L=function(e){return function(t){return T(t.$from,e)}},w=function(e){return function(t){return L((function(t){return x(e,t)}))(t)}},V=function(e,t){var n=t.schema.nodes[e];return!!w(n)(t.selection)},_=function(e){var t,n,o=e.state,c=o.selection,a=o.doc,r=c.from,l=a.nodeAt(r)||a.nodeAt(r-1);return null!==(t=l)&&void 0!==t&&t.lastChild&&(l=l.lastChild),(null===(n=l)||void 0===n?void 0:n.marks)||[]},B=function(e,t,n){var o,c=Object(N["a"])(e);try{for(c.s();!(o=c.n()).done;){var a=o.value;if(a.type.name===t&&a.attrs[n])return a.attrs[n]}}catch(r){c.e(r)}finally{c.f()}return null},D=function(e,t){var n,o=Object(N["a"])(e);try{for(o.s();!(n=o.n()).done;){var c=n.value;if(c.type.name===t)return!0}}catch(a){o.e(a)}finally{o.f()}return!1},M=function(e,t){var n=e.state,o=n.selection,c=n.doc,a=o.from,r=o.to,l=!0,i="";return c.nodesBetween(a,r,(function(e){return l&&e.attrs[t]&&(l=!1,i=e.attrs[t]),l})),i},A={color:"#000",backcolor:"#000",fontsize:"20px",fontname:"微软雅黑",align:"left"},P=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};t=Object(C["a"])(Object(C["a"])({},A),t);var n=_(e),o=D(n,"strong"),c=D(n,"em"),a=D(n,"underline"),r=D(n,"strikethrough"),l=D(n,"superscript"),i=D(n,"subscript"),u=D(n,"code"),d=B(n,"forecolor","color")||t.color,s=B(n,"backcolor","backcolor")||t.backcolor,f=B(n,"fontsize","fontsize")||t.fontsize,p=B(n,"fontname","fontname")||t.fontname,b=M(e,"align")||t.align,m=V("bullet_list",e.state),v=V("ordered_list",e.state),O=V("blockquote",e.state);return{bold:o,em:c,underline:a,strikethrough:r,superscript:l,subscript:i,code:u,color:d,backcolor:s,fontsize:f,fontname:p,align:b,bulletList:m,orderedList:v,blockquote:O}},R={bold:!1,em:!1,underline:!1,strikethrough:!1,superscript:!1,subscript:!1,code:!1,color:"#000",backcolor:"#000",fontsize:"20px",fontname:"微软雅黑",align:"left",bulletList:!1,orderedList:!1,blockquote:!1},F={activeElementIdList:[],handleElementId:"",activeGroupElementId:"",canvasPercentage:90,canvasScale:1,thumbnailsFocus:!1,editorAreaFocus:!1,disableHotkeys:!1,showGridLines:!1,creatingElement:null,availableFonts:[],toolbarState:"slideStyle",viewportRatio:.5625,theme:S,slides:I,slideIndex:0,selectedSlidesIndex:[],snapshotCursor:-1,snapshotLength:0,ctrlKeyState:!1,shiftKeyState:!1,screening:!1,clipingImageElementId:"",richTextAttrs:R,selectedTableCells:[],isScaling:!1},H=(n("d81d"),n("4de4"),n("caad"),n("2532"),n("7db0"),{currentSlide:function(e){return e.slides[e.slideIndex]||null},currentSlideAnimations:function(e){var t=e.slides[e.slideIndex];if(!t)return null;var n=t.animations;if(!n)return null;var o=t.elements,c=o.map((function(e){return e.id}));return n.filter((function(e){return c.includes(e.elId)}))},activeElementList:function(e){var t=e.slides[e.slideIndex];return t&&t.elements?t.elements.filter((function(t){return e.activeElementIdList.includes(t.id)})):[]},handleElement:function(e){var t=e.slides[e.slideIndex];return t&&t.elements&&t.elements.find((function(t){return e.handleElementId===t.id}))||null},canUndo:function(e){return e.snapshotCursor>0},canRedo:function(e){return e.snapshotCursor