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
* @Date: 2026-02-03 16:26:32
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 16:26:32
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-25 15:09:09
*/
/**
* Variable List Component
@@ -56,12 +56,22 @@ interface VariableListProps {
}
return (
<Card
title={<>
{t('application.variableConfiguration')}
<span className="rb:font-regular rb:text-[12px] rb:text-[#5B6167]"> ({t('application.VariableManagementDesc')})</span>
</>}
extra={<Button style={{ padding: '0 8px', height: '24px' }} onClick={handleAddVariable}>+ {t('application.addVariables')}</Button>}
title={t('application.variableConfiguration')}
extra={
<Button
size="small"
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}>
{(fields, { remove }) => {
return (
@@ -69,6 +79,7 @@ interface VariableListProps {
{fields.length > 0 ? (
<div className="rb:mt-3">
<Table
size="small"
rowKey="index"
pagination={false}
columns={[
@@ -92,7 +103,7 @@ interface VariableListProps {
title: t('application.optional'),
dataIndex: 'required',
key: 'required',
render: (required) => <Switch checked={!required} disabled />
render: (required) => <Switch size="small" checked={!required} disabled />
},
{
title: t('common.operation'),
@@ -117,7 +128,7 @@ interface VariableListProps {
/>
</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
* @Date: 2026-02-06 21:09:42
* @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
@@ -21,7 +21,7 @@
* @component
*/
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 as RcUploadProps } from 'antd/es/upload/interface';
import { useTranslation } from 'react-i18next';
@@ -194,7 +194,7 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
formData.append('file', file);
const response = await request.uploadFile(action, formData, requestConfig);
onSuccess?.({data: response});
} catch (error) {
onError?.(error as Error);
@@ -260,10 +260,10 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
itemRender: (_, file, __, actions) => {
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 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}
<span className="rb:text-[#5B6167] rb:cursor-pointer" onClick={() => actions?.remove()}>Cancel</span>
</div>
<span className="rb:text-[#5B6167] rb:cursor-pointer" onClick={() => actions?.remove()}>{t('common.cancel')}</span>
</Flex>
<Progress percent={file.percent || 0} strokeColor={file.status === 'error' ? '#FF5D34' : '#155EEF'} size="small" showInfo={false} />
</div>
);