zydx-plus 1.7.26 → 1.7.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zydx-plus",
3
- "version": "1.7.26",
3
+ "version": "1.7.28",
4
4
  "description": "Vue.js",
5
5
  "main": "src/index.js",
6
6
  "files": [
@@ -19,10 +19,6 @@
19
19
  ],
20
20
  "license": "MIT",
21
21
  "author": "",
22
- "dependencies": {
23
- "pdfjs-dist": "^3.4.120",
24
- "flipbook-vue": "^1.0.0-beta.4"
25
- },
26
22
  "peerDependencies": {
27
23
  "vue": "^3.2.13",
28
24
  "vue-draggable-next": "^2.1.1"
package/src/index.js CHANGED
@@ -11,7 +11,6 @@ import Table from './components/data_table/index';
11
11
  import buttonGroup from './components/buttonGroup/index';
12
12
  import spinner from './components/spinner/index';
13
13
  import treeList from './components/treeList/index';
14
- import flip from './components/flip/index';
15
14
 
16
15
  const components = [
17
16
  Calendar,
@@ -24,8 +23,7 @@ const components = [
24
23
  Year,
25
24
  Table,
26
25
  buttonGroup,
27
- treeList,
28
- flip
26
+ treeList
29
27
  ];
30
28
 
31
29
  function install(app) {
@@ -37,7 +35,7 @@ function install(app) {
37
35
  }
38
36
 
39
37
  export default {
40
- version: '1.7.25',
38
+ version: '1.7.28',
41
39
  install,
42
40
  Calendar,
43
41
  Message,
@@ -51,7 +49,6 @@ export default {
51
49
  Year,
52
50
  Table,
53
51
  buttonGroup,
54
- treeList,
55
- flip
52
+ treeList
56
53
  };
57
54
 
@@ -1,6 +0,0 @@
1
- import main from './src/flip';
2
-
3
- main.install = function(Vue) {
4
- Vue.component(main.name, main);
5
- };
6
- export default main;
@@ -1,134 +0,0 @@
1
- <template>
2
- <div id="docView">
3
- <div class="pdf-container">
4
- <canvas :id="'pdf-canvas'+ index" v-for="(item,index) in pdfPages" class="pdf-canvas"></canvas>
5
- </div>
6
- <div class="book">
7
- <flipbook class="flipbook" :pages="imgArr" @flip-left-end="flipLeft" @flip-right-end="flipRight" v-slot="flipbook" :singlePage="singlePage" :ambient="0" :gloss="1" :dragToFlip="false" :pagesHiRes="0">
8
- <div class="but">
9
- <button class="but-brown" @click="flipbook.flipLeft">上一页</button>
10
- <button class="but-brown" @click="flipbook.flipRight">下一页</button>
11
- </div>
12
- </flipbook>
13
- </div>
14
- </div>
15
- </template>
16
-
17
- <script>
18
- import flipbook from 'flipbook-vue'
19
- import * as PdfJs from 'pdfjs-dist/legacy/build/pdf.js' // 注意导入的写法
20
- PdfJs.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker.entry')
21
- export default {
22
- name: "zydx-flip",
23
- components: {flipbook},
24
- data() {
25
- return {
26
- pdfPages: 0,
27
- imgArr: [],
28
- hei: 0
29
- }
30
- },
31
- props: {
32
- source: {
33
- type: String,
34
- default: ''
35
- },
36
- singlePage: {
37
- type: Boolean,
38
- default: false
39
- },
40
- },
41
- mounted() {
42
- this.$nextTick(() => {
43
- this.readPdf()
44
- })
45
- },
46
- methods: {
47
- flipLeft(e) {
48
- this.$emit('flip',e)
49
- },
50
- flipRight(e) {
51
- this.$emit('flip',e)
52
- },
53
- readPdf() {
54
- let that = this
55
- const loadingTask = PdfJs.getDocument(this.source)
56
- loadingTask.promise.then((pdf) => {
57
- that.pdfPages = pdf.numPages // 获取pdf文件的总页数
58
- for(let i=0; i<that.pdfPages; i++) {
59
- pdf.getPage(i+1).then(function(page) {
60
- const canvas = document.getElementById('pdf-canvas' + i)
61
- const ctx = canvas.getContext('2d')
62
- const dpr = window.devicePixelRatio || 1
63
- const bsr = ctx.webkitBackingStorePixelRatio || ctx.mozBackingStorePixelRatio || ctx.msBackingStorePixelRatio || ctx.oBackingStorePixelRatio || ctx.backingStorePixelRatio || 1
64
- const ratio = dpr / bsr
65
- const viewport = page.getViewport({ scale: 1 })
66
- canvas.width = viewport.width * ratio
67
- canvas.height = viewport.height * ratio
68
- canvas.style.width = viewport.width + 'px'
69
- canvas.style.height = viewport.height + 'px'
70
- ctx.setTransform(ratio, 0, 0, ratio, 0, 0)
71
- const renderContext = {
72
- canvasContext: ctx,
73
- viewport: viewport
74
- }
75
- page.render(renderContext)
76
- });
77
- }
78
- setTimeout(() => {
79
- for(let i=0; i<that.pdfPages; i++) {
80
- const canvas = document.getElementById('pdf-canvas' + i)
81
- const dataURL = canvas.toDataURL("image/jpeg",1); //获取Base64编码
82
- that.imgArr.push(dataURL)
83
- }
84
- },0)
85
- })
86
- }
87
- }
88
- }
89
- </script>
90
-
91
- <style scoped>
92
- #docView{
93
- height: 100%;
94
- }
95
- .but-brown{
96
- background-color: #c64c10;
97
- padding: 0 20px;
98
- font-size: 12px;
99
- color: #fff;
100
- height: 24px;
101
- line-height: 24px;
102
- border-radius: 5px;
103
- border: 0;
104
- cursor: pointer;
105
- margin-left: 10px;
106
- }
107
- .but{
108
- position: absolute;
109
- bottom: 0;
110
- left: 0;
111
- right: 0;
112
- z-index: 1;
113
- text-align: center;
114
- }
115
- .book{
116
- width: 100%;
117
- height: 100%;
118
- }
119
- .flipbook {
120
- width: 100%;
121
- height: 100%;
122
- position: relative;
123
- padding-bottom: 24px;
124
- }
125
- .pdf-container{
126
- position: relative;
127
- }
128
- .pdf-canvas{
129
- position: absolute;
130
- top: -100000px;
131
- left: 0;
132
- z-index: -100;
133
- }
134
- </style>