zydx-plus 1.32.286 → 1.32.287

package/package.json

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

package/src/components/dragPopup/src/dragPopup.vue

@@ -88,6 +88,14 @@ export default {
       type: Boolean,
       default: false
     },
+    minWidth: {
+      type: Number,
+      default: 300
+    },
+    minHeight: {
+      type: Number,
+      default: 200
+    },
   },
   beforeUnmount() {
     this.clean()
@@ -174,6 +182,12 @@ export default {
       } else if (this.direction === 'r') {
         this.footRightOffset = event.clientX - this.x;
       }
+      if(this.footRightOffset < this.minWidth) {
+        this.footRightOffset = this.minWidth
+      }
+      if(this.footDownOffset < this.minHeight) {
+        this.footDownOffset = this.minHeight
+      }
       this.$emit('updateDrag', {
         width: this.footRightOffset,
         height: this.footDownOffset - ((this.dragTextShow)?60:30)

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

@@ -1,31 +1,39 @@
 <template>
-    <div class="docView">
-        <div>
-            <div class="book">
-                <div class="pages">
-                    <div class="wrap">
-                        <div class="wrap-one" :class="{'flip-animation-start': flipRights, 'flip-animation-end': flipLefts}" v-if="oneShow" :style="canvasStyle">
-                            <img :src="imgArr[(oneIndex === 'right')? pageIndex-1: pageIndex]" alt="" />
-                        </div>
-                        <div class="wrap-can">
-                            <canvas :id="id"></canvas>
-                        </div>
-                    </div>
-                    <div class="page-but-left" :style="{cursor: pageIndex === 1?'default':'pointer'}" @click="flipRight(pageIndex-=1,false)"></div>
-                    <div class="page-but-right" :style="{cursor: pageIndex === pdfPages?'default':'pointer'}" @click="flipLeft(pageIndex+=1,false)"></div>
-                </div>
+  <div class="docView" >
+    <div>
+      <div class="book">
+        <div class="pages">
+          <div class="wrap">
+            <div class="wrap-one" :class="{'flip-animation-start': flipRights, 'flip-animation-end': flipLefts}"
+                 v-if="oneShow" :style="canvasStyle">
+              <img :src="imgArr[(oneIndex === 'right')? pageIndex-1: pageIndex]" alt=""/>
             </div>
-            <div class="but-wrap" v-if="butShow">
-                <button class="but-brown" :disabled="pageIndex === 1" :class="{'but-act': pageIndex === 1}" @click="flipRight(pageIndex-=1,false)">上一页</button>
-                <button class="but-brown" :disabled="pageIndex === pdfPages" :class="{'but-act': pageIndex === pdfPages}" @click="flipLeft(pageIndex+=1,false)">下一页</button>
-            </div>
-        </div>
-        <div v-if="loading" class="loading-back">
-            <div class="loading-cont">
-                <div class="loadings">Loading</div>
+            <div class="wrap-can" ref="wrapCan">
+              <canvas @mousedown="mouseDown" @mousemove="mouseMove" :id="id"></canvas>
+<!--              <div class="cursor" :style="cursorRounded"></div>-->
             </div>
+          </div>
+          <div class="page-but-left" :style="{cursor: pageIndex === 1?'default':'pointer'}"
+               @click.stop="flipRight(pageIndex-=1,false)"></div>
+          <div class="page-but-right" :style="{cursor: pageIndex === pdfPages?'default':'pointer'}"
+               @click.stop="flipLeft(pageIndex+=1,false)"></div>
         </div>
+      </div>
+      <div class="but-wrap" v-if="butShow">
+        <button class="but-brown" :disabled="pageIndex === 1" :class="{'but-act': pageIndex === 1}"
+                @click.stop="flipRight(pageIndex-=1,false)">上一页
+        </button>
+        <button class="but-brown" :disabled="pageIndex === pdfPages" :class="{'but-act': pageIndex === pdfPages}"
+                @click.stop="flipLeft(pageIndex+=1,false)">下一页
+        </button>
+      </div>
     </div>
+    <div v-if="loading" class="loading-back">
+      <div class="loading-cont">
+        <div class="loadings">Loading</div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -33,321 +41,491 @@ 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/'
 export default {
-    name: "zydx-flip",
-    data() {
-        return {
-            pdfPages: 0,
-            imgArr: {},
-            hei: 0,
-            pageIndex: this.page,
-            show: false,
-            load: 0,
-            loadWidth: 0,
-            pages: false,
-            pagesData: [],
-            opacity: 1,
-            id: null,
-            loading: false,
-            canvasStyle: {},
-            oneShow: false,
-            flipRights: false,
-            flipLefts: false,
-            oneIndex: 'right'
-        }
+  name: "zydx-flip",
+  data() {
+    return {
+      pdfPages: 0,
+      imgArr: {},
+      hei: 0,
+      pageIndex: this.page,
+      show: false,
+      load: 0,
+      loadWidth: 0,
+      pages: false,
+      pagesData: [],
+      opacity: 1,
+      id: null,
+      loading: false,
+      canvasStyle: {},
+      oneShow: false,
+      flipRights: false,
+      flipLefts: false,
+      oneIndex: 'right',
+      scales: 1.35,
+      timer: null,
+      resultImg: '',
+      startX: 0,
+      startY: 0,
+      isDrawing: false,
+      sratio: 2,
+      ctx: null,
+      lineWidth: 2,
+      points: [],
+    }
+  },
+  props: {
+    source: {
+      type: String,
+      default: ''
+    },
+    singlePage: {
+      type: Boolean,
+      default: false
+    },
+    butShow: {
+      type: Boolean,
+      default: true
+    },
+    page: {
+      type: Number,
+      default: 1
     },
-    props: {
-        source: {
-            type: String,
-            default: ''
-        },
-        singlePage: {
-            type: Boolean,
-            default: false
-        },
-        butShow: {
-            type: Boolean,
-            default: true
-        },
-        page: {
-            type: Number,
-            default: 1
-        },
-        scale: {
-            type: Number,
-            default: 1.35
-        },
+    scale: {
+      type: Number,
+      default: 1.35
     },
-    watch: {
-        page: {
-            handler: function (val, oldVal) {
-                this.pageIndex = val
-            },
-            immediate: true
-        },
-        source: {
-            handler: function (val, oldVal) {
-                this.readPdf()
-            },
-            deep: true,
-            immediate: true
+    scaleStyle: {
+      type: Object,
+      default: () => {}
+    },
+    pointsData: {
+      type: Array,
+      default: () => []
+    }
+  },
+  watch: {
+    pointsData: {
+      handler: function (val) {
+        if(!val) return
+        this.points = val
+      },
+      immediate: true
+    },
+    page: {
+      handler: function (val) {
+        this.pageIndex = val
+      },
+      immediate: true
+    },
+    source: {
+      handler: function () {
+        this.readPdf()
+      },
+      deep: true,
+      immediate: true
+    },
+    scaleStyle: {
+      handler: function (val) {
+        if(!val) return
+        if (this.timer) {
+          clearTimeout(this.timer)
         }
+        this.timer = setTimeout(() => {
+          this.scales = val.width / 550
+          if(this.scales >= this.scale) {
+            this.scales = this.scale
+          }
+          this.readPdf(1)
+        }, 200)
+      },
+      deep: true
+    }
+  },
+  emits: ['flip','updateData'],
+  mounted() {
+    this.id = 'canvas-wrap' + Math.random().toString(36).substr(2)
+    // 在画板以外松开鼠标后冻结画笔
+    document.onmouseup = () => {
+      this.mouseUp()
+    }
+  },
+  methods: {
+    mouseDown (e) {
+      e = e || event
+      e.preventDefault()
+      this.isDrawing = true
+      let obj = {
+        x: e.offsetX*this.sratio,
+        y: e.offsetY*this.sratio
+      }
+      this.drawStart(obj)
     },
-    emits: ['flip'],
-    mounted() {
-        this.id = 'canvas-wrap' + Math.random().toString(36).substr(2)
+    mouseMove (e) {
+      e = e || event
+      e.preventDefault()
+      if (this.isDrawing) {
+        let obj = {
+          x: e.offsetX*this.sratio,
+          y: e.offsetY*this.sratio
+        }
+        this.drawMove(obj)
+      }
     },
-    methods: {
-        flipLeft(e,v) {
-            if(e > this.pdfPages) {
-                this.pageIndex = this.pdfPages
-                return
-            }else {
-                this.pageIndex = e
-            }
-            this.oneIndex = 'right'
-            this.readPdf()
-            if(!v) {
-                this.$emit('flip', {
-                    page: this.pageIndex,
-                    total: this.pdfPages
-                })
-            }
-        },
-        flipRight(e,v) {
-            if(e < 1) {
-                this.pageIndex = 1
-                return
-            }else {
-                this.pageIndex = e
-            }
-            this.oneIndex = 'left'
-            this.readPdf()
-            if(!v) {
-                this.$emit('flip', {
-                    page: this.pageIndex,
-                    total: this.pdfPages
-                })
-            }
-        },
-        readPdf() {
-            if(this.source === '' || this.source === undefined || this.source === null) return
-            let that = this
-            that.loading = true
-            if(that.imgArr[that.pageIndex - 1] !== undefined) {
-                that.oneShow = that.pageIndex !== 1
+    mouseUp (e) {
+      e = e || event
+      e.preventDefault()
+      let obj = {
+        x: e.offsetX*this.sratio,
+        y: e.offsetY*this.sratio
+      }
+      this.drawEnd(obj)
+      this.isDrawing = false
+    },
+    // 绘制
+    drawStart (obj) {
+      obj.index = this.pageIndex
+      obj.start = 'start'
+      this.startX = obj.x
+      this.startY = obj.y
+      this.ctx.beginPath()
+      this.ctx.moveTo(this.startX, this.startY)
+      this.ctx.lineTo(obj.x, obj.y)
+      this.ctx.lineCap = 'round'
+      this.ctx.lineJoin = 'round'
+      this.ctx.lineWidth = this.lineWidth * this.sratio
+      this.ctx.stroke()
+      this.ctx.closePath()
+      this.points.push(obj)
+    },
+    drawEnd (obj) {
+      obj.index = this.pageIndex
+      obj.start = 'end'
+      this.ctx.beginPath()
+      this.ctx.moveTo(this.startX, this.startY)
+      this.ctx.lineTo(obj.x, obj.y)
+      this.ctx.lineCap = 'round'
+      this.ctx.lineJoin = 'round'
+      this.ctx.stroke()
+      this.ctx.closePath()
+      this.points.push(obj)
+      this.$emit('updateData', this.points)
+    },
+    drawMove (obj) {
+      obj.index = this.pageIndex
+      obj.start = 'move'
+      this.ctx.beginPath()
+      this.ctx.moveTo(this.startX, this.startY)
+      this.ctx.lineTo(obj.x, obj.y)
+      this.ctx.strokeStyle = 'red'
+      this.ctx.lineWidth = this.lineWidth * this.sratio
+      this.ctx.lineCap = 'round'
+      this.ctx.lineJoin = 'round'
+      this.ctx.stroke()
+      this.ctx.closePath()
+      this.startY = obj.y
+      this.startX = obj.x
+      this.points.push(obj)
+    },
+    flipLeft(e, v) {
+      if (e > this.pdfPages) {
+        this.pageIndex = this.pdfPages
+        return
+      } else {
+        this.pageIndex = e
+      }
+      this.oneIndex = 'right'
+      this.readPdf()
+      if (!v) {
+        this.$emit('flip', {
+          page: this.pageIndex,
+          total: this.pdfPages
+        })
+      }
+    },
+    flipRight(e, v) {
+      if (e < 1) {
+        this.pageIndex = 1
+        return
+      } else {
+        this.pageIndex = e
+      }
+      this.oneIndex = 'left'
+      this.readPdf()
+      if (!v) {
+        this.$emit('flip', {
+          page: this.pageIndex,
+          total: this.pdfPages
+        })
+      }
+    },
+    readPdf(n) {
+      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
+      }
+      const loadingTask = PdfJs.getDocument({
+        url: this.source,
+        cMapUrl: jsdelivr,
+        cMapPacked: true
+      })
+      loadingTask.promise.then((pdf) => {
+        that.pdfPages = pdf.numPages // 获取pdf文件的总页数
+        pdf.getPage(that.pageIndex).then(function (page) {
+          let canvas = document.getElementById(that.id)
+          that.ctx = canvas.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'
+          that.canvasStyle = {
+            width: viewport.width + 'px',
+            height: viewport.height + 'px',
+            marginLeft: -(viewport.width / 2) + 'px'
+          }
+          let renderContext = {
+            canvasContext: that.ctx,
+            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] = canvas.toDataURL('image/jpeg', 1)
+            for(let i = 0; i < that.points.length; i++) {
+              if(that.points[i].index === that.pageIndex) {
+                that.ctx.beginPath()
+                that.ctx.moveTo(that.points[i].x,that.points[i].y)
+                if(that.points[i].start !== 'end') {
+                  that.ctx.lineTo(that.points[i+1].x, that.points[i+1].y)
+                }
+                that.ctx.strokeStyle = 'red'
+                that.ctx.lineCap = 'round'
+                that.ctx.lineJoin = 'round'
+                that.ctx.lineWidth = that.lineWidth * that.sratio
+                that.ctx.stroke()
+                that.ctx.closePath()
+              }
             }
-            const loadingTask = PdfJs.getDocument({
-                url: this.source,
-                cMapUrl: jsdelivr,
-                cMapPacked: true
-            })
-            loadingTask.promise.then((pdf) => {
-                that.pdfPages = pdf.numPages // 获取pdf文件的总页数
-                pdf.getPage(that.pageIndex).then(function (page) {
-                    let canvas = document.getElementById(that.id)
-                    let ctx = canvas.getContext('2d');
-                    let viewport = page.getViewport({scale: that.scale})
-                    canvas.width = viewport.width * 2
-                    canvas.height = viewport.height * 2
-                    canvas.style.width = viewport.width + 'px'
-                    canvas.style.height = viewport.height + 'px'
-                    that.canvasStyle = {
-                        width: viewport.width + 'px',
-                        height: viewport.height + 'px',
-                        marginLeft: -(viewport.width/2) + 'px'
-                    }
-                    let renderContext = {
-                        canvasContext: ctx,
-                        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] = canvas.toDataURL('image/jpeg', 1)
-                    }, 1000)
-                })
-            })
-        }
+          }, 1000)
+        })
+      })
     }
+  }
 }
 </script>
 
 <style scoped>
+.cursor{
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 9999;
+  width: 15px;
+  height: 15px;
+  margin-top: -7px;
+  margin-left: -7px;
+  cursor: none;
+  transition: all 0s ease-in-out;
+  background: url("data:image/png;base64,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") no-repeat 0 0;
+  background-size: 100% 100%;
+  user-select: none;
+}
 /*动画部分*/
 /*I'm the home page动画*/
 .flip-animation-start {
-    transform-origin: left center;
-    animation: flipBook1 1s forwards;
+  transform-origin: left center;
+  animation: flipBook1 1s forwards;
 }
+
 .flip-animation-end {
-    transform-origin: left center;
-    animation: flipBook2 1s forwards;
+  transform-origin: left center;
+  animation: flipBook2 1s forwards;
 }
+
 @keyframes flipBook1 {
-    0% {
-        transform: perspective(3000px) rotateY(0deg);
-        opacity: 1;
-    }
-    60%{
-        opacity: 1;
-    }
-    100% {
-        transform: perspective(3000px) rotateY(-160deg);
-        opacity: 0;
-    }
+  0% {
+    transform: perspective(3000px) rotateY(0deg);
+    opacity: 1;
+  }
+  60% {
+    opacity: 1;
+  }
+  100% {
+    transform: perspective(3000px) rotateY(-160deg);
+    opacity: 0;
+  }
 }
+
 /*关闭书页*/
 @keyframes flipBook2 {
-    0% {
-        transform: perspective(3000px) rotateY(-160deg);
-        opacity: 0;
-    }
-    30%{
-        opacity: 1;
-    }
-    70%{
-        opacity: 1;
-    }
-    100% {
-        transform: perspective(3000px) rotateY(0deg);
-        opacity: 0;
-    }
+  0% {
+    transform: perspective(3000px) rotateY(-160deg);
+    opacity: 0;
+  }
+  30% {
+    opacity: 1;
+  }
+  70% {
+    opacity: 1;
+  }
+  100% {
+    transform: perspective(3000px) rotateY(0deg);
+    opacity: 0;
+  }
 }
-.wrap-one{
-    position: absolute;
-    top: 0;
-    left: 50%;
-    right: 0;
-    bottom: 0;
-    z-index: 1;
+
+.wrap-one {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  right: 0;
+  bottom: 0;
+  z-index: 1;
 }
-.wrap-one img{
-    width: 100%;
-    height: 100%;
+
+.wrap-one img {
+  width: 100%;
+  height: 100%;
 }
-.wrap{
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    position: relative;
+
+.wrap {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  position: relative;
 }
-.wrap-can{
-    display: inline-block;
-    margin: 0 auto;
+
+.wrap-can {
+  display: inline-block;
+  margin: 0 auto;
+  //cursor: none;
 }
-.but-wrap{
-    text-align: center;
+
+.but-wrap {
+  text-align: center;
 }
-.pages{
-    width: 100%;
-    height: 100%;
-    position: relative;
+
+.pages {
+  width: 100%;
+  height: 100%;
+  position: relative;
 }
 
-.page-but-left{
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1;
-    width: 10%;
+.page-but-left {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+  width: 8%;
 }
-.page-but-right{
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    right: 0;
-    z-index: 1;
-    width: 10%;
+
+.page-but-right {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 1;
+  width: 8%;
 }
-.load>span{
-    display: inline-block;
-    width: 100%;
-    text-align: center;
-    padding-bottom: 10px;
-    font-size: 14px;
+
+.load > span {
+  display: inline-block;
+  width: 100%;
+  text-align: center;
+  padding-bottom: 10px;
+  font-size: 14px;
 }
-.docView{
-    height: 100%;
-    position: relative;
+
+.docView {
+  height: 100%;
+  position: relative;
 }
-.but-brown{
-    background-color: #c64c10;
-    padding: 0 20px;
-    font-size: 12px;
-    color: #fff;
-    height: 24px;
-    line-height: 24px;
-    border-radius: 5px;
-    border: 0;
-    cursor: pointer;
-    margin-left: 10px;
+
+.but-brown {
+  background-color: #c64c10;
+  padding: 0 20px;
+  font-size: 12px;
+  color: #fff;
+  height: 24px;
+  line-height: 24px;
+  border-radius: 5px;
+  border: 0;
+  cursor: pointer;
+  margin-left: 10px;
 }
-.book{
-    width: 100%;
-    height: 100%;
+
+.book {
+  width: 100%;
+  height: 100%;
 }
-.but-act{
-    background-color: #bbbbbb;
-    color: #fff;
+
+.but-act {
+  background-color: #bbbbbb;
+  color: #fff;
 }
-.loading-back{
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 100;
-    display: flex;
-    align-items: center;
+
+.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-cont {
+  display: inline-block;
+  margin: 0 auto;
 }
+
 .loadings {
-    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;
+  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;
 }
 
 .loadings::after {
-    content: "Loading";
-    position: absolute;
-    left: 0;
-    top: 0;
-    color: #ff3d00;
-    width: 0%;
-    height: 100%;
-    overflow: hidden;
-    animation: loading-animation 6s linear infinite;
+  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;
-    }
+  0% {
+    width: 0;
+  }
 
-    100% {
-        width: 100%;
-    }
+  100% {
+    width: 100%;
+  }
 }
 </style>

package/src/index.js

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