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

feat(web): Unified frontend code style (#1923)

Browse Source 
Co-authored-by: Fangyin Cheng <staneyffer@gmail.com>
Co-authored-by: 谨欣 <echo.cmy@antgroup.com>
Co-authored-by: 严志勇 <yanzhiyong@tiansuixiansheng.com>
Co-authored-by: yanzhiyong <932374019@qq.com>
This commit is contained in:
Dreammy23
2024-08-30 14:03:06 +08:00
committed by GitHub
parent f866580703
commit 471689ba20
247 changed files with 4960 additions and 4546 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
web/pages/mobile/chat/components/Resource.tsx
View File

@@ -3,35 +3,36 @@ import { dbMapper } from '@/utils';
import { FolderAddOutlined, LoadingOutlined, SwapOutlined } from '@ant-design/icons';
import { useRequest } from 'ahooks';
import type { MenuProps } from 'antd';
import { Dropdown, Space, Spin, Upload } from 'antd';
import { Dropdown, Spin, Upload } from 'antd';
import React, { useContext, useMemo, useState } from 'react';
import { MobileChatContext } from '../';
import OptionIcon from './OptionIcon';
const Resource: React.FC = () => {
const { appInfo, resourceList, scene, model, conv_uid, getChatHistoryRun, setResource, resource } = useContext(MobileChatContext);
const { appInfo, resourceList, scene, model, conv_uid, getChatHistoryRun, setResource, resource } =
useContext(MobileChatContext);
const [selectedVal, setSelectedVal] = useState<any>(null);
// 资源类型
const resourceVal = useMemo(() => {
return appInfo?.param_need?.filter((item) => item.type === 'resource')?.[0]?.value;
return appInfo?.param_need?.filter(item => item.type === 'resource')?.[0]?.value;
}, [appInfo]);
const items: MenuProps['items'] = useMemo(() => {
if (resourceList && resourceList.length > 0) {
return resourceList.map((item) => {
return resourceList.map(item => {
return {
label: (
<div
className="flex items-center gap-2"
className='flex items-center gap-2'
onClick={() => {
setSelectedVal(item);
setResource(item.space_id || item.param);
}}
>
<OptionIcon width={14} height={14} src={dbMapper[item.type].icon} label={dbMapper[item.type].label} />
<span className="text-xs">{item.param}</span>
<span className='text-xs'>{item.param}</span>
</div>
),
key: item.space_id || item.param,
@@ -43,7 +44,7 @@ const Resource: React.FC = () => {
// 上传文件
const { run: uploadFile, loading } = useRequest(
async (formData) => {
async formData => {
const [, res] = await apiInterceptors(
postChatModeParamsFileLoad({
convUid: conv_uid,
@@ -77,24 +78,24 @@ const Resource: React.FC = () => {
const uploadContent = useMemo(() => {
if (loading) {
return (
<div className="flex items-center gap-1">
<Spin size="small" indicator={<LoadingOutlined spin />} />
<span className="text-xs">上传中</span>
<div className='flex items-center gap-1'>
<Spin size='small' indicator={<LoadingOutlined spin />} />
<span className='text-xs'>上传中</span>
</div>
);
}
if (resource) {
return (
<div className="flex gap-1">
<span className="text-xs">{resource.file_name}</span>
<div className='flex gap-1'>
<span className='text-xs'>{resource.file_name}</span>
<SwapOutlined rotate={90} />
</div>
);
}
return (
<div className="flex items-center gap-1">
<FolderAddOutlined className="text-base" />
<span className="text-xs">上传文件</span>
<div className='flex items-center gap-1'>
<FolderAddOutlined className='text-base' />
<span className='text-xs'>上传文件</span>
</div>
);
}, [loading, resource]);
@@ -105,15 +106,15 @@ const Resource: React.FC = () => {
case 'text_file':
case 'image_file':
return (
<div className="flex items-center justify-center gap-1 border rounded-xl bg-white dark:bg-black px-2 flex-shrink-0">
<div className='flex items-center justify-center gap-1 border rounded-xl bg-white dark:bg-black px-2 flex-shrink-0'>
<Upload
name="file"
accept=".xlsx,.xls"
name='file'
accept='.xlsx,.xls'
maxCount={1}
showUploadList={false}
beforeUpload={() => false}
onChange={handleFileChange}
className="flex h-full w-full items-center justify-center"
className='flex h-full w-full items-center justify-center'
>
{uploadContent}
</Upload>
@@ -123,7 +124,7 @@ const Resource: React.FC = () => {
case 'knowledge':
case 'plugin':
case 'awel_flow':
if (!!!resourceList?.length) {
if (!resourceList?.length) {
return null;
}
return (
@@ -131,17 +132,17 @@ const Resource: React.FC = () => {
menu={{
items,
}}
placement="top"
placement='top'
trigger={['click']}
>
<div className="flex items-center gap-1 border rounded-xl bg-white dark:bg-black p-2 flex-shrink-0">
<div className='flex items-center gap-1 border rounded-xl bg-white dark:bg-black p-2 flex-shrink-0'>
<OptionIcon
width={14}
height={14}
src={dbMapper[selectedVal?.type || resourceList?.[0]?.type]?.icon}
label={dbMapper[selectedVal?.type || resourceList?.[0]?.type]?.label}
/>
<span className="text-xs font-medium">{selectedVal?.param || resourceList?.[0]?.param}</span>
<span className='text-xs font-medium'>{selectedVal?.param || resourceList?.[0]?.param}</span>
<SwapOutlined rotate={90} />
</div>
</Dropdown>