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/07/24 06:10:57 UTC
[incubator-apisix-dashboard] branch master updated: i18n ssl (#335)
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-apisix-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new 72afe3a i18n ssl (#335)
72afe3a is described below
commit 72afe3ab5967d65a25be88e6bbd0907a3b60aec2
Author: TikWind <65...@users.noreply.github.com>
AuthorDate: Fri Jul 24 14:10:47 2020 +0800
i18n ssl (#335)
---
src/pages/SSL/Create.tsx | 8 +++--
src/pages/SSL/List.tsx | 26 +++++++--------
src/pages/SSL/components/CertificateForm/index.tsx | 14 ++++----
.../SSL/components/CertificateUploader/index.tsx | 6 ++--
src/pages/SSL/components/Step1/index.tsx | 13 +++++---
src/pages/SSL/locales/en-US.ts | 37 ++++++++++++++++++++++
src/pages/SSL/locales/zh-CN.ts | 37 ++++++++++++++++++++++
7 files changed, 111 insertions(+), 30 deletions(-)
diff --git a/src/pages/SSL/Create.tsx b/src/pages/SSL/Create.tsx
index 7ffe351..27e26ae 100644
--- a/src/pages/SSL/Create.tsx
+++ b/src/pages/SSL/Create.tsx
@@ -2,6 +2,7 @@ import React, { useState } from 'react';
import { Card, Steps, notification, Form } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import moment from 'moment';
+import { useIntl } from 'umi';
import ActionBar from '@/components/ActionBar';
import { history } from 'umi';
@@ -14,6 +15,7 @@ const Page: React.FC = (props) => {
const [step, setStep] = useState(1);
const [form] = Form.useForm();
const { id } = (props as any).match.params;
+ const { formatMessage } = useIntl();
const onValidateForm = () => {
let keyPaire = { cert: '', key: '' };
@@ -33,7 +35,7 @@ const Page: React.FC = (props) => {
setStep(2);
})
.catch(() => {
- notification.warning({ message: '请检查证书内容' });
+ notification.warning({ message: formatMessage({ id: 'ssl.create.check' }) });
});
};
@@ -60,10 +62,10 @@ const Page: React.FC = (props) => {
return (
<>
- <PageHeaderWrapper title="证书创建">
+ <PageHeaderWrapper title={formatMessage({ id: 'ssl.create' })}>
<Card bordered={false}>
<Steps current={step - 1} className={styles.steps}>
- {['完善证书信息', '预览'].map((item) => (
+ {[formatMessage({ id: 'ssl.create.complete.cert.info' }), formatMessage({ id: 'ssl.create.preview' })].map((item) => (
<Steps.Step title={item} key={item} />
))}
</Steps>
diff --git a/src/pages/SSL/List.tsx b/src/pages/SSL/List.tsx
index 44ae420..b8e471e 100644
--- a/src/pages/SSL/List.tsx
+++ b/src/pages/SSL/List.tsx
@@ -17,7 +17,7 @@ const Page: React.FC = () => {
const onEnableChange = (id: string, checked: boolean) => {
switchEnable(id, checked)
.then(() => {
- notification.success({ message: '更新证书启用状态成功' });
+ notification.success({ message: formatMessage({ id: 'ssl.list.update.cert.enable.status.successful' }) });
})
.catch(() => {
/* eslint-disable no-unused-expressions */
@@ -38,13 +38,13 @@ const Page: React.FC = () => {
},
},
{
- title: '过期时间',
+ title: formatMessage({ id: 'ssl.list.expiration.time' }),
dataIndex: 'validity_end',
hideInSearch: true,
render: (text) => `${moment.unix(Number(text)).format('YYYY-MM-DD HH:mm:ss')}`,
},
{
- title: '是否启用',
+ title: formatMessage({ id: 'ssl.list.if.enable' }),
dataIndex: 'status',
hideInSearch: true,
render: (text, record) => (
@@ -57,13 +57,13 @@ const Page: React.FC = () => {
),
},
{
- title: '更新时间',
+ title: formatMessage({ id: 'ssl.list.update.time' }),
dataIndex: 'update_time',
hideInSearch: true,
render: (text) => `${moment.unix(Number(text)).format('YYYY-MM-DD HH:mm:ss')}`,
},
{
- title: formatMessage({ id: 'component.global.action' }),
+ title: formatMessage({ id: 'ssl.list.operation' }),
valueType: 'option',
render: (_, record) => (
<>
@@ -74,10 +74,10 @@ const Page: React.FC = () => {
}}
style={{ marginRight: 10 }}
>
- 编辑
+ {formatMessage({ id: 'ssl.list.edit' })}
</Button>
<Popconfirm
- title="删除"
+ title={formatMessage({ id: 'ssl.list.delete' })}
onConfirm={() =>
removeSSL(record.id).then(() => {
notification.success({
@@ -87,8 +87,8 @@ const Page: React.FC = () => {
requestAnimationFrame(() => tableRef.current?.reload());
})
}
- cancelText="取消"
- okText="确定"
+ cancelText={formatMessage({ id: 'ssl.list.cancel' })}
+ okText={formatMessage({ id: 'ssl.list.confirm' })}
>
<Button type="primary" danger>
{formatMessage({ id: 'component.global.remove' })}
@@ -98,7 +98,7 @@ const Page: React.FC = () => {
),
},
{
- title: '有效期',
+ title: formatMessage({ id: 'ssl.list.period.of.validity' }),
dataIndex: 'expire_range',
hideInTable: true,
hideInSearch: true,
@@ -106,7 +106,7 @@ const Page: React.FC = () => {
];
return (
- <PageHeaderWrapper title="证书列表">
+ <PageHeaderWrapper title={formatMessage({ id: 'ssl.list' })}>
<ProTable<SSLModule.ResSSL>
search={false}
rowKey="id"
@@ -115,7 +115,7 @@ const Page: React.FC = () => {
request={(params) => fetchSSLList(params, search)}
toolBarRender={(action) => [
<Input.Search
- placeholder="请输入"
+ placeholder={formatMessage({ id: 'ssl.list.input' })}
onSearch={(value) => {
setSearch(value);
action.setPageInfo({ page: 1 });
@@ -124,7 +124,7 @@ const Page: React.FC = () => {
/>,
<Button type="primary" onClick={() => history.push(`/ssl/create`)}>
<PlusOutlined />
- {formatMessage({ id: 'component.global.create' })}
+ {formatMessage({ id: 'ssl.list.create' })}
</Button>,
]}
/>
diff --git a/src/pages/SSL/components/CertificateForm/index.tsx b/src/pages/SSL/components/CertificateForm/index.tsx
index d0178d0..cec7973 100644
--- a/src/pages/SSL/components/CertificateForm/index.tsx
+++ b/src/pages/SSL/components/CertificateForm/index.tsx
@@ -29,7 +29,7 @@ const CertificateForm: React.FC<CertificateFormProps> = ({ mode, form }) => {
if (mode === 'VIEW') {
return (
<Form.Item
- label="过期时间"
+ label={formatMessage({ id: 'ssl.form.expiration.time' })}
name="expireTime"
rules={[{ required: true, message: 'ExpireTime' }]}
>
@@ -44,21 +44,21 @@ const CertificateForm: React.FC<CertificateFormProps> = ({ mode, form }) => {
<Form form={form} layout="horizontal" initialValues={form?.getFieldsValue()}>
{renderSNI()}
<Form.Item
- label="公钥"
+ label={formatMessage({ id: 'ssl.form.public.key' })}
name="cert"
rules={[
- { required: true, message: formatMessage({ id: 'component.ssl.fieldCertInvalid' }) },
- { min: 128, message: formatMessage({ id: 'component.ssl.fieldCertTooShort' }) },
+ { required: true, message: formatMessage({ id: 'ssl.form.check.cert.value' }) },
+ { min: 128, message: formatMessage({ id: 'ssl.form.cert.value.length' }) },
]}
>
<Input.TextArea rows={6} disabled={mode !== 'EDIT'} />
</Form.Item>
<Form.Item
- label="私钥"
+ label={formatMessage({ id: 'ssl.form.private.key' })}
name="key"
rules={[
- { required: true, message: formatMessage({ id: 'component.ssl.fieldKeyInvalid' }) },
- { min: 128, message: formatMessage({ id: 'component.ssl.fieldKeyTooShort' }) },
+ { required: true, message: formatMessage({ id: 'ssl.form.check.key.value' }) },
+ { min: 128, message: formatMessage({ id: 'ssl.form.key.value.length' }) },
]}
>
<Input.TextArea rows={6} disabled={mode !== 'EDIT'} />
diff --git a/src/pages/SSL/components/CertificateUploader/index.tsx b/src/pages/SSL/components/CertificateUploader/index.tsx
index 41d5570..132eade 100644
--- a/src/pages/SSL/components/CertificateUploader/index.tsx
+++ b/src/pages/SSL/components/CertificateUploader/index.tsx
@@ -3,6 +3,7 @@ import { Form, Button, Upload } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import { UploadFile } from 'antd/lib/upload/interface';
import styles from '@/pages/SSL/style.less';
+import { useIntl } from 'umi';
export type UploadType = 'PUBLIC_KEY' | 'PRIVATE_KEY';
@@ -18,6 +19,7 @@ interface UploaderProps {
const CertificateUploader: React.FC<UploaderProps> = ({ onSuccess, onRemove, data }) => {
const { publicKeyList = [], privateKeyList = [] } = data;
const [form] = Form.useForm();
+ const { formatMessage } = useIntl();
const genUploadFile = (name = ''): UploadFile => {
return {
@@ -66,7 +68,7 @@ const CertificateUploader: React.FC<UploaderProps> = ({ onSuccess, onRemove, dat
beforeUpload={(file, fileList) => beforeUpload(file, fileList, 'PUBLIC_KEY')}
>
<Button disabled={publicKeyList.length === 1}>
- <UploadOutlined /> 点击上传公钥
+ <UploadOutlined /> {formatMessage({ id: 'ssl.upload.public.key' })}
</Button>
</Upload>
</Form.Item>
@@ -78,7 +80,7 @@ const CertificateUploader: React.FC<UploaderProps> = ({ onSuccess, onRemove, dat
beforeUpload={(file, fileList) => beforeUpload(file, fileList, 'PRIVATE_KEY')}
>
<Button disabled={privateKeyList.length === 1}>
- <UploadOutlined /> 点击上传私钥
+ <UploadOutlined /> {formatMessage({ id: 'ssl.upload.private.key' })}
</Button>
</Upload>
</Form.Item>
diff --git a/src/pages/SSL/components/Step1/index.tsx b/src/pages/SSL/components/Step1/index.tsx
index 3713805..1e43e4d 100644
--- a/src/pages/SSL/components/Step1/index.tsx
+++ b/src/pages/SSL/components/Step1/index.tsx
@@ -2,6 +2,7 @@ import React, { useState } from 'react';
import { Form, Select } from 'antd';
import { UploadFile } from 'antd/lib/upload/interface';
import { FormInstance } from 'antd/es/form';
+import { useIntl } from 'umi';
import CertificateForm from '@/pages/SSL/components/CertificateForm';
import CertificateUploader, { UploadType } from '@/pages/SSL/components/CertificateUploader';
@@ -18,6 +19,8 @@ const Step: React.FC<Props> = ({ form }) => {
const [createType, setCreateType] = useState<CreateType>('Input');
+ const { formatMessage } = useIntl();
+
const onRemove = (type: UploadType) => {
if (type === 'PUBLIC_KEY') {
form.setFieldsValue({
@@ -34,14 +37,14 @@ const Step: React.FC<Props> = ({ form }) => {
return (
<>
<Form.Item
- label="方式"
+ label={formatMessage({ id: 'ssl.step.way' })}
required
extra={
- window.location.pathname.indexOf('edit') === -1 ? '' : '新证书所含 SNI 应与当前证书一致'
+ window.location.pathname.indexOf('edit') === -1 ? '' : formatMessage({ id: 'ssl.step.rules' })
}
>
<Select
- placeholder="请选择创建方式"
+ placeholder={formatMessage({ id: 'ssl.step.select.create.ways' })}
defaultValue="Input"
onChange={(value: CreateType) => {
form.setFieldsValue({
@@ -54,8 +57,8 @@ const Step: React.FC<Props> = ({ form }) => {
}}
style={{ width: 100 }}
>
- <Select.Option value="Input">手动输入</Select.Option>
- <Select.Option value="Upload">上传证书</Select.Option>
+ <Select.Option value="Input">{formatMessage({ id: 'ssl.step.input' })}</Select.Option>
+ <Select.Option value="Upload">{formatMessage({ id: 'ssl.step.upload' })}</Select.Option>
</Select>
</Form.Item>
<div style={createType === 'Input' ? {} : { display: 'none' }}>
diff --git a/src/pages/SSL/locales/en-US.ts b/src/pages/SSL/locales/en-US.ts
new file mode 100644
index 0000000..b7d6ca4
--- /dev/null
+++ b/src/pages/SSL/locales/en-US.ts
@@ -0,0 +1,37 @@
+export default {
+ 'ssl.form.expiration.time':'Expiration Time',
+ 'ssl.form.public.key':'Public Key',
+ 'ssl.form.check.cert.value': 'Please check Cert value',
+ 'ssl.form.cert.value.length': 'The Cert value requires at least 128 characters',
+ 'ssl.form.private.key':'Private Key',
+ 'ssl.form.check.key.value': 'Please check Key value',
+ 'ssl.form.key.value.length': 'The Key value requires at least 128 characters',
+
+ 'ssl.upload.public.key':'Upload Public Key',
+ 'ssl.upload.private.key':'Upload Private Key',
+
+ 'ssl.step.way':'Way',
+ 'ssl.step.rules':'The new certificate should contain the same about SNI as the current certificate',
+ 'ssl.step.select.create.ways':'Please select create ways',
+ 'ssl.step.input':'Input',
+ 'ssl.step.upload':'Upload',
+
+ 'ssl.create.check':'Please check certificate content',
+ 'ssl.create':'Create Certificate',
+ 'ssl.create.complete.cert.info':'Complete Certificate Information',
+ 'ssl.create.preview':'Preview',
+
+ 'ssl.list.update.cert.enable.status.successfully':'Update certificate enable status successfully',
+ 'ssl.list.expiration.time':'Expiration Time',
+ 'ssl.list.if.enable':'If Enable',
+ 'ssl.list.update.time':'Update Time',
+ 'ssl.list.operation': 'Operation',
+ 'ssl.list.edit':'Edit',
+ 'ssl.list.delete':'Delete',
+ 'ssl.list.cancel':'Cancle',
+ 'ssl.list.confirm':'Confirm',
+ 'ssl.list.period.of.validity':'Period Of Validity',
+ 'ssl.list':'Certificate List',
+ 'ssl.list.input':'Please input',
+ 'ssl.list.create': 'Create',
+};
diff --git a/src/pages/SSL/locales/zh-CN.ts b/src/pages/SSL/locales/zh-CN.ts
new file mode 100644
index 0000000..f78549d
--- /dev/null
+++ b/src/pages/SSL/locales/zh-CN.ts
@@ -0,0 +1,37 @@
+export default {
+ 'ssl.form.expiration.time':'过期时间',
+ 'ssl.form.public.key':'公钥',
+ 'ssl.form.check.cert.value': '请检查 Cert 值',
+ 'ssl.form.cert.value.length': 'Cert 值至少需要128个字符',
+ 'ssl.form.private.key':'私钥',
+ 'ssl.form.check.key.value': '请检查 Key 值',
+ 'ssl.form.key.value.length': 'Key 值至少需要128个字符',
+
+ 'ssl.upload.public.key':'上传公钥',
+ 'ssl.upload.private.key':'上传私钥',
+
+ 'ssl.step.way':'方式',
+ 'ssl.step.rules':'新证书所含 SNI 应与当前证书一致',
+ 'ssl.step.select.create.ways':'请选择创建方式',
+ 'ssl.step.input':'输入',
+ 'ssl.step.upload':'上传',
+
+ 'ssl.create.check':'请检查证书内容',
+ 'ssl.create':'证书创建',
+ 'ssl.create.complete.cert.info':'完善证书信息',
+ 'ssl.create.preview':'预览',
+
+ 'ssl.list.update.cert.enable.status.successful':'更新证书启用状态成功',
+ 'ssl.list.expiration.time':'过期时间',
+ 'ssl.list.if.enable':'是否启用',
+ 'ssl.list.update.time':'更新时间',
+ 'ssl.list.operation': '操作',
+ 'ssl.list.edit':'编辑',
+ 'ssl.list.delete':'删除',
+ 'ssl.list.cancel':'取消',
+ 'ssl.list.confirm':'确定',
+ 'ssl.list.period.of.validity':'有效期',
+ 'ssl.list':'证书列表',
+ 'ssl.list.input':'请输入',
+ 'ssl.list.create': '创建',
+};