workdesktop-ai 1.2.3 → 1.2.4
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/dist/api-button/index.mjs +1 -1
- package/dist/auto-complete/index.mjs +1 -1
- package/dist/checkbox-list/index.mjs +1 -1
- package/dist/chunks/{ApiButton.vue_vue_type_script_setup_true_lang-3BjZSAPZ.mjs → ApiButton.vue_vue_type_script_setup_true_lang-GBEBLUxz.mjs} +2 -2
- package/dist/chunks/{ApiButton.vue_vue_type_script_setup_true_lang-3BjZSAPZ.mjs.map → ApiButton.vue_vue_type_script_setup_true_lang-GBEBLUxz.mjs.map} +1 -1
- package/dist/chunks/{AutoComplete-C6Nxatvt.mjs → AutoComplete-DqyhsqiS.mjs} +2 -2
- package/dist/chunks/{AutoComplete-C6Nxatvt.mjs.map → AutoComplete-DqyhsqiS.mjs.map} +1 -1
- package/dist/chunks/{CheckboxList-5AEx33r5.mjs → CheckboxList-RxJGe-LQ.mjs} +2 -2
- package/dist/chunks/{CheckboxList-5AEx33r5.mjs.map → CheckboxList-RxJGe-LQ.mjs.map} +1 -1
- package/dist/chunks/{ConfirmButton.vue_vue_type_script_setup_true_lang-CXYH1Rlc.mjs → ConfirmButton.vue_vue_type_script_setup_true_lang-BPtvM5GB.mjs} +2 -2
- package/dist/chunks/{ConfirmButton.vue_vue_type_script_setup_true_lang-CXYH1Rlc.mjs.map → ConfirmButton.vue_vue_type_script_setup_true_lang-BPtvM5GB.mjs.map} +1 -1
- package/dist/chunks/{DataForm-C6VLTSOm.mjs → DataForm-DYMderSS.mjs} +8 -7
- package/dist/chunks/{DataForm-C6VLTSOm.mjs.map → DataForm-DYMderSS.mjs.map} +1 -1
- package/dist/chunks/{DataGrid-Dd7n5JM7.mjs → DataGrid-DWAhwLVk.mjs} +3 -3
- package/dist/chunks/{DataGrid-Dd7n5JM7.mjs.map → DataGrid-DWAhwLVk.mjs.map} +1 -1
- package/dist/chunks/{DialogButton.vue_vue_type_script_setup_true_lang-CTXP79zc.mjs → DialogButton.vue_vue_type_script_setup_true_lang-ex2zYLZC.mjs} +2 -2
- package/dist/chunks/{DialogButton.vue_vue_type_script_setup_true_lang-CTXP79zc.mjs.map → DialogButton.vue_vue_type_script_setup_true_lang-ex2zYLZC.mjs.map} +1 -1
- package/dist/chunks/{Drawer-ucXKUecL.mjs → Drawer-BzdohcBg.mjs} +96 -90
- package/dist/chunks/Drawer-BzdohcBg.mjs.map +1 -0
- package/dist/chunks/{DrawerButton.vue_vue_type_script_setup_true_lang-DUda4p7_.mjs → DrawerButton.vue_vue_type_script_setup_true_lang-u5ifQw5k.mjs} +2 -2
- package/dist/chunks/{DrawerButton.vue_vue_type_script_setup_true_lang-DUda4p7_.mjs.map → DrawerButton.vue_vue_type_script_setup_true_lang-u5ifQw5k.mjs.map} +1 -1
- package/dist/chunks/{EditableGrid-CDeeVkaX.mjs → EditableGrid-e3wwCaem.mjs} +6 -5
- package/dist/chunks/{EditableGrid-CDeeVkaX.mjs.map → EditableGrid-e3wwCaem.mjs.map} +1 -1
- package/dist/chunks/Guide-AWaWvQoq.mjs +347 -0
- package/dist/chunks/Guide-AWaWvQoq.mjs.map +1 -0
- package/dist/chunks/Iframe-DcFFi0S9.mjs +128 -0
- package/dist/chunks/Iframe-DcFFi0S9.mjs.map +1 -0
- package/dist/chunks/{ImageUpload-CQA9XQ7Q.mjs → ImageUpload-BK7tbU2o.mjs} +5 -4
- package/dist/chunks/{ImageUpload-CQA9XQ7Q.mjs.map → ImageUpload-BK7tbU2o.mjs.map} +1 -1
- package/dist/chunks/{PromptButton.vue_vue_type_script_setup_true_lang-oYaMH-CI.mjs → PromptButton.vue_vue_type_script_setup_true_lang-82Mxc2Qv.mjs} +2 -2
- package/dist/chunks/{PromptButton.vue_vue_type_script_setup_true_lang-oYaMH-CI.mjs.map → PromptButton.vue_vue_type_script_setup_true_lang-82Mxc2Qv.mjs.map} +1 -1
- package/dist/chunks/{RadioList-BUWcP_Pk.mjs → RadioList-DuEeHumw.mjs} +2 -2
- package/dist/chunks/{RadioList-BUWcP_Pk.mjs.map → RadioList-DuEeHumw.mjs.map} +1 -1
- package/dist/chunks/Requester.vue_vue_type_script_setup_true_lang-xCw4QHCA.mjs +63 -0
- package/dist/chunks/Requester.vue_vue_type_script_setup_true_lang-xCw4QHCA.mjs.map +1 -0
- package/dist/chunks/{Select-uvFy7_NU.mjs → Select-MD3taMJo.mjs} +2 -2
- package/dist/chunks/{Select-uvFy7_NU.mjs.map → Select-MD3taMJo.mjs.map} +1 -1
- package/dist/chunks/{Station-BTP0SbBg.mjs → Station-2m9uznh3.mjs} +2 -2
- package/dist/chunks/{Station-BTP0SbBg.mjs.map → Station-2m9uznh3.mjs.map} +1 -1
- package/dist/chunks/{Switch.vue_vue_type_script_setup_true_lang-DUhXAGs2.mjs → Switch.vue_vue_type_script_setup_true_lang-vok-8-BT.mjs} +2 -2
- package/dist/chunks/{Switch.vue_vue_type_script_setup_true_lang-DUhXAGs2.mjs.map → Switch.vue_vue_type_script_setup_true_lang-vok-8-BT.mjs.map} +1 -1
- package/dist/chunks/Tips-B_18E4mc.mjs +71 -0
- package/dist/chunks/Tips-B_18E4mc.mjs.map +1 -0
- package/dist/chunks/{Upload.vue_vue_type_script_setup_true_lang-CHGCjpKK.mjs → Upload.vue_vue_type_script_setup_true_lang-DVDw-3mF.mjs} +5 -4
- package/dist/chunks/{Upload.vue_vue_type_script_setup_true_lang-CHGCjpKK.mjs.map → Upload.vue_vue_type_script_setup_true_lang-DVDw-3mF.mjs.map} +1 -1
- package/dist/chunks/{Viewer-CjLSQTrw.mjs → Viewer-FSV6xObc.mjs} +2 -2
- package/dist/chunks/{Viewer-CjLSQTrw.mjs.map → Viewer-FSV6xObc.mjs.map} +1 -1
- package/dist/chunks/config-B6nWG5dv.mjs +1378 -0
- package/dist/chunks/config-B6nWG5dv.mjs.map +1 -0
- package/dist/chunks/http-BKKP0gEJ.mjs +2774 -0
- package/dist/chunks/http-BKKP0gEJ.mjs.map +1 -0
- package/dist/chunks/{useApiAction-DxVQWWxv.mjs → useApiAction-71XPKjlQ.mjs} +2 -2
- package/dist/chunks/{useApiAction-DxVQWWxv.mjs.map → useApiAction-71XPKjlQ.mjs.map} +1 -1
- package/dist/chunks/{useColumnSettings-BwG2V9xp.mjs → useColumnSettings-CbiWd27-.mjs} +22 -21
- package/dist/chunks/{useColumnSettings-BwG2V9xp.mjs.map → useColumnSettings-CbiWd27-.mjs.map} +1 -1
- package/dist/chunks/useConfig-CPioiLWJ.mjs +23 -0
- package/dist/chunks/useConfig-CPioiLWJ.mjs.map +1 -0
- package/dist/chunks/{useOptionsLoader-DEVCYhrp.mjs → useOptionsLoader-D4Jh4f1F.mjs} +2 -2
- package/dist/chunks/{useOptionsLoader-DEVCYhrp.mjs.map → useOptionsLoader-D4Jh4f1F.mjs.map} +1 -1
- package/dist/confirm-button/index.mjs +1 -1
- package/dist/data-form/index.mjs +1 -1
- package/dist/data-grid/index.mjs +1 -1
- package/dist/dialog-button/index.mjs +1 -1
- package/dist/drawer/index.mjs +1 -1
- package/dist/drawer/style.css +1 -1
- package/dist/drawer-button/index.mjs +1 -1
- package/dist/editable-grid/index.mjs +1 -1
- package/dist/guide/index.mjs +7 -0
- package/dist/guide/index.mjs.map +1 -0
- package/dist/guide/style.css +1 -0
- package/dist/iframe/index.mjs +1 -1
- package/dist/iframe/style.css +1 -1
- package/dist/image-upload/index.mjs +1 -1
- package/dist/index.esm.js +194 -189
- package/dist/index.esm.js.map +1 -1
- package/dist/index.umd.js +25 -21
- package/dist/index.umd.js.map +1 -1
- package/dist/prompt-button/index.mjs +1 -1
- package/dist/radio-list/index.mjs +1 -1
- package/dist/requester/index.mjs +1 -1
- package/dist/select/index.mjs +1 -1
- package/dist/station/index.mjs +1 -1
- package/dist/station/style.css +1 -1
- package/dist/style.css +1 -1
- package/dist/switch/index.mjs +1 -1
- package/dist/tips/index.mjs +1 -1
- package/dist/tips/style.css +1 -1
- package/dist/types/src/components/buttons/ApiButton.vue.d.ts +3 -3
- package/dist/types/src/components/buttons/ConfirmButton.vue.d.ts +5 -5
- package/dist/types/src/components/buttons/DialogButton.vue.d.ts +3 -3
- package/dist/types/src/components/buttons/DrawerButton.vue.d.ts +4 -4
- package/dist/types/src/components/buttons/PopconfirmButton.vue.d.ts +6 -6
- package/dist/types/src/components/buttons/PromptButton.vue.d.ts +5 -5
- package/dist/types/src/components/buttons/RouteButton.vue.d.ts +1 -1
- package/dist/types/src/components/buttons/TipsButton.vue.d.ts +1 -1
- package/dist/types/src/components/containers/Drawer.vue.d.ts +4 -4
- package/dist/types/src/components/containers/Iframe.vue.d.ts +42 -0
- package/dist/types/src/components/data/datagrid/DataGrid.vue.d.ts +5 -5
- package/dist/types/src/components/data/editable-grid/EditableGrid.vue.d.ts +7 -7
- package/dist/types/src/components/data/viewer/Viewer.vue.d.ts +1 -1
- package/dist/types/src/components/form/FormItem.vue.d.ts +1 -1
- package/dist/types/src/components/form/SearchItem.vue.d.ts +1 -1
- package/dist/types/src/components/form/data-form/DataForm.vue.d.ts +10 -10
- package/dist/types/src/components/guide/Guide.vue.d.ts +116 -0
- package/dist/types/src/components/index.d.ts +2 -1
- package/dist/types/src/components/inputs/AutoComplete.vue.d.ts +6 -6
- package/dist/types/src/components/inputs/CheckboxList.vue.d.ts +6 -6
- package/dist/types/src/components/inputs/RadioList.vue.d.ts +6 -6
- package/dist/types/src/components/inputs/Select.vue.d.ts +6 -6
- package/dist/types/src/components/inputs/Switch.vue.d.ts +9 -9
- package/dist/types/src/components/styles/Path.vue.d.ts +1 -1
- package/dist/types/src/components/styles/Tips.vue.d.ts +17 -0
- package/dist/types/src/components/upload/ImageUpload.vue.d.ts +5 -5
- package/dist/types/src/components/upload/Upload.vue.d.ts +5 -5
- package/dist/types/src/entries/guide.d.ts +9 -0
- package/dist/upload/index.mjs +1 -1
- package/dist/viewer/index.mjs +1 -1
- package/package.json +1 -1
- package/dist/chunks/Drawer-ucXKUecL.mjs.map +0 -1
- package/dist/chunks/Iframe-CeSiMnvR.mjs +0 -65
- package/dist/chunks/Iframe-CeSiMnvR.mjs.map +0 -1
- package/dist/chunks/Requester.vue_vue_type_script_setup_true_lang-DkLqAjug.mjs +0 -80
- package/dist/chunks/Requester.vue_vue_type_script_setup_true_lang-DkLqAjug.mjs.map +0 -1
- package/dist/chunks/Tips-IWCZcR1K.mjs +0 -63
- package/dist/chunks/Tips-IWCZcR1K.mjs.map +0 -1
- package/dist/chunks/http-C06mNpwY.mjs +0 -4141
- package/dist/chunks/http-C06mNpwY.mjs.map +0 -1
|
@@ -0,0 +1,347 @@
|
|
|
1
|
+
import { defineComponent as he, ref as m, computed as V, watch as le, onMounted as pe, onBeforeUnmount as me, resolveComponent as ne, openBlock as i, createBlock as D, Teleport as we, createVNode as q, Transition as ge, withCtx as E, createElementBlock as f, createElementVNode as B, createCommentVNode as w, normalizeStyle as oe, normalizeClass as O, withModifiers as ke, unref as ye, renderSlot as xe, toDisplayString as I, createTextVNode as U, Fragment as _e, renderList as be, nextTick as ae } from "vue";
|
|
2
|
+
import { Close as Ce } from "@element-plus/icons-vue";
|
|
3
|
+
import { _ as Te } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
|
|
4
|
+
const $e = ["width", "height"], Ve = ["width", "height"], Be = ["x", "y", "width", "height", "rx", "ry"], Me = ["width", "height", "fill", "mask"], Se = {
|
|
5
|
+
key: 0,
|
|
6
|
+
class: "wd-guide__title"
|
|
7
|
+
}, Ee = {
|
|
8
|
+
key: 1,
|
|
9
|
+
class: "wd-guide__desc"
|
|
10
|
+
}, Ie = { class: "wd-guide__footer" }, We = {
|
|
11
|
+
key: 1,
|
|
12
|
+
class: "wd-guide__skip-placeholder"
|
|
13
|
+
}, Ae = {
|
|
14
|
+
key: 2,
|
|
15
|
+
class: "wd-guide__dots"
|
|
16
|
+
}, Pe = ["aria-label", "onClick"], Re = { class: "wd-guide__actions" }, g = 12, p = 8, Le = /* @__PURE__ */ he({
|
|
17
|
+
name: "WdGuide",
|
|
18
|
+
__name: "Guide",
|
|
19
|
+
props: {
|
|
20
|
+
modelValue: { type: Boolean, default: !1 },
|
|
21
|
+
steps: {},
|
|
22
|
+
maskColor: { default: "rgba(0, 0, 0, 0.6)" },
|
|
23
|
+
padding: { default: 8 },
|
|
24
|
+
closeOnClickModal: { type: Boolean, default: !1 },
|
|
25
|
+
showClose: { type: Boolean, default: !0 },
|
|
26
|
+
showSkip: { type: Boolean, default: !0 },
|
|
27
|
+
showDots: { type: Boolean, default: !0 },
|
|
28
|
+
showPanel: { type: Boolean, default: !0 },
|
|
29
|
+
keyboard: { type: Boolean, default: !0 },
|
|
30
|
+
scrollIntoView: { type: Boolean, default: !0 },
|
|
31
|
+
appendTo: { default: "body" },
|
|
32
|
+
skipText: { default: "跳过" },
|
|
33
|
+
prevText: { default: "上一步" },
|
|
34
|
+
nextText: { default: "下一步" },
|
|
35
|
+
finishText: { default: "完成" }
|
|
36
|
+
},
|
|
37
|
+
emits: [
|
|
38
|
+
"update:modelValue",
|
|
39
|
+
"change",
|
|
40
|
+
"finish",
|
|
41
|
+
"skip",
|
|
42
|
+
"close"
|
|
43
|
+
],
|
|
44
|
+
setup(r, { expose: ie, emit: ue }) {
|
|
45
|
+
const c = r, M = ue, W = m(!1), a = m(0), _ = m(null), k = m({ w: 0, h: 0 }), u = m({ x: 0, y: 0, w: 0, h: 0 }), H = m({}), y = m("bottom"), G = m("bottom"), b = m(null), K = `wd-guide-mask-${Math.random().toString(36).slice(2, 9)}`, C = V(() => c.steps.length), l = V(() => c.steps[a.value]), j = V(() => _.value), J = V(() => c.appendTo === "none" ? "none" : c.appendTo), N = V(() => !l.value || l.value.highlight === "circle" ? Math.max(u.value.w, u.value.h) / 2 : 6), se = V(() => {
|
|
46
|
+
var e;
|
|
47
|
+
return {
|
|
48
|
+
left: `${u.value.x}px`,
|
|
49
|
+
top: `${u.value.y}px`,
|
|
50
|
+
width: `${u.value.w}px`,
|
|
51
|
+
height: `${u.value.h}px`,
|
|
52
|
+
borderRadius: ((e = l.value) == null ? void 0 : e.highlight) === "circle" ? "50%" : `${N.value}px`
|
|
53
|
+
};
|
|
54
|
+
});
|
|
55
|
+
function Q(e) {
|
|
56
|
+
if (!e) return null;
|
|
57
|
+
if (typeof e.target != "string") return e.target;
|
|
58
|
+
try {
|
|
59
|
+
return document.querySelector(e.target);
|
|
60
|
+
} catch {
|
|
61
|
+
return null;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
function re() {
|
|
65
|
+
return {
|
|
66
|
+
w: document.documentElement.clientWidth || window.innerWidth,
|
|
67
|
+
h: document.documentElement.clientHeight || window.innerHeight
|
|
68
|
+
};
|
|
69
|
+
}
|
|
70
|
+
function ce(e, t, s) {
|
|
71
|
+
var S, ee, te;
|
|
72
|
+
const n = ((S = l.value) == null ? void 0 : S.placement) || "bottom";
|
|
73
|
+
if (n === "center") return "center";
|
|
74
|
+
const o = ((ee = b.value) == null ? void 0 : ee.offsetWidth) || 320, v = ((te = b.value) == null ? void 0 : te.offsetHeight) || 160, T = t.y - g - v >= p, h = t.y + t.h + g + v <= s.h - p, d = t.x - g - o >= p, $ = t.x + t.w + g + o <= s.w - p;
|
|
75
|
+
switch (n) {
|
|
76
|
+
case "top":
|
|
77
|
+
if (T) return "top";
|
|
78
|
+
if (h) return "bottom";
|
|
79
|
+
break;
|
|
80
|
+
case "left":
|
|
81
|
+
if (d) return "left";
|
|
82
|
+
if ($) return "right";
|
|
83
|
+
break;
|
|
84
|
+
case "right":
|
|
85
|
+
if ($) return "right";
|
|
86
|
+
if (d) return "left";
|
|
87
|
+
break;
|
|
88
|
+
case "bottom":
|
|
89
|
+
default:
|
|
90
|
+
if (h) return "bottom";
|
|
91
|
+
if (T) return "top";
|
|
92
|
+
break;
|
|
93
|
+
}
|
|
94
|
+
return $ ? "right" : d ? "left" : "center";
|
|
95
|
+
}
|
|
96
|
+
function X(e, t, s) {
|
|
97
|
+
var $, S;
|
|
98
|
+
if (e === "center") {
|
|
99
|
+
H.value = {
|
|
100
|
+
left: "50%",
|
|
101
|
+
top: "50%",
|
|
102
|
+
transform: "translate(-50%, -50%)"
|
|
103
|
+
};
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
const n = (($ = b.value) == null ? void 0 : $.offsetWidth) || 320, o = ((S = b.value) == null ? void 0 : S.offsetHeight) || 160, v = t.x + t.w / 2, T = t.y + t.h / 2;
|
|
107
|
+
let h = 0, d = 0;
|
|
108
|
+
switch (e) {
|
|
109
|
+
case "bottom":
|
|
110
|
+
h = v - n / 2, d = t.y + t.h + g;
|
|
111
|
+
break;
|
|
112
|
+
case "top":
|
|
113
|
+
h = v - n / 2, d = t.y - g - o;
|
|
114
|
+
break;
|
|
115
|
+
case "right":
|
|
116
|
+
h = t.x + t.w + g, d = T - o / 2;
|
|
117
|
+
break;
|
|
118
|
+
case "left":
|
|
119
|
+
h = t.x - g - n, d = T - o / 2;
|
|
120
|
+
break;
|
|
121
|
+
}
|
|
122
|
+
h = Math.min(Math.max(h, p), Math.max(p, s.w - n - p)), d = Math.min(Math.max(d, p), Math.max(p, s.h - o - p)), H.value = { left: `${h}px`, top: `${d}px` };
|
|
123
|
+
}
|
|
124
|
+
let F = 0;
|
|
125
|
+
function A() {
|
|
126
|
+
cancelAnimationFrame(F), F = requestAnimationFrame(() => {
|
|
127
|
+
const e = re();
|
|
128
|
+
k.value = e;
|
|
129
|
+
const t = l.value;
|
|
130
|
+
if (_.value = Q(t), !_.value || !t || t.highlight === "none") {
|
|
131
|
+
u.value = { x: 0, y: 0, w: 0, h: 0 }, y.value = ((t == null ? void 0 : t.placement) === "center", "center"), G.value = "bottom", b.value && X("center", u.value, e);
|
|
132
|
+
return;
|
|
133
|
+
}
|
|
134
|
+
const s = _.value.getBoundingClientRect(), n = t.padding ?? c.padding, o = {
|
|
135
|
+
x: s.left - n,
|
|
136
|
+
y: s.top - n,
|
|
137
|
+
w: s.width + n * 2,
|
|
138
|
+
h: s.height + n * 2
|
|
139
|
+
};
|
|
140
|
+
u.value = o, y.value = ce(n, o, e), G.value = y.value === "center" ? "bottom" : y.value, X(y.value, o, e);
|
|
141
|
+
});
|
|
142
|
+
}
|
|
143
|
+
function de() {
|
|
144
|
+
var t;
|
|
145
|
+
const e = l.value;
|
|
146
|
+
!e || e.scrollIntoView === !1 || (e.scrollIntoView ?? c.scrollIntoView) !== !1 && ((t = _.value) == null || t.scrollIntoView({ behavior: "smooth", block: "center", inline: "center" }));
|
|
147
|
+
}
|
|
148
|
+
function Y() {
|
|
149
|
+
_.value = Q(l.value), ae(() => {
|
|
150
|
+
A(), de();
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
function P(e) {
|
|
154
|
+
e < 0 || e >= C.value || e === a.value || (a.value = e, M("change", e), Y());
|
|
155
|
+
}
|
|
156
|
+
function R() {
|
|
157
|
+
if (a.value >= C.value - 1) {
|
|
158
|
+
x("finish");
|
|
159
|
+
return;
|
|
160
|
+
}
|
|
161
|
+
P(a.value + 1);
|
|
162
|
+
}
|
|
163
|
+
function L() {
|
|
164
|
+
P(a.value - 1);
|
|
165
|
+
}
|
|
166
|
+
function x(e) {
|
|
167
|
+
W.value = !1, M("update:modelValue", !1), e === "finish" ? M("finish", a.value) : e === "skip" ? M("skip", a.value) : M("close");
|
|
168
|
+
}
|
|
169
|
+
function fe() {
|
|
170
|
+
c.closeOnClickModal && x("close");
|
|
171
|
+
}
|
|
172
|
+
function ve(e) {
|
|
173
|
+
c.keyboard && (e.key === "Escape" ? x(c.showClose ? "close" : "skip") : e.key === "ArrowRight" || e.key === "ArrowDown" ? (e.preventDefault(), R()) : (e.key === "ArrowLeft" || e.key === "ArrowUp") && (e.preventDefault(), L()));
|
|
174
|
+
}
|
|
175
|
+
function z() {
|
|
176
|
+
A();
|
|
177
|
+
}
|
|
178
|
+
function Z() {
|
|
179
|
+
C.value !== 0 && (W.value = !0, a.value = 0, ae(() => Y()));
|
|
180
|
+
}
|
|
181
|
+
return le(
|
|
182
|
+
() => c.modelValue,
|
|
183
|
+
(e) => {
|
|
184
|
+
e ? Z() : W.value = !1;
|
|
185
|
+
},
|
|
186
|
+
{ immediate: !0 }
|
|
187
|
+
), le(() => c.steps, () => A(), { deep: !1 }), pe(() => {
|
|
188
|
+
window.addEventListener("resize", z), window.addEventListener("scroll", z, !0);
|
|
189
|
+
}), me(() => {
|
|
190
|
+
cancelAnimationFrame(F), window.removeEventListener("resize", z), window.removeEventListener("scroll", z, !0);
|
|
191
|
+
}), ie({
|
|
192
|
+
/** 打开指引(默认从第 0 步开始) */
|
|
193
|
+
open: Z,
|
|
194
|
+
/** 关闭指引 */
|
|
195
|
+
close: () => x("close"),
|
|
196
|
+
/** 下一步(最后一步时完成) */
|
|
197
|
+
next: R,
|
|
198
|
+
/** 上一步 */
|
|
199
|
+
prev: L,
|
|
200
|
+
/** 跳转到指定步骤 */
|
|
201
|
+
goTo: P,
|
|
202
|
+
/** 重新计算目标位置(目标元素移动/尺寸变化后调用) */
|
|
203
|
+
refresh: A
|
|
204
|
+
}), (e, t) => {
|
|
205
|
+
const s = ne("el-icon"), n = ne("el-button");
|
|
206
|
+
return i(), D(we, {
|
|
207
|
+
to: J.value,
|
|
208
|
+
disabled: J.value === "none"
|
|
209
|
+
}, [
|
|
210
|
+
q(ge, { name: "wd-guide-fade" }, {
|
|
211
|
+
default: E(() => [
|
|
212
|
+
W.value ? (i(), f("div", {
|
|
213
|
+
key: 0,
|
|
214
|
+
class: "wd-guide",
|
|
215
|
+
onClick: fe,
|
|
216
|
+
onKeydown: ve,
|
|
217
|
+
tabindex: "-1"
|
|
218
|
+
}, [
|
|
219
|
+
(i(), f("svg", {
|
|
220
|
+
class: "wd-guide__mask",
|
|
221
|
+
width: k.value.w,
|
|
222
|
+
height: k.value.h
|
|
223
|
+
}, [
|
|
224
|
+
B("defs", null, [
|
|
225
|
+
B("mask", { id: K }, [
|
|
226
|
+
B("rect", {
|
|
227
|
+
x: "0",
|
|
228
|
+
y: "0",
|
|
229
|
+
width: k.value.w,
|
|
230
|
+
height: k.value.h,
|
|
231
|
+
fill: "#fff"
|
|
232
|
+
}, null, 8, Ve),
|
|
233
|
+
j.value && l.value && l.value.highlight !== "none" ? (i(), f("rect", {
|
|
234
|
+
key: 0,
|
|
235
|
+
x: u.value.x,
|
|
236
|
+
y: u.value.y,
|
|
237
|
+
width: u.value.w,
|
|
238
|
+
height: u.value.h,
|
|
239
|
+
rx: N.value,
|
|
240
|
+
ry: N.value,
|
|
241
|
+
fill: "#000"
|
|
242
|
+
}, null, 8, Be)) : w("", !0)
|
|
243
|
+
])
|
|
244
|
+
]),
|
|
245
|
+
B("rect", {
|
|
246
|
+
x: "0",
|
|
247
|
+
y: "0",
|
|
248
|
+
width: k.value.w,
|
|
249
|
+
height: k.value.h,
|
|
250
|
+
fill: r.maskColor,
|
|
251
|
+
mask: `url(#${K})`
|
|
252
|
+
}, null, 8, Me)
|
|
253
|
+
], 8, $e)),
|
|
254
|
+
j.value && l.value && l.value.highlight !== "none" ? (i(), f("div", {
|
|
255
|
+
key: 0,
|
|
256
|
+
class: O(["wd-guide__spot", [`is-${l.value.highlight}`, `is-${G.value}`]]),
|
|
257
|
+
style: oe(se.value)
|
|
258
|
+
}, null, 6)) : w("", !0),
|
|
259
|
+
l.value && r.showPanel ? (i(), f("div", {
|
|
260
|
+
key: 1,
|
|
261
|
+
ref_key: "panelRef",
|
|
262
|
+
ref: b,
|
|
263
|
+
class: O(["wd-guide__panel", [`is-${y.value}`, { "is-centered": y.value === "center" }]]),
|
|
264
|
+
style: oe(H.value),
|
|
265
|
+
onClick: t[4] || (t[4] = ke(() => {
|
|
266
|
+
}, ["stop"]))
|
|
267
|
+
}, [
|
|
268
|
+
r.showClose ? (i(), D(s, {
|
|
269
|
+
key: 0,
|
|
270
|
+
class: "wd-guide__close",
|
|
271
|
+
onClick: t[0] || (t[0] = (o) => x("close"))
|
|
272
|
+
}, {
|
|
273
|
+
default: E(() => [
|
|
274
|
+
q(ye(Ce))
|
|
275
|
+
]),
|
|
276
|
+
_: 1
|
|
277
|
+
})) : w("", !0),
|
|
278
|
+
xe(e.$slots, "panel", {
|
|
279
|
+
step: l.value,
|
|
280
|
+
index: a.value,
|
|
281
|
+
total: C.value,
|
|
282
|
+
current: a.value,
|
|
283
|
+
prev: L,
|
|
284
|
+
next: R,
|
|
285
|
+
close: x
|
|
286
|
+
}, () => [
|
|
287
|
+
l.value.title ? (i(), f("div", Se, I(l.value.title), 1)) : w("", !0),
|
|
288
|
+
l.value.description ? (i(), f("div", Ee, I(l.value.description), 1)) : w("", !0),
|
|
289
|
+
B("div", Ie, [
|
|
290
|
+
r.showSkip && a.value < C.value - 1 ? (i(), D(n, {
|
|
291
|
+
key: 0,
|
|
292
|
+
link: "",
|
|
293
|
+
type: "info",
|
|
294
|
+
class: "wd-guide__skip",
|
|
295
|
+
onClick: t[1] || (t[1] = (o) => x("skip"))
|
|
296
|
+
}, {
|
|
297
|
+
default: E(() => [
|
|
298
|
+
U(I(r.skipText), 1)
|
|
299
|
+
]),
|
|
300
|
+
_: 1
|
|
301
|
+
})) : (i(), f("span", We)),
|
|
302
|
+
r.showDots ? (i(), f("div", Ae, [
|
|
303
|
+
(i(!0), f(_e, null, be(r.steps, (o, v) => (i(), f("button", {
|
|
304
|
+
key: v,
|
|
305
|
+
type: "button",
|
|
306
|
+
class: O(["wd-guide__dot", { "is-active": v === a.value }]),
|
|
307
|
+
"aria-label": `第 ${v + 1} 步`,
|
|
308
|
+
onClick: (T) => P(v)
|
|
309
|
+
}, null, 10, Pe))), 128))
|
|
310
|
+
])) : w("", !0),
|
|
311
|
+
B("div", Re, [
|
|
312
|
+
a.value > 0 ? (i(), D(n, {
|
|
313
|
+
key: 0,
|
|
314
|
+
size: "small",
|
|
315
|
+
onClick: t[2] || (t[2] = (o) => L())
|
|
316
|
+
}, {
|
|
317
|
+
default: E(() => [
|
|
318
|
+
U(I(r.prevText), 1)
|
|
319
|
+
]),
|
|
320
|
+
_: 1
|
|
321
|
+
})) : w("", !0),
|
|
322
|
+
q(n, {
|
|
323
|
+
type: "primary",
|
|
324
|
+
size: "small",
|
|
325
|
+
onClick: t[3] || (t[3] = (o) => R())
|
|
326
|
+
}, {
|
|
327
|
+
default: E(() => [
|
|
328
|
+
U(I(a.value < C.value - 1 ? r.nextText : r.finishText), 1)
|
|
329
|
+
]),
|
|
330
|
+
_: 1
|
|
331
|
+
})
|
|
332
|
+
])
|
|
333
|
+
])
|
|
334
|
+
], !0)
|
|
335
|
+
], 6)) : w("", !0)
|
|
336
|
+
], 32)) : w("", !0)
|
|
337
|
+
]),
|
|
338
|
+
_: 3
|
|
339
|
+
})
|
|
340
|
+
], 8, ["to", "disabled"]);
|
|
341
|
+
};
|
|
342
|
+
}
|
|
343
|
+
}), Ge = /* @__PURE__ */ Te(Le, [["__scopeId", "data-v-9093809e"]]);
|
|
344
|
+
export {
|
|
345
|
+
Ge as W
|
|
346
|
+
};
|
|
347
|
+
//# sourceMappingURL=Guide-AWaWvQoq.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Guide-AWaWvQoq.mjs","sources":["../../src/components/guide/Guide.vue"],"sourcesContent":["<template>\n <Teleport :to=\"teleportTarget\" :disabled=\"teleportTarget === 'none'\">\n <Transition name=\"wd-guide-fade\">\n <div\n v-if=\"active\"\n class=\"wd-guide\"\n @click=\"onMaskClick\"\n @keydown=\"onKeydown\"\n tabindex=\"-1\"\n >\n <svg class=\"wd-guide__mask\" :width=\"viewport.w\" :height=\"viewport.h\">\n <defs>\n <mask :id=\"maskId\">\n <rect x=\"0\" y=\"0\" :width=\"viewport.w\" :height=\"viewport.h\" fill=\"#fff\" />\n <rect\n v-if=\"target && currentStep && currentStep.highlight !== 'none'\"\n :x=\"rect.x\"\n :y=\"rect.y\"\n :width=\"rect.w\"\n :height=\"rect.h\"\n :rx=\"holeRx\"\n :ry=\"holeRx\"\n fill=\"#000\"\n />\n </mask>\n </defs>\n <rect\n x=\"0\"\n y=\"0\"\n :width=\"viewport.w\"\n :height=\"viewport.h\"\n :fill=\"maskColor\"\n :mask=\"`url(#${maskId})`\"\n />\n </svg>\n\n <div\n v-if=\"target && currentStep && currentStep.highlight !== 'none'\"\n class=\"wd-guide__spot\"\n :class=\"[`is-${currentStep.highlight}`, `is-${spotPlacement}`]\"\n :style=\"spotStyle\"\n />\n\n <div\n v-if=\"currentStep && showPanel\"\n ref=\"panelRef\"\n class=\"wd-guide__panel\"\n :class=\"[`is-${panelPlacement}`, { 'is-centered': panelPlacement === 'center' }]\"\n :style=\"panelStyle\"\n @click.stop\n >\n <el-icon v-if=\"showClose\" class=\"wd-guide__close\" @click=\"finish('close')\">\n <Close />\n </el-icon>\n\n <slot\n name=\"panel\"\n :step=\"currentStep\"\n :index=\"current\"\n :total=\"total\"\n :current=\"current\"\n :prev=\"prev\"\n :next=\"next\"\n :close=\"finish\"\n >\n <div v-if=\"currentStep.title\" class=\"wd-guide__title\">{{ currentStep.title }}</div>\n <div v-if=\"currentStep.description\" class=\"wd-guide__desc\">\n {{ currentStep.description }}\n </div>\n\n <div class=\"wd-guide__footer\">\n <el-button\n v-if=\"showSkip && current < total - 1\"\n link\n type=\"info\"\n class=\"wd-guide__skip\"\n @click=\"finish('skip')\"\n >\n {{ skipText }}\n </el-button>\n <span v-else class=\"wd-guide__skip-placeholder\" />\n\n <div v-if=\"showDots\" class=\"wd-guide__dots\">\n <button\n v-for=\"(s, i) in steps\"\n :key=\"i\"\n type=\"button\"\n class=\"wd-guide__dot\"\n :class=\"{ 'is-active': i === current }\"\n :aria-label=\"`第 ${i + 1} 步`\"\n @click=\"goTo(i)\"\n />\n </div>\n\n <div class=\"wd-guide__actions\">\n <el-button v-if=\"current > 0\" size=\"small\" @click=\"prev()\">\n {{ prevText }}\n </el-button>\n <el-button type=\"primary\" size=\"small\" @click=\"next()\">\n {{ current < total - 1 ? nextText : finishText }}\n </el-button>\n </div>\n </div>\n </slot>\n </div>\n </div>\n </Transition>\n </Teleport>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { Close } from '@element-plus/icons-vue'\n\ndefineOptions({ name: 'WdGuide' })\n\ntype Placement = 'top' | 'bottom' | 'left' | 'right' | 'center'\ntype GuideResult = 'finish' | 'skip' | 'close'\n\n/** 单步指引配置 */\nexport interface GuideStep {\n /** 目标元素:CSS 选择器或元素引用 */\n target: string | HTMLElement\n /** 标题 */\n title?: string\n /** 描述文字 */\n description?: string\n /** 面板优先位置(空间不足自动翻转) */\n placement?: Placement\n /** 高亮样式:rect 矩形(默认)/ circle 圆形 / none 不挖洞 */\n highlight?: 'rect' | 'circle' | 'none'\n /** 高亮区域外扩 px */\n padding?: number\n /** 激活时是否滚动目标到可视区 */\n scrollIntoView?: boolean\n}\n\nconst props = withDefaults(\n defineProps<{\n /** 显隐(v-model) */\n modelValue?: boolean\n /** 指引步骤 */\n steps: GuideStep[]\n /** 蒙版颜色(任意 CSS 颜色,支持 rgba) */\n maskColor?: string\n /** 高亮区域与目标元素的外扩间距 px */\n padding?: number\n /** 点击蒙版是否关闭 */\n closeOnClickModal?: boolean\n /** 是否显示右上角关闭按钮 */\n showClose?: boolean\n /** 是否显示「跳过」按钮 */\n showSkip?: boolean\n /** 是否显示步骤圆点 */\n showDots?: boolean\n /** 是否显示面板(false 时仅高亮,可用于纯聚焦场景) */\n showPanel?: boolean\n /** 是否支持 ESC 关闭、方向键切换 */\n keyboard?: boolean\n /** 激活时自动滚动目标元素到可视区 */\n scrollIntoView?: boolean\n /** 挂载位置:body / 选择器 / none(不 teleport) */\n appendTo?: string\n skipText?: string\n prevText?: string\n nextText?: string\n finishText?: string\n }>(),\n {\n modelValue: false,\n maskColor: 'rgba(0, 0, 0, 0.6)',\n padding: 8,\n showClose: true,\n closeOnClickModal: false,\n showSkip: true,\n showDots: true,\n showPanel: true,\n keyboard: true,\n scrollIntoView: true,\n appendTo: 'body',\n skipText: '跳过',\n prevText: '上一步',\n nextText: '下一步',\n finishText: '完成'\n }\n)\n\nconst emit = defineEmits([\n 'update:modelValue',\n 'change',\n 'finish',\n 'skip',\n 'close'\n])\n\n/* ---------- 内部状态 ---------- */\n\nconst active = ref(false)\nconst current = ref(0)\nconst targetEl = ref<HTMLElement | null>(null)\nconst viewport = ref({ w: 0, h: 0 })\nconst rect = ref({ x: 0, y: 0, w: 0, h: 0 })\nconst panelStyle = ref<Record<string, string>>({})\nconst panelPlacement = ref<Placement>('bottom')\nconst spotPlacement = ref<Placement>('bottom')\n\nconst panelRef = ref<HTMLElement | null>(null)\nconst maskId = `wd-guide-mask-${Math.random().toString(36).slice(2, 9)}`\n\nconst GAP = 12\nconst MARGIN = 8\n\nconst total = computed(() => props.steps.length)\nconst currentStep = computed(() => props.steps[current.value])\nconst target = computed(() => targetEl.value)\n\nconst teleportTarget = computed(() => (props.appendTo === 'none' ? 'none' : props.appendTo))\n\n/** 挖洞圆角:circle 取半宽形成圆(宽高一致时为正圆),否则取元素自身圆角 */\nconst holeRx = computed(() => {\n if (!currentStep.value || currentStep.value.highlight === 'circle') {\n return Math.max(rect.value.w, rect.value.h) / 2\n }\n return 6\n})\n\nconst spotStyle = computed(() => ({\n left: `${rect.value.x}px`,\n top: `${rect.value.y}px`,\n width: `${rect.value.w}px`,\n height: `${rect.value.h}px`,\n borderRadius:\n currentStep.value?.highlight === 'circle'\n ? '50%'\n : `${holeRx.value}px`\n}))\n\n/* ---------- 元素定位 ---------- */\n\nfunction resolveTarget(step: GuideStep | undefined): HTMLElement | null {\n if (!step) return null\n if (typeof step.target !== 'string') return step.target\n try {\n return document.querySelector(step.target)\n } catch {\n return null\n }\n}\n\nfunction getViewport() {\n return {\n w: document.documentElement.clientWidth || window.innerWidth,\n h: document.documentElement.clientHeight || window.innerHeight\n }\n}\n\n/** 面板四边是否都放得下,放不下则翻转/居中 */\nfunction resolvePlacement(stepPadding: number, r: typeof rect.value, vp: { w: number; h: number }): Placement {\n const preferred = currentStep.value?.placement || 'bottom'\n if (preferred === 'center') return 'center'\n\n const panelW = panelRef.value?.offsetWidth || 320\n const panelH = panelRef.value?.offsetHeight || 160\n\n const fitTop = r.y - GAP - panelH >= MARGIN\n const fitBottom = r.y + r.h + GAP + panelH <= vp.h - MARGIN\n const fitLeft = r.x - GAP - panelW >= MARGIN\n const fitRight = r.x + r.w + GAP + panelW <= vp.w - MARGIN\n\n switch (preferred) {\n case 'top':\n if (fitTop) return 'top'\n if (fitBottom) return 'bottom'\n break\n case 'left':\n if (fitLeft) return 'left'\n if (fitRight) return 'right'\n break\n case 'right':\n if (fitRight) return 'right'\n if (fitLeft) return 'left'\n break\n case 'bottom':\n default:\n if (fitBottom) return 'bottom'\n if (fitTop) return 'top'\n break\n }\n\n // 上下都放不下时尝试左右\n if (fitRight) return 'right'\n if (fitLeft) return 'left'\n return 'center'\n}\n\nfunction computePanelStyle(placement: Placement, r: typeof rect.value, vp: { w: number; h: number }) {\n if (placement === 'center') {\n panelStyle.value = {\n left: '50%',\n top: '50%',\n transform: 'translate(-50%, -50%)'\n }\n return\n }\n\n const panelW = panelRef.value?.offsetWidth || 320\n const panelH = panelRef.value?.offsetHeight || 160\n const cx = r.x + r.w / 2\n const cy = r.y + r.h / 2\n\n let left = 0\n let top = 0\n\n switch (placement) {\n case 'bottom':\n left = cx - panelW / 2\n top = r.y + r.h + GAP\n break\n case 'top':\n left = cx - panelW / 2\n top = r.y - GAP - panelH\n break\n case 'right':\n left = r.x + r.w + GAP\n top = cy - panelH / 2\n break\n case 'left':\n left = r.x - GAP - panelW\n top = cy - panelH / 2\n break\n }\n\n // 防止横向溢出(纵向交由 placement 翻转保证)\n left = Math.min(Math.max(left, MARGIN), Math.max(MARGIN, vp.w - panelW - MARGIN))\n top = Math.min(Math.max(top, MARGIN), Math.max(MARGIN, vp.h - panelH - MARGIN))\n\n panelStyle.value = { left: `${left}px`, top: `${top}px` }\n}\n\nlet rafId = 0\n\nfunction updatePosition() {\n cancelAnimationFrame(rafId)\n rafId = requestAnimationFrame(() => {\n const vp = getViewport()\n viewport.value = vp\n\n const step = currentStep.value\n targetEl.value = resolveTarget(step)\n\n if (!targetEl.value || !step || step.highlight === 'none') {\n rect.value = { x: 0, y: 0, w: 0, h: 0 }\n panelPlacement.value = step?.placement === 'center' ? 'center' : 'center'\n spotPlacement.value = 'bottom'\n if (panelRef.value) computePanelStyle('center', rect.value, vp)\n return\n }\n\n const elRect = targetEl.value.getBoundingClientRect()\n const pad = step.padding ?? props.padding\n const r = {\n x: elRect.left - pad,\n y: elRect.top - pad,\n w: elRect.width + pad * 2,\n h: elRect.height + pad * 2\n }\n rect.value = r\n\n panelPlacement.value = resolvePlacement(pad, r, vp)\n spotPlacement.value = panelPlacement.value === 'center' ? 'bottom' : panelPlacement.value\n computePanelStyle(panelPlacement.value, r, vp)\n })\n}\n\n/* ---------- 步骤导航 ---------- */\n\nfunction scrollTargetIntoView() {\n const step = currentStep.value\n if (!step || step.scrollIntoView === false) return\n if ((step.scrollIntoView ?? props.scrollIntoView) === false) return\n targetEl.value?.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'center' })\n}\n\nfunction activateStep() {\n targetEl.value = resolveTarget(currentStep.value)\n nextTick(() => {\n updatePosition()\n scrollTargetIntoView()\n })\n}\n\nfunction goTo(index: number) {\n if (index < 0 || index >= total.value || index === current.value) return\n current.value = index\n emit('change', index)\n activateStep()\n}\n\nfunction next() {\n if (current.value >= total.value - 1) {\n finish('finish')\n return\n }\n goTo(current.value + 1)\n}\n\nfunction prev() {\n goTo(current.value - 1)\n}\n\nfunction finish(result: GuideResult) {\n active.value = false\n emit('update:modelValue', false)\n if (result === 'finish') emit('finish', current.value)\n else if (result === 'skip') emit('skip', current.value)\n else emit('close')\n}\n\n/* ---------- 事件 ---------- */\n\nfunction onMaskClick() {\n if (props.closeOnClickModal) finish('close')\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n if (!props.keyboard) return\n if (e.key === 'Escape') {\n finish(props.showClose ? 'close' : 'skip')\n } else if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n e.preventDefault()\n next()\n } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n e.preventDefault()\n prev()\n }\n}\n\nfunction onWindowEvent() {\n updatePosition()\n}\n\n/* ---------- 显隐联动 ---------- */\n\nfunction open() {\n if (total.value === 0) return\n active.value = true\n current.value = 0\n nextTick(() => activateStep())\n}\n\nwatch(\n () => props.modelValue,\n (val) => {\n if (val) open()\n else active.value = false\n },\n { immediate: true }\n)\n\nwatch(() => props.steps, () => updatePosition(), { deep: false })\n\nonMounted(() => {\n window.addEventListener('resize', onWindowEvent)\n window.addEventListener('scroll', onWindowEvent, true)\n})\n\nonBeforeUnmount(() => {\n cancelAnimationFrame(rafId)\n window.removeEventListener('resize', onWindowEvent)\n window.removeEventListener('scroll', onWindowEvent, true)\n})\n\ndefineExpose({\n /** 打开指引(默认从第 0 步开始) */\n open,\n /** 关闭指引 */\n close: () => finish('close'),\n /** 下一步(最后一步时完成) */\n next,\n /** 上一步 */\n prev,\n /** 跳转到指定步骤 */\n goTo,\n /** 重新计算目标位置(目标元素移动/尺寸变化后调用) */\n refresh: updatePosition\n})\n</script>\n\n<style scoped>\n.wd-guide {\n position: fixed;\n inset: 0;\n z-index: 2050;\n outline: none;\n}\n\n.wd-guide__mask {\n position: absolute;\n inset: 0;\n}\n\n.wd-guide__spot {\n position: absolute;\n box-sizing: border-box;\n border: 1px solid var(--wd-color-primary, #1677ff);\n box-shadow: 0 0 0 1px rgba(22, 119, 255, 0.25);\n transition: left 0.3s ease, top 0.3s ease, width 0.3s ease, height 0.3s ease,\n border-radius 0.3s ease;\n pointer-events: none;\n animation: wd-guide-pulse 2s ease-in-out infinite;\n}\n.wd-guide__spot.is-circle {\n border-style: solid;\n}\n\n@keyframes wd-guide-pulse {\n 0%,\n 100% {\n box-shadow: 0 0 0 1px rgba(22, 119, 255, 0.25),\n 0 0 0 4px rgba(22, 119, 255, 0.08);\n }\n 50% {\n box-shadow: 0 0 0 1px rgba(22, 119, 255, 0.45),\n 0 0 0 10px rgba(22, 119, 255, 0);\n }\n}\n\n/* ---------- 指引面板 ---------- */\n\n.wd-guide__panel {\n position: absolute;\n width: 320px;\n max-width: calc(100vw - 32px);\n padding: 18px 18px 14px;\n background: var(--wd-bg-color-overlay, #fff);\n border-radius: 10px;\n box-shadow: 0 12px 40px rgba(16, 21, 31, 0.22);\n box-sizing: border-box;\n transition: left 0.3s ease, top 0.3s ease;\n}\n\n.wd-guide__close {\n position: absolute;\n top: 10px;\n right: 10px;\n font-size: 15px;\n color: var(--wd-text-color-secondary, #909399);\n cursor: pointer;\n padding: 3px;\n border-radius: 4px;\n transition: color 0.18s ease, background-color 0.18s ease;\n}\n.wd-guide__close:hover {\n color: var(--wd-text-color-regular, #555b63);\n background: var(--wd-bg-color-page, #f4f6fa);\n}\n\n.wd-guide__title {\n font-size: 15px;\n font-weight: 600;\n color: var(--wd-text-color-primary, #24272c);\n padding-right: 20px;\n}\n.wd-guide__desc {\n margin-top: 8px;\n font-size: 13px;\n line-height: 1.7;\n color: var(--wd-text-color-regular, #555b63);\n}\n\n.wd-guide__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n margin-top: 16px;\n}\n.wd-guide__skip-placeholder {\n width: 40px;\n flex: none;\n}\n\n.wd-guide__dots {\n display: flex;\n gap: 6px;\n align-items: center;\n}\n.wd-guide__dot {\n width: 7px;\n height: 7px;\n padding: 0;\n border: none;\n border-radius: 50%;\n background: var(--wd-border-color, #d8dde5);\n cursor: pointer;\n transition: background-color 0.18s ease, transform 0.18s ease;\n}\n.wd-guide__dot:hover {\n transform: scale(1.2);\n}\n.wd-guide__dot.is-active {\n background: var(--wd-color-primary, #1677ff);\n}\n\n.wd-guide__actions {\n display: flex;\n gap: 8px;\n}\n\n/* ---------- 指向箭头 ---------- */\n\n.wd-guide__panel::before {\n content: '';\n position: absolute;\n width: 12px;\n height: 12px;\n background: var(--wd-bg-color-overlay, #fff);\n transform: rotate(45deg);\n}\n.wd-guide__panel.is-top::before {\n left: 50%;\n bottom: -6px;\n margin-left: -6px;\n}\n.wd-guide__panel.is-bottom::before {\n left: 50%;\n top: -6px;\n margin-left: -6px;\n}\n.wd-guide__panel.is-left::before {\n right: -6px;\n top: 50%;\n margin-top: -6px;\n}\n.wd-guide__panel.is-right::before {\n left: -6px;\n top: 50%;\n margin-top: -6px;\n}\n.wd-guide__panel.is-centered::before {\n display: none;\n}\n\n/* ---------- 过渡 ---------- */\n\n.wd-guide-fade-enter-active,\n.wd-guide-fade-leave-active {\n transition: opacity 0.25s ease;\n}\n.wd-guide-fade-enter-from,\n.wd-guide-fade-leave-to {\n opacity: 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .wd-guide__spot,\n .wd-guide__panel,\n .wd-guide-fade-enter-active,\n .wd-guide-fade-leave-active {\n transition: none;\n animation: none;\n }\n}\n</style>\n"],"names":["GAP","MARGIN","props","__props","emit","__emit","active","ref","current","targetEl","viewport","rect","panelStyle","panelPlacement","spotPlacement","panelRef","maskId","total","computed","currentStep","target","teleportTarget","holeRx","spotStyle","_a","resolveTarget","step","getViewport","resolvePlacement","stepPadding","r","vp","preferred","panelW","_b","panelH","_c","fitTop","fitBottom","fitLeft","fitRight","computePanelStyle","placement","cx","cy","left","top","rafId","updatePosition","elRect","pad","scrollTargetIntoView","activateStep","nextTick","goTo","index","next","finish","prev","result","onMaskClick","onKeydown","onWindowEvent","open","watch","val","onMounted","onBeforeUnmount","__expose","_createBlock","_Teleport","_createVNode","_Transition","_createElementBlock","_createElementVNode","_normalizeClass","_component_el_icon","_unref","Close","_renderSlot","_ctx","_openBlock","_hoisted_5","_toDisplayString","_hoisted_6","_hoisted_7","_component_el_button","_hoisted_8","_hoisted_9","_Fragment","_renderList","s","i","$event","_hoisted_11","_createTextVNode"],"mappings":"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"}
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import { defineComponent as M, ref as r, watch as w, computed as m, onMounted as N, onBeforeUnmount as R, resolveDirective as V, withDirectives as $, openBlock as _, createElementBlock as b, mergeProps as C } from "vue";
|
|
2
|
+
import { a as x } from "./config-B6nWG5dv.mjs";
|
|
3
|
+
import { u as q } from "./useConfig-CPioiLWJ.mjs";
|
|
4
|
+
import { _ as D } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
|
|
5
|
+
const j = ["src"], G = /* @__PURE__ */ M({
|
|
6
|
+
name: "WdIframe",
|
|
7
|
+
__name: "Iframe",
|
|
8
|
+
props: {
|
|
9
|
+
/** iframe 地址 */
|
|
10
|
+
src: { type: String, default: "" },
|
|
11
|
+
/** 固定高度(数字按 px) */
|
|
12
|
+
height: { type: [String, Number], default: "480px" },
|
|
13
|
+
/** 高度自适应(通过子页面 postMessage 上报高度) */
|
|
14
|
+
autoHeight: { type: Boolean, default: !1 },
|
|
15
|
+
/** 发送消息时使用的 targetOrigin(默认同源;跨域时需显式指定子页面 origin) */
|
|
16
|
+
origin: { type: String, default: "" },
|
|
17
|
+
/**
|
|
18
|
+
* 刷新信号:值变化时强制重新加载 iframe 内容。
|
|
19
|
+
* 常用于「每次显示时刷新」:父级在显示时机自增该值即可(例如 v-if 重建时不需此 prop,仅当 iframe 常驻 DOM 时才需要)。
|
|
20
|
+
*/
|
|
21
|
+
refreshKey: { type: [Number, String], default: 0 },
|
|
22
|
+
/**
|
|
23
|
+
* 是否显示加载遮罩:
|
|
24
|
+
* - 不传(undefined):跟随全局配置 request.loading.enable;
|
|
25
|
+
* - true:强制显示(子页加载完成前);
|
|
26
|
+
* - false:关闭 loading,加载过程不出现遮罩。
|
|
27
|
+
*/
|
|
28
|
+
loading: { type: Boolean, default: void 0 },
|
|
29
|
+
/**
|
|
30
|
+
* 加载超时时间(毫秒):超时后自动关闭遮罩并触发 timeout 事件;
|
|
31
|
+
* 不传时取组件默认配置,默认 0 表示不限制(不超时)。
|
|
32
|
+
*/
|
|
33
|
+
timeout: { type: Number, default: void 0 }
|
|
34
|
+
},
|
|
35
|
+
emits: ["load", "message", "complete", "timeout"],
|
|
36
|
+
setup(c, { expose: B, emit: L }) {
|
|
37
|
+
const t = c, a = L, d = r(null), k = r(null), s = r(null), g = q("WdIframe", {
|
|
38
|
+
loading: t.loading,
|
|
39
|
+
timeout: t.timeout
|
|
40
|
+
}), u = r(0);
|
|
41
|
+
w(
|
|
42
|
+
() => t.refreshKey,
|
|
43
|
+
() => {
|
|
44
|
+
u.value += 1;
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
const p = m(() => `${t.refreshKey}:${u.value}`), S = m(() => t.autoHeight && s.value ? { height: `${s.value}px` } : { height: typeof t.height == "number" ? `${t.height}px` : t.height }), o = r(!1);
|
|
48
|
+
let i = null;
|
|
49
|
+
function T() {
|
|
50
|
+
return g.value.loading ?? x().request.loading.enable;
|
|
51
|
+
}
|
|
52
|
+
function I() {
|
|
53
|
+
return g.value.timeout ?? 0;
|
|
54
|
+
}
|
|
55
|
+
const W = m(() => {
|
|
56
|
+
const e = x().request.loading.props || {};
|
|
57
|
+
return {
|
|
58
|
+
elementLoadingText: e.text,
|
|
59
|
+
elementLoadingBackground: e.background,
|
|
60
|
+
elementLoadingSpinner: e.spinner,
|
|
61
|
+
elementLoadingSvg: e.svg,
|
|
62
|
+
elementLoadingSvgViewBox: e.svgViewBox
|
|
63
|
+
};
|
|
64
|
+
});
|
|
65
|
+
function f() {
|
|
66
|
+
i && (clearTimeout(i), i = null);
|
|
67
|
+
}
|
|
68
|
+
function v() {
|
|
69
|
+
if (f(), !t.src || !T()) {
|
|
70
|
+
o.value = !1;
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
73
|
+
o.value = !0;
|
|
74
|
+
const e = I();
|
|
75
|
+
e > 0 && (i = setTimeout(() => {
|
|
76
|
+
o.value = !1, i = null, a("timeout", { timeout: e });
|
|
77
|
+
}, e));
|
|
78
|
+
}
|
|
79
|
+
function E() {
|
|
80
|
+
f(), o.value = !1, a("load"), a("complete");
|
|
81
|
+
}
|
|
82
|
+
w(
|
|
83
|
+
[() => t.src, p],
|
|
84
|
+
() => v()
|
|
85
|
+
);
|
|
86
|
+
function H(e) {
|
|
87
|
+
var l, y;
|
|
88
|
+
const n = t.origin || window.location.origin;
|
|
89
|
+
(y = (l = d.value) == null ? void 0 : l.contentWindow) == null || y.postMessage(e, n);
|
|
90
|
+
}
|
|
91
|
+
function K() {
|
|
92
|
+
u.value += 1;
|
|
93
|
+
}
|
|
94
|
+
function h(e) {
|
|
95
|
+
const n = e.data;
|
|
96
|
+
t.autoHeight && n && typeof n == "object" && n.type === "wd-iframe-height" && (s.value = Number(n.height) || null), a("message", n);
|
|
97
|
+
}
|
|
98
|
+
return N(() => {
|
|
99
|
+
window.addEventListener("message", h), v();
|
|
100
|
+
}), R(() => {
|
|
101
|
+
f(), window.removeEventListener("message", h);
|
|
102
|
+
}), B({ send: H, refresh: K }), (e, n) => {
|
|
103
|
+
const l = V("loading");
|
|
104
|
+
return $((_(), b("div", C({
|
|
105
|
+
ref_key: "wrapperRef",
|
|
106
|
+
ref: k,
|
|
107
|
+
class: "wd-iframe-wrapper",
|
|
108
|
+
style: S.value
|
|
109
|
+
}, W.value), [
|
|
110
|
+
(_(), b("iframe", {
|
|
111
|
+
ref_key: "iframeRef",
|
|
112
|
+
ref: d,
|
|
113
|
+
key: p.value,
|
|
114
|
+
src: c.src,
|
|
115
|
+
class: "wd-iframe",
|
|
116
|
+
frameborder: "0",
|
|
117
|
+
onLoad: E
|
|
118
|
+
}, null, 40, j))
|
|
119
|
+
], 16)), [
|
|
120
|
+
[l, o.value]
|
|
121
|
+
]);
|
|
122
|
+
};
|
|
123
|
+
}
|
|
124
|
+
}), A = /* @__PURE__ */ D(G, [["__scopeId", "data-v-8ad21b88"]]);
|
|
125
|
+
export {
|
|
126
|
+
A as W
|
|
127
|
+
};
|
|
128
|
+
//# sourceMappingURL=Iframe-DcFFi0S9.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Iframe-DcFFi0S9.mjs","sources":["../../src/components/containers/Iframe.vue"],"sourcesContent":["<template>\n <div\n ref=\"wrapperRef\"\n class=\"wd-iframe-wrapper\"\n :style=\"wrapperStyle\"\n v-loading=\"loadingVisible\"\n v-bind=\"loadingBindings\"\n >\n <iframe\n ref=\"iframeRef\"\n :key=\"renderKey\"\n :src=\"src\"\n class=\"wd-iframe\"\n frameborder=\"0\"\n @load=\"onLoad\"\n />\n </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'\nimport { getGlobalConfig } from '../../lib/core/config'\nimport { useConfig } from '../../lib/composables/useConfig'\n\ndefineOptions({ name: 'WdIframe' })\n\nconst props = defineProps({\n /** iframe 地址 */\n src: { type: String, default: '' },\n /** 固定高度(数字按 px) */\n height: { type: [String, Number], default: '480px' },\n /** 高度自适应(通过子页面 postMessage 上报高度) */\n autoHeight: { type: Boolean, default: false },\n /** 发送消息时使用的 targetOrigin(默认同源;跨域时需显式指定子页面 origin) */\n origin: { type: String, default: '' },\n /**\n * 刷新信号:值变化时强制重新加载 iframe 内容。\n * 常用于「每次显示时刷新」:父级在显示时机自增该值即可(例如 v-if 重建时不需此 prop,仅当 iframe 常驻 DOM 时才需要)。\n */\n refreshKey: { type: [Number, String], default: 0 },\n /**\n * 是否显示加载遮罩:\n * - 不传(undefined):跟随全局配置 request.loading.enable;\n * - true:强制显示(子页加载完成前);\n * - false:关闭 loading,加载过程不出现遮罩。\n */\n loading: { type: Boolean, default: undefined },\n /**\n * 加载超时时间(毫秒):超时后自动关闭遮罩并触发 timeout 事件;\n * 不传时取组件默认配置,默认 0 表示不限制(不超时)。\n */\n timeout: { type: Number, default: undefined }\n})\n\nconst emit = defineEmits(['load', 'message', 'complete', 'timeout'])\n\nconst iframeRef = ref<HTMLIFrameElement | null>(null)\nconst wrapperRef = ref<HTMLElement | null>(null)\nconst autoHeightValue = ref<number | null>(null)\n\n/** 合并全局组件默认配置(page.componentDefault.WdIframe)→ 本地 props */\nconst cfg = useConfig<{ loading?: boolean; timeout?: number }>('WdIframe', {\n loading: props.loading,\n timeout: props.timeout\n})\n\n/** 内部刷新计数:refreshKey 变化 或 调用 refresh() 时自增,驱动 iframe 重建(强制重新加载) */\nconst renderTick = ref(0)\nwatch(\n () => props.refreshKey,\n () => {\n renderTick.value += 1\n }\n)\nconst renderKey = computed(() => `${props.refreshKey}:${renderTick.value}`)\n\n/** 容器高度(iframe 填满容器,loading 遮罩按容器定位) */\nconst wrapperStyle = computed(() => {\n if (props.autoHeight && autoHeightValue.value) {\n return { height: `${autoHeightValue.value}px` }\n }\n return { height: typeof props.height === 'number' ? `${props.height}px` : props.height }\n})\n\n/* ---------------- loading 遮罩 ---------------- */\n\nconst loadingVisible = ref(false)\nlet timeoutTimer: ReturnType<typeof setTimeout> | null = null\n\n/** 是否启用 loading:本地 props / 组件默认(useConfig 已合并)→ 全局 request.loading.enable */\nfunction loadingEnabled(): boolean {\n return cfg.value.loading ?? getGlobalConfig().request.loading.enable\n}\n\n/** 超时毫秒:0 表示不限制 */\nfunction timeoutMs(): number {\n return cfg.value.timeout ?? 0\n}\n\n/** 遮罩外观跟随全局 request.loading.props(映射到 v-loading 支持的属性) */\nconst loadingBindings = computed<Record<string, any>>(() => {\n const p = getGlobalConfig().request.loading.props || {}\n return {\n elementLoadingText: p.text,\n elementLoadingBackground: p.background,\n elementLoadingSpinner: p.spinner,\n elementLoadingSvg: p.svg,\n elementLoadingSvgViewBox: p.svgViewBox\n }\n})\n\nfunction clearTimer() {\n if (timeoutTimer) {\n clearTimeout(timeoutTimer)\n timeoutTimer = null\n }\n}\n\n/** 开始一次加载:显示遮罩并启动超时计时 */\nfunction startLoading() {\n clearTimer()\n if (!props.src || !loadingEnabled()) {\n loadingVisible.value = false\n return\n }\n loadingVisible.value = true\n const ms = timeoutMs()\n if (ms > 0) {\n timeoutTimer = setTimeout(() => {\n loadingVisible.value = false\n timeoutTimer = null\n emit('timeout', { timeout: ms })\n }, ms)\n }\n}\n\nfunction onLoad() {\n clearTimer()\n loadingVisible.value = false\n // 保留 load(原生语义,向后兼容),complete 表示「加载完成、loading 结束」\n emit('load')\n emit('complete')\n}\n\n/* 地址变化或 iframe 重建(刷新)时,重新进入 loading */\nwatch(\n [() => props.src, renderKey],\n () => startLoading()\n)\n\n/**\n * 父 → 子:向 iframe 内页面发送消息(子页通过 window.addEventListener('message') 接收)\n */\nfunction send(message: any) {\n const targetOrigin = props.origin || window.location.origin\n iframeRef.value?.contentWindow?.postMessage(message, targetOrigin)\n}\n\n/** 强制重新加载 iframe 内容(重建 iframe 元素) */\nfunction refresh() {\n renderTick.value += 1\n}\n\n/** 子页面 postMessage 透传:约定 { type:'wd-iframe-height', height } 或任意消息 */\nfunction onMessage(event: MessageEvent) {\n const data = event.data\n if (props.autoHeight && data && typeof data === 'object' && data.type === 'wd-iframe-height') {\n autoHeightValue.value = Number(data.height) || null\n }\n emit('message', data)\n}\n\nonMounted(() => {\n window.addEventListener('message', onMessage)\n startLoading()\n})\nonBeforeUnmount(() => {\n clearTimer()\n window.removeEventListener('message', onMessage)\n})\n\ndefineExpose({ send, refresh })\n</script>\n\n<style scoped>\n.wd-iframe-wrapper {\n position: relative;\n width: 100%;\n}\n.wd-iframe {\n width: 100%;\n height: 100%;\n border: 0;\n display: block;\n}\n</style>\n"],"names":["props","__props","emit","__emit","iframeRef","ref","wrapperRef","autoHeightValue","cfg","useConfig","renderTick","watch","renderKey","computed","wrapperStyle","loadingVisible","timeoutTimer","loadingEnabled","getGlobalConfig","timeoutMs","loadingBindings","p","clearTimer","startLoading","ms","onLoad","send","message","targetOrigin","_b","_a","refresh","onMessage","event","data","onMounted","onBeforeUnmount","__expose","_withDirectives","_openBlock","_createElementBlock","_mergeProps"],"mappings":"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"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { defineComponent as L, useCssVars as T, ref as m, watch as j, computed as w, resolveComponent as b, openBlock as S, createElementBlock as N, normalizeClass as H, createVNode as C, mergeProps as J, withCtx as A, unref as O, toDisplayString as Q, createCommentVNode as V, createBlock as X } from "vue";
|
|
2
2
|
import { Plus as Y } from "@element-plus/icons-vue";
|
|
3
3
|
import { ElMessage as f, ElMessageBox as Z } from "element-plus";
|
|
4
|
-
import {
|
|
4
|
+
import { r as p } from "./http-BKKP0gEJ.mjs";
|
|
5
|
+
import { a as _ } from "./config-B6nWG5dv.mjs";
|
|
5
6
|
import { r as D } from "./linkage-FbL1mcz3.mjs";
|
|
6
7
|
import { h as F, f as ee } from "./props-DAytpx7D.mjs";
|
|
7
8
|
import { _ as te } from "./_plugin-vue_export-helper-CHgC5LLL.mjs";
|
|
@@ -186,8 +187,8 @@ const ae = {
|
|
|
186
187
|
], 2);
|
|
187
188
|
};
|
|
188
189
|
}
|
|
189
|
-
}),
|
|
190
|
+
}), fe = /* @__PURE__ */ te(ie, [["__scopeId", "data-v-74d04a3e"]]);
|
|
190
191
|
export {
|
|
191
|
-
|
|
192
|
+
fe as W
|
|
192
193
|
};
|
|
193
|
-
//# sourceMappingURL=ImageUpload-
|
|
194
|
+
//# sourceMappingURL=ImageUpload-BK7tbU2o.mjs.map
|