zydx-plus 1.32.298 → 1.32.300

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zydx-plus",
-  "version": "1.32.298",
+  "version": "1.32.300",
   "description": "Vue.js",
   "main": "src/index.js",
   "files": [

package/src/components/editor/src/butJson.js

@@ -9,13 +9,13 @@ export function butJson (editor,data) {
             menuKeys: []
         },
         titleMenu: {
-            name: '添加标题',
+            name: '字体',
             key: 'titleMenu',
             menuKeys: [
-                {name: '(中)黑体小4号', key: 'blackCenter4'},
-                {name: '(左)黑体小4号', key: 'blackLeft4'},
-                {name: '(中)黑体5号', key: 'blackCenter5'},
-                {name: '(左)黑体5号', key: 'blackLeft5'},
+                {name: '微软雅黑', key: 'Microsoft Yahei'},
+                {name: '楷体', key: 'Kaiti'},
+                {name: '仿宋', key: 'FangSong'},
+                {name: '黑体', key: 'SimHei'},
             ],
             html: {
                 blackCenter4: `<p data-signId="title-1" class="title ${randomId()}" style="text-align: center;"><span style="font-weight: 700;color: rgb(0, 0, 0);font-size: 16px;font-family: SimHei">${menusData(data,'titleMenu').text}</span></p>`,
@@ -25,17 +25,38 @@ export function butJson (editor,data) {
             }
         },
         textMenu: {
-            name: '添加正文',
+            name: '字号',
             key: 'textMenu',
             menuKeys: [
-                {name: '宋体5号', key: 'Song5'},
-                {name: '楷体5号', key: 'regular5'},
+                {name: '12', key: '12px'},
+                {name: '14', key: '14px'},
+                {name: '16', key: '16px'},
+                {name: '18', key: '18px'},
+                {name: '20', key: '20px'},
+                {name: '22', key: '22px'},
+                {name: '24', key: '24px'},
+                {name: '26', key: '26px'},
+                {name: '28', key: '28px'},
+                {name: '30', key: '30px'},
+                {name: '32', key: '32px'}
             ],
             html: {
                 Song5: `<p class="text" style="text-align: left;"><span style="color: rgb(0, 0, 0);font-size: 14px;font-family: SimSun">请输入正文</span></p>`,
                 regular5: `<p class="text" style="text-align: left;"><span style="color: rgb(0, 0, 0);font-size: 14px;font-family: KaiTi">请输入正文</span></p>`,
             }
         },
+        outlineMenu: {
+            name: '大纲级别',
+            key: 'outlineMenu',
+            menuKeys: [
+                {name: '一级标题', key: 'title-1'},
+                {name: '二级标题', key: 'title-2'},
+                {name: '三级标题', key: 'title-3'},
+                {name: '四级标题', key: 'title-4'},
+                {name: '正文文本', key: 'text'},
+            ],
+            html: {}
+        },
         redMenu: {
             name: '添加红头',
             key: 'redMenu',

package/src/components/editor/src/editor.vue

@@ -130,7 +130,8 @@ export default {
       menusStyle: {
         top: '0px',
         left: '0px'
-      }
+      },
+      menuStast: null
     }
   },
   props: {
@@ -236,7 +237,7 @@ export default {
         Superscript, // 上标
         titleId, // 标题id
         dataUrl,
-        BubbleMenu.configure({
+        BubbleMenu.configure({  // 气泡菜单
           element: document.querySelector('.menu'),
           shouldShow: ({editor, view, state, oldState, from, to}) => {
             _this.encIndex = state.selection.$from.parent.attrs
@@ -277,23 +278,66 @@ export default {
           HTMLAttributes: {
             class: 'editor-img'
           }
-        }),
+        })
       ],
-      injectCSS: true
-    })
-    document.addEventListener('keydown', function (e) {
-      if (e.keyCode === 13) {
-        // 禁止标题回车
-        const sid = _this.editor.state.selection.$anchor.path[3].attrs.signId
-        const ca = _this.editor.state.selection.$anchor.path[3].attrs.titleId
-        if (sid?.split('-')[0] === 'title') {
-          const json = _this.editor.getJSON()
-          for (let i = 0; i < json.content.length; i++) {
-            if (json.content[i].attrs?.titleId === ca) {
-              json.content.splice(i + 1, 1)
-              _this.editor?.commands.setContent(json)
-              break
+      injectCSS: true,
+      onBlur: () => {
+        _this.menuStast = null
+        _this.butDataName('outlineMenu','大纲级别')
+        _this.butDataName('textMenu','字号')
+        _this.butDataName('titleMenu','字体')
+      },
+      onTransaction: () => {
+        const index = _this.editor.state.selection.$anchor.path[1]
+        const json = _this.editor.getJSON()
+        for (let i = 0; i < json.content.length; i++) {
+          if(index === i) {
+            if(json.content[i].content === undefined) break
+            const attrs = json.content[i].attrs
+            if(attrs.titleId === 'text') {
+              _this.butDataName('正文文本')
             }
+            if(attrs.signId !== null) {
+              _this.butData.map(x => {
+                if(x.key === 'outlineMenu') {
+                  x.name = '大纲级别'
+                  if(attrs.signId === 'title-1') x.name = '一级标题'
+                  if(attrs.signId === 'title-2') x.name = '二级标题'
+                  if(attrs.signId === 'title-3') x.name = '三级标题'
+                  if(attrs.signId === 'title-4') x.name = '四级标题'
+                }
+              })
+            }
+            if(json.content[i].content[0].marks === undefined) break
+            const style = json.content[i].content[0].marks
+            style.forEach(x => {
+              if(x.type === 'textStyle') {
+                if(x.attrs.fontSize !== null) {
+                  if(_this.menuStast !== 'textMenu') {
+                    _this.butData.map(y => {
+                      if(y.key === 'textMenu') {
+                        y.name = '字号'
+                        y.name = '字号 ' + x.attrs.fontSize.replace(/px/g, '')
+                      }
+                    })
+                  }
+                }
+                if(x.attrs.fontFamily !== null) {
+                  if(_this.menuStast !== 'titleMenu') {
+                    _this.butData.map(y => {
+                      if(y.key === 'titleMenu') {
+                        y.name = '字体'
+                        if(x.attrs.fontFamily === 'Microsoft Yahei') y.name = '字体 雅黑'
+                        if(x.attrs.fontFamily  === 'Kaiti') y.name = '字体 楷体'
+                        if(x.attrs.fontFamily  === 'FangSong') y.name = '字体 仿宋'
+                        if(x.attrs.fontFamily === 'SimHei') y.name = '字体 黑体'
+                      }
+                    })
+                  }
+                }
+              }
+            })
+            break
           }
         }
       }
@@ -302,6 +346,11 @@ export default {
   },
   emits: ['confirm', 'enclosure', 'enlDownload', 'enlSee'],
   methods: {
+    butDataName(n,v) {
+      this.butData.map(x => {
+        if(x.key === n) x.name = v
+      })
+    },
     // 粘贴文本处理
     preventPaste(event) {
       const text = event.clipboardData.getData('text/plain');
@@ -790,13 +839,32 @@ export default {
       }
       // 标题
       if (data.key === 'titleMenu') {
-        const html = butJson(this.editor, this.menusText)[data.key].html[key.key]
-        this.editor.chain().focus().insertContentAt(this.selection(), html).run()
+        this.menuStast = 'titleMenu'
+        if(key.key === 'Microsoft Yahei') {
+          this.butDataName('titleMenu','字体 雅黑')
+        }else {
+          this.butDataName('titleMenu',`字体 ${key.name}`)
+        }
+        this.editor.commands.setFontFamily(key.key)
       }
       // 正文
       if (data.key === 'textMenu') {
-        const html = butJson(this.editor, this.menusText)[data.key].html[key.key]
-        this.editor.chain().focus().insertContentAt(this.selection(), html).run()
+        this.menuStast = 'textMenu'
+        this.butDataName('textMenu',`字号 ${key.name}`)
+        this.editor.commands.setFontSize(key.key)
+      }
+      // 大纲级别
+      if (data.key === 'outlineMenu') {
+        if (key.key === 'text') {
+          this.editor.commands.setTitleId(key.key)
+          this.editor.commands.unsetSignId()
+          this.editor.chain().focus().unsetBold().run()
+        }else {
+          const t = key.key.split('-')[0]
+          this.editor.commands.setSignId(key.key)
+          this.editor.commands.setTitleId(`${t} ${this.randomId()}`)
+          this.editor.chain().focus().setBold().run()
+        }
       }
       // 作者
       if (data.key === 'authorMenu') {
@@ -902,6 +970,9 @@ export default {
           this.imgPop = true
         }
       }
+      setTimeout(() => {
+        this.menuStast = null
+      },1000)
     },
     cursorPosition(data, index) {
       let num = 0
@@ -1135,7 +1206,7 @@ label {
 }
 
 .editing-cont :deep(p) {
-  line-height: 24px;
+  line-height: 1.7;
 }
 
 .editing-cont :deep(img) {

package/src/components/editor/src/extend/font-size.js

@@ -46,4 +46,4 @@ export const FontSize = Extension.create({
             },
         }
     },
-})
+})

package/src/components/editor/src/extend/sign-id.js

@@ -29,5 +29,15 @@ export const signId = Extension.create({
                 },
             },
         ]
-    }
-})
+    },
+    addCommands() {
+        return {
+            setSignId: (alignment) => ({ commands }) => {
+                return commands.updateAttributes('paragraph', { signId: alignment })
+            },
+            unsetSignId: () => ({ commands }) => {
+                return commands.resetAttributes('paragraph', 'signId')
+            },
+        }
+    },
+})

