emacroh5lib 1.0.40 → 1.0.41
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,7 +1,7 @@
|
|
1
1
|
<template>
|
2
2
|
<div class="duo-viewer" v-if="show" ref="duoViewer" @click="clickAgent">
|
3
3
|
<div class="duo-viewer-mask">
|
4
|
-
<img ref="duoViewerImage" :src="realSrc" :alt="alt" class="duo-viewer-mask__image"/>
|
4
|
+
<img ref="duoViewerImage" :src="realSrc" :alt="alt" class="duo-viewer-mask__image" />
|
5
5
|
</div>
|
6
6
|
<div class="duo-viewer-footer">
|
7
7
|
<div class="duo-viewer-footer__title">{{ realName }}</div>
|
@@ -178,7 +178,7 @@
|
|
178
178
|
|
179
179
|
$this.image = $this.$refs["duoViewerImage"];
|
180
180
|
$this.initDrag();
|
181
|
-
this.$emit("loadComplete");
|
181
|
+
$this.$emit("loadComplete");
|
182
182
|
const { width, height } = $this.listDataCache[index];
|
183
183
|
$this.setStyleByName($this.image, "width", width);
|
184
184
|
$this.setStyleByName($this.image, "height", height);
|
@@ -191,6 +191,10 @@
|
|
191
191
|
const { width, height } = $this.listDataCache[index];
|
192
192
|
$this.setStyleByName($this.image, "width", width);
|
193
193
|
$this.setStyleByName($this.image, "height", height);
|
194
|
+
|
195
|
+
setTimeout(() => {
|
196
|
+
$this.resetZoom();
|
197
|
+
}, 100);
|
194
198
|
})
|
195
199
|
|
196
200
|
},
|
@@ -219,13 +223,26 @@
|
|
219
223
|
},
|
220
224
|
|
221
225
|
// Reset zoom action
|
222
|
-
resetZoom() {
|
226
|
+
resetZoom(adaptive = true) {
|
223
227
|
let image = this.image;
|
224
228
|
const imageObject = new Image();
|
225
229
|
|
226
230
|
imageObject.src = this.list[this.index];
|
227
231
|
|
228
|
-
|
232
|
+
let { width, height } = imageObject;
|
233
|
+
|
234
|
+
if (adaptive) {
|
235
|
+
let rate = 1
|
236
|
+
if (width > height) {
|
237
|
+
rate = width / document.body.clientWidth
|
238
|
+
}
|
239
|
+
else {
|
240
|
+
rate = height / document.body.clientHeight
|
241
|
+
}
|
242
|
+
|
243
|
+
width = width / rate
|
244
|
+
height = height / rate
|
245
|
+
}
|
229
246
|
|
230
247
|
this.setStyleByName(image, "width", `${width}px`);
|
231
248
|
this.setStyleByName(image, "height", `${height}px`);
|
@@ -310,11 +327,15 @@
|
|
310
327
|
}
|
311
328
|
this.judgeThumbnailListMove(lastIndex, this.index);
|
312
329
|
|
313
|
-
|
314
|
-
|
315
|
-
|
316
|
-
|
317
|
-
|
330
|
+
setTimeout(() => {
|
331
|
+
this.resetZoom();
|
332
|
+
|
333
|
+
this.setStyleByName(this.image, "width", this.currentData.width);
|
334
|
+
this.setStyleByName(this.image, "height", this.currentData.height);
|
335
|
+
this.setStyleByName(this.image, "left", this.currentData.left);
|
336
|
+
this.setStyleByName(this.image, "top", this.currentData.top);
|
337
|
+
this.setTransform(this.image, this.currentData.transform);
|
338
|
+
}, 100);
|
318
339
|
},
|
319
340
|
// To judge thumbnail list move
|
320
341
|
judgeThumbnailListMove(lastIndex, index) {
|
@@ -524,7 +545,7 @@
|
|
524
545
|
this.zoom("out");
|
525
546
|
break;
|
526
547
|
case "one-to-one":
|
527
|
-
this.resetZoom();
|
548
|
+
this.resetZoom(false);
|
528
549
|
break;
|
529
550
|
case "prev":
|
530
551
|
this.switchAction("prev");
|
@@ -68,16 +68,18 @@ export default class TestView extends Vue {
|
|
68
68
|
|
69
69
|
public currentIndex: Number = 0; // 打开图片查看器时,需要定位到的图片的索引
|
70
70
|
public srcList: Array<String> = [
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
"
|
79
|
-
"http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001
|
80
|
-
"http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\
|
71
|
+
"http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
|
72
|
+
"http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\060 广西电子商务公共服务平台大数据中心.png",
|
73
|
+
"https://scpic.chinaz.net/files/pic/pic9/202203/apic39703.jpg",
|
74
|
+
"https://scpic.chinaz.net/files/pic/pic9/202005/zzpic24899.jpg",
|
75
|
+
"https://scpic.chinaz.net/files/pic/pic9/202109/bpic24244.jpg",
|
76
|
+
"https://scpic.chinaz.net/files/pic/pic9/202110/hpic4529.jpg",
|
77
|
+
"https://scpic.chinaz.net/files/pic/pic9/201912/zzpic22106.jpg",
|
78
|
+
"https://scpic.chinaz.net/files/pic/pic9/202202/apic38580.jpg",
|
79
|
+
// "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4",
|
80
|
+
// "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\ker.mp4",
|
81
|
+
// "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\video2.mp4",
|
82
|
+
// "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
|
81
83
|
] // 图片查看器数据集
|
82
84
|
|
83
85
|
public src: String = "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
|
@@ -89,8 +91,8 @@ export default class TestView extends Vue {
|
|
89
91
|
public listHeight = 0;
|
90
92
|
|
91
93
|
public handleOpen() {
|
92
|
-
|
93
|
-
this.showVideoViewer = true;
|
94
|
+
this.showViewer = true;
|
95
|
+
// this.showVideoViewer = true;
|
94
96
|
}
|
95
97
|
public openCallback() { } // 打开时的回调
|
96
98
|
public closeCallback() { } // 关闭时的回调
|