zydx-plus 1.19.92 → 1.19.94

package/package.json

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

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

@@ -24,7 +24,7 @@
                 <p v-if="editorShow">附件列表：</p>
                 <div class="enclosure-list" v-for="(item,index) in uploadAttData">
                     <div class="enclosure-item">
-                        <span>{{ index + 1 }}. {{ (item.name)? item.name : item.fileName }}</span>
+                        <span>{{ index + 1 }}. {{ (item.name)? item.name : item.annexName }}</span>
                     </div>
                     <div class="enclosure-item en-but">
                         <div style="display: inline-block; height: 21px;">
@@ -73,6 +73,7 @@
     </div>
 </template>
 <script>
+
 import { html2json, json2html } from 'html2json'
 import { Editor, EditorContent } from '@tiptap/vue-3'
 import StarterKit from '@tiptap/starter-kit'
@@ -191,8 +192,16 @@ export default {
         del(index) {
             if(this.uploadAttData[index].name === undefined) {
                 this.uploadAttData[index].active = false
-                this.$emit('del', this.uploadAttData[index], () => {
-                    this.uploadAttData.splice(index, 1)
+                this.$emit('del', this.uploadAttData[index], (e) => {
+                    if(e === undefined) {
+                        this.uploadAttData.splice(index, 1)
+                    }else {
+                        if(e) {
+                            this.uploadAttData.splice(index, 1)
+                        }else {
+                            this.uploadAttData[index].active = true
+                        }
+                    }
                 })
             }else {
                 this.uploadAttData.splice(index, 1)

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

@@ -3,7 +3,11 @@
       <div style="height: 100%;">
           <div class="book">
               <div class="pages">
-                  <div class="wrap" id="canvas-wrap"></div>
+                  <div class="wrap" id="canvas-wrap">
+                      <div class="wrap-can">
+                          <canvas id="the-canvas"></canvas>
+                      </div>
+                  </div>
                   <div class="page-but-left" :style="{cursor: pageIndex === 1?'default':'pointer'}" @click="flipLeft(pageIndex-=1,false)"></div>
                   <div class="page-but-right" :style="{cursor: pageIndex === pdfPages?'default':'pointer'}" @click="flipRight(pageIndex+=1,false)"></div>
 <!--                  <div class="paper z-in" :class="{'data-right': pages}">-->
@@ -26,6 +30,7 @@
 
 <script>
 import * as PdfJs from 'pdfjs-dist/legacy/build/pdf.js' // 注意导入的写法
+import { TextLayerBuilder } from 'pdfjs-dist/web/pdf_viewer'
 PdfJs.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker.entry')
 export default {
   name: "zydx-flip",
@@ -108,19 +113,19 @@ export default {
           loadingTask.promise.then((pdf) => {
               that.pdfPages = pdf.numPages // 获取pdf文件的总页数
               pdf.getPage(that.pageIndex).then(function (page) {
+                  let canvas = document.getElementById('the-canvas')
+                  let ctx = canvas.getContext('2d');
                   let viewport = page.getViewport({scale: 1})
-                  document.getElementById('canvas-wrap').innerHTML = ''
-                  let container = document.createElement('div')
-                  container.style.width = viewport.width + 'px'
-                  container.style.height = viewport.height + 'px'
-                  container.style.margin = '0 auto'
-                  document.getElementById('canvas-wrap').appendChild(container)
-                  return page.getOperatorList().then(function(opList) {
-                      let svgGfx = new PdfJs.SVGGraphics(page.commonObjs, page.objs)
-                      return svgGfx.getSVG(opList, viewport).then(function(svg) {
-                          container.appendChild(svg)
-                      })
-                  })
+                  canvas.width = viewport.width * 2
+                  canvas.height = viewport.height * 2
+                  canvas.style.width = viewport.width + 'px'
+                  canvas.style.height = viewport.height + 'px'
+                  let renderContext = {
+                      canvasContext: ctx,
+                      viewport: viewport,
+                      transform: [2, 0, 0, 2, 0, 0]//这里会进行放大，解决模糊问题
+                  }
+                  page.render(renderContext)
               })
           })
       }
@@ -132,64 +137,21 @@ export default {
 .wrap{
     width: 100%;
     height: 100%;
+    display: flex;
+    align-items: center;
+}
+.wrap-can{
+    display: inline-block;
+    margin: 0 auto;
 }
 .but-wrap{
     text-align: center;
 }
-.z-in{
-    z-index: 2;
-}
-.z-in-ac{
-    z-index: 1;
-}
 .pages{
     width: 100%;
     height: 100%;
     position: relative;
 }
-.paper{
-    position: absolute;
-    right: 0;
-    transform-style: preserve-3d;
-    width: 100%;
-}
-.page{
-    position: absolute;
-    text-align: center;
-}
-.page img{
-    width: 100%;
-    height: 100%;
-}
-.data-right {
-    opacity: 1;
-    transform-origin: left center;
-    animation: flip-to-left 1.5s ease-in-out forwards;
-}
-.data-left{
-    right: auto;
-    left: 0;
-}
-@keyframes flip-to-left {
-    0% {
-        transform: perspective(3000px) rotateY(0);
-    }
-    95% {
-        transform: perspective(3000px) rotateY(-180deg);
-    }
-    100% {
-        transform: perspective(3000px) rotateY(-180deg);
-    }
-}
-.page-1-back, .page-2-back {
-    transform: scale(-1, 1);
-}
-.page-1, .page-2 {
-    transform: translateZ(1px);
-}
-
-
-
 
 .page-but-left{
     position: absolute;

package/src/components/read/src/read.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="read">
-      <vue-office-docx v-if="fileType === 'docx'" :src="url" style="height: 100%;" />
-      <vue-office-excel v-if="fileType === 'xlsx' || fileType === 'xls'" :src="url" style="height: 100%;" />
+      <vue-office-docx v-if="fileType === 'docx'" :src="url" style="height: 100%;" @rendered="renderedHandler" />
+      <vue-office-excel v-if="fileType === 'xlsx'" :src="url" style="height: 100%;" @rendered="renderedHandler" />
       <div class="view-pdf" v-if="fileType === 'pdf'" id="canvas-wrap"></div>
       <div class="mp4" v-if="fileType === 'mp4'">
           <video :src="url" controls></video>
@@ -9,6 +9,11 @@
       <div class="mp3" v-if="fileType === 'mp3'">
           <audio :src="url" controls></audio>
       </div>
+      <div v-if="loading" class="loading-back">
+          <div class="loading-cont">
+              <div class="loading">Loading</div>
+          </div>
+      </div>
   </div>
 </template>
 
@@ -32,7 +37,9 @@ export default {
             PdfJs: null,
             svgArr: [],
             container: null,
-            pdfPages: 0
+            pdfPages: 0,
+            loading: true,
+            repeat: false,
         }
     },
     props: {
@@ -44,17 +51,28 @@ export default {
     watch: {
         url: {
             handler: function (val, oldVal) {
-                this.fileType = val.split('.').pop()
-                if(this.fileType === 'pdf') this.init()
+                this.repeatInit()
             },
             immediate: true
         }
     },
     mounted() {
-        this.fileType = this.url.split('.').pop()
-        if(this.fileType === 'pdf') this.init()
+        this.repeatInit()
     },
     methods: {
+        repeatInit() {
+            if(this.repeat) return // 防止重复加载
+            this.repeat = true
+            this.loading = true
+            this.fileType = this.url.split('.').pop()
+            if(this.fileType === 'pdf') this.init()
+            setTimeout(() => {
+                this.repeat = false
+            },1000)
+        },
+        renderedHandler() {
+            this.loading = false
+        },
         init() {
             let that = this
             const loadingTask = PdfJs.getDocument(this.url)
@@ -106,6 +124,7 @@ export default {
                 document.getElementById('canvas-wrap').appendChild(container)
                 container.appendChild(x.data)
             })
+            this.renderedHandler()
         },
     }
 }
@@ -130,6 +149,7 @@ export default {
 .read{
     width: 100%;
     height: 100%;
+    position: relative;
 }
 :deep(.vue-office-docx)::-webkit-scrollbar {
     width: 0
@@ -137,4 +157,50 @@ export default {
 :deep(.docx-wrapper) {
     background-color: #fff;
 }
+.loading-back{
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 100;
+    display: flex;
+    align-items: center;
+}
+.loading-cont{
+    display: inline-block;
+    margin: 0 auto;
+}
+.loading {
+    display: inline-block;
+    font-size: 28px;
+    font-family: Arial, Helvetica, sans-serif;
+    font-weight: bold;
+    color: #fff;
+    text-shadow: 0 0 2px #ff3d00, 0 0 1px #ff3d00, 0 0 1px #ff3d00;
+    letter-spacing: 2px;
+    position: relative;
+}
+
+.loading::after {
+    content: "Loading";
+    position: absolute;
+    left: 0;
+    top: 0;
+    color: #ff3d00;
+    width: 0%;
+    height: 100%;
+    overflow: hidden;
+    animation: loading-animation 6s linear infinite;
+}
+
+@keyframes loading-animation {
+    0% {
+        width: 0%;
+    }
+
+    100% {
+        width: 100%;
+    }
+}
 </style>

package/src/components/tab/src/tab.vue

@@ -35,6 +35,15 @@ export default {
       default: () => ['name']
     },
   },
+    watch: {
+        active(val) {
+            this.list.forEach((item, index) => {
+                if (item[this.activeId] === val) {
+                    this.actives = index
+                }
+            })
+        }
+    },
     mounted() {
       if (this.activeId) {
         this.list.forEach((item, index) => {

package/src/index.js

@@ -57,7 +57,7 @@ function install(app) {
 }
 
 export default {
-    version: '1.19.92',
+    version: '1.19.94',
     install,
     Calendar,
     Message,