emacroh5lib 1.0.69 → 1.0.72

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.
Files changed (12) hide show
  1. package/dist/emacroh5lib.min.js +1 -1
  2. package/dist/emacroh5lib.min.js.LICENSE.txt +7 -0
  3. package/package.json +1 -1
  4. package/src/index.ts +4 -3
  5. package/src/utilities/{File.ts → EMacro.ts} +6 -3
  6. package/src/views/ImageViewer/index.vue +3 -6
  7. package/src/views/ModelViewer/index.vue +508 -0
  8. package/src/views/ModelViewer/style/css/index.css +190 -0
  9. package/src/views/ModelViewer/style/css/index.less +212 -0
  10. package/src/views/ModelViewer/style/images/icons.png +0 -0
  11. package/src/views/TestView/index.vue +255 -238
  12. package/src/views/VideoViewer/index.vue +1 -1
package/src/views/TestView/index.vue CHANGED
@@ -2,6 +2,7 @@
2
2
  <div class="app-container">
3
3
 
4
4
  <button @click="handleOpen">打开查看器</button>
5
+ <button @click="handleOpen2">打开模型查看器查看器</button>
5
6
  <button @click="exportExcel($event)">透过Excel模板导出表格</button>
6
7
  <button @click="selectFile($event)">选择文件</button>
7
8
  <button @click="fileMD5($event)">文件MD5</button>
@@ -28,299 +29,315 @@
28
29
  <div class="filler2">111</div>
29
30
  </Draw>
30
31
 
31
- <video-viewer :list="srcList" :show.sync="showVideoViewer" width="80%" height="80%"/>
32
-
32
+ <video-viewer :list="srcList" :show.sync="showVideoViewer" width="80%" height="80%" />
33
+ <model-viewer :list="srcList" :show.sync="showModelViewer" width="80%" height="80%" />
33
34
 
34
35
  </div>
35
36
  </template>
36
37
 
37
38
  <script lang="ts">
