Merge remote-tracking branch 'origin/dev' into dev
This commit is contained in:
@@ -11,10 +11,14 @@
|
|||||||
"start": "npm run dev"
|
"start": "npm run dev"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@ant-design/charts": "^2.1.1",
|
||||||
"@ant-design/icons": "^5.0.1",
|
"@ant-design/icons": "^5.0.1",
|
||||||
"@ant-design/pro-components": "^2.4.4",
|
"@ant-design/pro-components": "^2.7.10",
|
||||||
"@umijs/max": "^4.3.1",
|
"@umijs/max": "^4.3.1",
|
||||||
"antd": "^5.4.0",
|
"antd": "^5.4.0",
|
||||||
|
"echarts": "^5.5.1",
|
||||||
|
"echarts-for-react": "^3.0.2",
|
||||||
|
"react-calendar-heatmap": "^1.9.0",
|
||||||
"yarn": "^1.22.22"
|
"yarn": "^1.22.22"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
@@ -109,21 +109,6 @@ const User: React.FC<unknown> = () => {
|
|||||||
dataIndex: 'endpoint',
|
dataIndex: 'endpoint',
|
||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: 'access_key_id',
|
|
||||||
dataIndex: 'AccessKey ID',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'access_key_secret',
|
|
||||||
dataIndex: 'AccessKey Secret',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'security_token',
|
|
||||||
dataIndex: 'security Token',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: 'Bucket名称',
|
title: 'Bucket名称',
|
||||||
dataIndex: 'bucket_name',
|
dataIndex: 'bucket_name',
|
||||||
@@ -139,15 +124,9 @@ const User: React.FC<unknown> = () => {
|
|||||||
dataIndex: 'user_agent',
|
dataIndex: 'user_agent',
|
||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
title: '失败后最大重试次数',
|
title: '创建时间',
|
||||||
dataIndex: 'max_error_retry',
|
|
||||||
default: '3',
|
|
||||||
tip: '请求失败后最大的重试次数。默认3次。',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -1,19 +1,319 @@
|
|||||||
import Guide from '@/components/Guide';
|
/** @format */
|
||||||
import { trim } from '@/utils/format';
|
import { ProCard, ProList } from '@ant-design/pro-components';
|
||||||
import { PageContainer } from '@ant-design/pro-components';
|
import { Avatar, Card, Skeleton, Space, Tag } from 'antd';
|
||||||
import { useModel } from '@umijs/max';
|
import Meta from 'antd/es/card/Meta';
|
||||||
import React from 'react';
|
import ReactECharts from 'echarts-for-react';
|
||||||
import styles from './index.less';
|
import { FunctionComponent, useEffect, useState } from 'react';
|
||||||
|
import styles from './index.module.less';
|
||||||
|
|
||||||
const HomePage: React.FC = () => {
|
import aliyun from '@/assets/icons/aliyun.svg';
|
||||||
const { name } = useModel('global');
|
import eye from '@/assets/icons/eye-outline.svg';
|
||||||
|
import share from '@/assets/icons/share.svg';
|
||||||
|
import standard_directory from '@/assets/icons/standard_directory.svg';
|
||||||
|
import userInfo from '@/assets/icons/userInfo.svg';
|
||||||
|
// import * as echarts from "echarts/core";
|
||||||
|
|
||||||
|
import 'react-calendar-heatmap/dist/styles.css';
|
||||||
|
const defaultData = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: '管理员1',
|
||||||
|
content: '2024-07-01',
|
||||||
|
image: aliyun,
|
||||||
|
desc: 'IP:255.255.255',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: '管理员2',
|
||||||
|
content: '2024-06-01',
|
||||||
|
image:
|
||||||
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
||||||
|
desc: 'IP:255.255.255',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: '管理员3',
|
||||||
|
content: '2024-05-01',
|
||||||
|
image:
|
||||||
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
||||||
|
desc: 'IP:255.255.255',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: '管理员4',
|
||||||
|
content: '2024-04-01',
|
||||||
|
image:
|
||||||
|
'https://gw.alipayobjects.com/zos/antfincdn/efFD%24IOql2/weixintupian_20170331104822.jpg',
|
||||||
|
desc: 'IP:255.255.255',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
type DataItem = (typeof defaultData)[number];
|
||||||
|
const MainHome: FunctionComponent = () => {
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
const [dataSource, setDataSource] = useState<DataItem[]>(defaultData);
|
||||||
|
const option = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
color: ['#F58080', '#47D8BE', '#F9A589'],
|
||||||
|
data: ['活跃用户数量', '新增分享圈数量'],
|
||||||
|
left: 'center',
|
||||||
|
bottom: 'bottom',
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
top: 'middle',
|
||||||
|
left: '3%',
|
||||||
|
right: '4%',
|
||||||
|
bottom: '3%',
|
||||||
|
height: '80%',
|
||||||
|
containLabel: true,
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
data: [
|
||||||
|
'2024-02-01',
|
||||||
|
'2024-03-01',
|
||||||
|
'2024-04-01',
|
||||||
|
'2024-05-01',
|
||||||
|
'2024-06-01',
|
||||||
|
'2024-07-01',
|
||||||
|
],
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#999',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value',
|
||||||
|
|
||||||
|
splitLine: {
|
||||||
|
lineStyle: {
|
||||||
|
type: 'dashed',
|
||||||
|
color: '#DDD',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#333',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
nameTextStyle: {
|
||||||
|
color: '#999',
|
||||||
|
},
|
||||||
|
splitArea: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '活跃用户数量',
|
||||||
|
type: 'line',
|
||||||
|
data: [800, 900, 220, 130, 660, 289],
|
||||||
|
color: '#F58080',
|
||||||
|
lineStyle: {
|
||||||
|
width: 5,
|
||||||
|
color: {
|
||||||
|
type: 'linear',
|
||||||
|
|
||||||
|
colorStops: [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: '#FFCAD4', // 0% 处的颜色
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 0.4,
|
||||||
|
color: '#F58080', // 100% 处的颜色
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: '#F58080', // 100% 处的颜色
|
||||||
|
},
|
||||||
|
],
|
||||||
|
globalCoord: false, // 缺省为 false
|
||||||
|
},
|
||||||
|
shadowColor: 'rgba(245,128,128, 0.5)',
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowOffsetY: 7,
|
||||||
|
},
|
||||||
|
itemStyle: {
|
||||||
|
color: '#F58080',
|
||||||
|
borderWidth: 10,
|
||||||
|
/*shadowColor: 'rgba(72,216,191, 0.3)',
|
||||||
|
shadowBlur: 100,*/
|
||||||
|
borderColor: '#F58080',
|
||||||
|
},
|
||||||
|
smooth: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '新增分享圈数量',
|
||||||
|
type: 'line',
|
||||||
|
data: [123, 568, 111, 222, 123, 56],
|
||||||
|
lineStyle: {
|
||||||
|
width: 5,
|
||||||
|
color: {
|
||||||
|
type: 'linear',
|
||||||
|
|
||||||
|
colorStops: [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: '#AAF487', // 0% 处的颜色
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 0.4,
|
||||||
|
color: '#47D8BE', // 100% 处的颜色
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: '#47D8BE', // 100% 处的颜色
|
||||||
|
},
|
||||||
|
],
|
||||||
|
globalCoord: false, // 缺省为 false
|
||||||
|
},
|
||||||
|
shadowColor: 'rgba(71,216,190, 0.5)',
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowOffsetY: 7,
|
||||||
|
},
|
||||||
|
itemStyle: {
|
||||||
|
color: '#AAF487',
|
||||||
|
borderWidth: 10,
|
||||||
|
/*shadowColor: 'rgba(72,216,191, 0.3)',
|
||||||
|
shadowBlur: 100,*/
|
||||||
|
borderColor: '#AAF487',
|
||||||
|
},
|
||||||
|
smooth: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setTimeout(() => {
|
||||||
|
setLoading(false);
|
||||||
|
}, 2000);
|
||||||
|
}, []);
|
||||||
return (
|
return (
|
||||||
<PageContainer ghost>
|
<>
|
||||||
<div className={styles.container}>
|
<div className={styles.home_content_main}>
|
||||||
<Guide name={trim(name)} />
|
<div className={styles.home_content_head}>
|
||||||
|
<div className={styles.home_content_head_left}>
|
||||||
|
<Card
|
||||||
|
style={{ width: '13.5vw', height: '21vh' }}
|
||||||
|
loading={false}
|
||||||
|
bordered
|
||||||
|
hoverable
|
||||||
|
>
|
||||||
|
<Skeleton loading={loading} active avatar>
|
||||||
|
<Meta
|
||||||
|
avatar={<Avatar shape="square" size="large" src={userInfo} />}
|
||||||
|
title="用户数量"
|
||||||
|
description="This is the description"
|
||||||
|
/>
|
||||||
|
</Skeleton>
|
||||||
|
</Card>
|
||||||
|
<Card
|
||||||
|
style={{ width: '13.5vw', height: '21vh' }}
|
||||||
|
loading={false}
|
||||||
|
bordered
|
||||||
|
hoverable
|
||||||
|
>
|
||||||
|
<Skeleton loading={loading} active avatar>
|
||||||
|
<Meta
|
||||||
|
avatar={<Avatar shape="square" size="large" src={share} />}
|
||||||
|
title="分享圈数量"
|
||||||
|
description="This is the description"
|
||||||
|
/>
|
||||||
|
</Skeleton>
|
||||||
|
</Card>
|
||||||
|
<Card
|
||||||
|
style={{ width: '13.5vw', height: '21vh' }}
|
||||||
|
loading={false}
|
||||||
|
bordered
|
||||||
|
hoverable
|
||||||
|
>
|
||||||
|
<Skeleton loading={loading} active avatar>
|
||||||
|
<Meta
|
||||||
|
avatar={
|
||||||
|
<Avatar
|
||||||
|
shape="square"
|
||||||
|
size="large"
|
||||||
|
src={standard_directory}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
title="文件总数"
|
||||||
|
description="This is the description"
|
||||||
|
/>
|
||||||
|
</Skeleton>
|
||||||
|
</Card>
|
||||||
|
<Card
|
||||||
|
style={{ width: '13.5vw', height: '21vh' }}
|
||||||
|
loading={false}
|
||||||
|
bordered
|
||||||
|
hoverable
|
||||||
|
>
|
||||||
|
<Skeleton loading={loading} active avatar>
|
||||||
|
<Meta
|
||||||
|
avatar={<Avatar shape="square" size="large" src={eye} />}
|
||||||
|
title="浏览总量"
|
||||||
|
description="This is the description"
|
||||||
|
/>
|
||||||
|
</Skeleton>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
<div style={{ width: '55%' }}>
|
||||||
|
<ProCard bordered boxShadow>
|
||||||
|
<Skeleton loading={loading} active>
|
||||||
|
<ReactECharts option={option} />
|
||||||
|
</Skeleton>
|
||||||
|
</ProCard>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.home_content_list}>
|
||||||
|
<ProCard bordered boxShadow style={{ width: '49%' }}>
|
||||||
|
<ProList<DataItem>
|
||||||
|
rowKey="id"
|
||||||
|
headerTitle="管理员日志"
|
||||||
|
dataSource={dataSource}
|
||||||
|
showActions="hover"
|
||||||
|
editable={{
|
||||||
|
onSave: async (key, record, originRow) => {
|
||||||
|
console.log(key, record, originRow);
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
onDataSourceChange={setDataSource}
|
||||||
|
metas={{
|
||||||
|
title: {
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
avatar: {
|
||||||
|
dataIndex: 'image',
|
||||||
|
editable: false,
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
dataIndex: 'content',
|
||||||
|
},
|
||||||
|
description: {
|
||||||
|
dataIndex: 'desc',
|
||||||
|
},
|
||||||
|
subTitle: {
|
||||||
|
render: () => {
|
||||||
|
return (
|
||||||
|
<Space size={0}>
|
||||||
|
<Tag color="blue">Ant Design</Tag>
|
||||||
|
<Tag color="#5BD8A6">TechUI</Tag>
|
||||||
|
</Space>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</ProCard>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</PageContainer>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
export default MainHome;
|
||||||
export default HomePage;
|
|
||||||
|
@@ -130,17 +130,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'file_host',
|
title: '创建时间',
|
||||||
dataIndex: 'file_host',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'download_host',
|
|
||||||
dataIndex: 'download_host',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -127,7 +127,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '注册时间',
|
title: '创建时间',
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -130,26 +130,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '使用的Region',
|
title: '创建时间',
|
||||||
dataIndex: 'region',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '是否使用https',
|
|
||||||
tip: '空间相关上传管理操作是否使用 https , 默认 是',
|
|
||||||
default: '1',
|
|
||||||
dataIndex: 'use_https_domains',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '是否使用代理加速上传',
|
|
||||||
tip: '空间相关上传管理操作是否使用代理加速上传,默认 是',
|
|
||||||
default: '1',
|
|
||||||
dataIndex: 'acc_up_host_first',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -119,7 +119,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '注册时间',
|
title: '创建时间',
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -136,22 +136,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '连接超时时长,单位毫秒',
|
title: '创建时间',
|
||||||
dataIndex: 'connection_timeout',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'Socket连接超时时长,单位毫秒',
|
|
||||||
dataIndex: 'so_timeout',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '设置服务器语言',
|
|
||||||
dataIndex: 'server_language_code',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -132,28 +132,7 @@ const User: React.FC<unknown> = () => {
|
|||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '使用的Region',
|
title: '创建时间',
|
||||||
dataIndex: 'region',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '域名后缀',
|
|
||||||
dataIndex: 'end_point_suffix',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'http proxy代理',
|
|
||||||
tip: 'http proxy代理,如果使用http proxy代理,需要设置IP与端口',
|
|
||||||
dataIndex: 'http_proxy_Ip',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '代理服务器端口',
|
|
||||||
dataIndex: 'http_proxy_port',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -129,28 +129,8 @@ const User: React.FC<unknown> = () => {
|
|||||||
dataIndex: 'base_path',
|
dataIndex: 'base_path',
|
||||||
valueType: 'text',
|
valueType: 'text',
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
title: '分片大小',
|
title: '创建时间',
|
||||||
default: '5',
|
|
||||||
dataIndex: 'part_size',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '超时时间',
|
|
||||||
tip: '默认的超时时间:30秒',
|
|
||||||
default: '30',
|
|
||||||
dataIndex: 'timeout',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '接入点',
|
|
||||||
tip: '默认为自动识别接入点',
|
|
||||||
dataIndex: 'api_domain',
|
|
||||||
valueType: 'text',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '注册时间',
|
|
||||||
dataIndex: 'create_time',
|
dataIndex: 'create_time',
|
||||||
valueType: 'dateTime',
|
valueType: 'dateTime',
|
||||||
},
|
},
|
||||||
|
@@ -1,26 +1,138 @@
|
|||||||
|
import {
|
||||||
|
ProFormDateTimePicker,
|
||||||
|
ProFormRadio,
|
||||||
|
ProFormSelect,
|
||||||
|
ProFormText,
|
||||||
|
ProFormTextArea,
|
||||||
|
StepsForm,
|
||||||
|
} from '@ant-design/pro-components';
|
||||||
import { Modal } from 'antd';
|
import { Modal } from 'antd';
|
||||||
import React, { PropsWithChildren } from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
interface CreateFormProps {
|
export interface FormValueType extends Partial<API.UserInfo> {
|
||||||
modalVisible: boolean;
|
target?: string;
|
||||||
onCancel: () => void;
|
template?: string;
|
||||||
|
type?: string;
|
||||||
|
time?: string;
|
||||||
|
frequency?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const CreateForm: React.FC<PropsWithChildren<CreateFormProps>> = (props) => {
|
export interface UpdateFormProps {
|
||||||
const { modalVisible, onCancel } = props;
|
onCancel: (flag?: boolean, formVals?: FormValueType) => void;
|
||||||
|
onSubmit: (values: FormValueType) => Promise<void>;
|
||||||
|
updateModalVisible: boolean;
|
||||||
|
values: Partial<API.UserInfo>;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
const UpdateForm: React.FC<UpdateFormProps> = (props) => (
|
||||||
<Modal
|
<StepsForm
|
||||||
destroyOnClose
|
stepsProps={{
|
||||||
title="新建"
|
size: 'small',
|
||||||
width={420}
|
}}
|
||||||
open={modalVisible}
|
stepsFormRender={(dom, submitter) => {
|
||||||
onCancel={() => onCancel()}
|
return (
|
||||||
footer={null}
|
<Modal
|
||||||
|
width={640}
|
||||||
|
bodyStyle={{ padding: '32px 40px 48px' }}
|
||||||
|
destroyOnClose
|
||||||
|
title="规则配置"
|
||||||
|
open={props.updateModalVisible}
|
||||||
|
footer={submitter}
|
||||||
|
onCancel={() => props.onCancel()}
|
||||||
|
>
|
||||||
|
{dom}
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
onFinish={props.onSubmit}
|
||||||
|
>
|
||||||
|
<StepsForm.StepForm
|
||||||
|
initialValues={{
|
||||||
|
name: props.values.name,
|
||||||
|
nickName: props.values.nickName,
|
||||||
|
}}
|
||||||
|
title="基本信息"
|
||||||
>
|
>
|
||||||
{props.children}
|
<ProFormText
|
||||||
</Modal>
|
width="md"
|
||||||
);
|
name="name"
|
||||||
};
|
label="规则名称"
|
||||||
|
rules={[{ required: true, message: '请输入规则名称!' }]}
|
||||||
|
/>
|
||||||
|
<ProFormTextArea
|
||||||
|
name="desc"
|
||||||
|
width="md"
|
||||||
|
label="规则描述"
|
||||||
|
placeholder="请输入至少五个字符"
|
||||||
|
rules={[
|
||||||
|
{ required: true, message: '请输入至少五个字符的规则描述!', min: 5 },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</StepsForm.StepForm>
|
||||||
|
<StepsForm.StepForm
|
||||||
|
initialValues={{
|
||||||
|
target: '0',
|
||||||
|
template: '0',
|
||||||
|
}}
|
||||||
|
title="配置规则属性"
|
||||||
|
>
|
||||||
|
<ProFormSelect
|
||||||
|
width="md"
|
||||||
|
name="target"
|
||||||
|
label="监控对象"
|
||||||
|
valueEnum={{
|
||||||
|
0: '表一',
|
||||||
|
1: '表二',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<ProFormSelect
|
||||||
|
width="md"
|
||||||
|
name="template"
|
||||||
|
label="规则模板"
|
||||||
|
valueEnum={{
|
||||||
|
0: '规则模板一',
|
||||||
|
1: '规则模板二',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<ProFormRadio.Group
|
||||||
|
name="type"
|
||||||
|
width="md"
|
||||||
|
label="规则类型"
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
value: '0',
|
||||||
|
label: '强',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '1',
|
||||||
|
label: '弱',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</StepsForm.StepForm>
|
||||||
|
<StepsForm.StepForm
|
||||||
|
initialValues={{
|
||||||
|
type: '1',
|
||||||
|
frequency: 'month',
|
||||||
|
}}
|
||||||
|
title="设定调度周期"
|
||||||
|
>
|
||||||
|
<ProFormDateTimePicker
|
||||||
|
name="time"
|
||||||
|
label="开始时间"
|
||||||
|
rules={[{ required: true, message: '请选择开始时间!' }]}
|
||||||
|
/>
|
||||||
|
<ProFormSelect
|
||||||
|
name="frequency"
|
||||||
|
label="监控对象"
|
||||||
|
width="xs"
|
||||||
|
valueEnum={{
|
||||||
|
month: '月',
|
||||||
|
week: '周',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</StepsForm.StepForm>
|
||||||
|
</StepsForm>
|
||||||
|
);
|
||||||
|
|
||||||
export default CreateForm;
|
export default UpdateForm;
|
||||||
|
@@ -10,7 +10,7 @@ import {
|
|||||||
import { Button, Divider, Drawer, message } from 'antd';
|
import { Button, Divider, Drawer, message } from 'antd';
|
||||||
import React, { useRef, useState } from 'react';
|
import React, { useRef, useState } from 'react';
|
||||||
import CreateForm from './components/CreateForm';
|
import CreateForm from './components/CreateForm';
|
||||||
//import UpdateForm, { FormValueType } from './components/UpdateForm';
|
import UpdateForm, { FormValueType } from './components/UpdateForm';
|
||||||
|
|
||||||
const { addUser, queryUserList, deleteUser, modifyUser } =
|
const { addUser, queryUserList, deleteUser, modifyUser } =
|
||||||
services.UserController;
|
services.UserController;
|
||||||
|
Reference in New Issue
Block a user