c-image 1.0.0 → 1.0.1
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/lib/my-vue-library.es.js +106 -101
- package/lib/my-vue-library.umd.js +1 -1
- package/lib/style.css +1 -1
- package/package.json +1 -1
package/lib/my-vue-library.es.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { defineComponent as S, createElementBlock as
|
|
1
|
+
import { defineComponent as S, createElementBlock as u, openBlock as n, createElementVNode as o, resolveComponent as i, createBlock as b, toDisplayString as w, withCtx as s, createVNode as t, unref as $, ref as y, Fragment as B, createTextVNode as v, renderList as V, normalizeClass as T, normalizeStyle as D } from "vue";
|
|
2
2
|
/*! Element Plus Icons Vue v2.3.2 */
|
|
3
3
|
var X = /* @__PURE__ */ S({
|
|
4
4
|
name: "ArrowLeft",
|
|
5
5
|
__name: "arrow-left",
|
|
6
6
|
setup(e) {
|
|
7
|
-
return (
|
|
7
|
+
return (a, l) => (n(), u("svg", {
|
|
8
8
|
xmlns: "http://www.w3.org/2000/svg",
|
|
9
9
|
viewBox: "0 0 1024 1024"
|
|
10
10
|
}, [
|
|
11
|
-
|
|
11
|
+
o("path", {
|
|
12
12
|
fill: "currentColor",
|
|
13
13
|
d: "M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.59 30.59 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.59 30.59 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0"
|
|
14
14
|
})
|
|
@@ -18,11 +18,11 @@ var X = /* @__PURE__ */ S({
|
|
|
18
18
|
name: "ArrowRight",
|
|
19
19
|
__name: "arrow-right",
|
|
20
20
|
setup(e) {
|
|
21
|
-
return (
|
|
21
|
+
return (a, l) => (n(), u("svg", {
|
|
22
22
|
xmlns: "http://www.w3.org/2000/svg",
|
|
23
23
|
viewBox: "0 0 1024 1024"
|
|
24
24
|
}, [
|
|
25
|
-
|
|
25
|
+
o("path", {
|
|
26
26
|
fill: "currentColor",
|
|
27
27
|
d: "M340.864 149.312a30.59 30.59 0 0 0 0 42.752L652.736 512 340.864 831.872a30.59 30.59 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"
|
|
28
28
|
})
|
|
@@ -32,25 +32,25 @@ var X = /* @__PURE__ */ S({
|
|
|
32
32
|
name: "Picture",
|
|
33
33
|
__name: "picture",
|
|
34
34
|
setup(e) {
|
|
35
|
-
return (
|
|
35
|
+
return (a, l) => (n(), u("svg", {
|
|
36
36
|
xmlns: "http://www.w3.org/2000/svg",
|
|
37
37
|
viewBox: "0 0 1024 1024"
|
|
38
38
|
}, [
|
|
39
|
-
|
|
39
|
+
o("path", {
|
|
40
40
|
fill: "currentColor",
|
|
41
41
|
d: "M160 160v704h704V160zm-32-64h768a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H128a32 32 0 0 1-32-32V128a32 32 0 0 1 32-32"
|
|
42
42
|
}),
|
|
43
|
-
|
|
43
|
+
o("path", {
|
|
44
44
|
fill: "currentColor",
|
|
45
45
|
d: "M384 288q64 0 64 64t-64 64-64-64 64-64M185.408 876.992l-50.816-38.912L350.72 556.032a96 96 0 0 1 134.592-17.856l1.856 1.472 122.88 99.136a32 32 0 0 0 44.992-4.864l216-269.888 49.92 39.936-215.808 269.824-.256.32a96 96 0 0 1-135.04 14.464l-122.88-99.072-.64-.512a32 32 0 0 0-44.8 5.952z"
|
|
46
46
|
})
|
|
47
47
|
]));
|
|
48
48
|
}
|
|
49
49
|
}), M = U;
|
|
50
|
-
const
|
|
50
|
+
const x = (e, a) => {
|
|
51
51
|
const l = e.__vccOpts || e;
|
|
52
|
-
for (const [
|
|
53
|
-
l[
|
|
52
|
+
for (const [g, c] of a)
|
|
53
|
+
l[g] = c;
|
|
54
54
|
return l;
|
|
55
55
|
}, W = { class: "wrap" }, G = { class: "name" }, J = { class: "flex justify-center items-center h-full" }, K = {
|
|
56
56
|
key: 1,
|
|
@@ -64,25 +64,27 @@ const w = (e, i) => {
|
|
|
64
64
|
show: { type: Boolean, default: !0 }
|
|
65
65
|
},
|
|
66
66
|
setup(e) {
|
|
67
|
-
const
|
|
67
|
+
const a = {
|
|
68
68
|
0: "融合智能识别",
|
|
69
69
|
1: "声迅智能识别",
|
|
70
70
|
2: "海康智能识别",
|
|
71
71
|
3: "讯飞智能识别"
|
|
72
72
|
};
|
|
73
|
-
return (l,
|
|
74
|
-
const c =
|
|
75
|
-
return n(),
|
|
76
|
-
|
|
77
|
-
e.show ? (n(),
|
|
73
|
+
return (l, g) => {
|
|
74
|
+
const c = i("el-icon"), _ = i("el-image");
|
|
75
|
+
return n(), u("div", W, [
|
|
76
|
+
o("div", G, w(a[e.curImageIndex]), 1),
|
|
77
|
+
e.show ? (n(), b(_, {
|
|
78
78
|
key: 0,
|
|
79
79
|
class: "image-item",
|
|
80
80
|
src: e.imgList[e.curImageIndex].url,
|
|
81
81
|
fit: e.fit,
|
|
82
|
-
"preview-src-list": e.imgList.map((
|
|
82
|
+
"preview-src-list": e.imgList.map((r) => r.url),
|
|
83
|
+
"initial-index": e.curImageIndex,
|
|
84
|
+
"show-progress": ""
|
|
83
85
|
}, {
|
|
84
86
|
error: s(() => [
|
|
85
|
-
|
|
87
|
+
o("div", J, [
|
|
86
88
|
t(c, null, {
|
|
87
89
|
default: s(() => [
|
|
88
90
|
t($(M))
|
|
@@ -91,8 +93,11 @@ const w = (e, i) => {
|
|
|
91
93
|
})
|
|
92
94
|
])
|
|
93
95
|
]),
|
|
96
|
+
progress: s(({ activeIndex: r }) => [
|
|
97
|
+
o("span", null, w(r + 1 + "-" + a[r]), 1)
|
|
98
|
+
]),
|
|
94
99
|
_: 1
|
|
95
|
-
}, 8, ["src", "fit", "preview-src-list"])) : (n(),
|
|
100
|
+
}, 8, ["src", "fit", "preview-src-list", "initial-index"])) : (n(), u("div", K, [
|
|
96
101
|
t(c, null, {
|
|
97
102
|
default: s(() => [
|
|
98
103
|
t($(M))
|
|
@@ -103,7 +108,7 @@ const w = (e, i) => {
|
|
|
103
108
|
]);
|
|
104
109
|
};
|
|
105
110
|
}
|
|
106
|
-
},
|
|
111
|
+
}, C = /* @__PURE__ */ x(Q, [["__scopeId", "data-v-0c64f028"]]), Y = { class: "image-box" }, Z = {
|
|
107
112
|
__name: "cImageBox",
|
|
108
113
|
props: {
|
|
109
114
|
images: {
|
|
@@ -116,21 +121,21 @@ const w = (e, i) => {
|
|
|
116
121
|
}
|
|
117
122
|
},
|
|
118
123
|
setup(e) {
|
|
119
|
-
return (
|
|
120
|
-
const
|
|
121
|
-
return n(),
|
|
122
|
-
e.images.length ? (n(),
|
|
124
|
+
return (a, l) => {
|
|
125
|
+
const g = i("el-col"), c = i("el-row"), _ = i("el-empty");
|
|
126
|
+
return n(), u("div", Y, [
|
|
127
|
+
e.images.length ? (n(), b(c, {
|
|
123
128
|
key: 0,
|
|
124
129
|
gutter: 10,
|
|
125
130
|
class: "content"
|
|
126
131
|
}, {
|
|
127
132
|
default: s(() => [
|
|
128
|
-
t(
|
|
133
|
+
t(g, {
|
|
129
134
|
span: 16,
|
|
130
135
|
class: "left"
|
|
131
136
|
}, {
|
|
132
137
|
default: s(() => [
|
|
133
|
-
t(
|
|
138
|
+
t(C, {
|
|
134
139
|
"img-list": e.images,
|
|
135
140
|
"cur-image-index": 0,
|
|
136
141
|
show: e.typeList.includes(0)
|
|
@@ -138,24 +143,24 @@ const w = (e, i) => {
|
|
|
138
143
|
]),
|
|
139
144
|
_: 1
|
|
140
145
|
}),
|
|
141
|
-
t(
|
|
146
|
+
t(g, {
|
|
142
147
|
span: 8,
|
|
143
148
|
class: "right"
|
|
144
149
|
}, {
|
|
145
150
|
default: s(() => [
|
|
146
|
-
t(
|
|
151
|
+
t(C, {
|
|
147
152
|
"img-list": e.images,
|
|
148
153
|
"cur-image-index": 1,
|
|
149
154
|
show: e.typeList.includes(1),
|
|
150
155
|
class: "item"
|
|
151
156
|
}, null, 8, ["img-list", "show"]),
|
|
152
|
-
t(
|
|
157
|
+
t(C, {
|
|
153
158
|
"img-list": e.images,
|
|
154
159
|
"cur-image-index": 2,
|
|
155
160
|
show: e.typeList.includes(2),
|
|
156
161
|
class: "item"
|
|
157
162
|
}, null, 8, ["img-list", "show"]),
|
|
158
|
-
t(
|
|
163
|
+
t(C, {
|
|
159
164
|
"img-list": e.images,
|
|
160
165
|
"cur-image-index": 3,
|
|
161
166
|
show: e.typeList.includes(3),
|
|
@@ -166,16 +171,16 @@ const w = (e, i) => {
|
|
|
166
171
|
})
|
|
167
172
|
]),
|
|
168
173
|
_: 1
|
|
169
|
-
})) : (n(),
|
|
174
|
+
})) : (n(), b(_, { key: 1 }, {
|
|
170
175
|
description: s(() => l[0] || (l[0] = [
|
|
171
|
-
|
|
176
|
+
o("div", null, "点击列表图片查看", -1)
|
|
172
177
|
])),
|
|
173
178
|
_: 1
|
|
174
179
|
}))
|
|
175
180
|
]);
|
|
176
181
|
};
|
|
177
182
|
}
|
|
178
|
-
}, F = /* @__PURE__ */
|
|
183
|
+
}, F = /* @__PURE__ */ x(Z, [["__scopeId", "data-v-28f92729"]]), ee = { class: "container" }, te = { class: "wrapper" }, le = ["onClick"], se = ["src", "alt"], ne = { class: "title" }, oe = { class: "image-container" }, N = 240, ae = {
|
|
179
184
|
__name: "cImage",
|
|
180
185
|
props: {
|
|
181
186
|
imageList: {
|
|
@@ -184,62 +189,62 @@ const w = (e, i) => {
|
|
|
184
189
|
}
|
|
185
190
|
},
|
|
186
191
|
setup(e) {
|
|
187
|
-
const
|
|
192
|
+
const a = e, l = y([0, 1, 2, 3]), g = y([]), c = y(-1), _ = {
|
|
188
193
|
0: "融合智能识别",
|
|
189
194
|
1: "声迅智能识别",
|
|
190
195
|
2: "海康智能识别",
|
|
191
196
|
3: "讯飞智能识别"
|
|
192
|
-
},
|
|
197
|
+
}, r = y(null), h = (R) => {
|
|
193
198
|
c.value = R;
|
|
194
|
-
const { items:
|
|
195
|
-
|
|
199
|
+
const { items: d } = a.imageList[R];
|
|
200
|
+
g.value = d.map((p) => ({
|
|
196
201
|
...p,
|
|
197
|
-
name:
|
|
202
|
+
name: _[p.type]
|
|
198
203
|
}));
|
|
199
204
|
};
|
|
200
|
-
let f = 0,
|
|
201
|
-
const
|
|
202
|
-
|
|
205
|
+
let f = 0, m = 0;
|
|
206
|
+
const I = () => {
|
|
207
|
+
m !== a.imageList.length && (m++, f -= N, r.value.style.transform = `translateX(${f}px)`);
|
|
203
208
|
}, A = () => {
|
|
204
|
-
|
|
209
|
+
m !== 0 && (m--, f += N, r.value.style.transform = `translateX(${f}px)`);
|
|
205
210
|
};
|
|
206
|
-
return (R,
|
|
207
|
-
const p =
|
|
208
|
-
return n(),
|
|
211
|
+
return (R, d) => {
|
|
212
|
+
const p = i("el-checkbox"), j = i("el-checkbox-group"), P = i("el-form-item"), E = i("el-form"), z = i("el-button");
|
|
213
|
+
return n(), u(B, null, [
|
|
209
214
|
t(E, { ref: "form" }, {
|
|
210
215
|
default: s(() => [
|
|
211
216
|
t(P, { label: "智能结果展示" }, {
|
|
212
217
|
default: s(() => [
|
|
213
218
|
t(j, {
|
|
214
219
|
modelValue: l.value,
|
|
215
|
-
"onUpdate:modelValue":
|
|
220
|
+
"onUpdate:modelValue": d[0] || (d[0] = (L) => l.value = L),
|
|
216
221
|
min: 1
|
|
217
222
|
}, {
|
|
218
223
|
default: s(() => [
|
|
219
224
|
t(p, { label: 0 }, {
|
|
220
|
-
default: s(() =>
|
|
221
|
-
|
|
225
|
+
default: s(() => d[1] || (d[1] = [
|
|
226
|
+
v("融合智能识别")
|
|
222
227
|
])),
|
|
223
228
|
_: 1,
|
|
224
229
|
__: [1]
|
|
225
230
|
}),
|
|
226
231
|
t(p, { label: 1 }, {
|
|
227
|
-
default: s(() =>
|
|
228
|
-
|
|
232
|
+
default: s(() => d[2] || (d[2] = [
|
|
233
|
+
v("声迅智能识别")
|
|
229
234
|
])),
|
|
230
235
|
_: 1,
|
|
231
236
|
__: [2]
|
|
232
237
|
}),
|
|
233
238
|
t(p, { label: 2 }, {
|
|
234
|
-
default: s(() =>
|
|
235
|
-
|
|
239
|
+
default: s(() => d[3] || (d[3] = [
|
|
240
|
+
v("海康智能识别")
|
|
236
241
|
])),
|
|
237
242
|
_: 1,
|
|
238
243
|
__: [3]
|
|
239
244
|
}),
|
|
240
245
|
t(p, { label: 3 }, {
|
|
241
|
-
default: s(() =>
|
|
242
|
-
|
|
246
|
+
default: s(() => d[4] || (d[4] = [
|
|
247
|
+
v("讯飞智能识别")
|
|
243
248
|
])),
|
|
244
249
|
_: 1,
|
|
245
250
|
__: [4]
|
|
@@ -253,30 +258,30 @@ const w = (e, i) => {
|
|
|
253
258
|
]),
|
|
254
259
|
_: 1
|
|
255
260
|
}, 512),
|
|
256
|
-
|
|
261
|
+
o("div", ee, [
|
|
257
262
|
t(z, {
|
|
258
263
|
class: "arrow-button",
|
|
259
264
|
icon: $(q),
|
|
260
265
|
circle: "",
|
|
261
|
-
onClick:
|
|
266
|
+
onClick: I
|
|
262
267
|
}, null, 8, ["icon"]),
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
ref_key: "
|
|
266
|
-
ref:
|
|
267
|
-
class: "
|
|
268
|
+
o("div", te, [
|
|
269
|
+
o("div", {
|
|
270
|
+
ref_key: "navRef",
|
|
271
|
+
ref: r,
|
|
272
|
+
class: "nav"
|
|
268
273
|
}, [
|
|
269
|
-
(n(!0),
|
|
270
|
-
key:
|
|
271
|
-
class: T(["
|
|
272
|
-
onClick: (ge) => h(
|
|
274
|
+
(n(!0), u(B, null, V(e.imageList, (L, k) => (n(), u("div", {
|
|
275
|
+
key: k,
|
|
276
|
+
class: T(["item", { active: c.value === k }]),
|
|
277
|
+
onClick: (ge) => h(k)
|
|
273
278
|
}, [
|
|
274
|
-
|
|
275
|
-
src:
|
|
276
|
-
alt: `缩略图 ${
|
|
279
|
+
o("img", {
|
|
280
|
+
src: L.items[0].url,
|
|
281
|
+
alt: `缩略图 ${k + 1}`,
|
|
277
282
|
style: { "object-fit": "contain" }
|
|
278
283
|
}, null, 8, se),
|
|
279
|
-
|
|
284
|
+
o("span", ne, w(_[L.items[0].type]), 1)
|
|
280
285
|
], 10, le))), 128))
|
|
281
286
|
], 512)
|
|
282
287
|
]),
|
|
@@ -287,16 +292,16 @@ const w = (e, i) => {
|
|
|
287
292
|
onClick: A
|
|
288
293
|
}, null, 8, ["icon"])
|
|
289
294
|
]),
|
|
290
|
-
|
|
295
|
+
o("div", oe, [
|
|
291
296
|
t(F, {
|
|
292
|
-
images:
|
|
297
|
+
images: g.value,
|
|
293
298
|
"type-list": l.value
|
|
294
299
|
}, null, 8, ["images", "type-list"])
|
|
295
300
|
])
|
|
296
301
|
], 64);
|
|
297
302
|
};
|
|
298
303
|
}
|
|
299
|
-
}, ie = /* @__PURE__ */
|
|
304
|
+
}, ie = /* @__PURE__ */ x(ae, [["__scopeId", "data-v-6692b78c"]]), ce = { class: "info" }, re = { class: "info" }, me = {
|
|
300
305
|
__name: "cImageList",
|
|
301
306
|
props: {
|
|
302
307
|
imageList: {
|
|
@@ -313,39 +318,39 @@ const w = (e, i) => {
|
|
|
313
318
|
}
|
|
314
319
|
},
|
|
315
320
|
emits: ["downFile", "showDetail"],
|
|
316
|
-
setup(e, { emit:
|
|
317
|
-
const l =
|
|
318
|
-
l("downFile",
|
|
319
|
-
}, c = (
|
|
320
|
-
l("showDetail",
|
|
321
|
+
setup(e, { emit: a }) {
|
|
322
|
+
const l = a, g = (_) => {
|
|
323
|
+
l("downFile", _);
|
|
324
|
+
}, c = (_) => {
|
|
325
|
+
l("showDetail", _);
|
|
321
326
|
};
|
|
322
|
-
return (
|
|
323
|
-
const h =
|
|
324
|
-
return n(!0),
|
|
325
|
-
key:
|
|
327
|
+
return (_, r) => {
|
|
328
|
+
const h = i("el-image"), f = i("el-button");
|
|
329
|
+
return n(!0), u(B, null, V(e.imageList, (m, I) => (n(), u("div", {
|
|
330
|
+
key: I,
|
|
326
331
|
class: "img-item",
|
|
327
332
|
style: D({ width: 100 / e.countPerRow + "%" })
|
|
328
333
|
}, [
|
|
329
334
|
t(h, {
|
|
330
|
-
src:
|
|
335
|
+
src: m.srcList[0],
|
|
331
336
|
style: { height: "300px", width: "240px" },
|
|
332
337
|
"zoom-rate": 1.2,
|
|
333
338
|
"max-scale": 7,
|
|
334
339
|
"min-scale": 0.2,
|
|
335
340
|
"show-progress": "",
|
|
336
|
-
"initial-index":
|
|
341
|
+
"initial-index": I,
|
|
337
342
|
fit: "contain",
|
|
338
|
-
onClick: (A) => c(
|
|
343
|
+
onClick: (A) => c(m)
|
|
339
344
|
}, null, 8, ["src", "initial-index", "onClick"]),
|
|
340
|
-
|
|
341
|
-
|
|
345
|
+
o("span", ce, w(m.time), 1),
|
|
346
|
+
o("span", re, w(m.name), 1),
|
|
342
347
|
t(f, {
|
|
343
348
|
type: "primary",
|
|
344
349
|
size: "small",
|
|
345
|
-
onClick: (A) =>
|
|
350
|
+
onClick: (A) => g(m)
|
|
346
351
|
}, {
|
|
347
|
-
default: s(() =>
|
|
348
|
-
|
|
352
|
+
default: s(() => r[0] || (r[0] = [
|
|
353
|
+
v("下载")
|
|
349
354
|
])),
|
|
350
355
|
_: 2,
|
|
351
356
|
__: [0]
|
|
@@ -353,7 +358,7 @@ const w = (e, i) => {
|
|
|
353
358
|
], 4))), 128);
|
|
354
359
|
};
|
|
355
360
|
}
|
|
356
|
-
}, ue = /* @__PURE__ */
|
|
361
|
+
}, ue = /* @__PURE__ */ x(me, [["__scopeId", "data-v-c9a26924"]]), _e = {
|
|
357
362
|
__name: "cImageScroll",
|
|
358
363
|
props: {
|
|
359
364
|
imageList: {
|
|
@@ -365,13 +370,13 @@ const w = (e, i) => {
|
|
|
365
370
|
default: "#ffffff"
|
|
366
371
|
}
|
|
367
372
|
},
|
|
368
|
-
setup(e, { expose:
|
|
369
|
-
const l =
|
|
370
|
-
return
|
|
373
|
+
setup(e, { expose: a }) {
|
|
374
|
+
const l = y(null);
|
|
375
|
+
return a({ setActive: (c) => {
|
|
371
376
|
l.value.setActiveItem(c);
|
|
372
|
-
} }), (c,
|
|
373
|
-
const
|
|
374
|
-
return n(),
|
|
377
|
+
} }), (c, _) => {
|
|
378
|
+
const r = i("CImageBox"), h = i("el-carousel-item"), f = i("el-carousel");
|
|
379
|
+
return n(), u("div", {
|
|
375
380
|
class: "c-image-scroll",
|
|
376
381
|
style: D({ background: e.scrollBg })
|
|
377
382
|
}, [
|
|
@@ -385,10 +390,10 @@ const w = (e, i) => {
|
|
|
385
390
|
style: { height: "100%" }
|
|
386
391
|
}, {
|
|
387
392
|
default: s(() => [
|
|
388
|
-
(n(!0),
|
|
393
|
+
(n(!0), u(B, null, V(e.imageList, (m) => (n(), b(h, { key: m }, {
|
|
389
394
|
default: s(() => [
|
|
390
|
-
t(
|
|
391
|
-
images:
|
|
395
|
+
t(r, {
|
|
396
|
+
images: m.items
|
|
392
397
|
}, null, 8, ["images"])
|
|
393
398
|
]),
|
|
394
399
|
_: 2
|
|
@@ -399,7 +404,7 @@ const w = (e, i) => {
|
|
|
399
404
|
], 4);
|
|
400
405
|
};
|
|
401
406
|
}
|
|
402
|
-
}, de = /* @__PURE__ */
|
|
407
|
+
}, de = /* @__PURE__ */ x(_e, [["__scopeId", "data-v-7f12f7d7"]]), pe = {
|
|
403
408
|
install(e) {
|
|
404
409
|
e.component("CImage", ie).component("CImageBox", F).component("CImageList", ue).component("CImageScroll", de);
|
|
405
410
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(e,_){typeof exports=="object"&&typeof module<"u"?module.exports=_(require("vue")):typeof define=="function"&&define.amd?define(["vue"],_):(e=typeof globalThis<"u"?globalThis:e||self,e.MyVueLibrary=_(e.Vue))})(this,function(e){"use strict";/*! Element Plus Icons Vue v2.3.2 */var _=e.defineComponent({name:"ArrowLeft",__name:"arrow-left",setup(t){return(n,o)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.59 30.59 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.59 30.59 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0"})]))}}),
|
|
1
|
+
(function(e,_){typeof exports=="object"&&typeof module<"u"?module.exports=_(require("vue")):typeof define=="function"&&define.amd?define(["vue"],_):(e=typeof globalThis<"u"?globalThis:e||self,e.MyVueLibrary=_(e.Vue))})(this,function(e){"use strict";/*! Element Plus Icons Vue v2.3.2 */var _=e.defineComponent({name:"ArrowLeft",__name:"arrow-left",setup(t){return(n,o)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.59 30.59 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.59 30.59 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0"})]))}}),I=_,L=e.defineComponent({name:"ArrowRight",__name:"arrow-right",setup(t){return(n,o)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M340.864 149.312a30.59 30.59 0 0 0 0 42.752L652.736 512 340.864 831.872a30.59 30.59 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"})]))}}),E=L,u=e.defineComponent({name:"Picture",__name:"picture",setup(t){return(n,o)=>(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 1024 1024"},[e.createElementVNode("path",{fill:"currentColor",d:"M160 160v704h704V160zm-32-64h768a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H128a32 32 0 0 1-32-32V128a32 32 0 0 1 32-32"}),e.createElementVNode("path",{fill:"currentColor",d:"M384 288q64 0 64 64t-64 64-64-64 64-64M185.408 876.992l-50.816-38.912L350.72 556.032a96 96 0 0 1 134.592-17.856l1.856 1.472 122.88 99.136a32 32 0 0 0 44.992-4.864l216-269.888 49.92 39.936-215.808 269.824-.256.32a96 96 0 0 1-135.04 14.464l-122.88-99.072-.64-.512a32 32 0 0 0-44.8 5.952z"})]))}}),C=u;const p=(t,n)=>{const o=t.__vccOpts||t;for(const[i,l]of n)o[i]=l;return o},b={class:"wrap"},$={class:"name"},S={class:"flex justify-center items-center h-full"},A={key:1,class:"flex justify-center items-center h-full"},g=p({__name:"cImageItem",props:{curImageIndex:{type:Number,default:0},fit:{type:String,default:"contain"},imgList:{type:Array,default:()=>[]},show:{type:Boolean,default:!0}},setup(t){const n={0:"融合智能识别",1:"声迅智能识别",2:"海康智能识别",3:"讯飞智能识别"};return(o,i)=>{const l=e.resolveComponent("el-icon"),s=e.resolveComponent("el-image");return e.openBlock(),e.createElementBlock("div",b,[e.createElementVNode("div",$,e.toDisplayString(n[t.curImageIndex]),1),t.show?(e.openBlock(),e.createBlock(s,{key:0,class:"image-item",src:t.imgList[t.curImageIndex].url,fit:t.fit,"preview-src-list":t.imgList.map(c=>c.url),"initial-index":t.curImageIndex,"show-progress":""},{error:e.withCtx(()=>[e.createElementVNode("div",S,[e.createVNode(l,null,{default:e.withCtx(()=>[e.createVNode(e.unref(C))]),_:1})])]),progress:e.withCtx(({activeIndex:c})=>[e.createElementVNode("span",null,e.toDisplayString(c+1+"-"+n[c]),1)]),_:1},8,["src","fit","preview-src-list","initial-index"])):(e.openBlock(),e.createElementBlock("div",A,[e.createVNode(l,null,{default:e.withCtx(()=>[e.createVNode(e.unref(C))]),_:1})]))])}}},[["__scopeId","data-v-0c64f028"]]),z={class:"image-box"},V=p({__name:"cImageBox",props:{images:{type:Array,default:()=>[]},typeList:{type:Array,default:()=>[0,1,2,3]}},setup(t){return(n,o)=>{const i=e.resolveComponent("el-col"),l=e.resolveComponent("el-row"),s=e.resolveComponent("el-empty");return e.openBlock(),e.createElementBlock("div",z,[t.images.length?(e.openBlock(),e.createBlock(l,{key:0,gutter:10,class:"content"},{default:e.withCtx(()=>[e.createVNode(i,{span:16,class:"left"},{default:e.withCtx(()=>[e.createVNode(g,{"img-list":t.images,"cur-image-index":0,show:t.typeList.includes(0)},null,8,["img-list","show"])]),_:1}),e.createVNode(i,{span:8,class:"right"},{default:e.withCtx(()=>[e.createVNode(g,{"img-list":t.images,"cur-image-index":1,show:t.typeList.includes(1),class:"item"},null,8,["img-list","show"]),e.createVNode(g,{"img-list":t.images,"cur-image-index":2,show:t.typeList.includes(2),class:"item"},null,8,["img-list","show"]),e.createVNode(g,{"img-list":t.images,"cur-image-index":3,show:t.typeList.includes(3),class:"item"},null,8,["img-list","show"])]),_:1})]),_:1})):(e.openBlock(),e.createBlock(s,{key:1},{description:e.withCtx(()=>o[0]||(o[0]=[e.createElementVNode("div",null,"点击列表图片查看",-1)])),_:1}))])}}},[["__scopeId","data-v-28f92729"]]),D={class:"container"},M={class:"wrapper"},R=["onClick"],T=["src","alt"],F={class:"title"},j={class:"image-container"},N=240,P=p({__name:"cImage",props:{imageList:{type:Array,default:()=>[]}},setup(t){const n=t,o=e.ref([0,1,2,3]),i=e.ref([]),l=e.ref(-1),s={0:"融合智能识别",1:"声迅智能识别",2:"海康智能识别",3:"讯飞智能识别"},c=e.ref(null),f=k=>{l.value=k;const{items:r}=n.imageList[k];i.value=r.map(d=>({...d,name:s[d.type]}))};let m=0,a=0;const h=()=>{a!==n.imageList.length&&(a++,m-=N,c.value.style.transform=`translateX(${m}px)`)},y=()=>{a!==0&&(a--,m+=N,c.value.style.transform=`translateX(${m}px)`)};return(k,r)=>{const d=e.resolveComponent("el-checkbox"),U=e.resolveComponent("el-checkbox-group"),W=e.resolveComponent("el-form-item"),G=e.resolveComponent("el-form"),B=e.resolveComponent("el-button");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createVNode(G,{ref:"form"},{default:e.withCtx(()=>[e.createVNode(W,{label:"智能结果展示"},{default:e.withCtx(()=>[e.createVNode(U,{modelValue:o.value,"onUpdate:modelValue":r[0]||(r[0]=w=>o.value=w),min:1},{default:e.withCtx(()=>[e.createVNode(d,{label:0},{default:e.withCtx(()=>r[1]||(r[1]=[e.createTextVNode("融合智能识别")])),_:1,__:[1]}),e.createVNode(d,{label:1},{default:e.withCtx(()=>r[2]||(r[2]=[e.createTextVNode("声迅智能识别")])),_:1,__:[2]}),e.createVNode(d,{label:2},{default:e.withCtx(()=>r[3]||(r[3]=[e.createTextVNode("海康智能识别")])),_:1,__:[3]}),e.createVNode(d,{label:3},{default:e.withCtx(()=>r[4]||(r[4]=[e.createTextVNode("讯飞智能识别")])),_:1,__:[4]})]),_:1},8,["modelValue"])]),_:1})]),_:1},512),e.createElementVNode("div",D,[e.createVNode(B,{class:"arrow-button",icon:e.unref(I),circle:"",onClick:h},null,8,["icon"]),e.createElementVNode("div",M,[e.createElementVNode("div",{ref_key:"navRef",ref:c,class:"nav"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.imageList,(w,x)=>(e.openBlock(),e.createElementBlock("div",{key:x,class:e.normalizeClass(["item",{active:l.value===x}]),onClick:ee=>f(x)},[e.createElementVNode("img",{src:w.items[0].url,alt:`缩略图 ${x+1}`,style:{"object-fit":"contain"}},null,8,T),e.createElementVNode("span",F,e.toDisplayString(s[w.items[0].type]),1)],10,R))),128))],512)]),e.createVNode(B,{class:"arrow-button",icon:e.unref(E),circle:"",onClick:y},null,8,["icon"])]),e.createElementVNode("div",j,[e.createVNode(V,{images:i.value,"type-list":o.value},null,8,["images","type-list"])])],64)}}},[["__scopeId","data-v-6692b78c"]]),q={class:"info"},X={class:"info"},H=p({__name:"cImageList",props:{imageList:{type:Array,default:()=>[]},width:{type:String,default:"800px"},countPerRow:{type:Number,default:5}},emits:["downFile","showDetail"],setup(t,{emit:n}){const o=n,i=s=>{o("downFile",s)},l=s=>{o("showDetail",s)};return(s,c)=>{const f=e.resolveComponent("el-image"),m=e.resolveComponent("el-button");return e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.imageList,(a,h)=>(e.openBlock(),e.createElementBlock("div",{key:h,class:"img-item",style:e.normalizeStyle({width:100/t.countPerRow+"%"})},[e.createVNode(f,{src:a.srcList[0],style:{height:"300px",width:"240px"},"zoom-rate":1.2,"max-scale":7,"min-scale":.2,"show-progress":"","initial-index":h,fit:"contain",onClick:y=>l(a)},null,8,["src","initial-index","onClick"]),e.createElementVNode("span",q,e.toDisplayString(a.time),1),e.createElementVNode("span",X,e.toDisplayString(a.name),1),e.createVNode(m,{type:"primary",size:"small",onClick:y=>i(a)},{default:e.withCtx(()=>c[0]||(c[0]=[e.createTextVNode("下载")])),_:2,__:[0]},1032,["onClick"])],4))),128)}}},[["__scopeId","data-v-c9a26924"]]),O=p({__name:"cImageScroll",props:{imageList:{type:Array,default:()=>[]},scrollBg:{type:String,default:"#ffffff"}},setup(t,{expose:n}){const o=e.ref(null);return n({setActive:l=>{o.value.setActiveItem(l)}}),(l,s)=>{const c=e.resolveComponent("CImageBox"),f=e.resolveComponent("el-carousel-item"),m=e.resolveComponent("el-carousel");return e.openBlock(),e.createElementBlock("div",{class:"c-image-scroll",style:e.normalizeStyle({background:t.scrollBg})},[e.createVNode(m,{ref_key:"carouselRef",ref:o,arrow:"always",trigger:"click",autoplay:!1,height:"100%",style:{height:"100%"}},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.imageList,a=>(e.openBlock(),e.createBlock(f,{key:a},{default:e.withCtx(()=>[e.createVNode(c,{images:a.items},null,8,["images"])]),_:2},1024))),128))]),_:1},512)],4)}}},[["__scopeId","data-v-7f12f7d7"]]);return{install(t){t.component("CImage",P).component("CImageBox",V).component("CImageList",H).component("CImageScroll",O)}}});
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@charset "UTF-8";.wrap[data-v-
|
|
1
|
+
@charset "UTF-8";.wrap[data-v-0c64f028]{width:100%;height:100%;position:relative;border:1px solid #eee}.wrap .name[data-v-0c64f028]{position:absolute;top:20px;left:20px;z-index:1;padding:5px;font-size:16px}.wrap .image-item[data-v-0c64f028]{width:100%;height:100%}.wrap .preview-name[data-v-0c64f028]{position:absolute;top:20px;left:20px;z-index:1;padding:5px;font-size:16px}.image-box[data-v-28f92729]{width:100%;height:100%;position:relative;overflow-y:auto}.image-box .content[data-v-28f92729]{width:100%;height:100%;height:calc(100% - 5px)}.image-box .content .left[data-v-28f92729],.image-box .content .right[data-v-28f92729]{height:100%;display:flex;flex-direction:column}.image-box .content .left .item[data-v-28f92729],.image-box .content .right .item[data-v-28f92729]{flex:1;overflow:hidden}.empty-state[data-v-28f92729]{padding:40px 0;text-align:center;color:#999;border:1px dashed #ddd;border-radius:8px;margin-top:15px}.image-container[data-v-6692b78c]{height:100%;position:relative;overflow-y:auto}.container[data-v-6692b78c]{width:100%;margin-top:10px;padding:5px 0;display:flex;align-items:center;gap:8px}.container .wrapper[data-v-6692b78c]{flex:1;display:flex;overflow-x:auto}.container .wrapper .nav[data-v-6692b78c]{display:flex;gap:10px}.item[data-v-6692b78c]{position:relative;width:240px;height:160px;flex-shrink:0;border-radius:8px;overflow:hidden;cursor:pointer;opacity:.7;transition:all .3s;box-sizing:border-box;border:2px solid #e0e0e0}.item.active[data-v-6692b78c]{opacity:1;border:2px solid #2196f3}.item .title[data-v-6692b78c]{position:absolute;right:5px;top:5px;font-size:12px;color:#666}.item img[data-v-6692b78c]{width:100%;height:100%;object-fit:cover;display:block;text-align:center;line-height:9}.nav[data-v-6692b78c]::-webkit-scrollbar{display:none}.nav[data-v-6692b78c]{-ms-overflow-style:none;scrollbar-width:none}.nav[data-v-6692b78c]:before,.nav[data-v-6692b78c]:after{content:"";position:absolute;top:0;bottom:0;width:30px;pointer-events:none;z-index:1}.nav[data-v-6692b78c]:before{left:0;background:linear-gradient(to right,#fff,transparent)}.nav[data-v-6692b78c]:after{right:0;background:linear-gradient(to left,#fff,transparent)}.info-meta p[data-v-6692b78c]{margin-bottom:10px;color:#666;font-size:14px;display:flex}.info-meta span[data-v-6692b78c]{width:80px;color:#999}@keyframes fadeInUp-6692b78c{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.container[data-v-6692b78c]{height:100px}}.icon-plus[data-v-6692b78c]:before{content:"+";font-weight:700}.img-item[data-v-c9a26924]{position:relative;display:flex;flex-direction:column;align-items:center}.img-item[data-v-c9a26924] .el-image{cursor:pointer}.img-item .info[data-v-c9a26924]{line-height:25px;font-size:14px}.img-item .big-img-wrap[data-v-c9a26924]{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080}.c-image-scroll[data-v-7f12f7d7]{width:100%;height:100%}
|