Skip to content

Commit 8cc46af

Browse files
shanhexishanhexi
committed
refactor-workspace
2 parents 4ef1a8f + d90495c commit 8cc46af

21 files changed

Lines changed: 364 additions & 268 deletions

File tree

‎chat2db-client/src/blocks/Tree/hooks/useGetRightClickMenu.ts‎

Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
import { ITreeNode } from '@/typings';
2+
import { OperationColumn, WorkspaceTabType } from '@/constants';
3+
import i18n from '@/i18n';
4+
import { v4 as uuid } from 'uuid';
5+
6+
// ----- components -----
7+
import { dataSourceFormConfigs } from '@/components/ConnectionEdit/config/dataSource';
8+
import { IConnectionConfig } from '@/components/ConnectionEdit/config/types';
9+
10+
// ----- config -----
11+
import { ITreeConfigItem, treeConfig } from '../treeConfig';
12+
import { useMemo } from 'react';
13+
14+
// ----- store -----
15+
import { createConsole, addWorkspaceTab } from '@/store/console';
16+
17+
interface IProps {
18+
treeNodeData: ITreeNode;
19+
loadData: any;
20+
}
21+
22+
interface IOperationColumnConfigItem {
23+
text: string;
24+
icon: string;
25+
handle: () => void;
26+
}
27+
28+
export const useGetRightClickMenu = (props: IProps) => {
29+
const { treeNodeData, loadData } = props;
30+
31+
const rightClickMenu = useMemo(() => {
32+
// 拿出当前节点的配置
33+
const treeNodeConfig: ITreeConfigItem = treeConfig[treeNodeData.treeNodeType];
34+
const { operationColumn } = treeNodeConfig;
35+
36+
const dataSourceFormConfig = dataSourceFormConfigs.find((t: IConnectionConfig) => {
37+
return t.type === treeNodeData.extraParams?.databaseType;
38+
})!;
39+
40+
// 有些数据库不支持的操作，需要排除掉
41+
function excludeSomeOperation() {
42+
const excludes = dataSourceFormConfig.baseInfo.excludes;
43+
const newOperationColumn: OperationColumn[] = [];
44+
operationColumn?.map((item: OperationColumn) => {
45+
let flag = false;
46+
excludes?.map((t) => {
47+
if (item === t) {
48+
flag = true;
49+
}
50+
});
51+
if (!flag) {
52+
newOperationColumn.push(item);
53+
}
54+
});
55+
return newOperationColumn;
56+
}
57+
58+
const operationColumnConfig: { [key in string]: IOperationColumnConfigItem } = {
59+
// 刷新
60+
[OperationColumn.Refresh]: {
61+
text: i18n('common.button.refresh'),
62+
icon: '\uec08',
63+
handle: () => {
64+
loadData({
65+
refresh: true,
66+
});
67+
},
68+
},
69+
// 创建console
70+
[OperationColumn.CreateConsole]: {
71+
text: i18n('workspace.menu.queryConsole'),
72+
icon: '\ue619',
73+
handle: () => {
74+
createConsole({
75+
name: 'create console',
76+
dataSourceId: treeNodeData.extraParams!.dataSourceId!,
77+
type: treeNodeData.extraParams!.databaseType!,
78+
databaseName: treeNodeData.extraParams?.databaseName,
79+
schemaName: treeNodeData.extraParams?.schemaName,
80+
});
81+
},
82+
},
83+
// 创建表
84+
[OperationColumn.CreateTable]: {
85+
text: i18n('editTable.button.createTable'),
86+
icon: '\ue792',
87+
handle: () => {
88+
addWorkspaceTab({
89+
id: uuid(),
90+
title: i18n('editTable.button.createTable'),
91+
type: WorkspaceTabType.CreateTable,
92+
uniqueData: {
93+
dataSourceId: treeNodeData.extraParams!.dataSourceId!,
94+
databaseType: treeNodeData.extraParams!.databaseType!,
95+
databaseName: treeNodeData.extraParams?.databaseName,
96+
schemaName: treeNodeData.extraParams?.schemaName,
97+
},
98+
});
99+
},
100+
},
101+
// 删除表
102+
[OperationColumn.DeleteTable]: {
103+
text: i18n('workspace.menu.deleteTable'),
104+
icon: '\ue6a7',
105+
handle: () => {
106+
// setVerifyDialog(true);
107+
},
108+
},
109+
// 查看ddl
110+
[OperationColumn.ViewDDL]: {
111+
text: i18n('workspace.menu.ViewDDL'),
112+
icon: '\ue665',
113+
handle: () => {
114+
//
115+
},
116+
},
117+
// 置顶
118+
[OperationColumn.Top]: {
119+
text: treeNodeData.pinned ? i18n('workspace.menu.unPin') : i18n('workspace.menu.pin'),
120+
icon: treeNodeData.pinned ? '\ue61d' : '\ue627',
121+
handle: () => {},
122+
},
123+
// 编辑表
124+
[OperationColumn.EditTable]: {
125+
text: i18n('workspace.menu.editTable'),
126+
icon: '\ue602',
127+
handle: () => {},
128+
},
129+
// 复制名称
130+
[OperationColumn.CopyName]: {
131+
text: i18n('common.button.copyName'),
132+
icon: '\uec7a',
133+
handle: () => {
134+
navigator.clipboard.writeText(treeNodeData.name);
135+
},
136+
},
137+
};
138+
139+
return excludeSomeOperation().map((t, i) => {
140+
const concrete = operationColumnConfig[t];
141+
return {
142+
key: i,
143+
onClick: concrete?.handle,
144+
labelProps: {
145+
icon: concrete?.icon,
146+
label: concrete?.text,
147+
},
148+
};
149+
});
150+
}, [treeNodeData]);
151+
152+
return rightClickMenu;
153+
};

