zydx-plus 1.28.131 → 1.28.133
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 +1 -1
- package/src/components/dragPopup/src/dragPopup.vue +26 -10
- package/src/components/editor2/src/editor.vue +4 -8
- package/src/components/read/src/read.vue +42 -52
- package/src/components/tipBox/src/main.vue +1 -1
- package/src/components/tipBox/src/zydxStyle.css +10 -0
- package/src/index.js +1 -1
package/package.json
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="drag-pop" :style="position">
|
|
3
|
-
<div class="drag-head"
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
@mouseleave="mousemove">
|
|
9
|
-
<span>按住可拖动弹窗</span>
|
|
3
|
+
<div class="drag-head" :style="{'background-color':titleColor}">
|
|
4
|
+
<span @mousedown="mousedown"
|
|
5
|
+
@mousemove="mousemove"
|
|
6
|
+
@mouseup="mouseup"
|
|
7
|
+
@mouseleave="mousemove">按住可拖动弹窗</span>
|
|
10
8
|
<i @click.stop="close"></i>
|
|
11
9
|
</div>
|
|
12
10
|
<div class="drag-cont" @mousemove="footMove" @mouseleave="footMove">
|
|
13
|
-
<
|
|
11
|
+
<div class="drag-cont-slot">
|
|
12
|
+
<slot name="content"></slot>
|
|
13
|
+
</div>
|
|
14
14
|
<i class="down" v-if="dragStatus" @mousedown="footDown($event,'d')" @mouseup="footUp"></i>
|
|
15
15
|
<i class="in" v-if="dragStatus" @mousedown="footDown($event,'in')" @mouseup="footUp"></i>
|
|
16
16
|
<i class="right" v-if="dragStatus" @mousedown="footDown($event,'r')" @mouseup="footUp"></i>
|
|
@@ -51,7 +51,7 @@ export default {
|
|
|
51
51
|
},
|
|
52
52
|
titleColor: {
|
|
53
53
|
type: String,
|
|
54
|
-
default: '
|
|
54
|
+
default: 'rgba(19, 191, 108, 1)'
|
|
55
55
|
},
|
|
56
56
|
dragStatus: {
|
|
57
57
|
type: Boolean,
|
|
@@ -116,6 +116,11 @@ export default {
|
|
|
116
116
|
</script>
|
|
117
117
|
|
|
118
118
|
<style scoped>
|
|
119
|
+
.drag-cont-slot{
|
|
120
|
+
width: 100%;
|
|
121
|
+
height: 100%;
|
|
122
|
+
overflow: auto;
|
|
123
|
+
}
|
|
119
124
|
.down-text-cont{
|
|
120
125
|
display: inline-block;
|
|
121
126
|
}
|
|
@@ -178,8 +183,17 @@ export default {
|
|
|
178
183
|
}
|
|
179
184
|
.drag-head span{
|
|
180
185
|
text-align: center;
|
|
181
|
-
width: 100
|
|
186
|
+
width: calc(100% - 30px);
|
|
182
187
|
display: inline-block;
|
|
188
|
+
margin-right: 40px;
|
|
189
|
+
}
|
|
190
|
+
@keyframes linkDown {
|
|
191
|
+
0% {
|
|
192
|
+
opacity: 0;
|
|
193
|
+
}
|
|
194
|
+
100% {
|
|
195
|
+
opacity: 1;
|
|
196
|
+
}
|
|
183
197
|
}
|
|
184
198
|
.drag-pop {
|
|
185
199
|
position: fixed;
|
|
@@ -187,6 +201,8 @@ export default {
|
|
|
187
201
|
background-color: #fff;
|
|
188
202
|
border-radius: 3px;
|
|
189
203
|
z-index: 999;
|
|
204
|
+
animation: linkDown .3s linear forwards;
|
|
205
|
+
opacity: 0;
|
|
190
206
|
}
|
|
191
207
|
.drag-head{
|
|
192
208
|
height: 30px;
|
|
@@ -298,6 +298,10 @@ export default {
|
|
|
298
298
|
if(v === 'uploadAtt') {
|
|
299
299
|
file.active = true
|
|
300
300
|
this.uploadAttData.push(file)
|
|
301
|
+
this.$emit('updateData', {
|
|
302
|
+
html: html2json(this.editor.getHTML()).child,
|
|
303
|
+
enclosure: this.uploadAttData
|
|
304
|
+
})
|
|
301
305
|
}else {
|
|
302
306
|
this.uploadFile(file,this.uploadImage).then(r => {
|
|
303
307
|
this.imgHtml(r.data)
|
|
@@ -342,14 +346,6 @@ export default {
|
|
|
342
346
|
},
|
|
343
347
|
download(index) {
|
|
344
348
|
this.$emit('download', this.uploadAttData[index])
|
|
345
|
-
// const url = this.uploadImage.url + this.uploadAttData[index].filePath
|
|
346
|
-
// let a = document.createElement('a');
|
|
347
|
-
// a.style.display = 'none';
|
|
348
|
-
// a.download = this.uploadAttData[index].filename? this.uploadAttData[index].filename : this.uploadAttData[index].annexName;
|
|
349
|
-
// a.href = url;
|
|
350
|
-
// document.body.appendChild(a);
|
|
351
|
-
// a.click();
|
|
352
|
-
// document.body.removeChild(a);
|
|
353
349
|
},
|
|
354
350
|
selection() {
|
|
355
351
|
const { from } = this.editor.state.selection
|
|
@@ -2,7 +2,11 @@
|
|
|
2
2
|
<div class="read">
|
|
3
3
|
<vue-office-docx v-if="fileType === 'docx'" :src="url" style="height: 100%;" @rendered="renderedHandler" />
|
|
4
4
|
<vue-office-excel v-if="fileType === 'xlsx'" :src="url" style="height: 100%;" @rendered="renderedHandler" />
|
|
5
|
-
<div class="view-pdf" v-if="fileType === 'pdf'"
|
|
5
|
+
<div class="view-pdf" v-if="fileType === 'pdf'">
|
|
6
|
+
<div class="pageContainer" v-for="(item,index) in idArr">
|
|
7
|
+
<canvas :id="item"></canvas>
|
|
8
|
+
</div>
|
|
9
|
+
</div>
|
|
6
10
|
<div class="mp4" v-if="fileType === 'mp4'">
|
|
7
11
|
<video :src="url" controls></video>
|
|
8
12
|
</div>
|
|
@@ -11,7 +15,7 @@
|
|
|
11
15
|
</div>
|
|
12
16
|
<div v-if="loading" class="loading-back">
|
|
13
17
|
<div class="loading-cont">
|
|
14
|
-
<div class="
|
|
18
|
+
<div class="loadings">Loading</div>
|
|
15
19
|
</div>
|
|
16
20
|
</div>
|
|
17
21
|
</div>
|
|
@@ -40,6 +44,7 @@ export default {
|
|
|
40
44
|
pdfPages: 0,
|
|
41
45
|
loading: true,
|
|
42
46
|
repeat: false,
|
|
47
|
+
idArr: []
|
|
43
48
|
}
|
|
44
49
|
},
|
|
45
50
|
props: {
|
|
@@ -61,14 +66,14 @@ export default {
|
|
|
61
66
|
},
|
|
62
67
|
methods: {
|
|
63
68
|
repeatInit() {
|
|
64
|
-
if(this.repeat) return // 防止重复加载
|
|
69
|
+
if (this.repeat) return // 防止重复加载
|
|
65
70
|
this.repeat = true
|
|
66
71
|
this.loading = true
|
|
67
72
|
this.fileType = this.url.split('.').pop()
|
|
68
|
-
if(this.fileType === 'pdf') this.init()
|
|
73
|
+
if (this.fileType === 'pdf') this.init()
|
|
69
74
|
setTimeout(() => {
|
|
70
75
|
this.repeat = false
|
|
71
|
-
},1000)
|
|
76
|
+
}, 1000)
|
|
72
77
|
},
|
|
73
78
|
renderedHandler() {
|
|
74
79
|
this.loading = false
|
|
@@ -78,59 +83,44 @@ export default {
|
|
|
78
83
|
const loadingTask = PdfJs.getDocument(this.url)
|
|
79
84
|
loadingTask.promise.then((pdf) => {
|
|
80
85
|
that.pdfPages = pdf.numPages // 获取pdf文件的总页数
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
let viewport = page.getViewport({scale: 1})
|
|
85
|
-
return page.getOperatorList().then(function(opList) {
|
|
86
|
-
let svgGfx = new PdfJs.SVGGraphics(page.commonObjs, page.objs)
|
|
87
|
-
return svgGfx.getSVG(opList, viewport).then(function(svg) {
|
|
88
|
-
that.svgArr.push({
|
|
89
|
-
index: inx,
|
|
90
|
-
width: viewport.width,
|
|
91
|
-
height: viewport.height,
|
|
92
|
-
data: svg
|
|
93
|
-
})
|
|
94
|
-
})
|
|
95
|
-
})
|
|
96
|
-
})
|
|
97
|
-
}
|
|
86
|
+
let page = pdf.numPages
|
|
87
|
+
// if(that.pdfPages > 5) page = 5
|
|
88
|
+
that.getPDF(pdf,page)
|
|
98
89
|
})
|
|
99
|
-
setTimeout(() => {
|
|
100
|
-
that.sortArr()
|
|
101
|
-
},100)
|
|
102
90
|
},
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
for(let
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
91
|
+
getPDF(pdf,page) {
|
|
92
|
+
let that = this
|
|
93
|
+
for (let i = 0; i < page; i++) {
|
|
94
|
+
const id = 'canvas' + Math.random().toString(36).substr(2)
|
|
95
|
+
that.idArr.push(id)
|
|
96
|
+
pdf.getPage(that.idArr.length).then(function (page) {
|
|
97
|
+
let canvas = document.getElementById(id)
|
|
98
|
+
let ctx = canvas.getContext('2d');
|
|
99
|
+
let viewport = page.getViewport({scale: 1.35})
|
|
100
|
+
canvas.width = viewport.width * 2
|
|
101
|
+
canvas.height = viewport.height * 2
|
|
102
|
+
canvas.style.width = viewport.width + 'px'
|
|
103
|
+
canvas.style.height = viewport.height + 'px'
|
|
104
|
+
let renderContext = {
|
|
105
|
+
canvasContext: ctx,
|
|
106
|
+
viewport: viewport,
|
|
107
|
+
transform: [2, 0, 0, 2, 0, 0]
|
|
108
|
+
}
|
|
109
|
+
page.render(renderContext)
|
|
110
|
+
})
|
|
114
111
|
}
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
container.id = 'canvas_' + x.index
|
|
118
|
-
container.className = 'pageContainer'
|
|
119
|
-
container.style.width = x.width + 'px'
|
|
120
|
-
container.style.height = x.height + 'px'
|
|
121
|
-
container.style.display = 'inline-block'
|
|
122
|
-
container.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.5)'
|
|
123
|
-
container.style.marginBottom = '5px'
|
|
124
|
-
document.getElementById('canvas-wrap').appendChild(container)
|
|
125
|
-
container.appendChild(x.data)
|
|
126
|
-
})
|
|
127
|
-
this.renderedHandler()
|
|
128
|
-
},
|
|
112
|
+
that.renderedHandler()
|
|
113
|
+
}
|
|
129
114
|
}
|
|
130
115
|
}
|
|
131
116
|
</script>
|
|
132
117
|
|
|
133
118
|
<style scoped>
|
|
119
|
+
.pageContainer{
|
|
120
|
+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
|
|
121
|
+
margin-bottom: 10px;
|
|
122
|
+
display: inline-block;
|
|
123
|
+
}
|
|
134
124
|
.mp4,.mp3{
|
|
135
125
|
width: 100%;
|
|
136
126
|
}
|
|
@@ -171,7 +161,7 @@ export default {
|
|
|
171
161
|
display: inline-block;
|
|
172
162
|
margin: 0 auto;
|
|
173
163
|
}
|
|
174
|
-
.
|
|
164
|
+
.loadings {
|
|
175
165
|
display: inline-block;
|
|
176
166
|
font-size: 28px;
|
|
177
167
|
font-family: Arial, Helvetica, sans-serif;
|
|
@@ -182,7 +172,7 @@ export default {
|
|
|
182
172
|
position: relative;
|
|
183
173
|
}
|
|
184
174
|
|
|
185
|
-
.
|
|
175
|
+
.loadings::after {
|
|
186
176
|
content: "Loading";
|
|
187
177
|
position: absolute;
|
|
188
178
|
left: 0;
|
|
@@ -136,7 +136,7 @@ export default {
|
|
|
136
136
|
this.inputArr[index].value = file
|
|
137
137
|
},
|
|
138
138
|
isNumberKey(evt,index) {
|
|
139
|
-
const charCode = (evt.which) ? evt.which :
|
|
139
|
+
const charCode = (evt.which) ? evt.which : evt.keyCode;
|
|
140
140
|
if(this.inputArr[index].value === undefined) return true
|
|
141
141
|
let val = this.inputArr[index].value.toString()
|
|
142
142
|
if (charCode === 46) {
|
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
@keyframes linkDown {
|
|
2
|
+
0% {
|
|
3
|
+
opacity: 0;
|
|
4
|
+
}
|
|
5
|
+
100% {
|
|
6
|
+
opacity: 1;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
1
9
|
.tip-popupWindowSearch{
|
|
2
10
|
position: fixed;
|
|
3
11
|
top: 0;
|
|
@@ -17,6 +25,8 @@
|
|
|
17
25
|
border: 5px rgba(0, 0, 0, .1) solid;
|
|
18
26
|
margin: 0 auto;
|
|
19
27
|
box-sizing: border-box;
|
|
28
|
+
animation: linkDown .3s linear forwards;
|
|
29
|
+
opacity: 0;
|
|
20
30
|
}
|
|
21
31
|
.tip-boxContent{
|
|
22
32
|
max-height: 600px;
|