feat(web): ui upgrade

This commit is contained in:
zhaoying
2026-03-07 15:09:22 +08:00
parent 77b9a6a94e
commit 153e68e055
2 changed files with 26 additions and 15 deletions

View File

@@ -1,8 +1,8 @@
/* /*
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 16:26:32 * @Date: 2026-02-03 16:26:32
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 16:26:32 * @Last Modified time: 2026-02-25 15:09:09
*/ */
/** /**
* Variable List Component * Variable List Component
@@ -56,12 +56,22 @@ interface VariableListProps {
} }
return ( return (
<Card <Card
title={<> title={t('application.variableConfiguration')}
{t('application.variableConfiguration')} extra={
<span className="rb:font-regular rb:text-[12px] rb:text-[#5B6167]"> ({t('application.VariableManagementDesc')})</span> <Button
</>} size="small"
extra={<Button style={{ padding: '0 8px', height: '24px' }} onClick={handleAddVariable}>+ {t('application.addVariables')}</Button>} className="rb:h-6! rb:py-0! rb:px-2! rb:rounded-md! rb:text-[#21233"
onClick={handleAddVariable}
>
+ {t('application.addVariables')}
</Button>
}
> >
<div className="rb:leading-4.5 rb:text-[12px] rb:mb-2">
<span className="rb:font-medium">{t('application.variableManagement')}</span>
<span className="rb:font-regular rb:text-[#5B6167]"> ({t('application.variableManagementDesc')})</span>
</div>
<Form.List name="variables" initialValue={value}> <Form.List name="variables" initialValue={value}>
{(fields, { remove }) => { {(fields, { remove }) => {
return ( return (
@@ -69,6 +79,7 @@ interface VariableListProps {
{fields.length > 0 ? ( {fields.length > 0 ? (
<div className="rb:mt-3"> <div className="rb:mt-3">
<Table <Table
size="small"
rowKey="index" rowKey="index"
pagination={false} pagination={false}
columns={[ columns={[
@@ -92,7 +103,7 @@ interface VariableListProps {
title: t('application.optional'), title: t('application.optional'),
dataIndex: 'required', dataIndex: 'required',
key: 'required', key: 'required',
render: (required) => <Switch checked={!required} disabled /> render: (required) => <Switch size="small" checked={!required} disabled />
}, },
{ {
title: t('common.operation'), title: t('common.operation'),
@@ -117,7 +128,7 @@ interface VariableListProps {
/> />
</div> </div>
) : ( ) : (
<Empty url={variablesEmpty} size={88} subTitle={t('application.variablesEmpty')} /> <div className="rb-border rb:rounded-xl rb:pt-4 rb:pb-6"><Empty url={variablesEmpty} size={88} subTitle={t('application.variablesEmpty')} /></div>
)} )}
</> </>
) )

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-06 21:09:42 * @Date: 2026-02-06 21:09:42
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-06 12:20:43 * @Last Modified time: 2026-03-07 15:03:31
*/ */
/** /**
* File Upload Component * File Upload Component
@@ -21,7 +21,7 @@
* @component * @component
*/ */
import { useState, useEffect, forwardRef, useImperativeHandle } from 'react'; import { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
import { Upload, Progress, App } from 'antd'; import { Upload, Progress, App, Flex } from 'antd';
import type { UploadProps, UploadFile } from 'antd'; import type { UploadProps, UploadFile } from 'antd';
import type { UploadProps as RcUploadProps } from 'antd/es/upload/interface'; import type { UploadProps as RcUploadProps } from 'antd/es/upload/interface';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@@ -260,10 +260,10 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
itemRender: (_, file, __, actions) => { itemRender: (_, file, __, actions) => {
return ( return (
<div key={file.uid} className="rb:relative rb:w-full rb:pt-2 rb:px-2.5 rb-pb-[10px] rb:border rb:border-[#EBEBEB] rb:rounded rb:p-2 rb:mt-2 rb:bg-white"> <div key={file.uid} className="rb:relative rb:w-full rb:pt-2 rb:px-2.5 rb-pb-[10px] rb:border rb:border-[#EBEBEB] rb:rounded rb:p-2 rb:mt-2 rb:bg-white">
<div className="rb:text-[12px] rb:flex rb:items-center rb:justify-between rb:mb-0.5"> <Flex align="center" justify="space-between" className="rb:text-[12px] rb:mb-0.5!">
{file.name} {file.name}
<span className="rb:text-[#5B6167] rb:cursor-pointer" onClick={() => actions?.remove()}>Cancel</span> <span className="rb:text-[#5B6167] rb:cursor-pointer" onClick={() => actions?.remove()}>{t('common.cancel')}</span>
</div> </Flex>
<Progress percent={file.percent || 0} strokeColor={file.status === 'error' ? '#FF5D34' : '#155EEF'} size="small" showInfo={false} /> <Progress percent={file.percent || 0} strokeColor={file.status === 'error' ? '#FF5D34' : '#155EEF'} size="small" showInfo={false} />
</div> </div>
); );