38
- import { Component, Vue } from "vue-property-decorator";
39
- import ImageViewer from "@/views/ImageViewer/index.vue";
40
- import VideoViewer from "@/views/VideoViewer/index.vue";
41
- import DragResizeView from "@/views/DragResizeView/index.vue";
42
- import Draw from "@/views/Draw/index.vue";
43
-
44
- import { formatJson, export_json_to_excel, number_to_excel, testToExcel } from "./Export2Excel"
45
- import { EMacro } from "../../utilities/File";
46
-
47
- import axios from 'axios'
48
- import Cookie from 'js-cookie'
49
-
50
- import LAY_EXCEL from 'lay-excel';
51
-
52
- import BMF from 'browser-md5-file';
53
- import { info } from "console";
54
-
55
-
56
- @Component({
57
- components: {
58
- ImageViewer,
59
- DragResizeView,
60
- VideoViewer,
61
- Draw
62
- },
63
- mounted() {
64
-
65
- }
66
- })
67
- export default class TestView extends Vue {
68
-
69
- public currentIndex: Number = 0; // 打开图片查看器时，需要定位到的图片的索引
70
- public srcList: Array<String> = [
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",
83
- ] // 图片查看器数据集
84
-
85
- public src: String = "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
86
-
87
- public showViewer: Boolean = false // 是否打开图片查看器
88
- public showVideoViewer: Boolean = false // 是否打开图片查看器
89
-
90
- public listWidth = 0;
91
- public listHeight = 0;
92
-
93
- public handleOpen() {
94
- this.showViewer = true;
95
- // this.showVideoViewer = true;
96
- }
97
- public openCallback() { } // 打开时的回调
98
- public closeCallback() { } // 关闭时的回调
99
-
100
- public rects = [
101
- {
102
- 'name': "test-0",
103
- 'width': 200,
104
- 'height': 150,
105
- 'top': 10,
106
- 'left': 10,
107
- 'draggable': true,
108
- 'resizable': true,
109
- 'minw': 10,
110
- 'minh': 10,
111
- 'axis': 'both',
112
- 'parentLim': true,
113
- 'snapToGrid': false,
114
- 'aspectRatio': false,
115
- 'zIndex': 1,
116
- 'color': '#EF9A9A',
117
- 'active': false
118
- },
119
- {
120
- 'name': "test-1",
121
- 'width': 200,
122
- 'height': 150,
123
- 'top': 170,
124
- 'left': 220,
125
- 'draggable': true,
126
- 'resizable': true,
127
- 'minw': 10,
128
- 'minh': 10,
129
- 'axis': 'both',
130
- 'parentLim': true,
131
- 'snapToGrid': false,
132
- 'aspectRatio': false,
133
- 'zIndex': 1,
134
- 'color': '#E6C27A',
135
- 'active': false,
136
- 'class': 'box-shaddow'
39
+ import { Component, Vue } from "vue-property-decorator";
40
+ import ImageViewer from "@/views/ImageViewer/index.vue";
41
+ import VideoViewer from "@/views/VideoViewer/index.vue";
42
+ import ModelViewer from "@/views/ModelViewer/index.vue";
43
+ import DragResizeView from "@/views/DragResizeView/index.vue";
44
+ import Draw from "@/views/Draw/index.vue";
45
+ import { formatJson, export_json_to_excel, number_to_excel, testToExcel } from "./Export2Excel"
46
+ import { EMacro } from "../../utilities/EMacro";
47
+ import axios from 'axios'
48
+ import Cookie from 'js-cookie'
49
+ import LAY_EXCEL from 'lay-excel';
50
+ import BMF from 'browser-md5-file';
51
+ import { info } from "console";
52
+
53
+
54
+ @Component({
55
+ components: {
56
+ ImageViewer,
57
+ DragResizeView,
58
+ VideoViewer,
59
+ ModelViewer,
60
+ Draw
137
61
  },
138
- {
139
- 'name': "test-2",
140
- 'width': 200,
141
- 'height': 150,
142
- 'top': 10,
143
- 'left': 220,
144
- 'draggable': true,
145
- 'resizable': true,
146
- 'minw': 10,
147
- 'minh': 10,
148
- 'axis': 'both',
149
- 'parentLim': true,
150
- 'snapToGrid': false,
151
- 'aspectRatio': false,
152
- 'zIndex': 2,
153
- 'color': '#AED581',
154
- 'active': false
62
+ mounted() {
63
+
64
+ }
65
+ })
66
+ export default class TestView extends Vue {
67
+
68
+ public currentIndex: Number = 0; // 打开图片查看器时，需要定位到的图片的索引
69
+ public srcList: Array<String> = [
70
+ "http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
71
+ "http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\060 广西电子商务公共服务平台大数据中心.png",
72
+ "https://scpic.chinaz.net/files/pic/pic9/202203/apic39703.jpg",
73
+ "https://scpic.chinaz.net/files/pic/pic9/202005/zzpic24899.jpg",
74
+ "https://scpic.chinaz.net/files/pic/pic9/202109/bpic24244.jpg",
75
+ "https://scpic.chinaz.net/files/pic/pic9/202110/hpic4529.jpg",
76
+ "https://scpic.chinaz.net/files/pic/pic9/201912/zzpic22106.jpg",
77
+ "https://scpic.chinaz.net/files/pic/pic9/202202/apic38580.jpg",
78
+ // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4",
79
+ // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\ker.mp4",
80
+ // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\video2.mp4",
81
+ // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
82
+ ] // 图片查看器数据集
83
+
84
+ public modelList: Array<Object> = [{
85
+ type: "obj",
86
+ name: "产品1",
87
+ mtl: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.mtl",
88
+ obj: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.obj"
155
89
  },
156
90
  {
157
- 'name': "test-3",
158
- 'width': 200,
159
- 'height': 150,
160
- 'top': 170,
161
- 'left': 10,
162
- 'draggable': true,
163
- 'resizable': true,
164
- 'minw': 10,
165
- 'minh': 10,
166
- 'axis': 'both',
167
- 'parentLim': true,
168
- 'snapToGrid': false,
169
- 'aspectRatio': false,
170
- 'zIndex': 3,
171
- 'color': '#81D4FA',
172
- 'active': false
173
- }
174
- ]
91
+ type: "obj",
92
+ name: "产品2",
93
+ mtl: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.mtl",
94
+ obj: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.obj"
95
+ },]
175
96
 
176
- public exportExcel(e): void {
177
- console.log('event', e);
97
+ public src: String = "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
178
98
 
179
- // testToExcel(e)
180
- // LAY_EXCEL.exportExcel([[1, 2, 3]], '表格导出.xlsx', 'xlsx')
99
+ public showViewer: Boolean = false // 是否打开图片查看器
100
+ public showVideoViewer: Boolean = false // 是否打开图片查看器
101
+ public showModelViewer: Boolean = false
181
102
 
103
+ public listWidth = 0;
104
+ public listHeight = 0;
182
105
 
183
- // var list = [[null,1, 2, 3], [null,1, 2, "a撒地方打赏打发士大夫"]]
184
- var list = {
185
- "aaa1撒旦飞洒": [
186
- [null, 1, 2, 3]
187
- ],
188
- "bbb1": [
189
- [2, 1, 2, null]
190
- ]
106
+ public handleOpen() {
107
+ this.showViewer = true;
108
+ // this.showVideoViewer = true;
191
109
  }
192
110
 
193
- // 2. 使用批量设置样式函数 setExportCellStyle 对单元格维度的数据进行批量设置样式
194
- // PS:注意这里是ARGB，前两位是透明度
195
- LAY_EXCEL.setExportCellStyle(list, 'A1:Z1', {
196
- s: {
197
- border: {
198
- top: { style: 'thick', color: { rgb: 'FFFF0000' } },
199
- bottom: { style: 'thick', color: { rgb: 'FFFF0000' } },
200
- left: { style: 'thick', color: { rgb: 'FFFF0000' } },
201
- right: { style: 'thick', color: { rgb: 'FFFF0000' } }
202
- },
203
- fill: {
204
- fgColor: {
205
- rgb: "ffff00"
206
- }
207
- },
208
- font: {
209
- name: "楷体",
210
- sz: 22,
211
- color: {
212
- rgb: "ff0000"
213
- },
214
- bold: true,
215
- italic: false,
216
- underline: false
217
- },
111
+ public handleOpen2() {
112
+ this.showModelViewer = true;
113
+ // this.showVideoViewer = true;
114
+ }
115
+
116
+ public openCallback() { } // 打开时的回调
117
+ public closeCallback() { } // 关闭时的回调
118
+
119
+ public rects = [
120
+ {
121
+ 'name': "test-0",
122
+ 'width': 200,
123
+ 'height': 150,
124
+ 'top': 10,
125
+ 'left': 10,
126
+ 'draggable': true,
127
+ 'resizable': true,
128
+ 'minw': 10,
129
+ 'minh': 10,
130
+ 'axis': 'both',
131
+ 'parentLim': true,
132
+ 'snapToGrid': false,
133
+ 'aspectRatio': false,
134
+ 'zIndex': 1,
135
+ 'color': '#EF9A9A',
136
+ 'active': false
137
+ },
138
+ {
139
+ 'name': "test-1",
140
+ 'width': 200,
141
+ 'height': 150,
142
+ 'top': 170,
143
+ 'left': 220,
144
+ 'draggable': true,
145
+ 'resizable': true,
146
+ 'minw': 10,
147
+ 'minh': 10,
148
+ 'axis': 'both',
149
+ 'parentLim': true,
150
+ 'snapToGrid': false,
151
+ 'aspectRatio': false,
152
+ 'zIndex': 1,
153
+ 'color': '#E6C27A',
154
+ 'active': false,
155
+ 'class': 'box-shaddow'
156
+ },
157
+ {
158
+ 'name': "test-2",
159
+ 'width': 200,
160
+ 'height': 150,
161
+ 'top': 10,
162
+ 'left': 220,
163
+ 'draggable': true,
164
+ 'resizable': true,
165
+ 'minw': 10,
166
+ 'minh': 10,
167
+ 'axis': 'both',
168
+ 'parentLim': true,
169
+ 'snapToGrid': false,
170
+ 'aspectRatio': false,
171
+ 'zIndex': 2,
172
+ 'color': '#AED581',
173
+ 'active': false
174
+ },
175
+ {
176
+ 'name': "test-3",
177
+ 'width': 200,
178
+ 'height': 150,
179
+ 'top': 170,
180
+ 'left': 10,
181
+ 'draggable': true,
182
+ 'resizable': true,
183
+ 'minw': 10,
184
+ 'minh': 10,
185
+ 'axis': 'both',
186
+ 'parentLim': true,
187
+ 'snapToGrid': false,
188
+ 'aspectRatio': false,
189
+ 'zIndex': 3,
190
+ 'color': '#81D4FA',
191
+ 'active': false
192
+ }
193
+ ]
194
+
195
+ public exportExcel(e): void {
196
+ console.log('event', e);
197
+
198
+ // testToExcel(e)
199
+ // LAY_EXCEL.exportExcel([[1, 2, 3]], '表格导出.xlsx', 'xlsx')
200
+
201
+ // var list = [[null,1, 2, 3], [null,1, 2, "a撒地方打赏打发士大夫"]]
202
+ var list = {
203
+ "aaa1撒旦飞洒": [
204
+ [null, 1, 2, 3]
205
+ ],
206
+ "bbb1": [
207
+ [2, 1, 2, null]
208
+ ]
218
209
  }
219
- })
220
210
 
211
+ // 2. 使用批量设置样式函数 setExportCellStyle 对单元格维度的数据进行批量设置样式
212
+ // PS:注意这里是ARGB，前两位是透明度
213
+ LAY_EXCEL.setExportCellStyle(list, 'A1:Z1', {
214
+ s: {
215
+ border: {
216
+ top: { style: 'thick', color: { rgb: 'FFFF0000' } },
217
+ bottom: { style: 'thick', color: { rgb: 'FFFF0000' } },
218
+ left: { style: 'thick', color: { rgb: 'FFFF0000' } },
219
+ right: { style: 'thick', color: { rgb: 'FFFF0000' } }
220
+ },
221
+ fill: {
222
+ fgColor: {
223
+ rgb: "ffff00"
224
+ }
225
+ },
226
+ font: {
227
+ name: "楷体",
228
+ sz: 22,
229
+ color: {
230
+ rgb: "ff0000"
231
+ },
232
+ bold: true,
233
+ italic: false,
234
+ underline: false
235
+ },
236
+ }
237
+ })
238
+
239
+ LAY_EXCEL.exportExcel(list, '表格导出.xlsx', 'xlsx')
240
+ }
221
241
 
222
- LAY_EXCEL.exportExcel(list, '表格导出.xlsx', 'xlsx')
223
- }
242
+ public selectFile(e) {
224
243
 
225
- public selectFile(e) {
244
+ EMacro.File.selectFile().then((files) => {
245
+ EMacro.File.uploadFiles(files, file => {
226
246
 
227
- EMacro.File.selectFile().then((files) => {
228
- EMacro.File.uploadFiles(files, file => {
247
+ file.savePath = "C:\\MES\\EMacroAndroidServer_Windows_v1.1\\EMacroAssets\\file\\" + file.fileName
229
248
 
230
- file.savePath = "C:\\MES\\EMacroAndroidServer_Windows_v1.1\\EMacroAssets\\file\\" + file.fileName
249
+ let postData = { 'id': 0, 'message': '', 'action': 'uploadSOPFile', 'user': {}, 'data': file }
250
+ axios.post("http://121.228.113.68:8019/H5/prod/Command/requestVueData", postData, {
251
+ timeout: 6000,
252
+ headers: {
253
+ Authorization: "Basic RU1hY3JvOkVNYWNybw==",
254
+ "Content-Type": "application/json;charset=UTF-8",
255
+ }
256
+ }).then(data => {
231
257
 
232
- let postData = { 'id': 0, 'message': '', 'action': 'uploadSOPFile', 'user': {}, 'data': file }
233
- axios.post("http://121.228.113.68:8019/H5/prod/Command/requestVueData", postData, {
234
- timeout: 6000,
235
- headers: {
236
- Authorization: "Basic RU1hY3JvOkVNYWNybw==",
237
- "Content-Type": "application/json;charset=UTF-8",
238
- }
239
- }).then(data => {
258
+ console.log("上传返回", data);
240
259
 
241
- console.log("上传返回", data);
260
+ }).catch(err => {
261
+ console.error("上传错误: ", err);
262
+ })
242
263
 
243
- }).catch(err => {
244
- console.error("上传错误: ", err);
245
264
  })
246
265
 
266
+ }).catch(err => {
267
+ console.error(err);
247
268
  })
248
269
 
249
- }).catch(err => {
250
- console.error(err);
251
- })
252
-
253
- }
254
-
255
- activateEv(index) {
256
- console.log("activateEv index", index);
257
- }
270
+ }
258
271
 
259
- deactivateEv(index) {
260
- console.log("deactivateEv index", index);
261
- }
272
+ activateEv(index) {
273
+ console.log("activateEv index", index);
274
+ }
262
275
 
263
- changePosition(newRect, index) {
264
- console.log("changePosition newRect", newRect);
265
- console.log("changePosition index", index);
266
- }
276
+ deactivateEv(index) {
277
+ console.log("deactivateEv index", index);
278
+ }
267
279
 
268
- changeSize(newRect, index) {
269
- console.log("changeSize newRect", newRect);
270
- console.log("changeSize index", index);
271
- }
280
+ changePosition(newRect, index) {
281
+ console.log("changePosition newRect", newRect);
282
+ console.log("changePosition index", index);
283
+ }
272
284
 
273
- public fileMD5() {
285
+ changeSize(newRect, index) {
286
+ console.log("changeSize newRect", newRect);
287
+ console.log("changeSize index", index);
288
+ }
274
289
 
275
- EMacro.File.selectFile().then(files => {
290
+ public fileMD5() {
276
291
 
277
- if (files == null) {
278
- return
279
- }
292
+ EMacro.File.selectFile().then(files => {
280
293
 
281
- EMacro.File.getFileMD5(files[0]).then(md5 => {
294
+ if (files == null) {
295
+ return
296
+ }
282
297
 
283
- console.log("文件MD5", md5);
298
+ EMacro.File.getFileMD5(files[0]).then(md5 => {
284
299
 
285
- })
300
+ console.log("文件MD5", md5);
286
301
 
302
+ })
287
303
 
288
- // new MD5().update(buffer).digest()
289
304
 
305
+ // new MD5().update(buffer).digest()
290
306
 
291
- // const hash = crypto
292
- // .createHash('md5')
293
- // .update(files[0], 'utf8')
294
- // .digest('hex');
295
307
 
296
- })
308
+ // const hash = crypto
309
+ // .createHash('md5')
310
+ // .update(files[0], 'utf8')
311
+ // .digest('hex');
297
312
 
313
+ })
298
314
 
299
315
 
300
- }
301
316
 
302
- public mounted() {
317
+ }
303
318
 
304
- EMacro.getVideoScale("http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4").then(info => {
305
- console.log("获取视频", info);
306
- });
319
+ public mounted() {
307
320
 
321
+ EMacro.getVideoScale("http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4").then(info => {
322
+ console.log("获取视频", info);
323
+ });
308
324
 
309
325
 
310
- const listEl = document.getElementById('list') as HTMLElement;
311
- this.listWidth = listEl.clientWidth;
312
- this.listHeight = listEl.clientHeight;
313
326
 
314
- window.addEventListener('resize', () => {
327
+ // const listEl = document.getElementById('list') as HTMLElement;
315
328
  // this.listWidth = listEl.clientWidth;
316
329
  // this.listHeight = listEl.clientHeight;
317
- })
318
- }
330
+
331
+ window.addEventListener('resize', () => {
332
+ // this.listWidth = listEl.clientWidth;
333
+ // this.listHeight = listEl.clientHeight;
334
+ })
335
+ }
319
336
 
320
337
 
321
- }
338
+ }
322
339
  </script>
323
340
 
324
341
  <style lang="less" scoped>
325
- @import "index.less";
342
+ @import "index.less";
326
343
  </style>
package/src/views/VideoViewer/index.vue CHANGED
@@ -47,7 +47,7 @@
47
47
 
48
48
  <script>
49
49
 
50
- import { EMacro } from "../../utilities/File";
50
+ import { EMacro } from "../../utilities/EMacro";
51
51
 
52
52
  export default {
53
53
  name: "ImageViewer",