package/src/components/editor/src/extend/title-id.js

@@ -1,4 +1,4 @@
-import { Extension } from '@tiptap/core'
+import { Extension, nodeInputRule } from '@tiptap/core'
 
 export const titleId = Extension.create({
     name: 'titleId',
@@ -29,5 +29,15 @@ export const titleId = Extension.create({
                 },
             },
         ]
-    }
-})
+    },
+    addCommands() {
+        return {
+            setTitleId: (alignment) => ({ commands }) => {
+                return commands.updateAttributes('paragraph', { titleId: alignment })
+            },
+            unsetTitleId: () => ({ commands }) => {
+                return commands.resetAttributes('paragraph', 'titleId')
+            },
+        }
+    },
+})

package/src/components/flip/src/flip.vue

@@ -131,6 +131,8 @@ import * as PdfJs from 'pdfjs-dist/legacy/build/pdf.js' // 注意导入的写法
 PdfJs.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker.entry')
 const jsdelivr = '/zydx/static/cmaps/'
 
+let pdfs = null
+
 export default {
   name: "zydx-flip",
   data() {
@@ -188,7 +190,7 @@ export default {
       textHeight: 0,
       textDownX: 0,
       textDownY: 0,
-      textMoveStart: false,
+      textMoveStart: false
     }
   },
   props: {
@@ -241,7 +243,7 @@ export default {
     },
     source: {
       handler: function () {
-        this.readPdf()
+        this.sourceUrl()
       },
       deep: true,
       immediate: true
@@ -936,6 +938,7 @@ export default {
       }
     },
     flipLeft(e, v) {
+      console.log(e)
       if (e > this.pdfPages) {
         this.pageIndex = this.pdfPages
         return
@@ -952,6 +955,7 @@ export default {
       }
     },
     flipRight(e, v) {
+      console.log(e)
       if (e < 1) {
         this.pageIndex = 1
         return
@@ -967,65 +971,67 @@ export default {
         })
       }
     },
-    readPdf(n) {
-      this.mouse()
+    sourceUrl() {
       if (this.source === '' || this.source === undefined || this.source === null) return
       let that = this
-      if(n !== 1) that.loading = true
-      if (that.imgArr[that.pageIndex - 1] !== undefined) {
-        that.oneShow = that.pageIndex !== 1
-      }
+      that.loading = true
       const loadingTask = PdfJs.getDocument({
-        url: this.source,
+        url: that.source,
         cMapUrl: jsdelivr,
         cMapPacked: true
       })
       loadingTask.promise.then((pdf) => {
+        pdfs = pdf
         that.pdfPages = pdf.numPages // 获取pdf文件的总页数
-        pdf.getPage(that.pageIndex).then(function (page) {
-          let canvas = document.getElementById(that.id)
-          let canvas2 = document.getElementById(`${that.id}2`)
-          that.ctx = canvas.getContext('2d');
-          let ctx2 = canvas2.getContext('2d');
-          let viewport = page.getViewport({scale: that.scales})
-          canvas.width = viewport.width * that.sratio
-          canvas.height = viewport.height * that.sratio
-          canvas.style.width = viewport.width + 'px'
-          canvas.style.height = viewport.height + 'px'
-          canvas2.width = viewport.width * that.sratio
-          canvas2.height = viewport.height * that.sratio
-          canvas2.style.width = viewport.width + 'px'
-          canvas2.style.height = viewport.height + 'px'
-          that.canvasStyle = {
-            width: viewport.width + 'px',
-            height: viewport.height + 'px',
-            marginLeft: -(viewport.width / 2) + 'px',
-            widthCanvas: viewport.width * that.sratio,
-            heightCanvas: viewport.height * that.sratio
-          }
-          let renderContext = {
-            canvasContext: ctx2,
-            viewport: viewport,
-            transform: [2, 0, 0, 2, 0, 0] //这里会进行放大，解决模糊问题
-          }
-          page.render(renderContext)
-          that.loading = false
-          if (that.oneIndex === 'right') {
-            that.flipRights = true
-            that.flipLefts = false
-          } else {
-            that.flipRights = false
-            that.flipLefts = true
-          }
-          // 获取canvas的base64数据
-          setTimeout(() => {
-            that.flipRights = false
-            that.flipLefts = false
-            that.oneShow = false
-            that.imgArr[that.pageIndex] = canvas2.toDataURL('image/jpeg', 1)
-            that.processing()
-          }, 1000)
-        })
+        that.readPdf(pdf)
+      })
+    },
+    readPdf() {
+      let that = this
+      this.mouse()
+      pdfs.getPage(that.pageIndex).then(function (page) {
+        let canvas = document.getElementById(that.id)
+        let canvas2 = document.getElementById(`${that.id}2`)
+        that.ctx = canvas.getContext('2d');
+        let ctx2 = canvas2.getContext('2d');
+        let viewport = page.getViewport({scale: that.scales})
+        canvas.width = viewport.width * that.sratio
+        canvas.height = viewport.height * that.sratio
+        canvas.style.width = viewport.width + 'px'
+        canvas.style.height = viewport.height + 'px'
+        canvas2.width = viewport.width * that.sratio
+        canvas2.height = viewport.height * that.sratio
+        canvas2.style.width = viewport.width + 'px'
+        canvas2.style.height = viewport.height + 'px'
+        that.canvasStyle = {
+          width: viewport.width + 'px',
+          height: viewport.height + 'px',
+          marginLeft: -(viewport.width / 2) + 'px',
+          widthCanvas: viewport.width * that.sratio,
+          heightCanvas: viewport.height * that.sratio
+        }
+        let renderContext = {
+          canvasContext: ctx2,
+          viewport: viewport,
+          transform: [2, 0, 0, 2, 0, 0] //这里会进行放大，解决模糊问题
+        }
+        page.render(renderContext)
+        that.loading = false
+        if (that.oneIndex === 'right') {
+          that.flipRights = true
+          that.flipLefts = false
+        } else {
+          that.flipRights = false
+          that.flipLefts = true
+        }
+        // 获取canvas的base64数据
+        setTimeout(() => {
+          that.flipRights = false
+          that.flipLefts = false
+          that.oneShow = false
+          that.imgArr[that.pageIndex] = canvas2.toDataURL('image/jpeg', 1)
+          that.processing()
+        }, 1000)
       })
     }
   }
@@ -1251,7 +1257,7 @@ export default {
   display: inline-block;
   margin: 0 auto;
   position: relative;
-  //cursor: none;
+//cursor: none;
 }
 
 .but-wrap {

package/src/index.js

@@ -81,7 +81,7 @@ function install(app) {
 }
 
 export default {
-    version: '1.32.298',
+    version: '1.32.300',
     install,
     Calendar,
     Message,