feat: 精简阿里云配置表、minio配置表、腾讯云配置表、七牛云配置表、up配置表、sftp配置表的页面设计

src/pages/Ali/index.tsx

@@ -109,21 +109,6 @@ const User: React.FC<unknown> = () => {
       dataIndex: 'endpoint',
       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名称',
       dataIndex: 'bucket_name',
@@ -139,15 +124,9 @@ const User: React.FC<unknown> = () => {
       dataIndex: 'user_agent',
       valueType: 'text',
     },
+
     {
-      title: '失败后最大重试次数',
+      title: '创建时间',
-      dataIndex: 'max_error_retry',
-      default: '3',
-      tip: '请求失败后最大的重试次数。默认3次。',
-      valueType: 'text',
-    },
-    {
-      title: '注册时间',
       dataIndex: 'create_time',
       valueType: 'dateTime',
     },

src/pages/Minio/index.tsx

@@ -130,17 +130,7 @@ const User: React.FC<unknown> = () => {
       valueType: 'text',
     },
     {
-      title: 'file_host',
+      title: '创建时间',
-      dataIndex: 'file_host',
-      valueType: 'text',
-    },
-    {
-      title: 'download_host',
-      dataIndex: 'download_host',
-      valueType: 'text',
-    },
-    {
-      title: '注册时间',
       dataIndex: 'create_time',
       valueType: 'dateTime',
     },

src/pages/Permission/index.tsx

@@ -127,7 +127,7 @@ const User: React.FC<unknown> = () => {
       valueType: 'text',
     },
     {
-      title: '注册时间',
+      title: '创建时间',
       dataIndex: 'create_time',
       valueType: 'dateTime',
     },

src/pages/Qiniu/index.tsx

@@ -130,26 +130,7 @@ const User: React.FC<unknown> = () => {
       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',
       valueType: 'dateTime',
     },

src/pages/Role/index.tsx

@@ -119,7 +119,7 @@ const User: React.FC<unknown> = () => {
       },
     },
     {
-      title: '注册时间',
+      title: '创建时间',
       dataIndex: 'create_time',
       valueType: 'dateTime',
     },

src/pages/Sftp/index.tsx

@@ -136,22 +136,7 @@ const User: React.FC<unknown> = () => {
       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',
       valueType: 'dateTime',
     },

src/pages/Tencent/index.tsx

@@ -132,28 +132,7 @@ const User: React.FC<unknown> = () => {
       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',
       valueType: 'dateTime',
     },

src/pages/Up/index.tsx

@@ -129,28 +129,8 @@ const User: React.FC<unknown> = () => {
       dataIndex: 'base_path',
       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',
       valueType: 'dateTime',
     },

src/pages/Users/components/UpdateForm.tsx

@@ -1,26 +1,138 @@
+import {
+  ProFormDateTimePicker,
+  ProFormRadio,
+  ProFormSelect,
+  ProFormText,
+  ProFormTextArea,
+  StepsForm,
+} from '@ant-design/pro-components';
 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;

src/pages/Users/index.tsx

@@ -10,7 +10,7 @@ import {
 import { Button, Divider, Drawer, message } from 'antd';
 import React, { useRef, useState } from 'react';
 import CreateForm from './components/CreateForm';
-//import UpdateForm, { FormValueType } from './components/UpdateForm';
+import UpdateForm, { FormValueType } from './components/UpdateForm';
 
 const { addUser, queryUserList, deleteUser, modifyUser } =
   services.UserController;