From d5d900c37f88a4d4065fbf3431730916cfaba2be Mon Sep 17 00:00:00 2001 From: landaiqing <3517283258@qq.com> Date: Mon, 8 Jul 2024 11:17:37 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E5=AD=98=E5=82=A8?= =?UTF-8?q?=E5=95=86=E9=85=8D=E7=BD=AE=E8=A1=A8=E5=8D=95=E6=A1=86=E6=9E=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.tsx | 10 - .../Main/Settings/components/AliSettings.tsx | 220 +++++++++++++- .../Main/Settings/components/AwsSettings.tsx | 257 +++++++++++++++- .../Settings/components/BaiduSettings.tsx | 286 +++++++++++++++++- .../Settings/components/HuaweiSettings.tsx | 242 ++++++++++++++- .../Main/Settings/components/JdSettings.tsx | 240 ++++++++++++++- .../Settings/components/JinshanSettings.tsx | 274 ++++++++++++++++- .../Settings/components/MinioSettings.tsx | 221 +++++++++++++- .../Settings/components/PinanSettings.tsx | 221 +++++++++++++- .../Settings/components/QingyunSettings.tsx | 250 ++++++++++++++- .../Settings/components/QiniuSettings.tsx | 225 +++++++++++++- .../Settings/components/TencentSettings.tsx | 211 ++++++++++++- .../Settings/components/UcloudSettings.tsx | 238 ++++++++++++++- .../Main/Settings/components/UpSettings.tsx | 221 +++++++++++++- .../Settings/components/WangyiSettings.tsx | 238 ++++++++++++++- .../Main/Settings/index.module.less | 4 + src/components/Main/Settings/index.tsx | 12 +- src/views/Main/defaultSettings.tsx | 2 +- src/views/Main/index.tsx | 2 +- 19 files changed, 3324 insertions(+), 50 deletions(-) delete mode 100644 src/App.tsx diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index c350d53..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,10 +0,0 @@ -/** @format */ - -import routes from "@/router/routes.ts"; -import { RouterGuard } from "@/router/guard.ts"; - -function App() { - return
{RouterGuard(routes)}
; -} - -export default App; diff --git a/src/components/Main/Settings/components/AliSettings.tsx b/src/components/Main/Settings/components/AliSettings.tsx index 5784299..2224d35 100644 --- a/src/components/Main/Settings/components/AliSettings.tsx +++ b/src/components/Main/Settings/components/AliSettings.tsx @@ -1,8 +1,224 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + accessKeyId: string; + accessKeySecret: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + endpoint: "https://oss.aliyuncs.com", + accessKeyId: "LTAI5tG3", + accessKeySecret: "G3", + createdTime: "2024-06-28 10:51:59", + updatedTime: "2024-06-29 10:51:59", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessKeySecret", + tooltip: "access key secret", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const AliSettings: React.FC = () => { - return <>阿里云OSs设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddAliOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="阿里云OSS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default AliSettings; diff --git a/src/components/Main/Settings/components/AwsSettings.tsx b/src/components/Main/Settings/components/AwsSettings.tsx index 4e60480..9c5912b 100644 --- a/src/components/Main/Settings/components/AwsSettings.tsx +++ b/src/components/Main/Settings/components/AwsSettings.tsx @@ -1,8 +1,261 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + accessKeyId: string; + secretAccessKey: string; + region: string; + mode: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "https://oss.aliyuncs.com", + accessKeyId: "LTAI5tG3", + secretAccessKey: "G3", + region: "2024-06-28 10:51:59", + mode: "2024-06-29 10:51:59", + createdTime: "2024-06-28 10:51:59", + updatedTime: "2024-06-29 10:51:59", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucket", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretAccessKey", + tooltip: "secret access key", + ellipsis: true, + }, + { + disable: true, + title: "地区", + dataIndex: "region", + tooltip: "region", + ellipsis: true, + }, + { + disable: true, + title: "模式", + dataIndex: "mode", + tooltip: "mode", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const AwsSettings: React.FC = () => { - return <>AWS设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddAwsOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="亚马逊S3配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default AwsSettings; diff --git a/src/components/Main/Settings/components/BaiduSettings.tsx b/src/components/Main/Settings/components/BaiduSettings.tsx index 60e1859..72da2be 100644 --- a/src/components/Main/Settings/components/BaiduSettings.tsx +++ b/src/components/Main/Settings/components/BaiduSettings.tsx @@ -1,8 +1,290 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, DatePicker, Drawer, Form, Input, Row, Select, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + accessKeyId: string; + accessKeySecret: string; + created_time: string; + updated_time: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + endpoint: "https://oss.aliyuncs.com", + accessKeyId: "LTAI5tG3", + accessKeySecret: "G3", + created_time: "2022-01-01", + updated_time: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessKeySecret", + tooltip: "access key secret", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "date", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updateTime", + valueType: "date", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const BaiduSettings: React.FC = () => { - return <>百度OBS设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddBaiduOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + trigger.parentElement!} + /> + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="百度云BOS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default BaiduSettings; diff --git a/src/components/Main/Settings/components/HuaweiSettings.tsx b/src/components/Main/Settings/components/HuaweiSettings.tsx index fbb7a14..c9de753 100644 --- a/src/components/Main/Settings/components/HuaweiSettings.tsx +++ b/src/components/Main/Settings/components/HuaweiSettings.tsx @@ -1,8 +1,242 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; -import React from "react"; -const HuaweiSettings: React.FC = () => { - return <>华为COS设置; +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + endpoint: string; + accessKey: string; + secretKey: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "666", + endpoint: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + secretKey: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKey", + tooltip: "access key", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretKey", + tooltip: "secret key", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; + +const HuawaiSettings: React.FC = () => { + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddHuaweiOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="华为云OBS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; -export default HuaweiSettings; +export default HuawaiSettings; diff --git a/src/components/Main/Settings/components/JdSettings.tsx b/src/components/Main/Settings/components/JdSettings.tsx index 7cb9120..95fb54f 100644 --- a/src/components/Main/Settings/components/JdSettings.tsx +++ b/src/components/Main/Settings/components/JdSettings.tsx @@ -1,8 +1,244 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: number; + endpoint: string; + accessKey: string; + secretKey: string; + region: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: 666, + endpoint: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + secretKey: "G3", + region: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKey", + tooltip: "access key", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretKey", + tooltip: "secret key", + ellipsis: true, + }, + { + disable: true, + title: "地区", + dataIndex: "region", + tooltip: "region", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const JdSettings: React.FC = () => { - return <>AWS设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddJdOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="京东云OSS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default JdSettings; diff --git a/src/components/Main/Settings/components/JinshanSettings.tsx b/src/components/Main/Settings/components/JinshanSettings.tsx index c364bb7..fa5d582 100644 --- a/src/components/Main/Settings/components/JinshanSettings.tsx +++ b/src/components/Main/Settings/components/JinshanSettings.tsx @@ -1,8 +1,278 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + bucketName: string; + accessKeyId: string; + accessKeySecret: string; + region: string; + securityToken: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "6666", + endpoint: "https://oss.aliyuncs.com", + accessKeyId: "LTAI5tG3", + accessKeySecret: "G3", + region: "G3", + securityToken: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessKeySecret", + tooltip: "access key secret", + ellipsis: true, + }, + { + disable: true, + title: "地区", + dataIndex: "region", + tooltip: "region", + ellipsis: true, + }, + { + disable: true, + title: "令牌", + dataIndex: "securityToken", + tooltip: "security token", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const JinshanSettings: React.FC = () => { - return <>金山设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddJinshanOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="金山OBS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default JinshanSettings; diff --git a/src/components/Main/Settings/components/MinioSettings.tsx b/src/components/Main/Settings/components/MinioSettings.tsx index a798318..caaf9d9 100644 --- a/src/components/Main/Settings/components/MinioSettings.tsx +++ b/src/components/Main/Settings/components/MinioSettings.tsx @@ -1,8 +1,225 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + accessKey: string; + secretKey: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + endpoint: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + secretKey: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKey", + tooltip: "access key", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretKey", + tooltip: "secret key", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const MinioSettings: React.FC = () => { - return <>Minio设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddMinioOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="MinIO配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default MinioSettings; diff --git a/src/components/Main/Settings/components/PinanSettings.tsx b/src/components/Main/Settings/components/PinanSettings.tsx index c2c3053..5439b44 100644 --- a/src/components/Main/Settings/components/PinanSettings.tsx +++ b/src/components/Main/Settings/components/PinanSettings.tsx @@ -1,8 +1,225 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + accessKeyId: string; + accessKeySecret: string; + created_time: string; + updated_time: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + endpoint: "https://oss.aliyuncs.com", + accessKeyId: "LTAI5tG3", + accessKeySecret: "G3", + created_time: "2022-01-01", + updated_time: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessKeySecret", + tooltip: "access key secret", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updateTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const PinanSettings: React.FC = () => { - return <>平安云设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddPinanOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="平安云OSS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default PinanSettings; diff --git a/src/components/Main/Settings/components/QingyunSettings.tsx b/src/components/Main/Settings/components/QingyunSettings.tsx index 7c2a508..9bb2ab8 100644 --- a/src/components/Main/Settings/components/QingyunSettings.tsx +++ b/src/components/Main/Settings/components/QingyunSettings.tsx @@ -1,8 +1,254 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + zone: string; + endpoint: string; + accessKey: string; + bucketName: string; + accessSecret: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "1", + zone: "1", + endpoint: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + accessSecret: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "地区", + dataIndex: "zone", + tooltip: "zone", + ellipsis: true, + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKey", + tooltip: "access Key", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessSecret", + tooltip: "access Secret", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const QingyunSettings: React.FC = () => { - return <>青云设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddQingyunOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="青云OSS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default QingyunSettings; diff --git a/src/components/Main/Settings/components/QiniuSettings.tsx b/src/components/Main/Settings/components/QiniuSettings.tsx index c85a499..ca6457e 100644 --- a/src/components/Main/Settings/components/QiniuSettings.tsx +++ b/src/components/Main/Settings/components/QiniuSettings.tsx @@ -1,8 +1,225 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; -import React from "react"; -const AliSettings: React.FC = () => { - return <>七牛设置; +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + accessKey: string; + secretKey: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + secretKey: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKeyId", + tooltip: "access key id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "accessKeySecret", + tooltip: "access key secret", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; + +const QiniuSettings: React.FC = () => { + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddQiniuOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="七牛Kodo配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; -export default AliSettings; +export default QiniuSettings; diff --git a/src/components/Main/Settings/components/TencentSettings.tsx b/src/components/Main/Settings/components/TencentSettings.tsx index 3525d2e..9e08e8a 100644 --- a/src/components/Main/Settings/components/TencentSettings.tsx +++ b/src/components/Main/Settings/components/TencentSettings.tsx @@ -1,8 +1,215 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + secretId: string; + secretKey: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "https://oss.aliyuncs.com", + secretId: "LTAI5tG3", + secretKey: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "secretId", + tooltip: "secret Id", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretKey", + tooltip: "secret Key", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const TencentSettings: React.FC = () => { - return <>腾讯云COS设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddTencentOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="腾讯云COS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default TencentSettings; diff --git a/src/components/Main/Settings/components/UcloudSettings.tsx b/src/components/Main/Settings/components/UcloudSettings.tsx index 6cc9704..54c0837 100644 --- a/src/components/Main/Settings/components/UcloudSettings.tsx +++ b/src/components/Main/Settings/components/UcloudSettings.tsx @@ -1,8 +1,242 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + publicKey: string; + privateKey: string; + customHost: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "https://oss.aliyuncs.com", + publicKey: "LTAI5tG3", + privateKey: "G3", + customHost: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "公钥", + dataIndex: "publicKey", + tooltip: "publicKey", + ellipsis: true, + }, + { + disable: true, + title: "私钥", + dataIndex: "privateKey", + tooltip: "privateKey", + ellipsis: true, + }, + { + disable: true, + title: "服务地址", + dataIndex: "customHost", + tooltip: "customHost", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const UcloudSettings: React.FC = () => { - return <>Ucloud设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddUcloudOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="UCloud US3配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default UcloudSettings; diff --git a/src/components/Main/Settings/components/UpSettings.tsx b/src/components/Main/Settings/components/UpSettings.tsx index 5426ed1..d14f091 100644 --- a/src/components/Main/Settings/components/UpSettings.tsx +++ b/src/components/Main/Settings/components/UpSettings.tsx @@ -1,8 +1,225 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + bucketName: string; + userName: string; + password: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + bucketName: "https://oss.aliyuncs.com", + userName: "LTAI5tG3", + password: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "用户名", + dataIndex: "userName", + tooltip: "userName", + ellipsis: true, + }, + { + disable: true, + title: "密码", + dataIndex: "password", + tooltip: "password", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const UpSettings: React.FC = () => { - return <>又拍云设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddUpOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="又拍云USS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default UpSettings; diff --git a/src/components/Main/Settings/components/WangyiSettings.tsx b/src/components/Main/Settings/components/WangyiSettings.tsx index f5893c2..548d573 100644 --- a/src/components/Main/Settings/components/WangyiSettings.tsx +++ b/src/components/Main/Settings/components/WangyiSettings.tsx @@ -1,8 +1,242 @@ /** @format */ +import { PlusOutlined } from "@ant-design/icons"; +import type { ActionType, ProColumns } from "@ant-design/pro-components"; +import { ProTable, TableDropdown } from "@ant-design/pro-components"; +import { Button, Col, Drawer, Form, Input, Row, Space } from "antd"; +import React, { useRef, useState } from "react"; + +type AliOssConfigItem = { + id: number; + userId: number; + endpoint: string; + bucketName: string; + accessKey: string; + secretKey: string; + createdTime: string; + updatedTime: string; + status: string; +}; +const data: AliOssConfigItem[] = [ + { + id: 1, + userId: 1, + endpoint: "https://oss.aliyuncs.com", + bucketName: "https://oss.aliyuncs.com", + accessKey: "LTAI5tG3", + secretKey: "G3", + createdTime: "2022-01-01", + updatedTime: "2022-01-01", + status: "正常", + }, +]; + +const columns: ProColumns[] = [ + { + dataIndex: "index", + valueType: "indexBorder", + width: 48, + }, + { + title: "ID", + dataIndex: "id", + copyable: true, + ellipsis: true, + tooltip: "Id", + }, + { + disable: true, + title: "服务地址", + dataIndex: "endpoint", + tooltip: "endpoint", + ellipsis: true, + }, + { + disable: true, + title: "存储桶", + dataIndex: "bucketName", + tooltip: "bucketName", + ellipsis: true, + }, + { + disable: true, + title: "密钥ID", + dataIndex: "accessKey", + tooltip: "accessKey", + ellipsis: true, + }, + { + disable: true, + title: "密钥值", + dataIndex: "secretKey", + tooltip: "secretKey", + ellipsis: true, + }, + { + disable: true, + title: "状态", + dataIndex: "status", + search: true, + }, + { + title: "创建时间", + dataIndex: "createdTime", + valueType: "dateTime", + sorter: true, + hideInSearch: true, + }, + { + title: "更新时间", + dataIndex: "updatedTime", + valueType: "dateTime", + sorter: true, + }, + { + title: "操作", + valueType: "option", + key: "option", + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-expect-error + render: (text, record, _, action) => [ + { + action?.startEditable?.(record.id); + }}> + 编辑 + , + + 查看 + , + action?.reload()} + menus={[ + { key: "copy", name: "复制" }, + { key: "delete", name: "删除" }, + ]} + />, + ], + }, +]; -import React from "react"; const WangyiSettings: React.FC = () => { - return <>网易云设置; + const actionRef = useRef(); + const [open, setOpen] = useState(false); + const showDrawer = () => { + setOpen(true); + }; + + const onClose = () => { + setOpen(false); + }; + const AddWangyiOssConfigDrawer = () => { + return ( + <> + + + + + }> +
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ + + ); + }; + return ( + <> + + columns={columns} + dataSource={data} + actionRef={actionRef} + cardBordered={true} + editable={{ + type: "multiple", + }} + columnsState={{ + persistenceKey: "pro-table-singe-demos", + persistenceType: "localStorage", + defaultValue: { + option: { fixed: "right", disable: true }, + }, + }} + rowKey="id" + search={false} + options={{ + setting: { + listsHeight: 400, + }, + }} + pagination={{ + pageSize: 5, + }} + dateFormatter="string" + headerTitle="阿里云OSS配置" + bordered={false} + toolBarRender={() => [ + , + ]} + /> + + + ); }; export default WangyiSettings; diff --git a/src/components/Main/Settings/index.module.less b/src/components/Main/Settings/index.module.less index f3e39d2..791eab7 100644 --- a/src/components/Main/Settings/index.module.less +++ b/src/components/Main/Settings/index.module.less @@ -1,3 +1,7 @@ + +.settings_container{ + height: 75vh; +} .settings_header{ display: flex; flex-direction: row; diff --git a/src/components/Main/Settings/index.tsx b/src/components/Main/Settings/index.tsx index 870a946..daee931 100644 --- a/src/components/Main/Settings/index.tsx +++ b/src/components/Main/Settings/index.tsx @@ -11,8 +11,8 @@ export default () => { const navigate = useNavigate(); const location = useLocation(); return ( - <> - +
+
- + {location.pathname === "/main/setting" || location.pathname === "/main/setting/" ? ( <> - + ) : ( <> @@ -67,7 +67,7 @@ export default () => { )} - - + +
); }; diff --git a/src/views/Main/defaultSettings.tsx b/src/views/Main/defaultSettings.tsx index 1fb06a9..07ac438 100644 --- a/src/views/Main/defaultSettings.tsx +++ b/src/views/Main/defaultSettings.tsx @@ -34,7 +34,7 @@ export default { }, { path: "main/setting", - name: "配置", + name: "存储商", icon: storage_setting, }, { diff --git a/src/views/Main/index.tsx b/src/views/Main/index.tsx index 23bfabc..09926a8 100644 --- a/src/views/Main/index.tsx +++ b/src/views/Main/index.tsx @@ -31,7 +31,7 @@ export default function Layout() { defaultOpenAll: false, hideMenuWhenCollapsed: false, type: "group", - collapsedShowTitle: true, + collapsedShowTitle: false, }} title={"五味子云存储"} siderWidth={216}