Skip to content

Commit ba87db0

Browse files
author
单贺喜
committed
feat:双击树创建console
1 parent ce0886e commit ba87db0

12 files changed

Lines changed: 162 additions & 87 deletions

File tree

‎chat2db-client/src/components/Iconfont/index.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,9 @@ if (__ENV === 'local') {
99
/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
1010
@font-face {
1111
font-family: 'iconfont'; /* Project id 3633546 */
12-
src: url('//at.alicdn.com/t/c/font_3633546_h8vaafdnpbp.woff2?t=1687789960780') format('woff2'),
13-
url('//at.alicdn.com/t/c/font_3633546_h8vaafdnpbp.woff?t=1687789960780') format('woff'),
14-
url('//at.alicdn.com/t/c/font_3633546_h8vaafdnpbp.ttf?t=1687789960780') format('truetype');
12+
src: url('//at.alicdn.com/t/a/font_3633546_7qftabf6y8.woff2?t=1687853414741') format('woff2'),
13+
url('//at.alicdn.com/t/a/font_3633546_7qftabf6y8.woff?t=1687853414741') format('woff'),
14+
url('//at.alicdn.com/t/a/font_3633546_7qftabf6y8.ttf?t=1687853414741') format('truetype');
1515
}
1616
`
1717
let style = document.createElement("style");
@@ -24,7 +24,7 @@ export default class Iconfont extends PureComponent<
2424
{
2525
code: string;
2626
} & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>
27-
> {
27+
> {
2828
render() {
2929
return (
3030
<i {...this.props} className={classnames(this.props.className, styles.iconfont)}>

‎chat2db-client/src/models/connection.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { IConnectionDetails } from '@/typings/connection';
22
import { Effect, Reducer } from 'umi';
33
import connectionService from '@/service/connection';
44
import { IPageResponse } from '@/typings/common';
5+
import { getCurConnection } from '@/utils/localStorage';
56

67
/**
78
* 数据源相关 - 链接池、数据库、schema、表
@@ -28,7 +29,7 @@ export interface IConnectionModelType {
2829
const ConnectionModel: IConnectionModelType = {
2930
namespace: 'connection',
3031
state: {
31-
curConnection: undefined,
32+
curConnection: getCurConnection(),
3233
connectionList: [],
3334
},
3435
reducers: {
@@ -42,6 +43,7 @@ const ConnectionModel: IConnectionModelType = {
4243

4344
// 设置当前选着的Connection
4445
setCurConnection(state, { payload }) {
46+
localStorage.setItem('cur-connection',JSON.stringify(payload))
4547
return { ...state, curConnection: payload };
4648
},
4749

‎chat2db-client/src/models/mainPage.ts‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,28 @@
1-
export interface MainState {
1+
import { Effect, Reducer } from 'umi';
2+
export interface IState {
23
curPage: string;
34
}
45

5-
const mainModel = {
6+
export interface IMainPageType {
7+
namespace: 'mainPage',
8+
state: IState,
9+
reducers: {
10+
updateCurPage: Reducer<IState>;
11+
};
12+
}
13+
14+
const MainPageModel: IMainPageType = {
615
namespace: 'mainPage',
716

817
state: {
9-
curPage: 'connections',
18+
curPage: '',
1019
},
1120

1221
reducers: {
13-
updateCurPage(state: MainState, { payload }: { payload: MainState['curPage'] }) {
22+
updateCurPage(state, { payload }) {
1423
return { ...state, curPage: payload };
1524
},
1625
},
1726
};
1827

19-
export default mainModel
28+
export default MainPageModel

‎chat2db-client/src/models/workspace.ts‎

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
import { getCurrentWorkspaceDatabase, setCurrentWorkspaceDatabase } from '@/utils/localStorage';
12
import sqlService, { MetaSchemaVO } from '@/service/sql';
23
import { DatabaseTypeCode } from '@/constants';
34
import { Effect, Reducer } from 'umi';
5+
import { ITreeNode } from '@/typings'
46

5-
export type ICurWorkspaceData = {
7+
export type ICurWorkspaceParams = {
68
dataSourceId: number;
79
databaseSourceName: string;
810
databaseType: DatabaseTypeCode;
@@ -14,7 +16,9 @@ export interface IState {
1416
// 当前连接下的及联databaseAndSchema数据
1517
databaseAndSchema: MetaSchemaVO;
1618
// 当前工作区所需的参数
17-
curWorkspaceParams: ICurWorkspaceData;
19+
curWorkspaceParams: ICurWorkspaceParams;
20+
// 双击树node节点
21+
doubleClickTreeNodeData: ITreeNode | undefined;
1822
}
1923

2024
export interface IWorkspaceModelType {
@@ -23,6 +27,7 @@ export interface IWorkspaceModelType {
2327
reducers: {
2428
setDatabaseAndSchema: Reducer<IState['databaseAndSchema']>;
2529
setCurWorkspaceParams: Reducer<IState['curWorkspaceParams']>;
30+
setDoubleClickTreeNodeData: Reducer<any>; //TS TODO:
2631
};
2732
effects: {
2833
fetchdatabaseAndSchema: Effect;
@@ -34,7 +39,8 @@ const WorkspaceModel:IWorkspaceModelType = {
3439

3540
state: {
3641
databaseAndSchema: {},
37-
curWorkspaceParams: {} as ICurWorkspaceData
42+
curWorkspaceParams: getCurrentWorkspaceDatabase(),
43+
doubleClickTreeNodeData: undefined,
3844
},
3945

4046
reducers: {
@@ -47,11 +53,19 @@ const WorkspaceModel:IWorkspaceModelType = {
4753
},
4854

4955
setCurWorkspaceParams(state, { payload }) {
56+
setCurrentWorkspaceDatabase(payload);
5057
return {
5158
...state,
5259
curWorkspaceParams: payload,
5360
};
5461
},
62+
63+
setDoubleClickTreeNodeData(state, { payload }) {
64+
return {
65+
...state,
66+
doubleClickTreeNodeData: payload,
67+
};
68+
},
5569
},
5670

5771
effects: {

‎chat2db-client/src/pages/main/connection/index.tsx‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -72,10 +72,6 @@ function Connections(props: IProps) {
7272
type: 'mainPage/updateCurPage',
7373
payload: 'workspace'
7474
})
75-
76-
dispatch({
77-
type: 'workspace/fetchdatabaseAndSchema',
78-
});
7975
}
8076

8177
const renderMenu = () => {

‎chat2db-client/src/pages/main/index.tsx‎

Lines changed: 31 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ import classnames from 'classnames';
66
import Setting from '@/blocks/Setting';
77
import Iconfont from '@/components/Iconfont';
88
import BrandLogo from '@/components/BrandLogo';
9-
import { MainState } from '@/models/mainPage';
9+
import { IMainPageType } from '@/models/mainPage';
10+
import { IWorkspaceModelType } from '@/models/workspace';
11+
import { IConnectionModelType } from '@/models/connection';
1012
import { findObjListValue } from '@/utils'
1113

1214
import DataSource from './connection';
@@ -45,42 +47,57 @@ const navConfig: INavItem[] = [
4547
const initPageIndex = navConfig.findIndex(t => `/${t.key}` === window.location.pathname);
4648

4749
interface IProps {
48-
mainModel: MainState;
50+
mainModel: IMainPageType['state'];
51+
workspaceModel: IWorkspaceModelType['state'];
52+
connectionModel: IConnectionModelType['state'];
4953
dispatch: any;
5054
}
5155

5256
function MainPage(props: IProps) {
53-
const { mainModel, dispatch } = props;
57+
const { mainModel, workspaceModel, connectionModel, dispatch } = props;
5458
const { curPage } = mainModel;
59+
const { curConnection } = connectionModel;
5560
const [activeNav, setActiveNav] = useState<INavItem>(navConfig[initPageIndex > 0 ? initPageIndex : 0]);
5661

5762
useEffect(() => {
63+
// activeNav 发生变化，同步到全局状态管理
5864
dispatch({
5965
type: 'mainPage/updateCurPage',
6066
payload: activeNav.key
6167
})
68+
// activeNav 发生变化 如果没有选中连接并且不在connections 那么需要跳转到 连接页面
69+
// if (!curConnection?.id && activeNav.key !== 'connections') {
70+
// setActiveNav(navConfig[2]);
71+
// }
72+
// activeNav 变化 同步地址栏变化
73+
// change url，but no page refresh
74+
window.history.pushState({}, "", activeNav.key);
6275
}, [activeNav])
6376

6477
useEffect(() => {
65-
if (curPage !== activeNav.key) {
66-
const activeNav = navConfig[findObjListValue(navConfig, 'key', curPage)]
67-
setActiveNav(activeNav)
78+
// 全局状态curPage发生变化，activeNav 需要同步变化
79+
if (curPage && curPage !== activeNav.key) {
80+
const newActiveNav = navConfig[findObjListValue(navConfig, 'key', curPage)]
81+
setActiveNav(newActiveNav)
6882
}
6983
}, [curPage])
7084

85+
useEffect(() => {
86+
if (curConnection?.id) {
87+
dispatch({
88+
type: 'workspace/fetchdatabaseAndSchema',
89+
})
90+
}
91+
}, [curConnection])
92+
7193
function switchingNav(item: INavItem) {
72-
// change url，but no page refresh
73-
window.history.pushState({}, "", item.key);
7494
if (item.openBrowser) {
7595
window.open(item.openBrowser);
7696
} else {
7797
setActiveNav(item);
7898
}
7999
}
80100

81-
useEffect(() => {
82-
83-
}, [])
84101

85102
return (
86103
<div className={styles.page}>
@@ -123,6 +140,8 @@ function MainPage(props: IProps) {
123140
);
124141
}
125142

126-
export default connect(({ mainPage }: { mainPage: MainState }) => ({
143+
export default connect(({ mainPage, workspace, connection }: { mainPage: IMainPageType, workspace: IWorkspaceModelType, connection: IConnectionModelType }) => ({
127144
mainModel: mainPage,
145+
workspaceModel: workspace,
146+
connectionModel: connection,
128147
}))(MainPage);

‎chat2db-client/src/pages/main/workspace/components/Tree/index.less‎

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,16 +8,22 @@
88
display: flex;
99
align-items: center;
1010
overflow: hidden;
11-
height: 24px;
12-
border-radius: 2px;
11+
height: 26px;
12+
border-radius: 4px;
1313
opacity: 1;
1414
cursor: pointer;
1515
transition: opacity 0.05s ease-in, height 0.1s ease-in;
1616
user-select: none;
1717

18-
&:hover .right {
19-
background-color: var(--custom-primary);
20-
color: var(--color-primary);
18+
&:hover {
19+
background-color: var(--color-hover-bg);
20+
.right {
21+
background-color: var(--custom-primary);
22+
color: var(--color-primary);
23+
}
24+
.arrows {
25+
display: flex;
26+
}
2127
}
2228
}
2329

@@ -35,35 +41,38 @@
3541
height: 100%;
3642
padding: 0px 10px;
3743
border-radius: 2px;
38-
color: var(--color-text-secondary)
44+
color: var(--color-text-secondary);
3945
}
4046

4147
.arrows {
4248
flex-shrink: 0;
4349
width: 20px;
44-
height: 24px;
50+
height: 26px;
4551
display: flex;
4652
align-items: center;
4753
transform: rotate(0deg);
4854
transition: transform 0.2s ease-in;
55+
display: none;
4956
}
5057

5158
.arrowsIcon {
5259
display: inline-block;
60+
transform: rotate(-90deg);
61+
font-size: 12px;
5362
}
5463

5564
.rotateArrowsIcon {
56-
transform: rotate(90deg);
65+
transform: rotate(0deg);
5766
}
5867

5968
.dblclickArea {
6069
display: flex;
6170
flex: 1;
62-
height: 24px;
71+
height: 26px;
6372
}
6473

6574
.typeIcon {
66-
height: 24px;
75+
height: 26px;
6776
display: flex;
6877
align-items: center;
6978
width: 20px;

0 commit comments

Comments
 (0)