adai/MemoryBear
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): ui upgrade

Browse Source
This commit is contained in:
zhaoying
2026-03-24 17:04:38 +08:00
parent c7275dccac
commit fb6ce839d2
8 changed files with 40 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
web/src/components/PageTabs/index.module.css
View File

@@ -1,5 +1,4 @@
.page-tabs:global(.ant-segmented) { .page-tabs:global(.ant-segmented) {
background-color: #F6F6F6;
padding: 4px; padding: 4px;
} }
.page-tabs:global(.ant-segmented .ant-segmented-item-label) { .page-tabs:global(.ant-segmented .ant-segmented-item-label) {

3
web/src/styles/antdThemeConfig.ts
View File

@@ -146,6 +146,9 @@ export const lightTheme: ThemeConfig = {
}, },
Progress: { Progress: {
remainingColor: '#EBEBEB', remainingColor: '#EBEBEB',
},
Segmented: {
trackBg: '#E1E2E7',
} }
} }
}; };

5
web/src/views/ApplicationConfig/ReleasePage.tsx
View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 16:29:41 * @Date: 2026-02-03 16:29:41
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-19 21:10:38 * @Last Modified time: 2026-03-24 16:43:10
*/ */
import { type FC, useState, useEffect, useRef } from 'react'; import { type FC, useState, useEffect, useRef } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@@ -163,20 +163,19 @@ const ReleasePage: FC<{data: Application; refresh: () => void}> = ({data, refres
title={t('application.changeLog')} title={t('application.changeLog')}
headerType="borderless" headerType="borderless"
> >
<Flex gap={16} vertical>
{selectedVersion && ( {selectedVersion && (
<RbCard <RbCard
headerType="borderless" headerType="borderless"
title={<div className="rb:text-[14px]">{formatDateTime(selectedVersion.published_at, 'YYYY-MM-DD HH:mm:ss')}</div>} title={<div className="rb:text-[14px]">{formatDateTime(selectedVersion.published_at, 'YYYY-MM-DD HH:mm:ss')}</div>}
extra={<span className="rb:text-[12px] rb:text-[#5B6167] rb:leading-4">{selectedVersion.publisher_name}</span>} extra={<span className="rb:text-[12px] rb:text-[#5B6167] rb:leading-4">{selectedVersion.publisher_name}</span>}
bodyClassName="rb:pt-0! rb:pb-3! rb:px-4!" bodyClassName="rb:pt-0! rb:pb-3! rb:px-4!"
variant="outlined"
> >
<div className="rb:font-regular rb:text-[#5B6167] rb:leading-4"> <div className="rb:font-regular rb:text-[#5B6167] rb:leading-4">
<Markdown content={selectedVersion.release_notes} /> <Markdown content={selectedVersion.release_notes} />
</div> </div>
</RbCard> </RbCard>
)} )}
</Flex>
</RbCard> </RbCard>
</Flex> </Flex>
} }

