Skip to content

Commit ee4f785

Browse files
committed
Use indexedDB to save automatically
1 parent 1d37d3b commit ee4f785

16 files changed

Lines changed: 304 additions & 283 deletions

File tree

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

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -70,10 +70,6 @@ const SQLExecute = memo<IProps>((props) => {
7070
setAppendValue({ text: data.initDDL });
7171
}, [data.initDDL]);
7272

73-
useEffect(() => {
74-
console.log(resultData);
75-
}, [resultData]);
76-
7773
/**
7874
* 执行SQL
7975
* @param sql

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

Lines changed: 34 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,14 @@ import Iconfont from '../Iconfont';
1313
import { IAiConfig, ITreeNode } from '@/typings';
1414
import { IAIState } from '@/models/ai';
1515
import Popularize from '@/components/Popularize';
16-
import { handleLocalStorageSavedConsole, readLocalStorageSavedConsoleText, formatSql } from '@/utils';
16+
import { formatSql, getCookie } from '@/utils';
1717
import { chatErrorForKey, chatErrorToLogin } from '@/constants/chat';
1818
import { AiSqlSourceType } from '@/typings/ai';
1919
import i18n from '@/i18n';
2020
import configService from '@/service/config';
2121
// import NewEditor from './NewMonacoEditor';
2222
import styles from './index.less';
23+
import indexedDB from '@/indexedDB';
2324

2425
enum IPromptType {
2526
NL_2_SQL = 'NL_2_SQL',
@@ -102,6 +103,7 @@ function Console(props: IProps) {
102103
const [modalProps, setModalProps] = useState({});
103104
const timerRef = useRef<any>();
104105
const aiFetchIntervalRef = useRef<any>();
106+
const initializeSuccessful = useRef(false);
105107

106108
/**
107109
* 当前选择的AI类型是Chat2DBAI
@@ -117,16 +119,35 @@ function Console(props: IProps) {
117119
}
118120
}, [appendValue]);
119121

122+
useEffect(() => {
123+
indexedDB
124+
.getDataByCursor('chat2db', 'workspaceConsoleDDL', {
125+
consoleId: executeParams.consoleId!,
126+
userId: getCookie('CHAT2DB.USER_ID'),
127+
})
128+
.then((res: any) => {
129+
const value = res?.[0]?.ddl || '';
130+
if (value) {
131+
editorRef?.current?.setValue(value, 'reset');
132+
initializeSuccessful.current = true;
133+
}
134+
});
135+
}, []);
136+
120137
useEffect(() => {
121138
if (source !== 'workspace') {
122139
return;
123140
}
124141
// 离开时保存
125142
if (!isActive) {
126143
// 离开时清除定时器
144+
indexedDB.updateData('chat2db', 'workspaceConsoleDDL', {
145+
consoleId: executeParams.consoleId!,
146+
ddl: editorRef?.current?.getAllContent(),
147+
userId: getCookie('CHAT2DB.USER_ID'),
148+
});
127149
if (timerRef.current) {
128150
clearInterval(timerRef.current);
129-
handleLocalStorageSavedConsole(executeParams.consoleId!, 'save', editorRef?.current?.getAllContent());
130151
}
131152
} else {
132153
// 活跃时自动保存
@@ -139,20 +160,18 @@ function Console(props: IProps) {
139160
};
140161
}, [isActive]);
141162

142-
useEffect(() => {
143-
if (source !== 'workspace') {
163+
function timingAutoSave() {
164+
// 如果没有初始化那就不自动保存
165+
if (!initializeSuccessful.current) {
144166
return;
145167
}
146-
const value = readLocalStorageSavedConsoleText(executeParams.consoleId!);
147-
if (value) {
148-
editorRef?.current?.setValue(value, 'reset');
149-
}
150-
}, []);
151-
152-
function timingAutoSave() {
153168
timerRef.current = setInterval(() => {
154-
handleLocalStorageSavedConsole(executeParams.consoleId!, 'save', editorRef?.current?.getAllContent());
155-
}, 500);
169+
indexedDB.updateData('chat2db', 'workspaceConsoleDDL', {
170+
consoleId: executeParams.consoleId!,
171+
ddl: editorRef?.current?.getAllContent(),
172+
userId: getCookie('CHAT2DB.USER_ID'),
173+
});
174+
}, 10000);
156175
}
157176

158177
const tableListName = useMemo(() => {
@@ -338,8 +357,8 @@ function Console(props: IProps) {
338357
ddl: value,
339358
};
340359

341-
historyServer.updateSavedConsole(p).then((res) => {
342-
handleLocalStorageSavedConsole(executeParams.consoleId!, 'delete');
360+
historyServer.updateSavedConsole(p).then(() => {
361+
indexedDB.deleteData('chat2db', 'workspaceConsoleDDL', executeParams.consoleId!);
343362
message.success(i18n('common.tips.saveSuccessfully'));
344363
props.onConsoleSave && props.onConsoleSave();
345364
});
Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
import { tableList } from './table';
2+
3+
// 创建数据库的方法
4+
export const createDB = (dbName: string, version: number) => {
5+
return new Promise((resolve, reject) => {
6+
const request = window.indexedDB.open(dbName, version);
7+
request.onerror = (event: any) => {
8+
reject(event.target.error);
9+
};
10+
request.onsuccess = (event: any) => {
11+
resolve(event.target.result);
12+
};
13+
request.onupgradeneeded = (event: any) => {
14+
const db = event.target.result; // 数据库对象
15+
// 创建存储库
16+
tableList.forEach((item: any) => {
17+
const { tableDetails } = item;
18+
const objectStore = db.createObjectStore(tableDetails.name, tableDetails.primaryKey);
19+
tableDetails.column.forEach((i: any) => {
20+
if (i.isIndex) {
21+
objectStore.createIndex(i.name, i.keyPath, i.options);
22+
}
23+
});
24+
});
25+
};
26+
});
27+
};
28+
29+
type TableType = 'workspaceConsoleDDL';
30+
31+
type DBType = 'chat2db';
32+
33+
// 添加数据
34+
export const addData = (db: DBType, tableName: TableType, data: any) => {
35+
return new Promise((resolve, reject) => {
36+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
37+
const objectStore = transaction.objectStore(tableName);
38+
const request = objectStore.add(data);
39+
request.onsuccess = () => {
40+
resolve(true);
41+
};
42+
request.onerror = (error) => {
43+
reject(error);
44+
};
45+
});
46+
};
47+
48+
// 通过索引删除数据
49+
export const deleteDataByIndex = (db: DBType, tableName: TableType, indexName, indexValue) => {
50+
return new Promise((resolve, reject) => {
51+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
52+
const objectStore = transaction.objectStore(tableName);
53+
const request = objectStore.index(indexName).delete(indexValue);
54+
request.onsuccess = () => {
55+
resolve(true);
56+
};
57+
request.onerror = () => {
58+
reject(false);
59+
};
60+
});
61+
};
62+
63+
// 通过主键删除数据
64+
export const deleteData = (db: DBType, tableName: TableType, key: any) => {
65+
return new Promise((resolve, reject) => {
66+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
67+
const objectStore = transaction.objectStore(tableName);
68+
const request = objectStore.delete(key);
69+
request.onsuccess = () => {
70+
resolve(true);
71+
};
72+
request.onerror = () => {
73+
reject(false);
74+
};
75+
});
76+
};
77+
78+
// 通过索引查询数据,支持传入多个索引
79+
export const getDataByIndex = (db: DBType, tableName: TableType, indexName: string, indexValue: any) => {
80+
return new Promise((resolve, reject) => {
81+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
82+
const objectStore = transaction.objectStore(tableName);
83+
const request = objectStore.index(indexName).get(indexValue);
84+
request.onsuccess = () => {
85+
resolve(request.result);
86+
};
87+
request.onerror = () => {
88+
reject(false);
89+
};
90+
});
91+
};
92+
93+
// 通过游标查询数据,支持传入多个条件
94+
export const getDataByCursor = (db: DBType, tableName: TableType, condition: {[key in string]: any}
95+
) => {
96+
return new Promise((resolve, reject) => {
97+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
98+
const objectStore = transaction.objectStore(tableName);
99+
const request = objectStore.openCursor();
100+
const result: any[] = [];
101+
request.onsuccess = (event: any) => {
102+
const cursor = event.target.result;
103+
if (cursor) {
104+
let flag = true;
105+
Object.keys(condition).forEach((key) => {
106+
if (cursor.value[key] !== condition[key]) {
107+
flag = false;
108+
}
109+
});
110+
if (flag) {
111+
result.push(cursor.value);
112+
}
113+
cursor.continue();
114+
} else {
115+
resolve(result);
116+
}
117+
};
118+
request.onerror = () => {
119+
reject(false);
120+
};
121+
});
122+
123+
};
124+
125+
126+
// 修改数据
127+
export const updateData = (db: DBType, tableName: TableType, data: any) => {
128+
return new Promise((resolve, reject) => {
129+
const transaction = window._indexedDB[db].transaction(tableName, 'readwrite');
130+
const objectStore = transaction.objectStore(tableName);
131+
const request = objectStore.put(data);
132+
request.onsuccess = () => {
133+
resolve(true);
134+
};
135+
request.onerror = () => {
136+
reject(false);
137+
};
138+
});
139+
};
140+
141+
// 关闭数据库
142+
export const closeDB = (db: DBType) => {
143+
return new Promise((resolve) => {
144+
window._indexedDB[db].close();
145+
resolve(true);
146+
});
147+
};
148+
149+
export default {
150+
createDB,
151+
addData,
152+
deleteDataByIndex,
153+
deleteData,
154+
getDataByIndex,
155+
getDataByCursor,
156+
updateData,
157+
closeDB,
158+
};

chat2db-client/src/indexedDB/indexedDB.ts

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

0 commit comments

Comments
 (0)