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/10/24 01:23:50 UTC
[apisix-dashboard] branch feat-ssl created (now 9ba8264)
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a change to branch feat-ssl
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git.
at 9ba8264 feat(SSL): added SSL
This branch includes the following new commits:
new 9ba8264 feat(SSL): added SSL
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[apisix-dashboard] 01/01: feat(SSL): added SSL
Posted by ju...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch feat-ssl
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git
commit 9ba8264ce08896aeb4d6986dcef03f29c70b3ab6
Author: juzhiyuan <ju...@apache.org>
AuthorDate: Sat Oct 24 09:23:26 2020 +0800
feat(SSL): added SSL
---
src/helpers.tsx | 11 +++---
src/locales/en-US/component.ts | 17 --------
src/locales/zh-CN/component.ts | 17 --------
src/pages/SSL/Create.tsx | 9 +----
src/pages/SSL/List.tsx | 46 +++++-----------------
src/pages/SSL/components/CertificateForm/index.tsx | 6 +--
src/pages/SSL/locales/en-US.ts | 3 +-
src/pages/SSL/locales/zh-CN.ts | 5 ++-
src/pages/SSL/service.ts | 40 ++++---------------
src/pages/SSL/typing.d.ts | 28 +++++--------
10 files changed, 37 insertions(+), 145 deletions(-)
diff --git a/src/helpers.tsx b/src/helpers.tsx
index 096c85c..6956bff 100644
--- a/src/helpers.tsx
+++ b/src/helpers.tsx
@@ -34,12 +34,11 @@ export const getMenuData = (): MenuDataItem[] => {
path: '/routes/list',
icon: <IconFont type="iconroute" />,
},
- // NOTE: disable SSL module in v2.0
- // {
- // name: 'ssl',
- // path: '/ssl/list',
- // icon: <IconFont type="iconSSLshuzizhengshu" />,
- // },
+ {
+ name: 'ssl',
+ path: '/ssl/list',
+ icon: <IconFont type="iconSSLshuzizhengshu" />,
+ },
{
name: 'upstream',
path: '/upstream/list',
diff --git a/src/locales/en-US/component.ts b/src/locales/en-US/component.ts
index 12a9fc8..1864cef 100644
--- a/src/locales/en-US/component.ts
+++ b/src/locales/en-US/component.ts
@@ -59,21 +59,4 @@ export default {
// User component
'component.user.loginByPassword': 'Username & Password',
'component.user.login': 'Login',
- 'component.user.username': 'Username',
- 'component.user.password': 'Password',
- 'component.user.rememberMe': 'Remember Me',
- 'component.user.inputUsername': 'Please input username!',
- 'component.user.inputPassword': 'Please input password!',
- 'component.user.wrongUsernameOrPassword': 'Wrong account or password!',
- // SSL Module
- 'component.ssl.removeSSLItemModalContent': 'You are going to remove this item!',
- 'component.ssl.removeSSLItemModalTitle': 'SSL Remove Alert',
- 'component.ssl.fetchSSLListSuccess': 'Fetch SSL list successfully',
- 'component.ssl.removeSSLSuccess': 'Remove target SSL successfully',
- 'component.ssl.fieldSNIInvalid': 'Please check SNI',
- '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 e807c15..a074362 100644
--- a/src/locales/zh-CN/component.ts
+++ b/src/locales/zh-CN/component.ts
@@ -55,21 +55,4 @@ export default {
// User component
'component.user.loginByPassword': '账号密码登录',
'component.user.login': '登录',
- 'component.user.username': '账号',
- 'component.user.password': '密码',
- 'component.user.rememberMe': '自动登录',
- 'component.user.inputUsername': '请输入账号！',
- 'component.user.inputPassword': '请输入密码！',
- 'component.user.wrongUsernameOrPassword': '账号或密码错误！',
- // SSL Module
- 'component.ssl.removeSSLItemModalContent': '确定要删除该项吗？',
- 'component.ssl.removeSSLItemModalTitle': '删除 SSL',
- 'component.ssl.fetchSSLListSuccess': '获取 SSL 列表成功',
- 'component.ssl.removeSSLSuccess': '删除 SSL 成功',
- 'component.ssl.fieldSNIInvalid': '请检查 SNI 值',
- '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/SSL/Create.tsx b/src/pages/SSL/Create.tsx
index 01b64a2..395bff1 100644
--- a/src/pages/SSL/Create.tsx
+++ b/src/pages/SSL/Create.tsx
@@ -15,7 +15,7 @@
* limitations under the License.
*/
import React, { useState } from 'react';
-import { Card, Steps, notification, Form } from 'antd';
+import { Card, Steps, Form } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import moment from 'moment';
import { history, useIntl } from 'umi';
@@ -48,13 +48,6 @@ const Page: React.FC = (props) => {
expireTime: moment.unix(Number(data.validity_end)).format('YYYY-MM-DD HH:mm:ss'),
});
setStep(2);
- })
- .catch(() => {
- notification.warning({
- message: `${formatMessage({ id: 'component.global.pleaseCheck' })}${formatMessage({
- id: 'page.ssl.form.itemLabel.cert',
- })}`,
- });
});
};
diff --git a/src/pages/SSL/List.tsx b/src/pages/SSL/List.tsx
index 7517c1c..182ca5e 100644
--- a/src/pages/SSL/List.tsx
+++ b/src/pages/SSL/List.tsx
@@ -17,40 +17,25 @@
import React, { useRef, useState } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table';
-import { Button, Switch, Popconfirm, notification, Tag, Input } from 'antd';
+import { Button, Popconfirm, notification, Tag, Input } from 'antd';
import { useIntl, history } from 'umi';
import { PlusOutlined } from '@ant-design/icons';
import moment from 'moment';
-import { fetchList as fetchSSLList, remove as removeSSL, switchEnable } from '@/pages/SSL/service';
+import { fetchList as fetchSSLList, remove as removeSSL } from '@/pages/SSL/service';
const Page: React.FC = () => {
- const [search, setSearch] = useState('');
+ const [, setSearch] = useState('');
const tableRef = useRef<ActionType>();
const { formatMessage } = useIntl();
- const onEnableChange = (id: string, checked: boolean) => {
- switchEnable(id, checked)
- .then(() => {
- notification.success({
- message: formatMessage({
- id: 'page.ssl.notification.updateCertEnableStatusSuccessfully',
- }),
- });
- })
- .catch(() => {
- /* eslint-disable no-unused-expressions */
- tableRef.current?.reload();
- });
- };
-
- const columns: ProColumns<SSLModule.ResSSL>[] = [
+ const columns: ProColumns<SSLModule.ResponseBody>[] = [
{
title: 'SNI',
dataIndex: 'sni',
render: (_, record) => {
- return record.snis.map((sni) => (
+ return (record.snis || []).map((sni) => (
<Tag color="geekblue" key={sni}>
{sni}
</Tag>
@@ -64,19 +49,6 @@ const Page: React.FC = () => {
render: (text) => `${moment.unix(Number(text)).format('YYYY-MM-DD HH:mm:ss')}`,
},
{
- title: formatMessage({ id: 'page.ssl.list.ifEnable' }),
- dataIndex: 'status',
- hideInSearch: true,
- render: (text, record) => (
- <Switch
- defaultChecked={Number(text) === 1}
- onChange={(checked: boolean) => {
- onEnableChange(record.id, checked);
- }}
- />
- ),
- },
- {
title: formatMessage({ id: 'component.global.updateTime' }),
dataIndex: 'update_time',
hideInSearch: true,
@@ -97,7 +69,7 @@ const Page: React.FC = () => {
{formatMessage({ id: 'component.global.edit' })}
</Button>
<Popconfirm
- title={formatMessage({ id: 'component.global.delete' })}
+ title={formatMessage({ id: 'component.ssl.removeSSLItemModalContent' })}
onConfirm={() =>
removeSSL(record.id).then(() => {
notification.success({
@@ -111,7 +83,7 @@ const Page: React.FC = () => {
okText={formatMessage({ id: 'component.global.confirm' })}
>
<Button type="primary" danger>
- {formatMessage({ id: 'component.global.remove' })}
+ {formatMessage({ id: 'component.global.delete' })}
</Button>
</Popconfirm>
</>
@@ -131,12 +103,12 @@ const Page: React.FC = () => {
id: 'component.global.list',
})}`}
>
- <ProTable<SSLModule.ResSSL>
+ <ProTable<SSLModule.ResponseBody>
search={false}
rowKey="id"
columns={columns}
actionRef={tableRef}
- request={(params) => fetchSSLList(params, search)}
+ request={() => fetchSSLList()}
toolBarRender={(action) => [
<Input.Search
placeholder={formatMessage({ id: 'component.global.pleaseEnter' })}
diff --git a/src/pages/SSL/components/CertificateForm/index.tsx b/src/pages/SSL/components/CertificateForm/index.tsx
index a0a4b26..0e667eb 100644
--- a/src/pages/SSL/components/CertificateForm/index.tsx
+++ b/src/pages/SSL/components/CertificateForm/index.tsx
@@ -75,11 +75,7 @@ const CertificateForm: React.FC<CertificateFormProps> = ({ mode, form }) => {
},
]}
>
- <Input.TextArea
- rows={6}
- disabled={mode !== 'EDIT'}
- placeholder={formatMessage({ id: 'page.ssl.textAreaPlaceholder.cert' })}
- />
+ <Input.TextArea rows={6} disabled={mode !== 'EDIT'} />
</Form.Item>
<Form.Item
label={formatMessage({ id: 'page.ssl.form.itemLabel.privateKey' })}
diff --git a/src/pages/SSL/locales/en-US.ts b/src/pages/SSL/locales/en-US.ts
index c80b97d..884fbaa 100644
--- a/src/pages/SSL/locales/en-US.ts
+++ b/src/pages/SSL/locales/en-US.ts
@@ -22,7 +22,6 @@ export default {
'page.ssl.form.itemLabel.privateKey': 'Private Key',
'page.ssl.form.itemRuleMessage.privateKeyLength':
'The Private Key requires at least 128 characters',
- 'page.ssl.textAreaPlaceholder.cert': 'Please enter the SSL Certificate Content',
'page.ssl.button.uploadCert': 'Upload Certificate',
@@ -39,4 +38,6 @@ export default {
'page.ssl.list.ifEnable': 'If Enable',
'page.ssl.list.periodOfValidity': 'Period Of Validity',
'page.ssl.steps.stepTitle.completeCertInfo': 'Complete Certificate Information',
+ 'component.ssl.removeSSLSuccess': 'Remove target SSL successfully',
+ 'component.ssl.removeSSLItemModalContent': 'You are going to remove this item!',
};
diff --git a/src/pages/SSL/locales/zh-CN.ts b/src/pages/SSL/locales/zh-CN.ts
index 232c80a..c9a82b1 100644
--- a/src/pages/SSL/locales/zh-CN.ts
+++ b/src/pages/SSL/locales/zh-CN.ts
@@ -16,11 +16,10 @@
*/
export default {
'page.ssl.form.itemLabel.expireTime': '过期时间',
- 'page.ssl.form.itemLabel.cert': '证书内容',
+ 'page.ssl.form.itemLabel.cert': '证书',
'page.ssl.form.itemRuleMessage.certValueLength': '证书内容至少需要128个字符',
'page.ssl.form.itemLabel.privateKey': '私钥',
'page.ssl.form.itemRuleMessage.privateKeyLength': '私钥 至少需要128个字符',
- 'page.ssl.textAreaPlaceholder.cert': '请填写SSL证书内容',
'page.ssl.button.uploadCert': '上传证书',
@@ -35,4 +34,6 @@ export default {
'page.ssl.list.ifEnable': '是否启用',
'page.ssl.list.periodOfValidity': '有效期',
'page.ssl.steps.stepTitle.completeCertInfo': '完善证书信息',
+ 'component.ssl.removeSSLSuccess': '删除 SSL 成功',
+ 'component.ssl.removeSSLItemModalContent': '确定要删除该证书吗？',
};
diff --git a/src/pages/SSL/service.ts b/src/pages/SSL/service.ts
index 5513b88..2e65a0b 100644
--- a/src/pages/SSL/service.ts
+++ b/src/pages/SSL/service.ts
@@ -15,61 +15,35 @@
* limitations under the License.
*/
import { request } from 'umi';
-import querystring from 'querystring';
-import { identity, pickBy, omit } from 'lodash';
-export const fetchList = (
- { current = 1, pageSize = 10, ...props }: SSLModule.FetchListParams,
- search: string,
-) => {
- const [expire_start, expire_end] = (props.expire_range || '').split(':');
- let queryObj = omit(props, 'expire_range', '_timestamp');
- queryObj = pickBy({ ...queryObj, expire_start, expire_end, sni: search }, identity);
- const query = querystring.encode(queryObj);
- return request<{ count: number; list: SSLModule.ResSSL[] }>(
- `/ssl?page=${current}&page_size=${pageSize}&${query}`,
- ).then((data) => {
+export const fetchList = () => {
+ return request<Res<ResListData<SSLModule.ResponseBody>>>(`/ssl`).then(({ data }) => {
return {
- total: data.count,
- data: data.list.map((item) => ({
- ...item,
- sni: item.snis.join(';'),
- })),
+ total: data.total_size,
+ data: data.rows,
};
});
};
export const remove = (id: string) =>
- request(`/ssls/${id}`, {
+ request(`/ssl/${id}`, {
method: 'DELETE',
});
export const create = (data: SSLModule.SSL) =>
- request('/ssls', {
+ request('/ssl', {
method: 'POST',
data,
});
-/**
- * 1. 校验证书是否匹配
- * 2. 解析公钥内容
- * */
export const verifyKeyPaire = (cert = '', key = ''): Promise<SSLModule.VerifyKeyPaireProps> =>
request('/check_ssl_cert', {
method: 'POST',
data: { cert, key },
});
-export const switchEnable = (id: string, checked: boolean) =>
- request(`/ssls/${id}`, {
- method: 'PATCH',
- data: {
- status: Number(checked),
- },
- });
-
export const update = (id: string, data: SSLModule.SSL) =>
- request(`/ssls/${id}`, {
+ request(`/ssl/${id}`, {
method: 'PUT',
data,
});
diff --git a/src/pages/SSL/typing.d.ts b/src/pages/SSL/typing.d.ts
index 652a436..985e305 100644
--- a/src/pages/SSL/typing.d.ts
+++ b/src/pages/SSL/typing.d.ts
@@ -21,17 +21,6 @@ declare namespace SSLModule {
key: string;
};
- type ResSSL = {
- id: string;
- create_time: number;
- update_time: number;
- validity_start: number;
- validity_end: number;
- status: number;
- snis: string[];
- public_key: string;
- };
-
type UploadPublicSuccessData = {
cert: string;
publicKeyList: UploadFile[];
@@ -56,13 +45,14 @@ declare namespace SSLModule {
};
};
- type FetchListParams = {
- current?: number;
- pageSize?: number;
- sni?: string;
- expire_range?: string;
- expire_start?: number;
- expire_end?: number;
- status?: 0;
+ type ResponseBody = {
+ id: string;
+ cert: string;
+ create_time: number;
+ snis: string[];
+ status: number;
+ update_time: number;
+ validity_start: number;
+ validity_end: number;
};
}