github/DB-GPT
1
0
Fork 0
mirror of https://github.com/csunny/DB-GPT.git synced 2025-09-11 22:09:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: database card style changed

Browse Source
This commit is contained in:
lhwan
2024-08-29 14:32:09 +08:00
parent 968a2f5b2e
commit 8a390aa930
2 changed files with 64 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/locales/zh/common.ts
View File

@@ -95,7 +95,7 @@ export const CommonZh: Resources["translation"] = {
Password: "密码", Password: "密码",
Remark: "备注", Remark: "备注",
Edit: "编辑", Edit: "编辑",
Database: "数据库", Database: "数据源",
Data_Source: "数据中心", Data_Source: "数据中心",
Close_Sidebar: "收起", Close_Sidebar: "收起",
Show_Sidebar: "展开", Show_Sidebar: "展开",

113
web/pages/construct/database.tsx
View File

@@ -3,12 +3,13 @@ import ConstructLayout from '@/new-components/layout/Construct';
import { ChatContext } from '@/app/chat-context'; import { ChatContext } from '@/app/chat-context';
import { apiInterceptors, getDbList, getDbSupportType, newDialogue, postDbDelete } from '@/client/api'; import { apiInterceptors, getDbList, getDbSupportType, newDialogue, postDbDelete } from '@/client/api';
import MuiLoading from '@/components/common/loading'; import MuiLoading from '@/components/common/loading';
import GPTCard from '@/components/common/gpt-card';
import FormDialog from '@/components/database/form-dialog'; import FormDialog from '@/components/database/form-dialog';
import { DBOption, DBType, DbListResponse, DbSupportTypeResponse, IChatDbSchema } from '@/types/db'; import { DBOption, DBType, DbListResponse, DbSupportTypeResponse, IChatDbSchema } from '@/types/db';
import { dbMapper } from '@/utils'; import { dbMapper } from '@/utils';
import { DeleteFilled, EditFilled, PlusOutlined } from '@ant-design/icons'; import { DeleteFilled, EditFilled, PlusOutlined } from '@ant-design/icons';
import { useAsyncEffect } from 'ahooks'; import { useAsyncEffect } from 'ahooks';
import { Button, Card, Drawer, Empty, Modal, Tag, message } from 'antd'; import { Button, Card, Drawer, Empty, Modal, Badge, message } from 'antd';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { useContext, useMemo, useState } from 'react'; import { useContext, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@@ -152,56 +153,68 @@ function Database() {
</div> </div>
</div> </div>
<div className="flex flex-wrap mx-[-8px]"> <div className="flex flex-wrap mx-[-8px] gap-2 md:gap-4">
{dbList.map((item) => { {dbTypeList.map((item) => {
let targetDBType = dbTypeList.find((i) => i?.value?.toLowerCase() === item.db_type);
return ( return (
<BlurredCard <Badge key={item.value} count={dbListByType[item.value]?.length} className="min-h-fit">
description={item.db_path ?? ''} <GPTCard
name={item.db_name} className="h-full"
key={item.db_name} title={item.label}
logo={targetDBType?.icon} desc={item.desc ?? ''}
RightTop={ disabled={item.disabled}
<InnerDropdown icon={item.icon}
menu={{ onClick={() => {
items: [ if (item.disabled) return;
{ handleDbTypeClick(item);
key: 'del', }}
label: ( />
<span </Badge>
className="text-red-400" // <BlurredCard
onClick={() => { // description={item.db_path ?? ''}
onDelete(item); // name={item.db_name}
}} // key={item.db_name}
> // logo={targetDBType?.icon}
{t('Delete_Btn')} // RightTop={
</span> // <InnerDropdown
), // menu={{
}, // items: [
], // {
}} // key: 'del',
/> // label: (
} // <span
rightTopHover={false} // className="text-red-400"
Tags={ // onClick={() => {
<div> // onDelete(item);
<Tag>{item.db_type}</Tag> // }}
</div> // >
} // {t('Delete_Btn')}
RightBottom={ // </span>
<ChatButton // ),
text={t('start_chat')} // },
onClick={() => { // ],
handleChat(item); // }}
}} // />
/> // }
} // rightTopHover={false}
onClick={() => { // Tags={
// if (targetDBType?.disabled) return; // <div>
// handleDbTypeClick(targetDBType); // <Tag>{item.db_type}</Tag>
onModify(item); // </div>
}} // }
/> // RightBottom={
// <ChatButton
// text={t('start_chat')}
// onClick={() => {
// handleChat(item);
// }}
// />
// }
// onClick={() => {
// // if (targetDBType?.disabled) return;
// // handleDbTypeClick(targetDBType);
// onModify(item);
// }}
// />
); );
})} })}
</div> </div>