pengjunjie/ragflow
1
0
Fork 1
mirror of https://github.com/infiniflow/ragflow.git synced 2025-12-26 00:46:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix: Modify the personal center style #10703 (#11347)

Browse Source 
### What problem does this PR solve?

Fix: Modify the personal center style

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
This commit is contained in:
chanx
2025-11-18 20:07:17 +08:00
committed by GitHub
parent 8cd4882596
commit 50bc53a1f5
19 changed files with 79 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/pages/user-setting/data-source/add-datasource-modal.tsx
View File

@ -40,17 +40,17 @@ const AddDataSourceModal = ({
return (
<Modal
title={
<div className="flex flex-col">
{sourceData?.icon}
<div className="flex flex-col gap-4">
<div className="size-6">{sourceData?.icon}</div>
{t('setting.addDataSourceModalTital', { name: sourceData?.name })}
</div>
}
open={visible || false}
onOpenChange={(open) => !open && hideModal?.()}
// onOk={() => handleOk()}
okText={t('common.ok')}
okText={t('common.confirm')}
cancelText={t('common.cancel')}
showfooter={false}
footer={<div className="p-4"></div>}
>
<DynamicForm.Root
fields={fields}
@ -63,7 +63,7 @@ const AddDataSourceModal = ({
] as FieldValues
}
>
<div className="flex items-center justify-end w-full gap-2 py-4">
<div className=" absolute bottom-0 right-0 left-0 flex items-center justify-end w-full gap-2 py-6 px-6">
<DynamicForm.CancelButton
handleCancel={() => {
hideModal?.();
@ -71,7 +71,7 @@ const AddDataSourceModal = ({
/>
<DynamicForm.SavingButton
submitLoading={loading || false}
buttonText={t('common.ok')}
buttonText={t('common.confirm')}
submitFunc={(values: FieldValues) => {
handleOk(values);
}}

21
web/src/pages/user-setting/data-source/component/added-source-card.tsx
View File

@ -1,3 +1,4 @@
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
import { Settings, Trash2 } from 'lucide-react';
@ -32,17 +33,19 @@ export const AddedSourceCard = (props: IAddedSourceCardProps) => {
>
<div className="text-sm text-text-secondary ">{item.name}</div>
<div className="text-sm text-text-secondary flex gap-2">
<Settings
className="cursor-pointer"
size={14}
<Button
variant={'ghost'}
className="rounded-lg px-2 py-1 bg-transparent hover:bg-bg-card"
onClick={() => {
toDetail(item.id);
}}
/>
>
<Settings size={14} />
</Button>
{/* <ConfirmDeleteDialog onOk={() => handleDelete(item)}> */}
<Trash2
className="cursor-pointer"
size={14}
<Button
variant={'ghost'}
className="rounded-lg px-2 py-1 bg-transparent hover:bg-state-error-5 hover:text-state-error"
onClick={() =>
delSourceModal({
data: item,
@ -51,7 +54,9 @@ export const AddedSourceCard = (props: IAddedSourceCardProps) => {
},
})
}
/>
>
<Trash2 className="cursor-pointer" size={14} />
</Button>
{/* </ConfirmDeleteDialog> */}
</div>
</div>

1
web/src/pages/user-setting/mcp/index.tsx
View File

@ -71,6 +71,7 @@ export default function McpServer() {
className="w-40"
value={searchString}
onChange={handleInputChange}
placeholder={t('common.search')}
></SearchInput>
<Button variant={'secondary'} onClick={switchSelectionMode}>
{isSelectionMode ? (

37
web/src/pages/user-setting/mcp/mcp-operation.tsx
View File

@ -1,5 +1,4 @@
import { ConfirmDeleteDialog } from '@/components/confirm-delete-dialog';
import { RAGFlowTooltip } from '@/components/ui/tooltip';
import { useDeleteMcpServer } from '@/hooks/use-mcp-request';
import { PenLine, Trash2, Upload } from 'lucide-react';
import { MouseEventHandler, useCallback } from 'react';
@ -20,24 +19,24 @@ export function McpOperation({
}, [deleteMcpServer, mcpId]);
return (
<div className="hidden gap-3 group-hover:flex text-text-secondary">
<RAGFlowTooltip tooltip={t('mcp.export')}>
<Upload
className="size-3 cursor-pointer"
onClick={handleExportMcpJson([mcpId])}
/>
</RAGFlowTooltip>
<RAGFlowTooltip tooltip={t('common.edit')}>
<PenLine
className="size-3 cursor-pointer"
onClick={showEditModal(mcpId)}
/>
</RAGFlowTooltip>
<RAGFlowTooltip tooltip={t('common.delete')}>
<ConfirmDeleteDialog onOk={handleDelete}>
<Trash2 className="size-3 cursor-pointer" />
</ConfirmDeleteDialog>
</RAGFlowTooltip>
<div className="hidden gap-1 group-hover:flex text-text-secondary">
{/* <RAGFlowTooltip tooltip={t('mcp.export')}> */}
<Upload
className="size-5 cursor-pointer p-1 rounded-sm hover:text-text-primary hover:bg-bg-card"
onClick={handleExportMcpJson([mcpId])}
/>
{/* </RAGFlowTooltip>
<RAGFlowTooltip tooltip={t('common.edit')}> */}
<PenLine
className="size-5 cursor-pointer p-1 rounded-sm hover:text-text-primary hover:bg-bg-card"
onClick={showEditModal(mcpId)}
/>
{/* </RAGFlowTooltip>
<RAGFlowTooltip tooltip={t('common.delete')}> */}
<ConfirmDeleteDialog onOk={handleDelete}>
<Trash2 className="size-5 cursor-pointer p-1 rounded-sm hover:text-state-error hover:bg-state-error-5" />
</ConfirmDeleteDialog>
{/* </RAGFlowTooltip> */}
</div>
);
}

20
web/src/pages/user-setting/profile/index.tsx
View File

@ -143,12 +143,12 @@ const ProfilePage: FC = () => {
{profile.userName}
</div>
<Button
variant={'secondary'}
variant={'ghost'}
type="button"
onClick={() => handleEditClick(EditType.editName)}
className="text-sm text-text-secondary flex gap-1 px-1"
className="text-sm text-text-secondary flex gap-1 px-1 border border-border-button"
>
<PenLine size={12} /> Edit
<PenLine size={12} /> {t('edit')}
</Button>
</div>
</div>
@ -175,12 +175,12 @@ const ProfilePage: FC = () => {
{profile.timeZone}
</div>
<Button
variant={'secondary'}
variant={'ghost'}
type="button"
onClick={() => handleEditClick(EditType.editTimeZone)}
className="text-sm text-text-secondary flex gap-1 px-1"
className="text-sm text-text-secondary flex gap-1 px-1 border border-border-button"
>
<PenLine size={12} /> Edit
<PenLine size={12} /> {t('edit')}
</Button>
</div>
</div>
@ -208,12 +208,12 @@ const ProfilePage: FC = () => {
{profile.currPasswd ? '********' : ''}
</div>
<Button
variant={'secondary'}
variant={'ghost'}
type="button"
onClick={() => handleEditClick(EditType.editPassword)}
className="text-sm text-text-secondary flex gap-1 px-1"
className="text-sm text-text-secondary flex gap-1 px-1 border border-border-button"
>
<PenLine size={12} /> Edit
<PenLine size={12} /> {t('edit')}
</Button>
</div>
</div>
@ -304,7 +304,7 @@ const ProfilePage: FC = () => {
<div className="flex flex-col w-full gap-2">
<FormLabel
required
className="text-sm flex justify-between text-text-secondary whitespace-nowrap"
className="text-sm flex text-text-secondary whitespace-nowrap"
>
{t('currentPassword')}
</FormLabel>

14
web/src/pages/user-setting/setting-model/components/modal-card.tsx
View File

@ -67,21 +67,22 @@ export const ModelProviderCard: FC<IModelCardProps> = ({
return (
<div className={`w-full rounded-lg border border-border-button`}>
{/* Header */}
<div className="flex h-16 items-center justify-between p-4 cursor-pointer transition-colors">
<div className="flex h-16 items-center justify-between p-4 cursor-pointer transition-colors text-text-secondary">
<div className="flex items-center space-x-3">
<LlmIcon name={item.name} />
<div>
<h3 className="font-medium">{item.name}</h3>
<div className="font-medium text-xl">{item.name}</div>
</div>
</div>
<div className="flex items-center space-x-2">
<Button
variant={'ghost'}
onClick={(e) => {
e.stopPropagation();
handleApiKeyClick();
}}
className="px-3 py-1 text-sm bg-bg-input hover:bg-bg-input text-text-primary rounded-md transition-colors flex items-center space-x-1"
className="px-3 py-1 text-sm rounded-md transition-colors flex items-center space-x-1 border border-border-default"
>
<SettingOutlined />
<span>
@ -90,23 +91,24 @@ export const ModelProviderCard: FC<IModelCardProps> = ({
</Button>
<Button
variant={'ghost'}
onClick={(e) => {
e.stopPropagation();
handleShowMoreClick();
}}
className="px-3 py-1 text-sm bg-bg-input hover:bg-bg-input text-text-primary rounded-md transition-colors flex items-center space-x-1"
className="px-3 py-1 text-sm rounded-md transition-colors flex items-center space-x-1 border border-border-default"
>
<span>{visible ? t('hideModels') : t('showMoreModels')}</span>
{!visible ? <ChevronsDown /> : <ChevronsUp />}
</Button>
<Button
variant={'secondary'}
variant={'ghost'}
onClick={(e) => {
e.stopPropagation();
handleDeleteFactory();
}}
className="p-1 text-text-primary hover:text-state-error transition-colors"
className=" hover:text-state-error hover:bg-state-error-5 transition-colors border border-border-default"
>
<Trash2 />
</Button>

3
web/src/pages/user-setting/setting-model/components/system-setting.tsx
View File

@ -27,7 +27,6 @@ interface IProps {
const SystemSetting = ({ onOk, loading }: IProps) => {
const { systemSetting: initialValues, allOptions } =
useFetchSystemModelSettingOnMount();
const { t: tcommon } = useTranslate('common');
const { t } = useTranslate('setting');
const [formData, setFormData] = useState({
@ -149,7 +148,7 @@ const SystemSetting = ({ onOk, loading }: IProps) => {
<TooltipTrigger>
<CircleQuestionMark
size={12}
className="ml-1 text-text-disabled text-xs"
className="ml-1 text-text-secondary text-xs"
/>
</TooltipTrigger>
</Tooltip>

5
web/src/pages/user-setting/setting-model/components/un-add-model.tsx
View File

@ -1,6 +1,7 @@
// src/components/AvailableModels.tsx
import { LlmIcon } from '@/components/svg-icon';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { useTranslate } from '@/hooks/common-hooks';
import { useSelectLlmList } from '@/hooks/llm-hooks';
import { Plus, Search } from 'lucide-react';
@ -77,12 +78,12 @@ export const AvailableModels: FC<{
{/* Search Bar */}
<div className="mb-6">
<div className="relative">
<input
<Input
type="text"
placeholder={t('search')}
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="w-full px-4 py-3 pl-10 bg-bg-input border border-border-default rounded-lg focus:outline-none focus:ring-1 focus:ring-border-button transition-colors"
className="w-full px-4 py-2 pl-10 bg-bg-input border border-border-default rounded-lg focus:outline-none focus:ring-1 focus:ring-border-button transition-colors"
/>
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-text-secondary" />
</div>

2
web/src/pages/user-setting/setting-team/tenant-table.tsx
View File

@ -72,7 +72,7 @@ const TenantTable = ({ searchTerm }: { searchTerm: string }) => {
<div className="rounded-lg bg-bg-input scrollbar-auto overflow-hidden border border-border-default">
<Table rootClassName="rounded-lg">
<TableHeader className="bg-bg-title">
<TableRow>
<TableRow className="hover:bg-bg-title">
<TableHead className="h-12 px-4">{t('common.name')}</TableHead>
<TableHead
className="h-12 px-4 cursor-pointer"

2
web/src/pages/user-setting/setting-team/user-table.tsx
View File

@ -78,7 +78,7 @@ const UserTable = ({ searchUser }: { searchUser: string }) => {
<div className="rounded-lg bg-bg-input scrollbar-auto overflow-hidden border border-border-default">
<Table rootClassName="rounded-lg">
<TableHeader className="bg-bg-title">
<TableRow>
<TableRow className="hover:bg-bg-title">
<TableHead className="h-12 px-4">{t('common.name')}</TableHead>
<TableHead
className="h-12 px-4 cursor-pointer"