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 5b60d20 feature: improve project structure and fix some problem (#172)
5b60d20 is described below
commit 5b60d20063e03d5d365bd9f4cd19065c4c8f548d
Author: bzp2010 <bzp20000...@gmail.com>
AuthorDate: Sat Apr 11 19:25:33 2020 +0800
feature: improve project structure and fix some problem (#172)
* feature: improve directory structure and change routes
feature: improve ssl edit page structure and add loading message
feature: add some i18n content
fix: ssl edit page cancel button
* fix: config/proxy.ts api target's incorrect change
* fix: change i18n contents
* fix: change edit directory to detail
* fix: change directory structure
* fix: route item
* feature: add submitting load message
* fix: format codes
---
config/config.ts | 5 +++
src/locales/en-US/component.ts | 3 ++
src/locales/zh-CN/component.ts | 3 ++
src/pages/SSLModule/detail/index.tsx | 63 ++++++++++++++++++++++++------------
src/pages/SSLModule/list/index.tsx | 2 --
5 files changed, 53 insertions(+), 23 deletions(-)
diff --git a/config/config.ts b/config/config.ts
index ca064fe..b6435b4 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -126,9 +126,14 @@ export default {
icon: 'crown',
routes: [
{
+ path: '/ssl',
+ redirect: '/ssl/list',
+ },
+ {
path: '/ssl/list',
name: 'list',
component: './SSLModule/list',
+ hideInMenu: true,
},
{
path: '/ssl/:key/edit',
diff --git a/src/locales/en-US/component.ts b/src/locales/en-US/component.ts
index 1133865..9a7fc5d 100644
--- a/src/locales/en-US/component.ts
+++ b/src/locales/en-US/component.ts
@@ -13,6 +13,7 @@ export default {
'component.global.update': 'Update',
'component.global.get': 'Get',
'component.global.edit.plugin': 'Edit plugin',
+ 'component.global.loading': 'Loading',
'component.status.success': 'Successfully',
'component.status.fail': 'Failed',
// User component
@@ -33,4 +34,6 @@ export default {
'component.ssl.fieldKeyInvalid': 'Please check Key',
'component.ssl.fieldCertInvalid': 'Please check Cert',
'component.ssl.invalidKey': 'Invalid Key',
+ 'component.ssl.fieldKeyTooShort': 'Key is too short, 128 characters at
least.',
+ 'component.ssl.fieldCertTooShort': 'Cert is too short, 128 characters at
least.',
};
diff --git a/src/locales/zh-CN/component.ts b/src/locales/zh-CN/component.ts
index 3a73156..8292d91 100644
--- a/src/locales/zh-CN/component.ts
+++ b/src/locales/zh-CN/component.ts
@@ -13,6 +13,7 @@ export default {
'component.global.update': '更新',
'component.global.get': '获取',
'component.global.edit.plugin': '编辑插件',
+ 'component.global.loading': '加载中',
'component.status.success': '成功',
'component.status.fail': '失败',
// User component
@@ -33,4 +34,6 @@ export default {
'component.ssl.fieldKeyInvalid': '请检查 Key 值',
'component.ssl.fieldCertInvalid': '请检查 Cert 值',
'component.ssl.invalidKey': '非法的 Key',
+ 'component.ssl.fieldKeyTooShort': 'Key 值过短，至少需要128位！',
+ 'component.ssl.fieldCertTooShort': 'Cert 值过短，至少需要128位！',
};
diff --git a/src/pages/SSLModule/detail/index.tsx
b/src/pages/SSLModule/detail/index.tsx
index 6cf25d9..03eb654 100644
--- a/src/pages/SSLModule/detail/index.tsx
+++ b/src/pages/SSLModule/detail/index.tsx
@@ -1,56 +1,75 @@
-import React, { useState, useEffect } from 'react';
-import { PageHeaderWrapper } from '@ant-design/pro-layout';
-import { useParams } from 'dva';
-import { Form, Input, Card, Button, notification } from 'antd';
-import { formatMessage } from 'umi-plugin-react/locale';
+import React, {useState, useEffect} from 'react';
+import {PageHeaderWrapper} from '@ant-design/pro-layout';
+import {useParams} from 'dva';
+import {Form, Input, Card, Button, notification, message} from 'antd';
+import {formatMessage} from 'umi-plugin-react/locale';
-import { getPageMode } from '@/utils/utils';
+import {getPageMode} from '@/utils/utils';
import {
fetchItem as fetchSSLItem,
create as createSSL,
update as updateSSL,
} from '@/services/ssl';
-import { useForm } from 'antd/es/form/util';
+import {useForm} from 'antd/es/form/util';
+import {router} from 'umi';
const layout = {
- wrapperCol: { span: 8 },
+ labelCol: {
+ span: 2,
+ },
+ wrapperCol: {
+ span: 8,
+ },
+};
+
+const tailLayout = {
+ wrapperCol: {
+ offset: 2,
+ },
};
const Detail: React.FC = () => {
const [mode] = useState<PageMode>(getPageMode());
- const { key } = useParams();
+ const {key} = useParams();
const [form] = useForm();
useEffect(() => {
+ let 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) => {
+ let 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({
+ message: `${formatMessage({id: 'component.global.update'})} SSL
${formatMessage({
id: 'component.status.success',
}).toLowerCase()}`,
});
- window.history.go(-1);
+ router.goBack();
});
}
if (mode === 'CREATE') {
createSSL(values).then(() => {
+ hideLoading();
notification.success({
- message: `${formatMessage({ id: 'component.global.create' })} SSL
${formatMessage({
+ message: `${formatMessage({id: 'component.global.create'})} SSL
${formatMessage({
id: 'component.status.success',
}).toLowerCase()}`,
});
- window.history.go(-1);
+ router.goBack();
});
}
};
@@ -63,7 +82,7 @@ const Detail: React.FC = () => {
label="SNI"
name="sni"
rules={[
- { required: true, message: formatMessage({ id:
'component.ssl.fieldSNIInvalid' }) },
+ {required: true, message: formatMessage({id:
'component.ssl.fieldSNIInvalid'})},
]}
>
<Input />
@@ -73,7 +92,8 @@ const Detail: React.FC = () => {
label="Cert"
name="cert"
rules={[
- { required: true, message: formatMessage({ id:
'component.ssl.fieldCertInvalid' }) },
+ {required: true, message: formatMessage({id:
'component.ssl.fieldCertInvalid'})},
+ {min: 128, message: formatMessage({id:
'component.ssl.fieldCertTooShort'})},
]}
>
<Input.TextArea rows={6} />
@@ -83,21 +103,22 @@ const Detail: React.FC = () => {
label="Key"
name="key"
rules={[
- { required: true, message: formatMessage({ id:
'component.ssl.fieldKeyInvalid' }) },
+ {required: true, message: formatMessage({id:
'component.ssl.fieldKeyInvalid'})},
+ {min: 128, message: formatMessage({id:
'component.ssl.fieldKeyTooShort'})},
]}
>
<Input.TextArea rows={6} />
</Form.Item>
- <Form.Item>
- <Button style={{ marginRight: 10 }}>
- {formatMessage({ id: 'component.global.cancel' })}
+ <Form.Item {...tailLayout}>
+ <Button style={{marginRight: 10}} onClick={() => router.goBack()}>
+ {formatMessage({id: 'component.global.cancel'})}
</Button>
<Button htmlType="submit" type="primary">
{mode === 'CREATE'
- ? formatMessage({ id: 'component.global.create' })
- : formatMessage({ id: 'component.global.save' })}
+ ? formatMessage({id: 'component.global.create'})
+ : formatMessage({id: 'component.global.save'})}
</Button>
</Form.Item>
</Form>
diff --git a/src/pages/SSLModule/list/index.tsx
b/src/pages/SSLModule/list/index.tsx
index cff1c43..89986d0 100644
--- a/src/pages/SSLModule/list/index.tsx
+++ b/src/pages/SSLModule/list/index.tsx
@@ -22,7 +22,6 @@ const List: React.FC = () => {
okButtonProps: {
type: 'danger',
},
- /* eslint-disable no-unused-expressions */
onOk: () =>
removeSSL(key).then(() => {
notification.success({
@@ -30,7 +29,6 @@ const List: React.FC = () => {
});
tableRef.current?.reload();
}),
- /* eslint-enable no-unused-expressions */
});
};