28
web/src/views/ApplicationConfig/components/Skill/SkillListModal.tsx
View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-05 10:45:08 * @Date: 2026-02-05 10:45:08
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-04 10:41:35 * @Last Modified time: 2026-03-24 16:59:57
*/ */
import { forwardRef, useEffect, useImperativeHandle, useState } from 'react'; import { forwardRef, useEffect, useImperativeHandle, useState } from 'react';
import { List, Flex, Tooltip, Form } from 'antd'; import { List, Flex, Tooltip, Form } from 'antd';
@@ -185,19 +185,19 @@ const SkillListModal = forwardRef<SkillModalRef, SkillModalProps>(({
"rb:bg-[rgba(21,94,239,0.06)] rb:border-[#155EEF] rb:text-[#155EEF]": selectedIds.includes(item.id), "rb:bg-[rgba(21,94,239,0.06)] rb:border-[#155EEF] rb:text-[#155EEF]": selectedIds.includes(item.id),
"rb:border-[#DFE4ED] rb:text-[#212332]": !selectedIds.includes(item.id), "rb:border-[#DFE4ED] rb:text-[#212332]": !selectedIds.includes(item.id),
})} onClick={() => handleSelect(item)}> })} onClick={() => handleSelect(item)}>
<Flex> {/* Skill name and description */}
{/* Skill avatar showing first letter of name */} <div className="rb:flex-1 rb:max-w-[calc(100%-60px)]">
<Flex align="center" justify="center" className="rb:size-12 rb:rounded-lg rb:mr-3.25! rb:bg-[#155eef] rb:text-[28px] rb:text-white"> <Tooltip title={item.name}>
{item.name[0]} <div className="rb:flex-1 rb:leading-5.5 rb:min-w-0 rb:whitespace-break-spaces rb:wrap-break-word rb:line-clamp-1 rb:font-medium rb:text-[16px] rb:mb-4">
</Flex> {item.name}
{/* Skill name and description */} </div>
<div className="rb:flex-1 rb:max-w-[calc(100%-60px)]"> </Tooltip>
<div className="rb:font-medium rb:wrap-break-word rb:line-clamp-1">{item.name}</div>
<Tooltip title={item.description}> {/* Skill description with tooltip */}
<div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4.25 rb:font-regular rb:-mt-1 rb:wrap-break-word rb:line-clamp-1">{item.description}</div> <Tooltip title={item.description}>
</Tooltip> <div className="rb:h-10 rb:leading-5 rb:wrap-break-word rb:line-clamp-2">{item.description}</div>
</div> </Tooltip>
</Flex> </div>
</div> </div>
</List.Item> </List.Item>
)} )}

14
web/src/views/MemberManagement/index.tsx
View File

@@ -1,8 +1,8 @@
/* /*
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 16:42:12 * @Date: 2026-02-03 16:42:12
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 16:42:12 * @Last Modified time: 2026-03-24 16:49:45
*/ */
/** /**
* Member Management Page * Member Management Page
@@ -10,7 +10,7 @@
*/ */
import React, { useRef } from 'react'; import React, { useRef } from 'react';
import { App, Button, Space } from 'antd'; import { App, Button, Space, Flex } from 'antd';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import type { ColumnsType } from 'antd/es/table'; import type { ColumnsType } from 'antd/es/table';
import type { AnyObject } from 'antd/es/_util/type'; import type { AnyObject } from 'antd/es/_util/type';
@@ -106,12 +106,12 @@ const MemberManagement: React.FC = () => {
]; ];
return ( return (
<> <div className="rb:h-[calc(100vh-80px)] rb:overflow-hidden rb:bg-white rb:rounded-lg rb:pt-3 rb:px-3">
<div className="rb:flex rb:justify-end rb:mb-3"> <Flex justify="end" className="rb:px-1! rb:mb-3!">
<Button type="primary" onClick={() => handleEdit()}> <Button type="primary" onClick={() => handleEdit()}>
{t('member.createMember')} {t('member.createMember')}
</Button> </Button>
</div> </Flex>
<Table <Table
ref={tableRef} ref={tableRef}
apiUrl={memberListUrl} apiUrl={memberListUrl}
@@ -124,7 +124,7 @@ const MemberManagement: React.FC = () => {
ref={memberFormRef} ref={memberFormRef}
refreshTable={refreshTable} refreshTable={refreshTable}
/> />
</> </div>
); );
}; };