‎chat2db-client/src/blocks/Tree/index.tsx‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { treeConfig, switchIcon, ITreeConfigItem } from './treeConfig';
99
import { useCommonStore } from '@/store/common';
1010
import LoadingGracile from '@/components/Loading/LoadingGracile';
1111
import { setFocusId, useTreeStore } from './treeStore';
12-
import { getRightClickMenu } from './rightClickMenu';
12+
import { useGetRightClickMenu } from './hooks/useGetRightClickMenu';
1313
import MenuLabel from '@/components/MenuLabel';
1414

1515
interface IProps {
@@ -151,20 +151,26 @@ const TreeNode = memo((props: TreeNodeIProps) => {
151151
});
152152
}, [treeNodeData]);
153153

154+
const rightClickMenu = useGetRightClickMenu({
155+
treeNodeData,
156+
loadData,
157+
});
158+
154159
const treeNodeDom = useMemo(() => {
155-
const dropdownsItems = getRightClickMenu({ treeNodeData, loadData }).map((item) => {
160+
const dropdownsItems: any = rightClickMenu.map((item) => {
156161
return {
157-
...item,
158-
label: <MenuLabel {...item.labelProps} />,
162+
key: item.key,
163+
onClick: item.onClick,
164+
label: <MenuLabel icon={item.labelProps.icon} label={item.labelProps.label} />,
159165
};
160166
});
161167

162168
return (
163169
<Dropdown
164170
trigger={['contextMenu']}
165171
menu={{
166-
items: dropdownsItems || [],
167-
style: dropdownsItems ? {} : { display: 'none' }, // 有菜单项才显示
172+
items: dropdownsItems,
173+
style: dropdownsItems?.length ? {} : { display: 'none' }, // 有菜单项才显示
168174
}}
169175
overlayStyle={{
170176
zIndex: 1080,
@@ -216,7 +222,7 @@ const TreeNode = memo((props: TreeNodeIProps) => {
216222
</Tooltip>
217223
</Dropdown>
218224
);
219-
}, [isFocus, isLoading, treeNodeData]);
225+
}, [isFocus, isLoading, rightClickMenu]);
220226

221227
return (
222228
<>

‎chat2db-client/src/blocks/Tree/rightClickMenu.ts‎

Lines changed: 0 additions & 136 deletions
This file was deleted.

0 commit comments

Comments
 (0)