react-kggraph 0.0.27 → 0.0.29
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/index.es3.js +118 -117
- package/lib/index.es38.js +6 -6
- package/lib/index.es43.js +18 -88
- package/lib/index.es44.js +39 -54
- package/lib/index.es45.js +39 -30
- package/lib/index.es46.js +91 -0
- package/lib/index.es47.js +58 -0
- package/lib/index.es48.js +33 -0
- package/lib/index.es7.js +70 -69
- package/lib/index.es8.js +147 -127
- package/lib/src/components/Graph/utils/tools.d.ts +3 -2
- package/lib/style.css +1 -1
- package/package.json +1 -1
- package/lib/index.es40.js +0 -21
- package/lib/index.es41.js +0 -43
- package/lib/index.es42.js +0 -42
package/lib/index.es3.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { jsx as h, jsxs as
|
|
2
|
-
import { useRef as k, useState as v, useEffect as
|
|
1
|
+
import { jsx as h, jsxs as ne } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as k, useState as v, useEffect as D } from "react";
|
|
3
3
|
import E from "cytoscape";
|
|
4
4
|
import Ee from "cytoscape-cose-bilkent";
|
|
5
5
|
import ze from "cytoscape-cise";
|
|
@@ -8,27 +8,27 @@ import je from "storm-layout";
|
|
|
8
8
|
import Le from "./index.es7.js";
|
|
9
9
|
/* empty css */
|
|
10
10
|
import { handleCalcPath as Oe, resDetailData as F } from "./index.es8.js";
|
|
11
|
-
import { fixNodesToEdges as
|
|
12
|
-
import { edgeNodeStyles as
|
|
13
|
-
import
|
|
11
|
+
import { fixNodesToEdges as Pe, coseBilkentLayout as se } from "./index.es9.js";
|
|
12
|
+
import { edgeNodeStyles as Re, defaultColors as de, nodeSize as Te } from "./index.es10.js";
|
|
13
|
+
import $e from "cytoscape-layout-utilities";
|
|
14
14
|
import { message as C } from "antd";
|
|
15
|
-
import { menuItemsConfig as
|
|
15
|
+
import { menuItemsConfig as De } from "./index.es11.js";
|
|
16
16
|
import { jsonStringify as L } from "./index.es12.js";
|
|
17
|
-
import
|
|
18
|
-
import
|
|
17
|
+
import Se from "./index.es13.js";
|
|
18
|
+
import Ie from "./index.es14.js";
|
|
19
19
|
import { GraphProvider as Be } from "./index.es15.js";
|
|
20
|
-
import
|
|
21
|
-
import
|
|
22
|
-
E.use(
|
|
20
|
+
import Ae from "./index.es16.js";
|
|
21
|
+
import We from "./index.es17.js";
|
|
22
|
+
E.use($e);
|
|
23
23
|
E.use(ze);
|
|
24
24
|
E.use(we);
|
|
25
25
|
E.use(je);
|
|
26
26
|
E.use(Ee);
|
|
27
27
|
const lt = ({
|
|
28
|
-
data:
|
|
29
|
-
getAllGraphData:
|
|
30
|
-
highPathAnalysis:
|
|
31
|
-
graphInfo:
|
|
28
|
+
data: z,
|
|
29
|
+
getAllGraphData: S,
|
|
30
|
+
highPathAnalysis: K = [],
|
|
31
|
+
graphInfo: u,
|
|
32
32
|
stepNextApi: re,
|
|
33
33
|
knowledgeCardApi: ae,
|
|
34
34
|
colors: w,
|
|
@@ -36,43 +36,44 @@ const lt = ({
|
|
|
36
36
|
actionCircle: le,
|
|
37
37
|
queryStatisticsConfig: ce = [{ label: "实体", key: "entity" }, { label: "关系", key: "relation" }],
|
|
38
38
|
className: pe,
|
|
39
|
-
noDataDesc:
|
|
39
|
+
noDataDesc: He = "暂无数据"
|
|
40
40
|
}) => {
|
|
41
|
-
var
|
|
42
|
-
const O = k(null), [p,
|
|
43
|
-
|
|
44
|
-
|
|
41
|
+
var G, ee, te;
|
|
42
|
+
const O = k(null), [p, I] = v([]), g = k(null), X = k(null), Z = 1, [Me, _] = v(!1), [x, B] = v({}), [P, A] = v({}), [ge, ue] = v("cose-bilkent"), J = k(null), Q = k(null), [ye, V] = v(["", ""]), W = k(w);
|
|
43
|
+
D(() => {
|
|
44
|
+
W.current = w;
|
|
45
45
|
}, [w]);
|
|
46
|
-
const [
|
|
46
|
+
const [y, j] = v({
|
|
47
47
|
visible: !1,
|
|
48
48
|
x: 0,
|
|
49
49
|
y: 0,
|
|
50
50
|
targetNode: null,
|
|
51
51
|
bgColor: ""
|
|
52
|
-
}), [
|
|
52
|
+
}), [R, Y] = v({
|
|
53
53
|
visible: !1,
|
|
54
54
|
x: 0,
|
|
55
55
|
y: 0,
|
|
56
56
|
content: ""
|
|
57
|
-
}),
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
57
|
+
}), fe = De({ cyRef: g, setContextMenu: j, onPathAnalysis: (G = X.current) == null ? void 0 : G.onPathAnalysis, setPathNodes: V, actionCircle: le });
|
|
58
|
+
D(() => {
|
|
59
|
+
const { nodes: n, links: s } = K || {};
|
|
60
|
+
((n == null ? void 0 : n.length) > 0 || (s == null ? void 0 : s.length) > 0) && Oe(g, { nodes: n, links: s, isGrayed: !1 });
|
|
61
|
+
}, [L(K), L(p)]), D(() => {
|
|
62
|
+
const n = [], s = [];
|
|
62
63
|
p.forEach((l) => {
|
|
63
|
-
l.group === "nodes" ? n.push(l.data) : l.group === "edges" &&
|
|
64
|
-
}),
|
|
65
|
-
}, [L(p), L(x), L(
|
|
64
|
+
l.group === "nodes" ? n.push(l.data) : l.group === "edges" && s.push(l.data);
|
|
65
|
+
}), S == null || S({ graphData: p, nodeStatic: x, relationStatic: P, data: { nodes: n, links: s }, paths: z.paths, data2: z.data2, logId: z.logId, costtime: z.costtime });
|
|
66
|
+
}, [L(p), L(x), L(P)]), D(() => {
|
|
66
67
|
var a;
|
|
67
|
-
if (!O.current ||
|
|
68
|
-
const { elements: n, typeListObj:
|
|
69
|
-
B(
|
|
68
|
+
if (!O.current || g.current) return;
|
|
69
|
+
const { elements: n, typeListObj: s, relationListObj: l } = F(z, { typeObj: x, graphInfo: u });
|
|
70
|
+
B(s), I(n), A(l), document.addEventListener("contextmenu", function(t) {
|
|
70
71
|
t.preventDefault();
|
|
71
72
|
});
|
|
72
73
|
const e = E({
|
|
73
74
|
container: O.current,
|
|
74
75
|
elements: n,
|
|
75
|
-
style:
|
|
76
|
+
style: Re({ elements: n, colors: w }),
|
|
76
77
|
autounselectify: !1,
|
|
77
78
|
autolock: !1,
|
|
78
79
|
maxZoom: 1,
|
|
@@ -81,23 +82,23 @@ const lt = ({
|
|
|
81
82
|
// 使用预设布局,完全依赖 position
|
|
82
83
|
}
|
|
83
84
|
});
|
|
84
|
-
if (
|
|
85
|
-
|
|
85
|
+
if (g.current = e, ((a = u == null ? void 0 : u.searchNodes) == null ? void 0 : a.length) === 2)
|
|
86
|
+
Pe(
|
|
86
87
|
e,
|
|
87
|
-
|
|
88
|
-
|
|
88
|
+
u.searchNodes[0],
|
|
89
|
+
u.searchNodes[1]
|
|
89
90
|
);
|
|
90
91
|
else {
|
|
91
|
-
const t = e.layout(
|
|
92
|
+
const t = e.layout(se());
|
|
92
93
|
t.run(), t.on("layoutstop", () => {
|
|
93
94
|
e.fit(void 0, 50), e.center();
|
|
94
95
|
});
|
|
95
96
|
}
|
|
96
97
|
return e.on("mouseover", "edge", (t) => {
|
|
97
|
-
var
|
|
98
|
+
var d;
|
|
98
99
|
const o = t.target;
|
|
99
100
|
if (!o.hasClass("path-edge")) {
|
|
100
|
-
const r = ((
|
|
101
|
+
const r = ((d = W.current) == null ? void 0 : d.edgeHoverColor) ?? de.edgeHoverColor;
|
|
101
102
|
o.style({
|
|
102
103
|
"line-color": r,
|
|
103
104
|
"target-arrow-color": r,
|
|
@@ -105,10 +106,10 @@ const lt = ({
|
|
|
105
106
|
});
|
|
106
107
|
}
|
|
107
108
|
}), e.on("mouseout", "edge", (t) => {
|
|
108
|
-
var
|
|
109
|
+
var d;
|
|
109
110
|
const o = t.target;
|
|
110
111
|
if (!o.hasClass("path-edge")) {
|
|
111
|
-
const r = ((
|
|
112
|
+
const r = ((d = W.current) == null ? void 0 : d.edgeDefaultColor) ?? de.edgeDefaultColor;
|
|
112
113
|
o.style({
|
|
113
114
|
"line-color": r,
|
|
114
115
|
"target-arrow-color": r,
|
|
@@ -119,26 +120,26 @@ const lt = ({
|
|
|
119
120
|
const o = t.target;
|
|
120
121
|
o.hasClass("selected") || o.addClass("hover");
|
|
121
122
|
}), e.on("mouseover", "node", (t) => {
|
|
122
|
-
const o = t.target,
|
|
123
|
-
o.addClass("hover"),
|
|
123
|
+
const o = t.target, d = o.renderedPosition(), r = o.data("name") || "";
|
|
124
|
+
o.addClass("hover"), Y({
|
|
124
125
|
visible: !0,
|
|
125
|
-
x:
|
|
126
|
-
y:
|
|
126
|
+
x: d.x,
|
|
127
|
+
y: d.y - 60,
|
|
127
128
|
content: r
|
|
128
129
|
});
|
|
129
130
|
}), e.on("mouseout", "node", (t) => {
|
|
130
|
-
t.target.removeClass("hover"),
|
|
131
|
+
t.target.removeClass("hover"), Y((d) => ({ ...d, visible: !1 }));
|
|
131
132
|
}), e.on("cxttap", "node", (t) => {
|
|
132
133
|
t.preventDefault(), t.stopPropagation(), t.stopImmediatePropagation(), t.originalEvent && (t.originalEvent.preventDefault(), t.originalEvent.stopPropagation(), t.originalEvent.stopImmediatePropagation());
|
|
133
|
-
const o = t.target,
|
|
134
|
+
const o = t.target, d = o.renderedPosition();
|
|
134
135
|
console.log("renderedPos:::", o.data(), o.style("background-color")), j({
|
|
135
136
|
visible: !0,
|
|
136
|
-
x:
|
|
137
|
-
y:
|
|
137
|
+
x: d.x - 90,
|
|
138
|
+
y: d.y - 90,
|
|
138
139
|
targetNode: o,
|
|
139
140
|
bgColor: o.style("background-color")
|
|
140
141
|
});
|
|
141
|
-
}),
|
|
142
|
+
}), g.current = e, e.on("click", "node", (t) => {
|
|
142
143
|
const o = t.target;
|
|
143
144
|
e.nodes().removeClass("selected grayed highlighted"), e.edges().removeClass("selected grayed highlighted"), o.addClass("selected");
|
|
144
145
|
const r = o.neighborhood().nodes().add(o), N = r.edgesWith(r);
|
|
@@ -146,43 +147,43 @@ const lt = ({
|
|
|
146
147
|
}), e.on("tap", (t) => {
|
|
147
148
|
t.target === e && (j((o) => ({ ...o, visible: !1 })), e.nodes().removeClass("grayed highlighted highlight selected correlationStyle path-node level-highlight level-selected level-grayed"), e.edges().removeClass("grayed highlighted highlight selected correlationStyle path-edge level-highlightedge level-grayed"));
|
|
148
149
|
}), () => {
|
|
149
|
-
|
|
150
|
+
g.current && (g.current.destroy(), g.current = null);
|
|
150
151
|
};
|
|
151
152
|
}, []);
|
|
152
153
|
const me = async (n) => {
|
|
153
|
-
const { id:
|
|
154
|
+
const { id: s, kgId: l } = n, e = g.current;
|
|
154
155
|
if (!e) return;
|
|
155
|
-
const a = e.$(`#${
|
|
156
|
+
const a = e.$(`#${s}`);
|
|
156
157
|
if (!a || a.length === 0) {
|
|
157
158
|
console.error("当前节点不存在");
|
|
158
159
|
return;
|
|
159
160
|
}
|
|
160
|
-
const t = e.nodes().filter((
|
|
161
|
+
const t = e.nodes().filter((d) => d.data("parentId") ? (d.data("parentId") === s || d.data("idLabel") === `${s}-${d.data("name")}`) && d.data("zktype") === n.zktype : !1);
|
|
161
162
|
if (t.length > 0) {
|
|
162
|
-
const
|
|
163
|
-
(c) => c.data("source") ===
|
|
164
|
-
),
|
|
163
|
+
const d = t.map((c) => c.id()), r = t.connectedEdges(), N = e.edges().filter(
|
|
164
|
+
(c) => c.data("source") === s && d.includes(c.data("target"))
|
|
165
|
+
), T = e.edges().filter((c) => c.data("appendedBy") === s), H = r.merge(N).merge(T).filter((c) => c.data().zktype === n.zktype);
|
|
165
166
|
t.animate({
|
|
166
167
|
style: { opacity: 0 }
|
|
167
168
|
}, {
|
|
168
169
|
duration: 200,
|
|
169
170
|
complete: () => {
|
|
170
|
-
e.remove(t), e.remove(
|
|
171
|
-
const
|
|
172
|
-
var b,
|
|
171
|
+
e.remove(t), e.remove(H), I((c) => {
|
|
172
|
+
const $ = c.filter((m) => {
|
|
173
|
+
var b, oe;
|
|
173
174
|
const i = m.data.zktype;
|
|
174
|
-
if (m.group === "nodes" &&
|
|
175
|
+
if (m.group === "nodes" && d.includes((b = m.data) == null ? void 0 : b.id) && i && i === n.zktype)
|
|
175
176
|
return !1;
|
|
176
177
|
if (m.group === "edges" && i && i === n.zktype) {
|
|
177
|
-
const xe = Array.from(
|
|
178
|
-
const
|
|
179
|
-
return `${
|
|
180
|
-
}),
|
|
178
|
+
const xe = Array.from(T).map((Ce) => {
|
|
179
|
+
const q = Ce.data();
|
|
180
|
+
return `${q.source}-${q.target}-${q.label}`;
|
|
181
|
+
}), U = m.data, Ne = xe.includes(`${U.source}-${U.target}-${U.label}`), ke = ((oe = m.data) == null ? void 0 : oe.appendedBy) === s;
|
|
181
182
|
return !Ne && !ke;
|
|
182
183
|
}
|
|
183
184
|
return !0;
|
|
184
|
-
}), { typeListObj:
|
|
185
|
-
return B(
|
|
185
|
+
}), { typeListObj: f, relationListObj: M } = F({}, { graphData: $, typeObj: {} });
|
|
186
|
+
return B(f), A(M), $;
|
|
186
187
|
}), a.data("appendedNodes", []), a.data("isExpanded", !1);
|
|
187
188
|
}
|
|
188
189
|
}), setTimeout(() => {
|
|
@@ -190,28 +191,28 @@ const lt = ({
|
|
|
190
191
|
}, 300);
|
|
191
192
|
} else {
|
|
192
193
|
try {
|
|
193
|
-
|
|
194
|
+
_(!0), C.open({
|
|
194
195
|
type: "loading",
|
|
195
196
|
content: "正在展开...",
|
|
196
197
|
duration: 0
|
|
197
198
|
});
|
|
198
|
-
const
|
|
199
|
-
if (B(N),
|
|
199
|
+
const d = await re({ uri: s, queryType: 1, kgId: l, zktype: n.zktype }), { elements: r, typeListObj: N, relationListObj: T } = F(d.data, { graphData: p, typeObj: x, relationObj: P, zktype: n.zktype });
|
|
200
|
+
if (B(N), A(T), !((r == null ? void 0 : r.length) > 0)) {
|
|
200
201
|
setTimeout(() => {
|
|
201
202
|
C.destroy(), C.warning("暂无数据");
|
|
202
203
|
}, 2e3);
|
|
203
204
|
return;
|
|
204
205
|
}
|
|
205
206
|
if ((r == null ? void 0 : r.length) > 0) {
|
|
206
|
-
const
|
|
207
|
-
...
|
|
207
|
+
const H = e.layoutUtilities({
|
|
208
|
+
...se(),
|
|
208
209
|
idealEdgeLength: 80,
|
|
209
210
|
// 与你的期望边长匹配
|
|
210
211
|
offset: 30
|
|
211
212
|
// 随机偏移,避免完全重叠
|
|
212
213
|
}), c = r.map((i) => {
|
|
213
214
|
if (i.group === "nodes") {
|
|
214
|
-
const b =
|
|
215
|
+
const b = Te * Z;
|
|
215
216
|
return {
|
|
216
217
|
...i,
|
|
217
218
|
style: {
|
|
@@ -221,11 +222,11 @@ const lt = ({
|
|
|
221
222
|
},
|
|
222
223
|
data: {
|
|
223
224
|
...i.data,
|
|
224
|
-
parentId:
|
|
225
|
+
parentId: s,
|
|
225
226
|
// 标记父节点
|
|
226
|
-
appendedBy:
|
|
227
|
+
appendedBy: s,
|
|
227
228
|
// 标记由谁追加
|
|
228
|
-
idLabel:
|
|
229
|
+
idLabel: s + "-" + i.data.label,
|
|
229
230
|
zktype: n.zktype,
|
|
230
231
|
isAppended: !0,
|
|
231
232
|
// 标记是追加节点
|
|
@@ -238,16 +239,16 @@ const lt = ({
|
|
|
238
239
|
...i,
|
|
239
240
|
data: {
|
|
240
241
|
...i.data,
|
|
241
|
-
appendedBy:
|
|
242
|
+
appendedBy: s,
|
|
242
243
|
zktype: n.zktype
|
|
243
244
|
}
|
|
244
245
|
};
|
|
245
|
-
}),
|
|
246
|
-
|
|
247
|
-
const
|
|
248
|
-
a.data("appendedNodes",
|
|
249
|
-
const m = e.nodes().difference(
|
|
250
|
-
m.forEach((i) => i.lock()),
|
|
246
|
+
}), $ = e.add(c);
|
|
247
|
+
I([...p, ...c]);
|
|
248
|
+
const f = $.filter(":node"), M = f.map((i) => i.id());
|
|
249
|
+
a.data("appendedNodes", M), a.data("isExpanded", !0);
|
|
250
|
+
const m = e.nodes().difference(f);
|
|
251
|
+
m.forEach((i) => i.lock()), H.placeNewNodes(f), e.layout({
|
|
251
252
|
name: "cose-bilkent",
|
|
252
253
|
randomize: !1,
|
|
253
254
|
// ⚠️ 这是关键!保持已有节点位置不变
|
|
@@ -264,7 +265,7 @@ const lt = ({
|
|
|
264
265
|
gravity: 0.6
|
|
265
266
|
}).run(), setTimeout(() => {
|
|
266
267
|
m.forEach((i) => i.unlock());
|
|
267
|
-
}, 2e3),
|
|
268
|
+
}, 2e3), f.animate({
|
|
268
269
|
style: {
|
|
269
270
|
opacity: 1,
|
|
270
271
|
width: 20,
|
|
@@ -274,7 +275,7 @@ const lt = ({
|
|
|
274
275
|
duration: 400,
|
|
275
276
|
easing: "ease-out",
|
|
276
277
|
complete: () => {
|
|
277
|
-
|
|
278
|
+
f.style("opacity", ""), f.style("width", ""), f.style("height", "");
|
|
278
279
|
}
|
|
279
280
|
}), setTimeout(() => {
|
|
280
281
|
a.removed() || (a.style("border-width", ""), a.style("border-color", ""), e.center(a), e.zoom(e.zoom()));
|
|
@@ -282,25 +283,25 @@ const lt = ({
|
|
|
282
283
|
} else
|
|
283
284
|
console.log("没有找到相关节点数据");
|
|
284
285
|
C.destroy();
|
|
285
|
-
} catch (
|
|
286
|
-
C.destroy(), C.error("请求接口失败"), console.error("22请求接口失败:",
|
|
286
|
+
} catch (d) {
|
|
287
|
+
C.destroy(), C.error("请求接口失败"), console.error("22请求接口失败:", d);
|
|
287
288
|
}
|
|
288
|
-
|
|
289
|
+
_(!1);
|
|
289
290
|
}
|
|
290
291
|
j({ visible: !1 });
|
|
291
292
|
}, he = {
|
|
292
293
|
expanded: "typed-literal",
|
|
293
294
|
contract: "uri"
|
|
294
|
-
}, ve = (n,
|
|
295
|
+
}, ve = (n, s) => {
|
|
295
296
|
var e;
|
|
296
|
-
console.log("handleMenuAction:::", n,
|
|
297
|
-
const l =
|
|
297
|
+
console.log("handleMenuAction:::", n, s);
|
|
298
|
+
const l = s || y.targetNode;
|
|
298
299
|
if (l) {
|
|
299
300
|
const a = n.ids, t = l.data();
|
|
300
301
|
if (["expanded", "contract"].includes(a))
|
|
301
|
-
me({ kgId:
|
|
302
|
+
me({ kgId: u.kgId, ...t, zktype: he[a] });
|
|
302
303
|
else if (a === "nodeInfo") {
|
|
303
|
-
const o = l,
|
|
304
|
+
const o = l, d = {
|
|
304
305
|
id: o.id(),
|
|
305
306
|
data: o.data(),
|
|
306
307
|
position: o.position(),
|
|
@@ -310,42 +311,42 @@ const lt = ({
|
|
|
310
311
|
classes: o.classes(),
|
|
311
312
|
style: o.style()
|
|
312
313
|
};
|
|
313
|
-
|
|
314
|
-
} else a === "knowledgeCard" &&
|
|
314
|
+
J.current.open(d);
|
|
315
|
+
} else a === "knowledgeCard" && Q.current.open(l.data());
|
|
315
316
|
(e = n.onClick) == null || e.call(n, l), j({ visible: !1, x: 0, y: 0, targetNode: null });
|
|
316
317
|
}
|
|
317
318
|
};
|
|
318
|
-
console.log(111, !(((
|
|
319
|
+
console.log(111, !(((ee = p == null ? void 0 : p.nodes) == null ? void 0 : ee.length) > 0), p);
|
|
319
320
|
const be = () => {
|
|
320
321
|
const n = {};
|
|
321
|
-
return Object.keys(x).forEach((
|
|
322
|
-
|
|
322
|
+
return Object.keys(x).forEach((s) => {
|
|
323
|
+
s !== "_" && (n[s] = x[s]);
|
|
323
324
|
}), n;
|
|
324
325
|
};
|
|
325
|
-
return /* @__PURE__ */ h(Be, { value: { pathNodes:
|
|
326
|
+
return /* @__PURE__ */ h(Be, { value: { pathNodes: ye, setPathNodes: V, graphInfo: u, graphData: p, layoutType: ge, setLayoutType: ue, knowledgeCardApi: ae, queryStatisticsConfig: ce, actionBar: ie }, children: /* @__PURE__ */ ne("div", { className: We("cytoscape-container relative", pe), children: [
|
|
326
327
|
/* @__PURE__ */ h("div", { className: "btn-group" }),
|
|
327
328
|
/* @__PURE__ */ h(
|
|
328
329
|
Le,
|
|
329
330
|
{
|
|
330
|
-
ref:
|
|
331
|
-
cyRef:
|
|
332
|
-
graphInfo:
|
|
333
|
-
initNodeScale:
|
|
331
|
+
ref: X,
|
|
332
|
+
cyRef: g,
|
|
333
|
+
graphInfo: u,
|
|
334
|
+
initNodeScale: Z,
|
|
334
335
|
cyContainerRef: O,
|
|
335
336
|
typeObj: be(),
|
|
336
|
-
relationObj:
|
|
337
|
+
relationObj: P,
|
|
337
338
|
colors: w
|
|
338
339
|
}
|
|
339
340
|
),
|
|
340
|
-
/* @__PURE__ */
|
|
341
|
+
/* @__PURE__ */ ne("div", { className: "relative h-100", children: [
|
|
341
342
|
/* @__PURE__ */ h("div", { ref: O, className: "cy-container" }),
|
|
342
|
-
|
|
343
|
+
y.visible && y.targetNode && /* @__PURE__ */ h(
|
|
343
344
|
"div",
|
|
344
345
|
{
|
|
345
346
|
style: {
|
|
346
347
|
position: "absolute",
|
|
347
|
-
left: `${
|
|
348
|
-
top: `${
|
|
348
|
+
left: `${y.x}px`,
|
|
349
|
+
top: `${y.y}px`,
|
|
349
350
|
// backgroundColor: 'white',
|
|
350
351
|
// border: '1px solid #ccc',
|
|
351
352
|
// borderRadius: '50%',
|
|
@@ -359,16 +360,16 @@ const lt = ({
|
|
|
359
360
|
overflow: "hidden"
|
|
360
361
|
},
|
|
361
362
|
onClick: (n) => n.stopPropagation(),
|
|
362
|
-
children: /* @__PURE__ */ h(
|
|
363
|
+
children: /* @__PURE__ */ h(Se, { items: fe, centerImage: (te = y == null ? void 0 : y.targetNode) == null ? void 0 : te.data().image, targetNode: y.targetNode, onClick: (n, s) => ve(n, s) })
|
|
363
364
|
}
|
|
364
365
|
),
|
|
365
|
-
|
|
366
|
+
R.visible && /* @__PURE__ */ h(
|
|
366
367
|
"div",
|
|
367
368
|
{
|
|
368
369
|
style: {
|
|
369
370
|
position: "absolute",
|
|
370
|
-
left: `${
|
|
371
|
-
top: `${
|
|
371
|
+
left: `${R.x}px`,
|
|
372
|
+
top: `${R.y}px`,
|
|
372
373
|
transform: "translateX(-50%)",
|
|
373
374
|
backgroundColor: "rgba(0, 0, 0, 0.85)",
|
|
374
375
|
color: "#fff",
|
|
@@ -382,12 +383,12 @@ const lt = ({
|
|
|
382
383
|
overflow: "hidden",
|
|
383
384
|
textOverflow: "ellipsis"
|
|
384
385
|
},
|
|
385
|
-
children:
|
|
386
|
+
children: R.content
|
|
386
387
|
}
|
|
387
388
|
)
|
|
388
389
|
] }),
|
|
389
|
-
/* @__PURE__ */ h(
|
|
390
|
-
/* @__PURE__ */ h(
|
|
390
|
+
/* @__PURE__ */ h(Ie, { ref: J }),
|
|
391
|
+
/* @__PURE__ */ h(Ae, { ref: Q })
|
|
391
392
|
] }) });
|
|
392
393
|
};
|
|
393
394
|
export {
|
package/lib/index.es38.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsxs as c, jsx as r, Fragment as o } from "react/jsx-runtime";
|
|
2
|
-
import N from "./index.
|
|
3
|
-
import k from "./index.
|
|
4
|
-
import y from "./index.
|
|
5
|
-
import C from "./index.
|
|
6
|
-
import S from "./index.
|
|
7
|
-
import v from "./index.
|
|
2
|
+
import N from "./index.es43.js";
|
|
3
|
+
import k from "./index.es44.js";
|
|
4
|
+
import y from "./index.es45.js";
|
|
5
|
+
import C from "./index.es46.js";
|
|
6
|
+
import S from "./index.es47.js";
|
|
7
|
+
import v from "./index.es48.js";
|
|
8
8
|
import { Row as x, Col as f, Empty as q } from "antd";
|
|
9
9
|
/* empty css */
|
|
10
10
|
const i = (e) => {
|
package/lib/index.es43.js
CHANGED
|
@@ -1,91 +1,21 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
const
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const o = document.createElement("canvas");
|
|
19
|
-
o.width = e.videoWidth, o.height = e.videoHeight;
|
|
20
|
-
const d = o.getContext("2d");
|
|
21
|
-
if (d) {
|
|
22
|
-
d.drawImage(e, 0, 0, o.width, o.height);
|
|
23
|
-
const w = o.toDataURL("image/jpeg", 0.8);
|
|
24
|
-
h((N) => ({ ...N, [r]: w }));
|
|
25
|
-
}
|
|
26
|
-
e.src = "";
|
|
27
|
-
}, e.onerror = () => {
|
|
28
|
-
e.src = "";
|
|
29
|
-
};
|
|
30
|
-
};
|
|
31
|
-
return f(() => {
|
|
32
|
-
c.forEach((t, r) => {
|
|
33
|
-
y(t.propertyValue, r);
|
|
34
|
-
});
|
|
35
|
-
}, [c]), /* @__PURE__ */ m(x, { children: [
|
|
36
|
-
/* @__PURE__ */ a("div", { className: "video-wraper", children: c.map((t, r) => {
|
|
37
|
-
t.propertyValue.split("/").pop();
|
|
38
|
-
const e = i[r];
|
|
39
|
-
return /* @__PURE__ */ a("div", { className: "rounded-lg overflow-hidden transition-shadow", children: /* @__PURE__ */ m("div", { className: "video-item", children: [
|
|
40
|
-
/* @__PURE__ */ a(
|
|
41
|
-
"video",
|
|
42
|
-
{
|
|
43
|
-
ref: (o) => {
|
|
44
|
-
v.current[r] = o;
|
|
45
|
-
},
|
|
46
|
-
src: t.propertyValue,
|
|
47
|
-
poster: e,
|
|
48
|
-
className: "video-item-video",
|
|
49
|
-
muted: !0,
|
|
50
|
-
playsInline: !0,
|
|
51
|
-
preload: "metadata",
|
|
52
|
-
onClick: () => l(t.propertyValue)
|
|
53
|
-
}
|
|
54
|
-
),
|
|
55
|
-
!n && /* @__PURE__ */ a("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ a(
|
|
56
|
-
"div",
|
|
57
|
-
{
|
|
58
|
-
className: "w-8 h-8 rounded-full flex items-center justify-center cursor-pointer hover:scale-110 transition-transform",
|
|
59
|
-
onClick: () => l(t.propertyValue),
|
|
60
|
-
children: /* @__PURE__ */ a("span", { className: "w-24px h-24px i-custom-video-play inline-block" })
|
|
61
|
-
}
|
|
62
|
-
) })
|
|
63
|
-
] }) }, r);
|
|
64
|
-
}) }),
|
|
65
|
-
/* @__PURE__ */ a(
|
|
66
|
-
C,
|
|
67
|
-
{
|
|
68
|
-
open: !!n,
|
|
69
|
-
footer: null,
|
|
70
|
-
onCancel: g,
|
|
71
|
-
width: "auto",
|
|
72
|
-
centered: !0,
|
|
73
|
-
className: "video-modal",
|
|
74
|
-
wrapClassName: "modal-wrapClassName",
|
|
75
|
-
getContainer: () => document.getElementById("root"),
|
|
76
|
-
children: n && /* @__PURE__ */ a(
|
|
77
|
-
"video",
|
|
78
|
-
{
|
|
79
|
-
ref: s,
|
|
80
|
-
src: n,
|
|
81
|
-
controls: !0,
|
|
82
|
-
className: "max-w-[80vw] max-h-[80vh] mt-10px"
|
|
83
|
-
}
|
|
84
|
-
)
|
|
85
|
-
}
|
|
86
|
-
)
|
|
87
|
-
] });
|
|
1
|
+
import { jsx as o, jsxs as r } from "react/jsx-runtime";
|
|
2
|
+
import { Row as i, Col as p } from "antd";
|
|
3
|
+
const d = ({ properties: t, excludedKeys: l = [] }) => {
|
|
4
|
+
const s = t.filter(
|
|
5
|
+
(e) => !l.includes(e.propertyKey)
|
|
6
|
+
);
|
|
7
|
+
return /* @__PURE__ */ o(i, { className: "property-section-wraper", children: s.map((e, a) => /* @__PURE__ */ r(p, { span: 24, className: "section-item", children: [
|
|
8
|
+
/* @__PURE__ */ r("div", { className: "detail-label", children: [
|
|
9
|
+
e.propertyKey,
|
|
10
|
+
":"
|
|
11
|
+
] }),
|
|
12
|
+
/* @__PURE__ */ r("div", { className: "detail-value", children: [
|
|
13
|
+
" ",
|
|
14
|
+
e.propertyValue,
|
|
15
|
+
" "
|
|
16
|
+
] })
|
|
17
|
+
] }, a)) });
|
|
88
18
|
};
|
|
89
19
|
export {
|
|
90
|
-
|
|
20
|
+
d as default
|
|
91
21
|
};
|