8
web/src/views/ModelManagement/List.tsx
View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 16:50:10 * @Date: 2026-02-03 16:50:10
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-20 18:51:27 * @Last Modified time: 2026-03-24 16:52:48
*/ */
/** /**
* Model List View * Model List View
@@ -11,7 +11,7 @@
*/ */
import { useRef, useState, useEffect, forwardRef, useImperativeHandle } from 'react'; import { useRef, useState, useEffect, forwardRef, useImperativeHandle } from 'react';
import { Button, Flex, Row, Col, Tooltip, Space } from 'antd' import { Button, Flex, Row, Col, Tooltip } from 'antd'
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import type { ProviderModelItem, KeyConfigModalRef, ModelListDetailRef, ModelListItem, BaseRef } from './types' import type { ProviderModelItem, KeyConfigModalRef, ModelListDetailRef, ModelListItem, BaseRef } from './types'
@@ -75,9 +75,7 @@ const ModelList = forwardRef<BaseRef, { query: any; handleEdit: (vo?: ModelListI
<Tooltip title={t(`modelNew.${item.provider}`)}> <Tooltip title={t(`modelNew.${item.provider}`)}>
<div className="rb:wrap-break-word rb:line-clamp-1">{t(`modelNew.${item.provider}`)}</div> <div className="rb:wrap-break-word rb:line-clamp-1">{t(`modelNew.${item.provider}`)}</div>
</Tooltip> </Tooltip>
<Space> <Flex gap={8}>{item.tags.map(tag => <Tag key={tag}>{t(`modelNew.${tag}`)}</Tag>)}</Flex>
<Flex gap={8} wrap>{item.tags.map(tag => <Tag key={tag}>{t(`modelNew.${tag}`)}</Tag>)}</Flex>
</Space>
</Flex>} </Flex>}
isNeedTooltip={false} isNeedTooltip={false}
footer={<Row gutter={9} className="rb:pt-2!"> footer={<Row gutter={9} className="rb:pt-2!">

13
web/src/views/ModelManagement/components/ModelListDetail.tsx
View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 16:49:45 * @Date: 2026-02-03 16:49:45
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-06 12:26:12 * @Last Modified time: 2026-03-24 16:55:30
*/ */
/** /**
* Model List Detail Drawer * Model List Detail Drawer
@@ -146,16 +146,19 @@ const ModelListDetail = forwardRef<ModelListDetailRef, ModelListDetailProps>(({
} }
extra={<Switch checked={item.is_active} disabled={loading} onChange={() => handleChange(item)} />} extra={<Switch checked={item.is_active} disabled={loading} onChange={() => handleChange(item)} />}
bodyClassName="rb:relative rb:pb-[64px]! rb:h-[calc(100%-64px)]!" bodyClassName="rb:relative rb:pb-[64px]! rb:h-[calc(100%-64px)]!"
variant="outlined"
> >
<Tooltip title={item.description}> <Tooltip title={item.description}>
<div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4.5 rb:font-regular rb:wrap-break-word rb:line-clamp-2">{item.description}</div> <div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4.5 rb:font-regular rb:wrap-break-word rb:line-clamp-2">{item.description}</div>
</Tooltip> </Tooltip>
<div className="rb:absolute rb:bottom-4 rb:left-6 rb:right-6"> <div className="rb:absolute rb:bottom-4 rb:left-6 rb:right-6">
<Row gutter={12}> <Row gutter={12}>
<Col span={12}> {!item.model_id &&
{!item.model_id && <Button block onClick={() => handleEdit(item)}>{t('modelNew.modelConfiguration')}</Button>} <Col span={12}>
</Col> <Button block onClick={() => handleEdit(item)}>{t('modelNew.modelConfiguration')}</Button>
<Col span={12}> </Col>
}
<Col span={!item.model_id ? 12 : 24}>
<Button type="primary" ghost block onClick={() => handleKeyConfig(item)}>{t('modelNew.keyConfig')}</Button> <Button type="primary" ghost block onClick={() => handleKeyConfig(item)}>{t('modelNew.keyConfig')}</Button>
</Col> </Col>
</Row> </Row>

6
web/src/views/SpaceConfig/index.tsx
View File

@@ -1,8 +1,8 @@
/* /*
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 17:48:03 * @Date: 2026-02-03 17:48:03
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 17:48:03 * @Last Modified time: 2026-03-24 17:01:59
*/ */
/** /**
* Space Configuration Page * Space Configuration Page
@@ -63,7 +63,7 @@ const SpaceConfig: FC = () => {
} }
return ( return (
<div className="rb:h-full rb:max-w-140 rb:mx-auto"> <div className="rb:w-250 rb:bg-white rb:rounded-lg rb:py-3 rb:px-3">
{pageLoading {pageLoading
? <Skeleton active /> ? <Skeleton active />
: <Form : <Form