Skip to content

Commit d0fdb41

Browse files
shanhexishanhexi
committed
fix: bug when streaming content to editor
1 parent f792ec9 commit d0fdb41

22 files changed

Lines changed: 183 additions & 155 deletions

File tree

‎chat2db-client/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@
2222
"start": "concurrently \"npm run start:web\" \"npm run start:main\"",
2323
"start:main": "cross-env NODE_ENV=development electron .",
2424
"start:main:prod": "cross-env NODE_ENV=production electron .",
25-
"start:web": "cross-env UMI_ENV=local cross-env APP_VERSION=${npm_config_app_version} umi dev"
25+
"start:web": "cross-env UMI_ENV=local HMR=none cross-env APP_VERSION=${npm_config_app_version} umi dev",
26+
"start:web:hot": "cross-env UMI_ENV=local cross-env APP_VERSION=${npm_config_app_version} umi dev"
2627
},
2728
"dependencies": {
2829
"@dnd-kit/modifiers": "^6.0.1",
@@ -47,7 +48,6 @@
4748
"umi": "^4.0.70",
4849
"umi-request": "^1.4.0",
4950
"uuid": "^9.0.0",
50-
"@dnd-kit/modifiers": "^6.0.1",
5151
"highlight.js": "^11.9.0"
5252
},
5353
"devDependencies": {

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

Lines changed: 49 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import styles from './index.less';
33
import classnames from 'classnames';
44
import { IConnectionDetails, IDatabase } from '@/typings';
55
import ConnectionEdit, { ICreateConnectionFunction } from '@/components/ConnectionEdit';
6-
import { DatabaseTypeCode, databaseMap, databaseTypeList } from '@/constants';
6+
import { databaseTypeList } from '@/constants';
77
import Iconfont from '@/components/Iconfont';
88

99
interface IProps {
@@ -12,24 +12,18 @@ interface IProps {
1212
connectionDetail?: IConnectionDetails; // 如果你想编辑，就直接传入完成的数据就好
1313
}
1414

15-
export default memo<IProps>(function CreateConnection(props) {
15+
export default memo<IProps>((props) => {
1616
const { className, onSubmit, connectionDetail } = props;
1717
const [curConnection, setCurConnection] = useState<Partial<IConnectionDetails>>({});
1818
const createConnectionRef = useRef<ICreateConnectionFunction>();
1919

20-
2120
useEffect(() => {
2221
if (connectionDetail) {
23-
setCurConnection(connectionDetail)
22+
setCurConnection(connectionDetail);
2423
} else {
25-
setCurConnection({})
24+
setCurConnection({});
2625
}
27-
}, [connectionDetail])
28-
29-
30-
function getData() {
31-
console.log(createConnectionRef.current?.getData())
32-
}
26+
}, [connectionDetail]);
3327

3428
function handleCreateConnections(database: IDatabase) {
3529
setCurConnection({
@@ -38,50 +32,52 @@ export default memo<IProps>(function CreateConnection(props) {
3832
}
3933

4034
function handleSubmit(data: IConnectionDetails) {
41-
onSubmit?.(data)
35+
onSubmit?.(data);
4236
}
4337

44-
return <div className={classnames(styles.box, className)}>
45-
{curConnection && Object.keys(curConnection).length ? (
46-
<div
47-
className={classnames(styles.createConnections, {
48-
[styles.showCreateConnections]: Object.keys(curConnection).length,
49-
})}
50-
>
51-
{
52-
<ConnectionEdit
53-
ref={createConnectionRef as any}
54-
closeCreateConnection={() => {
55-
setCurConnection({});
56-
}}
57-
connectionData={curConnection as any}
58-
submit={handleSubmit}
59-
/>
60-
}
61-
</div>
62-
) : (
63-
<div className={styles.dataBaseList}>
64-
{databaseTypeList.map((t) => {
65-
return (
66-
<div key={t.code} className={styles.databaseItem} onClick={handleCreateConnections.bind(null, t)}>
67-
<div className={styles.databaseItemMain}>
68-
<div className={styles.databaseItemLeft}>
69-
<div className={styles.logoBox}>
70-
<Iconfont code={t.icon} />
38+
return (
39+
<div className={classnames(styles.box, className)}>
40+
{curConnection && Object.keys(curConnection).length ? (
41+
<div
42+
className={classnames(styles.createConnections, {
43+
[styles.showCreateConnections]: Object.keys(curConnection).length,
44+
})}
45+
>
46+
{
47+
<ConnectionEdit
48+
ref={createConnectionRef as any}
49+
closeCreateConnection={() => {
50+
setCurConnection({});
51+
}}
52+
connectionData={curConnection as any}
53+
submit={handleSubmit}
54+
/>
55+
}
56+
</div>
57+
) : (
58+
<div className={styles.dataBaseList}>
59+
{databaseTypeList.map((t) => {
60+
return (
61+
<div key={t.code} className={styles.databaseItem} onClick={handleCreateConnections.bind(null, t)}>
62+
<div className={styles.databaseItemMain}>
63+
<div className={styles.databaseItemLeft}>
64+
<div className={styles.logoBox}>
65+
<Iconfont code={t.icon} />
66+
</div>
67+
{t.name}
68+
</div>
69+
<div className={styles.databaseItemRight}>
70+
<Iconfont code="&#xe631;" />
7171
</div>
72-
{t.name}
73-
</div>
74-
<div className={styles.databaseItemRight}>
75-
<Iconfont code="&#xe631;" />
7672
</div>
7773
</div>
78-
</div>
79-
);
80-
})}
81-
{Array.from({ length: 20 }).map((t, index) => {
82-
return <div key={index} className={styles.databaseItemSpacer}></div>;
83-
})}
84-
</div>
85-
)}
86-
</div>
87-
})
74+
);
75+
})}
76+
{Array.from({ length: 20 }).map((t, index) => {
77+
return <div key={index} className={styles.databaseItemSpacer} />;
78+
})}
79+
</div>
80+
)}
81+
</div>
82+
);
83+
});

‎chat2db-client/src/blocks/DatabaseTableEditor/ColumnList/index.tsx‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -107,17 +107,12 @@ const ColumnList = forwardRef((props: IProps, ref: ForwardedRef<IColumnListRef>)
107107
form.setFieldsValue({ ...record });
108108
setEditingData(record);
109109
// 根据当前字段类型，设置编辑配置
110-
console.log(databaseSupportField.columnTypes, record.columnType);
111110
databaseSupportField.columnTypes.forEach((i) => {
112111
if (i.typeName === record.columnType) {
113112
setEditingConfig({
114113
...i,
115114
editKey: record.key!,
116115
});
117-
console.log({
118-
...i,
119-
editKey: record.key!,
120-
});
121116
}
122117
});
123118
}
@@ -161,6 +156,7 @@ const ColumnList = forwardRef((props: IProps, ref: ForwardedRef<IColumnListRef>)
161156
title: i18n('editTable.label.columnName'),
162157
dataIndex: 'name',
163158
width: '160px',
159+
fixed: 'left',
164160
render: (text: string, record: IColumnItemNew) => {
165161
const editable = isEditing(record);
166162
return (
@@ -319,7 +315,6 @@ const ColumnList = forwardRef((props: IProps, ref: ForwardedRef<IColumnListRef>)
319315
}
320316
return item;
321317
});
322-
console.log(newData);
323318
setDataSource(newData);
324319
};
325320

‎chat2db-client/src/blocks/DatabaseTableEditor/IncludeCol/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,6 @@ const IncludeCol = forwardRef((props: IProps, ref: ForwardedRef<IIncludeColRef>)
8787
const addData = () => {
8888
const newData = createInitialData();
8989
setDataSource([...dataSource, newData]);
90-
console.log([...dataSource, newData]);
9190
edit(newData);
9291
setTimeout(() => {
9392
tableRef.current?.scrollTo(0, tableRef.current?.scrollHeight + 100);

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import SearchResult from '@/components/SearchResult';
88
import { DatabaseTypeCode, ConsoleStatus, TreeNodeType } from '@/constants';
99
import { IManageResultData, IResultConfig } from '@/typings';
1010
import { IWorkspaceModelState, IWorkspaceModelType } from '@/models/workspace';
11-
import historyServer, { ISaveBasicInfo } from '@/service/history';
1211
import { IAIState } from '@/models/ai';
1312
import sqlServer, { IExecuteSqlParams } from '@/service/sql';
1413
import { v4 as uuidV4 } from 'uuid';

‎chat2db-client/src/components/Console/MonacoEditor/index.tsx‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -297,6 +297,15 @@ export const appendMonacoValue = (editor: any, text: any, range: IRangeType = 'e
297297
newRange = new monaco.Range(lastLine, lastLineLength, lastLine, lastLineLength);
298298
newText = `${text}`;
299299
break;
300+
// 在光标处添加内容
301+
case 'cursor':
302+
{
303+
const position = editor.getPosition();
304+
if (position) {
305+
newRange = new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column);
306+
}
307+
}
308+
break;
300309
default:
301310
break;
302311
}
@@ -309,10 +318,14 @@ export const appendMonacoValue = (editor: any, text: any, range: IRangeType = 'e
309318
// decorations?: IModelDeltaDecoration[]: 一个数组类型的参数，用于指定插入的文本的装饰。可以用来设置文本的样式、颜色、背景色等。如果不需要设置装饰，可以忽略此参数。
310319
const decorations = [{}]; // 解决新增的文本默认背景色为灰色
311320
editor.executeEdits('setValue', [op], decorations);
321+
const addedLastLine = editor.getModel().getLineCount();
322+
const addedLastLineLength = editor.getModel().getLineMaxColumn(lastLine);
323+
312324
if (range === 'end') {
313325
setTimeout(() => {
314-
editor.revealLine(lastLine + 1);
315-
editor.setPosition({ lineNumber: lastLine, column: 1 });
326+
editor.revealLine(addedLastLine + 1);
327+
editor.setPosition({ lineNumber: addedLastLine, column: addedLastLineLength });
328+
editor.focus();
316329
}, 0);
317330
}
318331
};

‎chat2db-client/src/components/Console/NewMonacoEditor/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,6 @@ function SQLEditor({ id, dataSource, database }) {
6363

6464
useEffect(() => {
6565
//
66-
console.log('dataSource', dataSource);
6766
providerKeyword.dispose();
6867
providerKeyword = monaco.languages.registerCompletionItemProvider('sql', {
6968
provideCompletionItems: (model, position) => {

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

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useEffect, useMemo, useRef, useState } from 'react';
1+
import React, { useEffect, useMemo, useRef, useState, useImperativeHandle, ForwardedRef, forwardRef } from 'react';
22
import { connect } from 'umi';
33
import { formatParams } from '@/utils/common';
44
import connectToEventSource from '@/utils/eventSource';
@@ -21,7 +21,7 @@ import configService from '@/service/config';
2121
// import NewEditor from './NewMonacoEditor';
2222
import styles from './index.less';
2323
import indexedDB from '@/indexedDB';
24-
import { isEmpty, set } from 'lodash';
24+
import { isEmpty } from 'lodash';
2525

2626
enum IPromptType {
2727
NL_2_SQL = 'NL_2_SQL',
@@ -79,7 +79,11 @@ interface IProps {
7979
tables: any[];
8080
}
8181

82-
function Console(props: IProps) {
82+
export interface IConsoleRef {
83+
editorRef: IExportRefFunction | undefined;
84+
}
85+
86+
function Console(props: IProps, ref: ForwardedRef<IConsoleRef>) {
8387
const {
8488
hasAiChat = true,
8589
executeParams,
@@ -126,6 +130,10 @@ function Console(props: IProps) {
126130
}
127131
}, [appendValue]);
128132

133+
useImperativeHandle(ref, () => ({
134+
editorRef: editorRef?.current,
135+
}));
136+
129137
useEffect(() => {
130138
indexedDB
131139
.getDataByCursor('chat2db', 'workspaceConsoleDDL', {
@@ -265,7 +273,6 @@ function Console(props: IProps) {
265273
});
266274

267275
const handleMessage = (message: string) => {
268-
// console.log('message', message);
269276
setIsLoading(false);
270277
setIsAiDrawerLoading(false);
271278
try {
@@ -282,7 +289,7 @@ function Console(props: IProps) {
282289
});
283290
}
284291
if (isNL2SQL) {
285-
editorRef?.current?.setValue('\n\n\n');
292+
editorRef?.current?.setValue('\n\n');
286293
} else {
287294
setIsAiDrawerLoading(false);
288295
chatResult.current += '\n\n\n';
@@ -452,7 +459,7 @@ function Console(props: IProps) {
452459
};
453460

454461
return (
455-
<div className={styles.console}>
462+
<div className={styles.console} ref={ref as any}>
456463
<Spin spinning={isLoading} style={{ height: '100%' }}>
457464
{hasAiChat && (
458465
<ChatInput
@@ -482,7 +489,7 @@ function Console(props: IProps) {
482489
localStorage.setItem('syncTableModel', String(model));
483490
}}
484491
onCancelStream={() => {
485-
closeEventSource.current()
492+
closeEventSource.current();
486493
setIsStream(false);
487494
setIsLoading(false);
488495
}}
@@ -550,4 +557,4 @@ const dvaModel = connect(({ ai, loading }: { ai: IAIState; loading: any }) => ({
550557
aiModel: ai,
551558
remainingBtnLoading: loading.effects['ai/fetchRemainingUse'],
552559
}));
553-
export default dvaModel(Console);
560+
export default dvaModel(forwardRef(Console));

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,6 @@ const ImportConnection: React.FC<IImportConnectionProps> = ({ open, onClose, onC
4242
formData.append('file', selectedFile);
4343

4444
const fileExtension = selectedFile.name.split('.').pop() || '';
45-
console.log('fileExtension', fileExtension);
4645

4746
const { uploadUrl } = uploadFileType[fileExtension] || {};
4847

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -169,20 +169,20 @@ const WorkspaceModel: IWorkspaceModelType = {
169169
}
170170
},
171171
// 获取当前连接下的表列表
172-
*fetchGetCurTableList({ payload, callback }, { put, call }) {
172+
*fetchGetCurTableList({ payload, callback }, { put }) {
173173
try {
174174
const res = (yield treeConfig[TreeNodeType.TABLES].getChildren!({
175175
pageNo: 1,
176176
pageSize: 999,
177177
...payload,
178-
})) as ITreeNode[];
178+
})) as any;
179179
// 异步操作完成后调用回调函数
180180
if (callback && typeof callback === 'function') {
181-
callback(res);
181+
callback(res.data);
182182
}
183183
yield put({
184184
type: 'setCurTableList',
185-
payload: res,
185+
payload: res.data,
186186
});
187187
}
188188
catch {

0 commit comments

Comments
 (0)