Skip to content

Commit dbd174c

Browse files
author
Moyee
authored
Merge pull request #24 from TuGraph-family/update-analysis-0911
fix: Update Graph Analysis Model
2 parents b6fb47a + 3526153 commit dbd174c

File tree

17 files changed

+607
-309
lines changed

17 files changed

+607
-309
lines changed

client/package.json

Lines changed: 42 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,48 @@
1919
},
2020
"resolutions": {
2121
"@types/react": "^17.0.0",
22-
"@types/react-dom": "^17.0.0"
22+
"@types/react-dom": "^17.0.0",
23+
"umzug": "3.1.1",
24+
"tsparticles-engine": "2.9.3",
25+
"tsparticles-move-base": "2.9.3",
26+
"tsparticles-shape-circle": "2.9.3",
27+
"tsparticles-updater-color": "2.9.3",
28+
"tsparticles-updater-opacity": "2.9.3",
29+
"tsparticles-updater-out-modes": "2.9.3",
30+
"tsparticles-updater-size": "2.9.3",
31+
"tsparticles-interaction-external-trail": "2.9.3",
32+
"tsparticles-plugin-absorbers": "2.9.3",
33+
"tsparticles-plugin-emitters": "2.9.3",
34+
"tsparticles-slim": "2.9.3",
35+
"tsparticles-updater-destroy": "2.9.3",
36+
"tsparticles-updater-roll": "2.9.3",
37+
"tsparticles-updater-tilt": "2.9.3",
38+
"tsparticles-updater-twinkle": "2.9.3",
39+
"tsparticles-updater-wobble": "2.9.3",
40+
"tsparticles-interaction-external-attract": "2.9.3",
41+
"tsparticles-interaction-external-bounce": "2.9.3",
42+
"tsparticles-interaction-external-bubble": "2.9.3",
43+
"tsparticles-interaction-external-connect": "2.9.3",
44+
"tsparticles-interaction-external-grab": "2.9.3",
45+
"tsparticles-interaction-external-pause": "2.9.3",
46+
"tsparticles-interaction-external-push": "2.9.3",
47+
"tsparticles-interaction-external-remove": "2.9.3",
48+
"tsparticles-interaction-external-repulse": "2.9.3",
49+
"tsparticles-interaction-external-slow": "2.9.3",
50+
"tsparticles-interaction-particles-attract": "2.9.3",
51+
"tsparticles-interaction-particles-collisions": "2.9.3",
52+
"tsparticles-interaction-particles-links": "2.9.3",
53+
"tsparticles-move-parallax": "2.9.3",
54+
"tsparticles-particles.js": "2.9.3",
55+
"tsparticles-plugin-easing-quad": "2.9.3",
56+
"tsparticles-shape-image": "2.9.3",
57+
"tsparticles-shape-line": "2.9.3",
58+
"tsparticles-shape-polygon": "2.9.3",
59+
"tsparticles-shape-square": "2.9.3",
60+
"tsparticles-shape-star": "2.9.3",
61+
"tsparticles-shape-text": "2.9.3",
62+
"tsparticles-updater-life": "2.9.3",
63+
"tsparticles-updater-stroke-color": "2.9.3"
2364
},
2465
"dependencies": {
2566
"@tugraph/openpiece-cli": "0.0.6",

client/packages/app/client/.umirc.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const umiConfig = getUmiConfig();
88

99
process.env.MFSU_AD = 'none';
1010

11-
const ANTD_VERSION = '4.23.5';
11+
const ANTD_VERSION = '4.24.0';
1212
const GI_SDK_APP_VERSION = '1.2.0';
1313

1414
export default defineConfig({

client/packages/app/client/src/components/@@plugins/src/components/studio/tugraph/domain-core/graph-construct/add-nodes-edges/index.module.less

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,14 @@
1717
overflow: hidden;
1818
}
1919
}
20+
.ant-table-cell {
21+
font-weight: 400;
22+
font-size: 14px;
23+
color: #6a6b71;
24+
}
25+
.ant-form-item-required {
26+
color: #363740;
27+
}
2028
}
2129
&-content {
2230
padding: 0 24px 24px;
@@ -41,6 +49,12 @@
4149
}
4250
&-addbtn {
4351
margin: 8px 0 10px 0;
52+
&:hover {
53+
border: 1px dashed #1650ff;
54+
}
55+
}
56+
&-name:focus {
57+
border: 1px solid #1650ff;
4458
}
4559
&-attr {
4660
margin-bottom: 16px;
@@ -50,4 +64,7 @@
5064
font-size: 14px;
5165
color: rgba(54, 55, 64, 1);
5266
}
67+
&-attributes {
68+
background-color: #1650ff;
69+
}
5370
}

