feat(web): ui upgrade
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
.page-tabs:global(.ant-segmented) {
|
||||
background-color: #F6F6F6;
|
||||
padding: 4px;
|
||||
}
|
||||
.page-tabs:global(.ant-segmented .ant-segmented-item-label) {
|
||||
|
||||
@@ -146,6 +146,9 @@ export const lightTheme: ThemeConfig = {
|
||||
},
|
||||
Progress: {
|
||||
remainingColor: '#EBEBEB',
|
||||
},
|
||||
Segmented: {
|
||||
trackBg: '#E1E2E7',
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -2,7 +2,7 @@
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-03 16:29:41
|
||||
* @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 { useTranslation } from 'react-i18next';
|
||||
@@ -163,20 +163,19 @@ const ReleasePage: FC<{data: Application; refresh: () => void}> = ({data, refres
|
||||
title={t('application.changeLog')}
|
||||
headerType="borderless"
|
||||
>
|
||||
<Flex gap={16} vertical>
|
||||
{selectedVersion && (
|
||||
<RbCard
|
||||
headerType="borderless"
|
||||
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>}
|
||||
bodyClassName="rb:pt-0! rb:pb-3! rb:px-4!"
|
||||
variant="outlined"
|
||||
>
|
||||
<div className="rb:font-regular rb:text-[#5B6167] rb:leading-4">
|
||||
<Markdown content={selectedVersion.release_notes} />
|
||||
</div>
|
||||
</RbCard>
|
||||
)}
|
||||
</Flex>
|
||||
</RbCard>
|
||||
</Flex>
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-05 10:45:08
|
||||
* @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 { 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:border-[#DFE4ED] rb:text-[#212332]": !selectedIds.includes(item.id),
|
||||
})} onClick={() => handleSelect(item)}>
|
||||
<Flex>
|
||||
{/* Skill avatar showing first letter of name */}
|
||||
<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">
|
||||
{item.name[0]}
|
||||
</Flex>
|
||||
{/* Skill name and description */}
|
||||
<div className="rb:flex-1 rb:max-w-[calc(100%-60px)]">
|
||||
<div className="rb:font-medium rb:wrap-break-word rb:line-clamp-1">{item.name}</div>
|
||||
<Tooltip title={item.description}>
|
||||
<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>
|
||||
</div>
|
||||
</Flex>
|
||||
{/* Skill name and description */}
|
||||
<div className="rb:flex-1 rb:max-w-[calc(100%-60px)]">
|
||||
<Tooltip title={item.name}>
|
||||
<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">
|
||||
{item.name}
|
||||
</div>
|
||||
</Tooltip>
|
||||
|
||||
{/* Skill description with tooltip */}
|
||||
<Tooltip title={item.description}>
|
||||
<div className="rb:h-10 rb:leading-5 rb:wrap-break-word rb:line-clamp-2">{item.description}</div>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</List.Item>
|
||||
)}
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
/*
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-03 16:42:12
|
||||
* @Last Modified by: ZhaoYing
|
||||
* @Last Modified time: 2026-02-03 16:42:12
|
||||
* @Last Modified by: ZhaoYing
|
||||
* @Last Modified time: 2026-03-24 16:49:45
|
||||
*/
|
||||
/**
|
||||
* Member Management Page
|
||||
@@ -10,7 +10,7 @@
|
||||
*/
|
||||
|
||||
import React, { useRef } from 'react';
|
||||
import { App, Button, Space } from 'antd';
|
||||
import { App, Button, Space, Flex } from 'antd';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import type { ColumnsType } from 'antd/es/table';
|
||||
import type { AnyObject } from 'antd/es/_util/type';
|
||||
@@ -106,12 +106,12 @@ const MemberManagement: React.FC = () => {
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="rb:flex rb:justify-end rb:mb-3">
|
||||
<div className="rb:h-[calc(100vh-80px)] rb:overflow-hidden rb:bg-white rb:rounded-lg rb:pt-3 rb:px-3">
|
||||
<Flex justify="end" className="rb:px-1! rb:mb-3!">
|
||||
<Button type="primary" onClick={() => handleEdit()}>
|
||||
{t('member.createMember')}
|
||||
</Button>
|
||||
</div>
|
||||
</Flex>
|
||||
<Table
|
||||
ref={tableRef}
|
||||
apiUrl={memberListUrl}
|
||||
@@ -124,7 +124,7 @@ const MemberManagement: React.FC = () => {
|
||||
ref={memberFormRef}
|
||||
refreshTable={refreshTable}
|
||||
/>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-03 16:50:10
|
||||
* @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
|
||||
@@ -11,7 +11,7 @@
|
||||
*/
|
||||
|
||||
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 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}`)}>
|
||||
<div className="rb:wrap-break-word rb:line-clamp-1">{t(`modelNew.${item.provider}`)}</div>
|
||||
</Tooltip>
|
||||
<Space>
|
||||
<Flex gap={8} wrap>{item.tags.map(tag => <Tag key={tag}>{t(`modelNew.${tag}`)}</Tag>)}</Flex>
|
||||
</Space>
|
||||
<Flex gap={8}>{item.tags.map(tag => <Tag key={tag}>{t(`modelNew.${tag}`)}</Tag>)}</Flex>
|
||||
</Flex>}
|
||||
isNeedTooltip={false}
|
||||
footer={<Row gutter={9} className="rb:pt-2!">
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-03 16:49:45
|
||||
* @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
|
||||
@@ -146,16 +146,19 @@ const ModelListDetail = forwardRef<ModelListDetailRef, ModelListDetailProps>(({
|
||||
}
|
||||
extra={<Switch checked={item.is_active} disabled={loading} onChange={() => handleChange(item)} />}
|
||||
bodyClassName="rb:relative rb:pb-[64px]! rb:h-[calc(100%-64px)]!"
|
||||
variant="outlined"
|
||||
>
|
||||
<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>
|
||||
</Tooltip>
|
||||
<div className="rb:absolute rb:bottom-4 rb:left-6 rb:right-6">
|
||||
<Row gutter={12}>
|
||||
<Col span={12}>
|
||||
{!item.model_id && <Button block onClick={() => handleEdit(item)}>{t('modelNew.modelConfiguration')}</Button>}
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
{!item.model_id &&
|
||||
<Col span={12}>
|
||||
<Button block onClick={() => handleEdit(item)}>{t('modelNew.modelConfiguration')}</Button>
|
||||
</Col>
|
||||
}
|
||||
<Col span={!item.model_id ? 12 : 24}>
|
||||
<Button type="primary" ghost block onClick={() => handleKeyConfig(item)}>{t('modelNew.keyConfig')}</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
/*
|
||||
* @Author: ZhaoYing
|
||||
* @Date: 2026-02-03 17:48:03
|
||||
* @Last Modified by: ZhaoYing
|
||||
* @Last Modified time: 2026-02-03 17:48:03
|
||||
* @Last Modified by: ZhaoYing
|
||||
* @Last Modified time: 2026-03-24 17:01:59
|
||||
*/
|
||||
/**
|
||||
* Space Configuration Page
|
||||
@@ -63,7 +63,7 @@ const SpaceConfig: FC = () => {
|
||||
}
|
||||
|
||||
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
|
||||
? <Skeleton active />
|
||||
: <Form
|
||||
|
||||
Reference in New Issue
Block a user