You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by ju...@apache.org on 2020/05/20 08:13:22 UTC
[incubator-apisix-dashboard] branch next updated: WIP: Feat
refactor (#198)
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-apisix-dashboard.git
The following commit(s) were added to refs/heads/next by this push:
new 129c775 WIP: Feat refactor (#198)
129c775 is described below
commit 129c77540f81f057d8bd52a68607de4bb607e87c
Author: 琚致远 <ju...@apache.org>
AuthorDate: Wed May 20 16:13:15 2020 +0800
WIP: Feat refactor (#198)
* feat: remove edit ssl
* feat: update SSL icon
* feat: remove Welcome
* feat: refactor structure for SSL
* feat: update service
* feat: refactor SSL structure
* feat: remove ssl model
---
config/config.ts | 20 +---
src/locales/en-US.ts | 2 -
src/locales/en-US/menu.ts | 1 -
src/locales/zh-CN.ts | 2 -
src/locales/zh-CN/menu.ts | 1 -
src/models/connect.d.ts | 2 -
src/models/ssl.ts | 23 ----
src/pages/SSLModule/detail/index.tsx | 129 ---------------------
src/pages/Welcome.less | 8 --
src/pages/Welcome.tsx | 62 ----------
.../create/style.less => ssl/Create.less} | 0
.../{SSLModule/create/index.tsx => ssl/Create.tsx} | 2 +-
.../{SSLModule/list/index.tsx => ssl/List.tsx} | 3 +-
.../components/CertificateForm/index.tsx | 2 +-
.../components/CertificateUploader/index.tsx | 4 +-
.../create => ssl}/components/Step1/index.tsx | 4 +-
.../create => ssl}/components/Step2/index.tsx | 2 +-
.../create => ssl}/components/Step3/index.tsx | 4 +-
.../create => ssl}/components/Step4/index.tsx | 2 +-
src/{services/ssl.ts => pages/ssl/service.ts} | 6 +-
src/pages/ssl/typing.d.ts | 5 +
21 files changed, 23 insertions(+), 261 deletions(-)
diff --git a/config/config.ts b/config/config.ts
index c045c1e..7524365 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -46,13 +46,7 @@ export default defineConfig({
routes: [
{
path: '/',
- redirect: '/welcome',
- },
- {
- path: '/welcome',
- name: 'welcome',
- icon: 'smile',
- component: './Welcome',
+ redirect: '/settings',
},
{
name: 'settings',
@@ -63,7 +57,7 @@ export default defineConfig({
{
name: 'ssl',
path: '/ssl',
- icon: 'crown',
+ icon: 'BarsOutlined',
routes: [
{
path: '/ssl',
@@ -72,19 +66,13 @@ export default defineConfig({
{
path: '/ssl/list',
name: 'list',
- component: './SSLModule/list',
- hideInMenu: true,
- },
- {
- path: '/ssl/:key/edit',
- name: 'edit',
- component: './SSLModule/detail',
+ component: './ssl/List',
hideInMenu: true,
},
{
name: 'create',
path: '/ssl/create',
- component: './SSLModule/create',
+ component: './ssl/Create',
hideInMenu: true,
},
],
diff --git a/src/locales/en-US.ts b/src/locales/en-US.ts
index 3d57988..4ff9776 100644
--- a/src/locales/en-US.ts
+++ b/src/locales/en-US.ts
@@ -11,8 +11,6 @@ export default {
'layout.user.link.privacy': 'Privacy',
'layout.user.link.terms': 'Terms',
'app.preview.down.block': 'Download this page to your local project',
- 'app.welcome.link.fetch-blocks': 'Get all block',
- 'app.welcome.link.block-list': 'Quickly build standard, pages based on `block` development',
...globalHeader,
...menu,
...settingDrawer,
diff --git a/src/locales/en-US/menu.ts b/src/locales/en-US/menu.ts
index 5e605dd..914dc06 100644
--- a/src/locales/en-US/menu.ts
+++ b/src/locales/en-US/menu.ts
@@ -1,5 +1,4 @@
export default {
- 'menu.welcome': 'Welcome',
'menu.more-blocks': 'More Blocks',
'menu.home': 'Home',
'menu.admin': 'Admin',
diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts
index 1822d7b..b37ec0f 100644
--- a/src/locales/zh-CN.ts
+++ b/src/locales/zh-CN.ts
@@ -11,8 +11,6 @@ export default {
'layout.user.link.privacy': '隐私',
'layout.user.link.terms': '条款',
'app.preview.down.block': '下载此页面到本地项目',
- 'app.welcome.link.fetch-blocks': '获取全部区块',
- 'app.welcome.link.block-list': '基于 block 开发，快速构建标准页面',
...globalHeader,
...menu,
...settingDrawer,
diff --git a/src/locales/zh-CN/menu.ts b/src/locales/zh-CN/menu.ts
index 6f22688..11ea16f 100644
--- a/src/locales/zh-CN/menu.ts
+++ b/src/locales/zh-CN/menu.ts
@@ -1,5 +1,4 @@
export default {
- 'menu.welcome': '欢迎',
'menu.more-blocks': '更多区块',
'menu.home': '首页',
'menu.admin': '管理页',
diff --git a/src/models/connect.d.ts b/src/models/connect.d.ts
index 9e27465..a0696dc 100644
--- a/src/models/connect.d.ts
+++ b/src/models/connect.d.ts
@@ -3,7 +3,6 @@ import { GlobalModelState } from './global';
import { DefaultSettings as SettingModelState } from '../../config/defaultSettings';
import { UserModelState } from './user';
import { StateType } from './login';
-import { ModelState as SSLModelState } from './ssl';
export { GlobalModelState, SettingModelState, UserModelState };
@@ -25,7 +24,6 @@ export interface ConnectState {
settings: SettingModelState;
user: UserModelState;
login: StateType;
- ssl: SSLModelState;
}
export interface Route extends MenuDataItem {
diff --git a/src/models/ssl.ts b/src/models/ssl.ts
deleted file mode 100644
index 49edb08..0000000
--- a/src/models/ssl.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-export interface SSL {
- sni: string[];
- cert: string;
- key: string;
-}
-
-export interface ModelState {}
-
-export interface ModelType {
- namespace: string;
- state: ModelState;
- effects: {};
- reducers: {};
-}
-
-const model: ModelType = {
- namespace: 'ssl',
- state: {},
- effects: {},
- reducers: {},
-};
-
-export default model;
diff --git a/src/pages/SSLModule/detail/index.tsx b/src/pages/SSLModule/detail/index.tsx
deleted file mode 100644
index 2c0abef..0000000
--- a/src/pages/SSLModule/detail/index.tsx
+++ /dev/null
@@ -1,129 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { Form, Input, Card, Button, notification, message } from 'antd';
-import { useIntl, history, useParams } from 'umi';
-import { useForm } from 'antd/es/form/util';
-
-import { getPageMode } from '@/utils/utils';
-import {
- fetchItem as fetchSSLItem,
- create as createSSL,
- update as updateSSL,
-} from '@/services/ssl';
-
-const layout = {
- labelCol: {
- span: 2,
- },
- wrapperCol: {
- span: 8,
- },
-};
-
-const tailLayout = {
- wrapperCol: {
- offset: 2,
- },
-};
-
-const Detail: React.FC = () => {
- const [mode] = useState<PageMode>(getPageMode());
- const { key } = useParams();
- const [form] = useForm();
- const { formatMessage } = useIntl();
-
- useEffect(() => {
- const hideLoading = message.loading(formatMessage({ id: 'component.global.loading' }), 0);
- if (mode === 'EDIT' && key) {
- fetchSSLItem(key).then((data) => {
- form.setFieldsValue(data.value);
- hideLoading();
- });
- } else {
- hideLoading();
- }
- }, [mode]);
-
- const onFinish = (values: any) => {
- const hideLoading = message.loading(formatMessage({ id: 'component.global.loading' }), 0);
- if (mode === 'EDIT' && key) {
- hideLoading();
- updateSSL(key, values).then(() => {
- notification.success({
- message: `${formatMessage({ id: 'component.global.update' })} SSL ${formatMessage({
- id: 'component.status.success',
- }).toLowerCase()}`,
- });
-
- history.goBack();
- });
- }
-
- if (mode === 'CREATE') {
- createSSL(values).then(() => {
- hideLoading();
- notification.success({
- message: `${formatMessage({ id: 'component.global.create' })} SSL ${formatMessage({
- id: 'component.status.success',
- }).toLowerCase()}`,
- });
-
- history.goBack();
- });
- }
- };
-
- return (
- <PageHeaderWrapper>
- <Card>
- <Form {...layout} form={form} onFinish={onFinish}>
- <Form.Item
- label="SNI"
- name="sni"
- rules={[
- { required: true, message: formatMessage({ id: 'component.ssl.fieldSNIInvalid' }) },
- ]}
- >
- <Input />
- </Form.Item>
-
- <Form.Item
- label="Cert"
- name="cert"
- rules={[
- { required: true, message: formatMessage({ id: 'component.ssl.fieldCertInvalid' }) },
- { min: 128, message: formatMessage({ id: 'component.ssl.fieldCertTooShort' }) },
- ]}
- >
- <Input.TextArea rows={6} />
- </Form.Item>
-
- <Form.Item
- label="Key"
- name="key"
- rules={[
- { required: true, message: formatMessage({ id: 'component.ssl.fieldKeyInvalid' }) },
- { min: 128, message: formatMessage({ id: 'component.ssl.fieldKeyTooShort' }) },
- ]}
- >
- <Input.TextArea rows={6} />
- </Form.Item>
-
- <Form.Item {...tailLayout}>
- <Button style={{ marginRight: 10 }} onClick={() => history.goBack()}>
- {formatMessage({ id: 'component.global.cancel' })}
- </Button>
-
- <Button htmlType="submit" type="primary">
- {mode === 'CREATE'
- ? formatMessage({ id: 'component.global.create' })
- : formatMessage({ id: 'component.global.save' })}
- </Button>
- </Form.Item>
- </Form>
- </Card>
- </PageHeaderWrapper>
- );
-};
-
-export default Detail;
diff --git a/src/pages/Welcome.less b/src/pages/Welcome.less
deleted file mode 100644
index 914c40d..0000000
--- a/src/pages/Welcome.less
+++ /dev/null
@@ -1,8 +0,0 @@
-@import '~antd/lib/style/themes/default.less';
-
-.pre {
- margin: 12px 0;
- padding: 12px 20px;
- background: @input-bg;
- box-shadow: @card-shadow;
-}
diff --git a/src/pages/Welcome.tsx b/src/pages/Welcome.tsx
deleted file mode 100644
index 6d7c3ea..0000000
--- a/src/pages/Welcome.tsx
+++ /dev/null
@@ -1,62 +0,0 @@
-import React from 'react';
-import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { Card, Typography, Alert } from 'antd';
-import styles from './Welcome.less';
-
-const CodePreview: React.FC<{}> = ({ children }) => (
- <pre className={styles.pre}>
- <code>
- <Typography.Text copyable>{children}</Typography.Text>
- </code>
- </pre>
-);
-
-export default (): React.ReactNode => (
- <PageHeaderWrapper>
- <Card>
- <Alert
- message="umi ui 现已发布，点击右下角 umi 图标即可使用"
- type="success"
- showIcon
- banner
- style={{
- margin: -12,
- marginBottom: 24,
- }}
- />
- <Typography.Text strong>
- <a target="_blank" rel="noopener noreferrer" href="https://pro.ant.design/docs/block">
- 基于 block 开发，快速构建标准页面
- </a>
- </Typography.Text>
- <CodePreview> npm run ui</CodePreview>
- <Typography.Text
- strong
- style={{
- marginBottom: 12,
- }}
- >
- <a
- target="_blank"
- rel="noopener noreferrer"
- href="https://pro.ant.design/docs/available-script#npm-run-fetchblocks"
- >
- 获取全部区块
- </a>
- </Typography.Text>
- <CodePreview> npm run fetch:blocks</CodePreview>
- </Card>
- <p
- style={{
- textAlign: 'center',
- marginTop: 24,
- }}
- >
- Want to add more pages? Please refer to{' '}
- <a href="https://pro.ant.design/docs/block-cn" target="_blank" rel="noopener noreferrer">
- use block
- </a>
- 。
- </p>
- </PageHeaderWrapper>
-);
diff --git a/src/pages/SSLModule/create/style.less b/src/pages/ssl/Create.less
similarity index 100%
rename from src/pages/SSLModule/create/style.less
rename to src/pages/ssl/Create.less
diff --git a/src/pages/SSLModule/create/index.tsx b/src/pages/ssl/Create.tsx
similarity index 98%
rename from src/pages/SSLModule/create/index.tsx
rename to src/pages/ssl/Create.tsx
index 2d2db9a..0ec6ff4 100644
--- a/src/pages/SSLModule/create/index.tsx
+++ b/src/pages/ssl/Create.tsx
@@ -6,7 +6,7 @@ import Step1 from './components/Step1';
import Step2 from './components/Step2';
import Step3 from './components/Step3';
import Step4 from './components/Step4';
-import styles from './style.less';
+import styles from './Create.less';
const { Step } = Steps;
diff --git a/src/pages/SSLModule/list/index.tsx b/src/pages/ssl/List.tsx
similarity index 98%
rename from src/pages/SSLModule/list/index.tsx
rename to src/pages/ssl/List.tsx
index 178c5fa..53adaef 100644
--- a/src/pages/SSLModule/list/index.tsx
+++ b/src/pages/ssl/List.tsx
@@ -4,8 +4,7 @@ import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table';
import { Button, Modal, notification, Switch } from 'antd';
import { history, useIntl } from 'umi';
import { PlusOutlined } from '@ant-design/icons';
-import { fetchList as fetchSSLList, remove as removeSSL } from '@/services/ssl';
-import { SSL } from '@/models/ssl';
+import { fetchList as fetchSSLList, remove as removeSSL } from '@/pages/ssl/service';
import { ListItem } from '@/transforms/global';
interface SearchParamsProps {
diff --git a/src/pages/SSLModule/create/components/CertificateForm/index.tsx b/src/pages/ssl/components/CertificateForm/index.tsx
similarity index 97%
rename from src/pages/SSLModule/create/components/CertificateForm/index.tsx
rename to src/pages/ssl/components/CertificateForm/index.tsx
index ef9ebbe..0cbd083 100644
--- a/src/pages/SSLModule/create/components/CertificateForm/index.tsx
+++ b/src/pages/ssl/components/CertificateForm/index.tsx
@@ -2,7 +2,7 @@ import React from 'react';
import { Form, Input } from 'antd';
import { useIntl } from 'umi';
import { FormInstance } from 'antd/lib/form';
-import { FormData } from '../..';
+import { FormData } from '../../Create';
interface CertificateFormProps {
mode: 'EDIT' | 'VIEW';
diff --git a/src/pages/SSLModule/create/components/CertificateUploader/index.tsx b/src/pages/ssl/components/CertificateUploader/index.tsx
similarity index 97%
rename from src/pages/SSLModule/create/components/CertificateUploader/index.tsx
rename to src/pages/ssl/components/CertificateUploader/index.tsx
index 9408862..aaa35d6 100644
--- a/src/pages/SSLModule/create/components/CertificateUploader/index.tsx
+++ b/src/pages/ssl/components/CertificateUploader/index.tsx
@@ -4,8 +4,8 @@ import { UploadOutlined } from '@ant-design/icons';
import { UploadFile } from 'antd/lib/upload/interface';
import { useForm } from 'antd/es/form/util';
import forge from 'node-forge';
-import { FormData } from '../..';
-import styles from '../../style.less';
+import { FormData } from '../../Create';
+import styles from '../../Create.less';
export interface AltName {
value: string;
diff --git a/src/pages/SSLModule/create/components/Step1/index.tsx b/src/pages/ssl/components/Step1/index.tsx
similarity index 94%
rename from src/pages/SSLModule/create/components/Step1/index.tsx
rename to src/pages/ssl/components/Step1/index.tsx
index bd702d4..c463d12 100644
--- a/src/pages/SSLModule/create/components/Step1/index.tsx
+++ b/src/pages/ssl/components/Step1/index.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { Form, Button, Select } from 'antd';
-import styles from '../../style.less';
-import { StepProps } from '../..';
+import styles from '../../Create.less';
+import { StepProps } from '../../Create';
const { Option } = Select;
diff --git a/src/pages/SSLModule/create/components/Step2/index.tsx b/src/pages/ssl/components/Step2/index.tsx
similarity index 98%
rename from src/pages/SSLModule/create/components/Step2/index.tsx
rename to src/pages/ssl/components/Step2/index.tsx
index f6e80b9..51c320f 100644
--- a/src/pages/SSLModule/create/components/Step2/index.tsx
+++ b/src/pages/ssl/components/Step2/index.tsx
@@ -9,7 +9,7 @@ import {
UploadType,
AltName,
} from '../CertificateUploader';
-import { StepProps } from '../..';
+import { StepProps } from '../../Create';
const Step2: React.FC<StepProps> = ({ onStepChange, onFormChange, data }) => {
const [form] = Form.useForm();
diff --git a/src/pages/SSLModule/create/components/Step3/index.tsx b/src/pages/ssl/components/Step3/index.tsx
similarity index 89%
rename from src/pages/SSLModule/create/components/Step3/index.tsx
rename to src/pages/ssl/components/Step3/index.tsx
index 8b8a3f1..e1a921c 100644
--- a/src/pages/SSLModule/create/components/Step3/index.tsx
+++ b/src/pages/ssl/components/Step3/index.tsx
@@ -1,8 +1,8 @@
import React from 'react';
import { Form, Button } from 'antd';
-import { create as createSSL } from '@/services/ssl';
+import { create as createSSL } from '@/pages/ssl/service';
import CertificateForm from '../CertificateForm';
-import { StepProps } from '../..';
+import { StepProps } from '../../Create';
const Step3: React.FC<StepProps> = ({ data, onStepChange }) => {
const [form] = Form.useForm();
diff --git a/src/pages/SSLModule/create/components/Step4/index.tsx b/src/pages/ssl/components/Step4/index.tsx
similarity index 94%
rename from src/pages/SSLModule/create/components/Step4/index.tsx
rename to src/pages/ssl/components/Step4/index.tsx
index 1a503cc..de6ac17 100644
--- a/src/pages/SSLModule/create/components/Step4/index.tsx
+++ b/src/pages/ssl/components/Step4/index.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { Result, Button } from 'antd';
import { history } from 'umi';
-import { StepProps } from '../..';
+import { StepProps } from '../../Create';
const Step4: React.FC<StepProps> = ({ onStepChange, onFormChange }) => {
return (
diff --git a/src/services/ssl.ts b/src/pages/ssl/service.ts
similarity index 66%
rename from src/services/ssl.ts
rename to src/pages/ssl/service.ts
index 4d96c6f..77e4162 100644
--- a/src/services/ssl.ts
+++ b/src/pages/ssl/service.ts
@@ -1,11 +1,11 @@
import request from '@/utils/request';
import { transformFetchListData, transformFetchItemData } from '@/transforms/global';
-import { SSL } from '@/models/ssl';
-export const fetchList = () => request('/api/ssl').then(data => transformFetchListData<SSL>(data));
+export const fetchList = () =>
+ request('/api/ssl').then((data) => transformFetchListData<SSL>(data));
export const fetchItem = (key: string) =>
- request(`/api/ssl/${key}`).then(data => transformFetchItemData<SSL>(data));
+ request(`/api/ssl/${key}`).then((data) => transformFetchItemData<SSL>(data));
export const remove = (key: string) => request.delete(`/api/ssl/${key}`);
diff --git a/src/pages/ssl/typing.d.ts b/src/pages/ssl/typing.d.ts
new file mode 100644
index 0000000..0a66d55
--- /dev/null
+++ b/src/pages/ssl/typing.d.ts
@@ -0,0 +1,5 @@
+type SSL = {
+ sni: string[];
+ cert: string;
+ key: string;
+};