client/packages/app/client/src/components/@@plugins/src/components/studio/tugraph/domain-core/graph-construct/add-nodes-edges/index.tsx

Lines changed: 38 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ type Prop = {
1717
data?: any;
1818
onFinish?: (value?: any) => void;
1919
onSwitch?: (onShow: () => void, onClose: () => void) => void;
20+
onVisible?: (visible: boolean) => void;
2021
};
2122
interface EditColumnsType<T> extends ColumnsType<T> {
2223
editorConfig: {
@@ -33,6 +34,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
3334
data = [],
3435
onFinish,
3536
onSwitch,
37+
onVisible,
3638
}) => {
3739
const [form] = Form.useForm();
3840
const { visible, onShow, onClose } = useVisible({ defaultVisible: true });
@@ -50,18 +52,22 @@ export const AddNodesEdges: React.FC<Prop> = ({
5052
useEffect(() => {
5153
onSwitch?.(onShow, onClose);
5254
}, []);
55+
useEffect(() => {
56+
onVisible?.(visible);
57+
}, [visible]);
58+
5359
const propertyList = () => {
5460
const attrPropertyNames = map(
55-
filter(attrList, (attr) => !attr.optional),
56-
(item) => item.name
61+
filter(attrList, attr => !attr.optional),
62+
item => item.name,
5763
);
58-
const indexPropertyNames = map(configList, (item) => item.propertyName);
64+
const indexPropertyNames = map(configList, item => item.propertyName);
5965
return map(
6066
filter(
6167
xor(attrPropertyNames, indexPropertyNames),
62-
(item) => item !== undefined
68+
item => item !== undefined,
6369
),
64-
(item) => ({ label: item, value: item })
70+
item => ({ label: item, value: item }),
6571
);
6672
};
6773
const addButton = (handleAdd?: () => void, text: string = '添加属性') => {
@@ -87,7 +93,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
8793
return {
8894
inputType: EditType.SELECT,
8995
prop: {
90-
options: map(data.nodes, (item) => ({
96+
options: map(data.nodes, item => ({
9197
label: item.labelName,
9298
value: item.labelName,
9399
})),
@@ -104,7 +110,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
104110
return {
105111
inputType: EditType.SELECT,
106112
prop: {
107-
options: map(data.nodes, (item) => ({
113+
options: map(data.nodes, item => ({
108114
label: item.labelName,
109115
value: item.labelName,
110116
})),
@@ -120,9 +126,9 @@ export const AddNodesEdges: React.FC<Prop> = ({
120126
<Popconfirm
121127
title="确定要删除吗?"
122128
onConfirm={() => {
123-
updateState((draft) => {
129+
updateState(draft => {
124130
draft.startList = [
125-
...startList.filter((item) => item.id !== record?.id),
131+
...startList.filter(item => item.id !== record?.id),
126132
];
127133
});
128134
}}
@@ -194,9 +200,9 @@ export const AddNodesEdges: React.FC<Prop> = ({
194200
<Popconfirm
195201
title="确定要删除吗?"
196202
onConfirm={() => {
197-
updateState((draft) => {
203+
updateState(draft => {
198204
draft.attrList = [
199-
...attrList.filter((item) => item.id !== record?.id),
205+
...attrList.filter(item => item.id !== record?.id),
200206
];
201207
});
202208
}}
@@ -294,9 +300,9 @@ export const AddNodesEdges: React.FC<Prop> = ({
294300
<Popconfirm
295301
title="确定要删除吗?"
296302
onConfirm={() => {
297-
updateState((draft) => {
303+
updateState(draft => {
298304
draft.configList = [
299-
...configList.filter((item) => item.id !== record?.id),
305+
...configList.filter(item => item.id !== record?.id),
300306
];
301307
});
302308
}}
@@ -309,14 +315,14 @@ export const AddNodesEdges: React.FC<Prop> = ({
309315
},
310316
];
311317
const addNodeAttr = () => {
312-
updateState((draft) => {
318+
updateState(draft => {
313319
const list = [...attrList];
314320
list.push({ id: attrList.length + 1 });
315321
draft.attrList = [...list];
316322
});
317323
};
318324
const addNodeConfig = () => {
319-
updateState((draft) => {
325+
updateState(draft => {
320326
const list = [...configList];
321327
list.push({
322328
id: configList.length + 1,
@@ -326,7 +332,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
326332
});
327333
};
328334
const addEdge = () => {
329-
updateState((draft) => {
335+
updateState(draft => {
330336
const list = [...startList];
331337
list.push({ id: `${startList.length + 1}` });
332338
draft.startList = [...list];
@@ -347,7 +353,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
347353
onClick={() => {
348354
onClose();
349355
form.resetFields();
350-
updateState((draft) => {
356+
updateState(draft => {
351357
draft.startList = [];
352358
draft.configList = [];
353359
draft.attrList = [];
@@ -359,7 +365,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
359365
<Button
360366
onClick={() => {
361367
const isEdgeRepeat =
362-
uniq(map(startList, (item) => `${item.source}_${item.target}`))
368+
uniq(map(startList, item => `${item.source}_${item.target}`))
363369
.length === startList.length;
364370
if (!isEdgeRepeat) {
365371
return message.error('两条边的起点和终点不能相同');
@@ -375,7 +381,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
375381
},
376382
indexs: configList,
377383
properties: attrList,
378-
edgeConstraints: map(startList, (item) => {
384+
edgeConstraints: map(startList, item => {
379385
return [item.source, item.target];
380386
}),
381387
});
@@ -391,7 +397,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
391397
<div className={styles[`${PUBLIC_PERFIX_CLASS}-container-header`]}>
392398
<span> 添加{`${isNode ? '点' : '边'}`}类型</span>
393399
<div>
394-
命令行建模
400+
<span style={{ marginRight: 4 }}>命令行建模</span>
395401
<a href="https://tugraph.antgroup.com/doc" target="_blank">
396402
参见文档
397403
</a>
@@ -409,12 +415,12 @@ export const AddNodesEdges: React.FC<Prop> = ({
409415
var reg = new RegExp('^[a-zA-Z0-9_\u4e00-\u9fa5]+$');
410416
if (!value) {
411417
return Promise.reject(
412-
`请填写${isNode ? '点' : '边'}类型名称!`
418+
`请填写${isNode ? '点' : '边'}类型名称!`,
413419
);
414420
}
415421
if (!reg.test(value)) {
416422
return Promise.reject(
417-
'名称由中文、字母、数字、下划线组成。'
423+
'名称由中文、字母、数字、下划线组成。',
418424
);
419425
} else {
420426
return Promise.resolve();
@@ -426,6 +432,7 @@ export const AddNodesEdges: React.FC<Prop> = ({
426432
<Input
427433
autoComplete="off"
428434
placeholder={`请输入${isNode ? '点' : '边'}类型名称`}
435+
className={styles[`${PUBLIC_PERFIX_CLASS}-container-name`]}
429436
/>
430437
</Form.Item>
431438
</Form>
@@ -434,11 +441,13 @@ export const AddNodesEdges: React.FC<Prop> = ({
434441
属性列表
435442
</p>
436443
<EditTable
444+
// className={styles[`${PUBLIC_PERFIX_CLASS}-container-attributes`]}
445+
// style={{ background: 'red' }}
437446
columns={defaultColumns}
438447
dataSource={attrList}
439448
rowKey="id"
440-
onChange={(newData) => {
441-
updateState((draft) => {
449+
onChange={newData => {
450+
updateState(draft => {
442451
draft.attrList = [...(newData || [])];
443452
});
444453
}}
@@ -460,9 +469,9 @@ export const AddNodesEdges: React.FC<Prop> = ({
460469
rowKey="id"
461470
bordered
462471
pagination={false}
463-
onChange={(newData) => {
464-
updateState((draft) => {
465-
draft.startList = map([...newData], (item) => ({
472+
onChange={newData => {
473+
updateState(draft => {
474+
draft.startList = map([...newData], item => ({
466475
...item,
467476
label: form.getFieldValue('name'),
468477
style: { label: { value: form.getFieldValue('name') } },
@@ -485,8 +494,8 @@ export const AddNodesEdges: React.FC<Prop> = ({
485494
columns={nodeConfigColumns}
486495
dataSource={configList}
487496
rowKey="id"
488-
onChange={(newData) => {
489-
updateState((draft) => {
497+
onChange={newData => {
498+
updateState(draft => {
490499
draft.configList = [...newData];
491500
});
492501
}}

0 commit comments

Comments
 (0)