From 2e107ceb04c1d705a9fce869f6e81224193626ba Mon Sep 17 00:00:00 2001 From: wanganjuan Date: Wed, 2 Mar 2022 16:02:47 +0800 Subject: [PATCH] feat: support i18n for more languages (#352) * i18n for basic ui comment * i18n for built-in text, such as confirmation, cancellation, etc * fix style: 1) the menu is not centered 2) style of vertex/edge manipulation * add additional json configuration and the replacement example --- hubble-fe/src/components/common/AppBar.less | 8 + hubble-fe/src/components/common/AppBar.tsx | 34 +- .../graph-management/GraphManagementList.tsx | 6 +- .../edge-type/EdgeTypeList.tsx | 36 +- .../edge-type/NewEdgeType.tsx | 26 +- .../graph-view/CheckAndEditVertex.tsx | 14 +- .../graph-view/CreateEdge.tsx | 26 +- .../graph-view/CreateVertex.tsx | 10 +- .../vertex-type/NewVertexType.tsx | 10 +- .../vertex-type/VertexTypeList.tsx | 14 +- hubble-fe/src/i18n/index.ts | 7 +- .../en-US/graph-managment/AsyncTasks.json | 64 ++++ .../GraphManagementSidebar.json | 5 + .../en-US/graph-managment/addition.json | 10 + .../en-US/graph-managment/common.json | 5 + .../data-import/import-tasks/ImportTasks.json | 342 ++++++++++++++++++ .../en-US/graph-managment/dataAnalyze.json | 287 +++++++++++++++ .../resources/en-US/graph-managment/index.ts | 15 + hubble-fe/src/i18n/resources/en-US/index.ts | 22 ++ hubble-fe/src/i18n/resources/index.ts | 3 +- .../GraphManagementSidebar.json | 2 +- .../zh-CN/graph-managment/addition.json | 10 + .../resources/zh-CN/graph-managment/index.ts | 4 +- hubble-fe/src/i18n/resources/zh-CN/index.ts | 6 +- hubble-fe/src/index.less | 5 + hubble-fe/src/index.tsx | 14 +- 26 files changed, 849 insertions(+), 136 deletions(-) create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/AsyncTasks.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/GraphManagementSidebar.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/addition.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/common.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/data-import/import-tasks/ImportTasks.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/dataAnalyze.json create mode 100644 hubble-fe/src/i18n/resources/en-US/graph-managment/index.ts create mode 100644 hubble-fe/src/i18n/resources/en-US/index.ts create mode 100644 hubble-fe/src/i18n/resources/zh-CN/graph-managment/addition.json diff --git a/hubble-fe/src/components/common/AppBar.less b/hubble-fe/src/components/common/AppBar.less index 495899535..b935c8442 100644 --- a/hubble-fe/src/components/common/AppBar.less +++ b/hubble-fe/src/components/common/AppBar.less @@ -68,3 +68,11 @@ color: #505f73; } } + +// i18n style start +.i18n-box { + position: absolute; + top: 19px; + right: 20px +} +// i18n style end diff --git a/hubble-fe/src/components/common/AppBar.tsx b/hubble-fe/src/components/common/AppBar.tsx index 6267f3701..27e5a0da2 100644 --- a/hubble-fe/src/components/common/AppBar.tsx +++ b/hubble-fe/src/components/common/AppBar.tsx @@ -1,19 +1,31 @@ -import React, { useCallback } from 'react'; +import React, { useCallback, useState } from 'react'; import { observer } from 'mobx-react'; import { useLocation } from 'wouter'; - +import { useTranslation } from 'react-i18next' +import { Select } from 'antd'; import './AppBar.less'; +const { Option } = Select; const AppBar: React.FC = observer(() => { const [_, setLocation] = useLocation(); - + // init select language + const [languageType, setLanguageType] = useState(localStorage.getItem('languageType') || 'zh-CN') + const { t } = useTranslation() const setRoute = useCallback( (route: string) => () => { setLocation(route); }, [setLocation] ); - + /** + * switch language and update localStorage + */ + const i18Change = (e: string) => { + localStorage.setItem('languageType', e) + setLanguageType(e) + // Refresh directly or through react.createcontext implements no refresh switching + window.location.reload() + } return ( ); }); diff --git a/hubble-fe/src/components/graph-management/GraphManagementList.tsx b/hubble-fe/src/components/graph-management/GraphManagementList.tsx index 3863088d5..70951b263 100644 --- a/hubble-fe/src/components/graph-management/GraphManagementList.tsx +++ b/hubble-fe/src/components/graph-management/GraphManagementList.tsx @@ -24,6 +24,7 @@ import Highlighter from 'react-highlight-words'; import { GraphManagementStoreContext } from '../../stores'; import HintIcon from '../../assets/imgs/ic_question_mark.svg'; import { GraphData } from '../../stores/types/GraphManagementStore/graphManagementStore'; +import { useTranslation } from 'react-i18next' const dropdownList = [ { @@ -144,6 +145,7 @@ const GraphManagementListItem: React.FC< index: number; } > = observer(({ id, name, graph, host, port, enabled, create_time, index }) => { + const {t} = useTranslation() const graphManagementStore = useContext(GraphManagementStoreContext); const [_, setLocation] = useLocation(); const [isEditing, setEditingState] = useState(false); @@ -290,7 +292,7 @@ const GraphManagementListItem: React.FC< />
- 端口号: + {t('addition.graph-list.port')}:
-
端口号
+
{t('addition.graph-list.port')}
{port}
diff --git a/hubble-fe/src/components/graph-management/metadata-configs/edge-type/EdgeTypeList.tsx b/hubble-fe/src/components/graph-management/metadata-configs/edge-type/EdgeTypeList.tsx index b250b9101..ebde7d013 100644 --- a/hubble-fe/src/components/graph-management/metadata-configs/edge-type/EdgeTypeList.tsx +++ b/hubble-fe/src/components/graph-management/metadata-configs/edge-type/EdgeTypeList.tsx @@ -664,19 +664,7 @@ const EdgeTypeList: React.FC = observer(() => { disabled={!isEditEdge} prefixCls="new-fc-one-select-another" dropdownMatchSelectWidth={false} - value={ -
- } + value={edgeTypeStore.editedSelectedEdgeType.style.color} onChange={(value: string) => { edgeTypeStore.mutateEditedSelectedEdgeType({ ...edgeTypeStore.editedSelectedEdgeType, @@ -747,28 +735,12 @@ const EdgeTypeList: React.FC = observer(() => { size="medium" showSearch={false} disabled={!isEditEdge} - value={ - ( - edgeTypeStore.editedSelectedEdgeType.style - .with_arrow !== null - ? edgeTypeStore.editedSelectedEdgeType.style - .with_arrow - : edgeTypeStore.selectedEdgeType!.style.with_arrow - ) ? ( -
- -
- ) : ( -
- -
- ) - } + value={edgeTypeStore.editedSelectedEdgeType.style.with_arrow} onChange={(e: any) => { edgeTypeStore.mutateEditedSelectedEdgeType({ ...edgeTypeStore.editedSelectedEdgeType, style: { - with_arrow: e[0] && e[1] === 'solid', + with_arrow: e, color: edgeTypeStore.editedSelectedEdgeType.style .color !== null @@ -795,7 +767,7 @@ const EdgeTypeList: React.FC = observer(() => { > {edgeTypeStore.edgeShapeSchemas.map((item, index) => ( diff --git a/hubble-fe/src/components/graph-management/metadata-configs/edge-type/NewEdgeType.tsx b/hubble-fe/src/components/graph-management/metadata-configs/edge-type/NewEdgeType.tsx index 037a26ec7..5739e07cc 100644 --- a/hubble-fe/src/components/graph-management/metadata-configs/edge-type/NewEdgeType.tsx +++ b/hubble-fe/src/components/graph-management/metadata-configs/edge-type/NewEdgeType.tsx @@ -118,15 +118,7 @@ const NewVertexType: React.FC = observer(() => { - -
- ) : ( -
- -
- ) - } + value={edgeTypeStore.newEdgeType.style.with_arrow} onChange={(e: any) => { edgeTypeStore.mutateNewEdgeType({ ...edgeTypeStore.newEdgeType, style: { ...edgeTypeStore.newEdgeType.style, - with_arrow: e[0] && e[1] === 'solid' + with_arrow: e } }); }} > {edgeTypeStore.edgeShapeSchemas.map((item, index) => ( diff --git a/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CheckAndEditVertex.tsx b/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CheckAndEditVertex.tsx index 3ca760ceb..45aaebe3f 100644 --- a/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CheckAndEditVertex.tsx +++ b/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CheckAndEditVertex.tsx @@ -420,19 +420,7 @@ const CheckAndEditVertex: React.FC = observer(() => { dropdownMatchSelectWidth={false} showSearch={false} disabled={!isEditVertex} - value={ -
- } + value={vertexTypeStore.editedSelectedVertexType.style.color} onChange={(value: string) => { vertexTypeStore.mutateEditedSelectedVertexType({ ...vertexTypeStore.editedSelectedVertexType, diff --git a/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CreateEdge.tsx b/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CreateEdge.tsx index 1911874db..05b6f2db4 100644 --- a/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CreateEdge.tsx +++ b/hubble-fe/src/components/graph-management/metadata-configs/graph-view/CreateEdge.tsx @@ -254,15 +254,7 @@ const CreateEdge: React.FC = observer(() => { width={66} size="medium" style={{ marginRight: 12 }} - value={ -
- } + value={edgeTypeStore.newEdgeType.style.color} prefixCls="new-fc-one-select-another" dropdownMatchSelectWidth={false} onChange={(value: string) => { @@ -309,30 +301,20 @@ const CreateEdge: React.FC = observer(() => { - } + value={vertexTypeStore.newVertexType.style.color} prefixCls="new-fc-one-select-another" dropdownMatchSelectWidth={false} onChange={(value: string) => { diff --git a/hubble-fe/src/components/graph-management/metadata-configs/vertex-type/VertexTypeList.tsx b/hubble-fe/src/components/graph-management/metadata-configs/vertex-type/VertexTypeList.tsx index cfdf653c5..5216b25f3 100644 --- a/hubble-fe/src/components/graph-management/metadata-configs/vertex-type/VertexTypeList.tsx +++ b/hubble-fe/src/components/graph-management/metadata-configs/vertex-type/VertexTypeList.tsx @@ -695,19 +695,7 @@ const VertexTypeList: React.FC = observer(() => { dropdownMatchSelectWidth={false} showSearch={false} disabled={!isEditVertex} - value={ -
- } + value={vertexTypeStore.editedSelectedVertexType.style.color} onChange={(value: string) => { vertexTypeStore.mutateEditedSelectedVertexType({ ...vertexTypeStore.editedSelectedVertexType, diff --git a/hubble-fe/src/i18n/index.ts b/hubble-fe/src/i18n/index.ts index 01174ff5a..734223ba1 100644 --- a/hubble-fe/src/i18n/index.ts +++ b/hubble-fe/src/i18n/index.ts @@ -1,14 +1,15 @@ import i18n from 'i18next'; import { initReactI18next } from 'react-i18next'; -import { zhCNResources } from './resources'; +import { zhCNResources, enUSResources } from './resources'; i18n.use(initReactI18next).init({ - lng: 'zh-CN', + lng: localStorage.getItem('languageType') || 'zh-CN', fallbackLng: 'zh-CN', resources: { - 'zh-CN': zhCNResources + 'zh-CN': zhCNResources, + 'en-US': enUSResources }, interpolation: { diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/AsyncTasks.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/AsyncTasks.json new file mode 100644 index 000000000..ce2848f4c --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/AsyncTasks.json @@ -0,0 +1,64 @@ +{ + "async-tasks": { + "title": "任务管理", + "placeholders": { + "search": "请输入任务ID或名称搜索" + }, + "table-column-title": { + "task-id": "任务ID", + "task-name": "任务名称", + "task-type": "任务类型", + "create-time": "创建时间", + "time-consuming": "耗时", + "status": "状态", + "manipulation": "操作" + }, + "table-filters": { + "task-type": { + "all": "全部", + "gremlin": "Gremlin任务", + "algorithm": "算法任务", + "remove-schema": "删除元数据", + "create-index": "创建索引", + "rebuild-index": "重建索引" + }, + "status": { + "all": "全部", + "scheduling": "调度中", + "scheduled": "排队中", + "queued": "排队中", + "running": "运行中", + "restoring": "恢复中", + "success": "成功", + "failed": "失败", + "cancelling": "已取消", + "cancelled": "已取消" + } + }, + "table-selection": { + "selected": "已选{{number}}项", + "delete-batch": "批量删除" + }, + "manipulations": { + "abort": "终止", + "aborting": "终止中", + "delete": "删除", + "check-result": "查看结果", + "check-reason": "查看原因" + }, + "hint": { + "delete-confirm": "删除确认", + "delete-description": "是否确认删除该任务?删除后无法恢复,请谨慎操作", + "delete-succeed": "删除成功", + "delete-batch-confirm": "批量删除", + "delete-batch-description": "确认删除以下任务?删除后无法恢复,请谨慎操作", + "delete": "删除", + "cancel": "取消", + "no-data": "暂无数据", + "empty": "您暂时还没有任何任务", + "select-disabled": "任务{{id}}无法被选中删除", + "check-details": "查看详情", + "creation-failed": "创建失败" + } + } +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/GraphManagementSidebar.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/GraphManagementSidebar.json new file mode 100644 index 000000000..d6b2f5455 --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/GraphManagementSidebar.json @@ -0,0 +1,5 @@ +{ + "data-import": "数据导入", + "import-task": "导入任务", + "map-templates": "映射模板" +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/addition.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/addition.json new file mode 100644 index 000000000..f3a4c8265 --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/addition.json @@ -0,0 +1,10 @@ +{ + "addition": { + "appbar": { + "graph-manager": "Graph Manager" + }, + "graph-list": { + "port": "port" + } + } +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/common.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/common.json new file mode 100644 index 000000000..98d821703 --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/common.json @@ -0,0 +1,5 @@ +{ + "common": { + "loading-data": "数据加载中" + } +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/data-import/import-tasks/ImportTasks.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/data-import/import-tasks/ImportTasks.json new file mode 100644 index 000000000..da8577c09 --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/data-import/import-tasks/ImportTasks.json @@ -0,0 +1,342 @@ +{ + "breadcrumb": { + "first": "导入任务", + "second": "任务详情" + }, + "import-manager": { + "hint": { + "empty-task": "您暂时还没有任何任务,立即创建", + "no-result": "无结果", + "creation-succeed": "创建成功", + "update-succeed": "编辑成功" + }, + "manipulation": { + "create": "创建" + }, + "placeholder": { + "input-job-name": "请输入任务名称搜索", + "input-valid-job-name": "允许出现中英文、数字、下划线", + "input-job-description": "请输入任务备注" + }, + "list-column-title": { + "job-name": "任务名称", + "size": "大小", + "create-time": "创建时间", + "status": "状态", + "time-consuming": "任务耗时", + "manipulation": "操作" + }, + "list-column-status": { + "DEFAULT": "未开始", + "UPLOADING": "未开始", + "MAPPING": "设置中", + "SETTING": "导入中", + "LOADING": "导入中", + "FAILED": "失败", + "SUCCESS": "成功" + }, + "list-column-manipulations": { + "start": "开始任务", + "resume-setting": "继续设置", + "resume-importing": "继续导入", + "check-error-log": "查看原因", + "delete": "删除" + }, + "modal": { + "create-job": { + "title": "创建导入任务", + "job-name": "任务名称:", + "job-description": "任务备注:" + }, + "delete-job": { + "title": "删除任务", + "hint": "确认删除任务{{name}}吗?", + "sub-hint": "删除后该任务不可恢复" + }, + "manipulations": { + "create": "创建", + "delete": "删除", + "cancel": "取消" + } + }, + "validator": { + "no-empty": "此项为必填项", + "over-limit-size": "已超出字数限制", + "invalid-format": "请输入中英文、数字、下划线" + } + }, + "import-job-details": { + "tabs": { + "basic-settings": "基础设置", + "uploaded-files": "上传文件", + "data-maps": "映射文件", + "import-details": "导入详情" + }, + "basic": { + "job-name": "任务名称:", + "job-description": "任务备注:", + "modal": { + "edit-job": { + "title": "编辑导入任务", + "job-name": "任务名称:", + "job-description": "任务备注:" + }, + "manipulations": { + "save": "保存", + "cancel": "取消" + } + } + }, + "manipulations": { + "edit": "编辑", + "resume-task": "继续任务" + } + }, + "step": { + "first": "上传文件", + "second": "设置数据映射", + "third": "导入数据", + "fourth": "完成" + }, + "upload-files": { + "click": "点击", + "description": "点击或将文件拖拽到此处上传,可同时上传多个支持csv文件,单个1G以内,单次累计10G以内", + "drag": "拖拽", + "description-1": "或将文件", + "description-2": "到此处上传,可同时上传多个支持csv文件,单个1G以内,单次累计10G以内", + "cancel": "取消上传", + "next": "下一步", + "wrong-format": "仅支持 csv 格式文件", + "over-single-size-limit": "容量已超过 1 GB", + "over-all-size-limit": "总容量已超过 10 GB", + "empty-file": "文件为空,请重新上传", + "no-duplicate": "下列上传的文件已存在:" + }, + "data-configs": { + "file": { + "title": "文件设置", + "include-header": "包含表头", + "delimiter": { + "title": "分隔符", + "comma": "逗号", + "semicolon": "分号", + "tab": "制表符", + "space": "空格", + "custom": "自定义" + }, + "code-type": { + "title": "编码格式", + "UTF-8": "UTF-8", + "GBK": "GBK", + "ISO-8859-1": "ISO-8859-1", + "US-ASCII": "US-ASCII", + "custom": "自定义" + }, + "date-type": { + "title": "日期格式", + "custom": "自定义" + }, + "skipped-line": "跳过行", + "timezone": "时区", + "save": "保存", + "placeholder": { + "input-delimiter": "请输入分隔符", + "input-charset": "请输入编码格式", + "input-date-format": "请输入日期格式" + }, + "hint": { + "save-succeed": "已保存文件设置" + } + }, + "type": { + "title": "类型设置", + "basic-settings": "基础设置", + "manipulation": { + "create": "创建", + "save": "保存", + "cancel": "取消", + "create-vertex": "创建顶点映射", + "create-edge": "创建边映射" + }, + "info": { + "type": "类型", + "name": "名称", + "ID-strategy": "ID策略", + "edit": "编辑", + "delete": "删除" + }, + "ID-strategy": { + "PRIMARY_KEY": "主键ID", + "AUTOMATIC": "自动生成", + "CUSTOMIZE_STRING": "自定义字符串", + "CUSTOMIZE_NUMBER": "自定义数字", + "CUSTOMIZE_UUID": "自定义UUID" + }, + "vertex": { + "title": "创建顶点映射", + "type": "顶点类型", + "ID-strategy": "ID策略", + "ID-column": "ID列", + "map-settings": "映射设置", + "add-map": { + "title": "添加映射", + "name": "列名", + "sample": "数据样例", + "property": "映射属性", + "clear": "清空" + }, + "select-all": "全选", + "advance": { + "title": "高级设置", + "nullable-list": { + "title": "空值列表", + "empty": "空值", + "custom": "自定义" + }, + "map-property-value": { + "title": "属性值映射", + "add-value": "添加属性值映射", + "fields": { + "property": "属性", + "value-map": "值映射", + "add-value-map": "添加值映射" + } + }, + "placeholder": { + "input": "请选择", + "input-property": "请选择输入属性", + "input-file-value": "请输入文件值", + "input-graph-value": "请输入图导入值" + } + } + }, + "edge": { + "title": "创建边映射", + "type": "边类型", + "source-ID-strategy": "起点ID策略", + "target-ID-strategy": "终点ID策略", + "ID-column": "ID列", + "map-settings": "映射设置", + "add-map": { + "title": "添加映射", + "name": "列名", + "sample": "数据样例", + "property": "映射属性", + "clear": "清空" + }, + "select-all": "全选", + "advance": { + "title": "高级设置", + "nullable-list": { + "title": "空值列表", + "empty": "空值", + "custom": "自定义" + }, + "map-property-value": { + "title": "属性值映射", + "add-value": "添加 属性值映射", + "fields": { + "property": "属性", + "value-map": "值映射", + "add-value-map": "添加值映射" + } + }, + "placeholder": { + "input": "请选择映射属性", + "input-property": "请选择输入属性", + "input-file-value": "请输入文件值", + "input-graph-value": "请输入图导入值" + } + } + }, + "hint": { + "lack-support-for-automatic": "自动生成的ID策略不支持可视化导入,请调用API实现", + "no-vertex-or-edge-mapping": "如下文件未设置顶点类型或边类型映射:" + }, + "placeholder": { + "select-vertex-type": "请选择顶点类型", + "select-edge-type": "请选择边类型", + "select-id-column": "请选择 ID 列" + } + }, + "manipulations": { + "previous": "上一步", + "next": "下一步", + "add": "添加", + "edit": "编辑", + "delete": "删除", + "cancel": "取消", + "hints": { + "delete-confirm": "确认删除?", + "warning": "删除后无法恢复,请谨慎操作" + } + }, + "validator": { + "no-empty": "该项不能为空" + } + }, + "server-data-import": { + "import-settings": { + "title": "导入设置", + "checkIfExist": "检查边连接的顶点是否存在", + "requestTimesWhenInterpolationFailed": "插入失败重试次数", + "maximumAnalyzedErrorRow": "允许最大解析错误行数", + "requestTicksWhenInterpolationFailed": "插入失败重试间隔/s", + "maxiumInterpolateErrorRow": "允许最大插入错误行数", + "InterpolationTimeout": "插入超时时间/s" + }, + "import-details": { + "title": "导入详情", + "column-titles": { + "file-name": "文件名称", + "type": "类型", + "import-speed": "导入速度", + "import-progress": "导入进度", + "status": "状态", + "time-consumed": "耗时", + "manipulations": "操作" + }, + "content": { + "vertex": "顶点", + "edge": "边" + }, + "status": { + "RUNNING": "运行中", + "SUCCEED": "成功", + "FAILED": "失败", + "PAUSED": "已暂停", + "STOPPED": "已终止" + }, + "manipulations": { + "pause": "暂停", + "resume": "继续", + "retry": "重试", + "abort": "终止", + "failed-cause": "查看原因" + } + }, + "hint": { + "check-vertex": "开启检查会影响导入性能,请按需开启", + "no-data": "正在请求导入", + "confirm-navigation": "确认跳转到任务列表?正在上传的文件可能会丢失" + }, + "validator": { + "no-empty": "该项不能为空", + "need-integer-with-negative": "请输入-1或大于0的整数", + "need-integer": "请输入大于0的整数" + }, + "manipulations": { + "previous": "上一步", + "start": "开始导入", + "cancel": "取消导入", + "finished": "完成" + } + }, + "data-import-status": { + "finished": "导入完成", + "success": "已成功导入 {{number}} 个文件", + "pause": "{{number}} 个文件暂停", + "abort": "{{number}} 个文件终止", + "move-to-import-manager": "返回导入任务列表" + } +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/dataAnalyze.json b/hubble-fe/src/i18n/resources/en-US/graph-managment/dataAnalyze.json new file mode 100644 index 000000000..87afb8a40 --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/dataAnalyze.json @@ -0,0 +1,287 @@ +{ + "data-analyze": { + "category": { + "gremlin-analyze": "Gremlin 分析", + "algorithm-analyze": "算法分析" + }, + "manipulations": { + "execution": "执行", + "favorite": "收藏", + "reset": "重置" + }, + "algorithm-list": { + "title": "算法目录", + "loop-detection": "环路检测", + "focus-detection": "交点检测", + "shortest-path": "最短路径", + "shortest-path-all": "全最短路径", + "all-path": "全部路径", + "neighbor-rank-recommendation": "Neighbor Rank推荐算法", + "model-similarity": "模型相似度算法", + "real-time-recommendation": "实时推荐", + "k-step-neighbor": "k步邻居", + "k-hop": "k跳算法", + "custom-path": "自定义路径", + "custom-intersection-detection": "自定义交点检测", + "radiographic-inspection": "射线检测", + "common-neighbor": "共同邻居", + "weighted-shortest-path": "带权最短路径", + "single-source-weighted-path": "单源带权路径", + "jaccard-similarity": "Jaccard相似度", + "personal-rank-recommendation": "Personal Rank推荐算法" + }, + "algorithm-forms": { + "loop-detection": { + "options": { + "source": "起点ID:", + "direction": "方向:", + "max_depth": "最大步数:", + "label": "边类型:", + "max_degree": "最大度数:", + "source_in_ring": "环路包含起点:", + "limit": "返回可达路径最大值:", + "capacity": "访问顶点最大值:" + }, + "pre-value": "全部", + "placeholder": { + "input-source-id": "请输入起点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "no-edge-types": "无边类型" + }, + "hint": { + "max-depth": "为保证性能,建议不超过10步,推荐5步", + "skip-degree": "填写查询过程中需要跳过的顶点的最小的边数目,即当顶点的边数目大于超级顶点度数时,跳过该顶点,可用于规避超级点" + }, + "validations": { + "no-empty": "该项不能为空", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数" + } + }, + "focus-detection": { + "options": { + "source": "起点ID:", + "target": "终点ID:", + "direction": "方向:", + "max_depth": "最大步数:", + "label": "边类型:", + "max_degree": "最大度数:", + "limit": "访问顶点最大值:", + "capacity": "返回交点最大值:" + }, + "pre-value": "全部", + "placeholder": { + "input-source-id": "请输入起点ID", + "input-target-id": "请输入终点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "no-edge-types": "无边类型" + }, + "hint": { + "max-depth": "为保证性能,建议不超过10步,推荐5步", + "skip-degree": "填写查询过程中需要跳过的顶点的最小的边数目,即当顶点的边数目大于超级顶点度数时,跳过该顶点,可用于规避超级点" + }, + "validations": { + "no-empty": "该项不能为空", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数" + } + }, + "shortest-path": { + "options": { + "source": "起点ID:", + "target": "终点ID:", + "direction": "方向:", + "max_depth": "最大步数:", + "maxDepth": "最大步数:", + "label": "边类型:", + "max_degree": "最大度数:", + "maxDegree": "最大度数:", + "skip_degree": "超级顶点度数:", + "skipDegree": "超级顶点度数:", + "capacity": "访问顶点最大值:" + }, + "pre-value": "全部", + "placeholder": { + "input-source-id": "请输入起点ID", + "input-target-id": "请输入终点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "no-edge-types": "无边类型" + }, + "hint": { + "max-depth": "为保证性能,建议不超过10步,推荐5步", + "skip-degree": "填写查询过程中需要跳过的顶点的最小的边数目,即当顶点的边数目大于超级顶点度数时,跳过该顶点,可用于规避超级点" + }, + "validations": { + "no-empty": "该项不能为空", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数" + } + }, + "shortest-path-all": { + "options": { + "source": "起点ID:", + "target": "终点ID:", + "direction": "方向:", + "max_depth": "最大步数:", + "label": "边类型:", + "max_degree": "最大度数:", + "capacity": "访问顶点最大值:", + "skip_degree": "超级顶点度数:" + }, + "pre-value": "全部", + "placeholder": { + "input-source-id": "请输入起点ID", + "input-target-id": "请输入终点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "no-edge-types": "无边类型" + }, + "hint": { + "max-depth": "为保证性能,建议不超过10步,推荐5步", + "skip-degree": "填写查询过程中需要跳过的顶点的最小的边数目,即当顶点的边数目大于超级顶点度数时,跳过该顶点,可用于规避超级点" + }, + "validations": { + "no-empty": "该项不能为空", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数" + } + }, + "all-path": { + "options": { + "source": "起点ID:", + "target": "终点ID:", + "direction": "方向:", + "max_depth": "最大步数:", + "label": "边类型:", + "max_degree": "最大度数:", + "capacity": "访问顶点最大值:", + "limit": "返回路径最大值:" + }, + "pre-value": "全部", + "placeholder": { + "input-source-id": "请输入起点ID", + "input-target-id": "请输入终点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "no-edge-types": "无边类型" + }, + "hint": { + "max-depth": "为保证性能,建议不超过10步,推荐5步", + "skip-degree": "填写查询过程中需要跳过的顶点的最小的边数目,即当顶点的边数目大于超级顶点度数时,跳过该顶点,可用于规避超级点" + }, + "validations": { + "no-empty": "该项不能为空", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数" + } + }, + "model-similarity": { + "options": { + "method": "起点选择方式:", + "source": "起点ID:", + "vertex-type": "顶点类型", + "vertex-property": "顶点属性", + "direction": "方向:", + "least_neighbor": "最少邻居数:", + "similarity": "相似度:", + "label": "边类型:", + "max_similar": "相似度最高个数:", + "least_similar": "梭形相似点最小个数:", + "property_filter": "属性过滤:", + "least_property_number": "最小属性值个数:", + "max_degree": "最大度数:", + "capacity": "访问顶点最大值:", + "skip_degree": "返回顶点最大值:", + "limit": "返回结果最大值:", + "return_common_connection": "返回共同关联点:", + "return_complete_info": "返回顶点完整信息:" + }, + "radio-value": { + "specific-id": "指定ID", + "filtered-type-property": "筛选类型属性" + }, + "placeholder": { + "input-source-id": "请输入起点ID", + "input-vertex-type": "请选择顶点类型", + "input-vertex-property": "请选择顶点属性", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "input-integer-gt-1": "请填写大于1的整数", + "input-filtered-property": "请选择需要过滤的属性", + "no-properties": "无属性", + "no-vertex-type": "无顶点类型" + }, + "hint": { + "least_property_number": "属性过滤和最小属性值个数需一起使用;设置后效果为:当起点跟其所有的梭形相似点某个属性的值大于等于最小属性值个数时,才会返回该起点及其梭形相似点", + "least_neighbor": "邻居数少于当前设定值,则认为起点没有梭形相似点", + "similarity": "起点与\"梭形相似点\"的共同邻居数目占起点的全部邻居数目的比例", + "max_similar": "返回起点的梭形相似点中相似度最高的top个数,0表示全部", + "return_common_connection": "是否返回起点及其\"梭形相似点\"共同关联的中间点" + }, + "validations": { + "no-empty": "该项不能为空", + "no-edge-typs": "无边类型", + "integer-only": "请填写大于等于0的整数", + "positive-integer-only": "请填写大于0的整数", + "integer-gt-1": "请填写大于1的整数" + }, + "pre-value": "全部" + }, + "neighbor-rank": { + "options": { + "source": "起点ID:", + "alpha": "Alpha", + "direction": "方向:", + "capacity": "访问顶点最大值:", + "label": "边类型:", + "degree": "最大度数:", + "top": "每层保留权重Top N:" + }, + "placeholder": { + "input-source-id": "请输入起点ID", + "input-integer": "请填写大于等于0的整数", + "input-positive-integer": "请填写大于0的整数", + "range": "范围(0-1]" + }, + "hint": { + "top": "在结果中每一层只保留权重最高的N个结果" + }, + "validations": { + "no-empty": "该项不能为空", + "no-edge-typs": "无边类型", + "range": "请填写大于0且小于等于1的数值", + "integer-only": "请填写大于等于0的整数", + "postive-integer-only": "请填写大于0的整数", + "input-chars": "规则不能其它重复" + }, + "pre-value": "全部", + "add-new-rule": "添加规则" + } + }, + "exec-logs": { + "table-title": { + "time": "时间", + "type": "执行类型", + "content": "执行内容", + "status": "状态", + "duration": "耗时", + "manipulation": "操作" + }, + "type": { + "GREMLIN": "GREMLIN 查询", + "GREMLIN_ASYNC": "GREMLIN 任务", + "ALGORITHM": "算法查询" + }, + "status": { + "success": "成功", + "async-success": "提交成功", + "running": "运行中", + "failed": "失败", + "async-failed": "提交失败" + } + } + } +} diff --git a/hubble-fe/src/i18n/resources/en-US/graph-managment/index.ts b/hubble-fe/src/i18n/resources/en-US/graph-managment/index.ts new file mode 100644 index 000000000..60bf8513c --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/graph-managment/index.ts @@ -0,0 +1,15 @@ +import CommonResources from './common.json'; +import GraphManagementSideBarResources from './GraphManagementSidebar.json'; +import DataAnalyzeResources from './dataAnalyze.json'; +import DataImportResources from './data-import/import-tasks/ImportTasks.json'; +import AsyncTasksResources from './AsyncTasks.json'; +import Addition from './addition.json'; + +export { + CommonResources, + DataAnalyzeResources, + GraphManagementSideBarResources, + DataImportResources, + AsyncTasksResources, + Addition +}; diff --git a/hubble-fe/src/i18n/resources/en-US/index.ts b/hubble-fe/src/i18n/resources/en-US/index.ts new file mode 100644 index 000000000..38f16e43d --- /dev/null +++ b/hubble-fe/src/i18n/resources/en-US/index.ts @@ -0,0 +1,22 @@ +import { merge } from 'lodash-es'; +import { + CommonResources, + DataAnalyzeResources, + GraphManagementSideBarResources, + DataImportResources, + AsyncTasksResources, + Addition +} from './graph-managment'; + +const translation = { + translation: merge( + CommonResources, + DataAnalyzeResources, + GraphManagementSideBarResources, + DataImportResources, + AsyncTasksResources, + Addition + ) +}; + +export default translation; diff --git a/hubble-fe/src/i18n/resources/index.ts b/hubble-fe/src/i18n/resources/index.ts index 05ed9ce69..1fbbb1514 100644 --- a/hubble-fe/src/i18n/resources/index.ts +++ b/hubble-fe/src/i18n/resources/index.ts @@ -1,3 +1,4 @@ import zhCNResources from './zh-CN'; +import enUSResources from './en-US'; -export { zhCNResources }; +export { zhCNResources, enUSResources }; diff --git a/hubble-fe/src/i18n/resources/zh-CN/graph-managment/GraphManagementSidebar.json b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/GraphManagementSidebar.json index 5ceaede98..d6b2f5455 100644 --- a/hubble-fe/src/i18n/resources/zh-CN/graph-managment/GraphManagementSidebar.json +++ b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/GraphManagementSidebar.json @@ -2,4 +2,4 @@ "data-import": "数据导入", "import-task": "导入任务", "map-templates": "映射模板" -} \ No newline at end of file +} diff --git a/hubble-fe/src/i18n/resources/zh-CN/graph-managment/addition.json b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/addition.json new file mode 100644 index 000000000..3def97f5e --- /dev/null +++ b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/addition.json @@ -0,0 +1,10 @@ +{ + "addition": { + "appbar": { + "graph-manager": "图管理" + }, + "graph-list": { + "port": "端口号" + } + } +} diff --git a/hubble-fe/src/i18n/resources/zh-CN/graph-managment/index.ts b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/index.ts index f403f5739..60bf8513c 100644 --- a/hubble-fe/src/i18n/resources/zh-CN/graph-managment/index.ts +++ b/hubble-fe/src/i18n/resources/zh-CN/graph-managment/index.ts @@ -3,11 +3,13 @@ import GraphManagementSideBarResources from './GraphManagementSidebar.json'; import DataAnalyzeResources from './dataAnalyze.json'; import DataImportResources from './data-import/import-tasks/ImportTasks.json'; import AsyncTasksResources from './AsyncTasks.json'; +import Addition from './addition.json'; export { CommonResources, DataAnalyzeResources, GraphManagementSideBarResources, DataImportResources, - AsyncTasksResources + AsyncTasksResources, + Addition }; diff --git a/hubble-fe/src/i18n/resources/zh-CN/index.ts b/hubble-fe/src/i18n/resources/zh-CN/index.ts index 9e1160ad3..38f16e43d 100644 --- a/hubble-fe/src/i18n/resources/zh-CN/index.ts +++ b/hubble-fe/src/i18n/resources/zh-CN/index.ts @@ -4,7 +4,8 @@ import { DataAnalyzeResources, GraphManagementSideBarResources, DataImportResources, - AsyncTasksResources + AsyncTasksResources, + Addition } from './graph-managment'; const translation = { @@ -13,7 +14,8 @@ const translation = { DataAnalyzeResources, GraphManagementSideBarResources, DataImportResources, - AsyncTasksResources + AsyncTasksResources, + Addition ) }; diff --git a/hubble-fe/src/index.less b/hubble-fe/src/index.less index 9e73f3abf..4b8f8c932 100644 --- a/hubble-fe/src/index.less +++ b/hubble-fe/src/index.less @@ -295,3 +295,8 @@ code { .new-fc-one-modal-body { overflow-y: auto !important; } + +// menu center +.data-analyze-sidebar .ant-menu.ant-menu-inline-collapsed > .ant-menu-item { + padding: 0 12px ; +} diff --git a/hubble-fe/src/index.tsx b/hubble-fe/src/index.tsx index 642806da5..029987780 100644 --- a/hubble-fe/src/index.tsx +++ b/hubble-fe/src/index.tsx @@ -3,5 +3,17 @@ import ReactDOM from 'react-dom'; import './index.less'; import App from './components/App'; import './i18n'; +import { ConfigProvider } from 'antd'; +import zhCN from 'antd/lib/locale/zh_CN'; +import enUS from 'antd/lib/locale/en_US'; -ReactDOM.render(, document.getElementById('root')); +// UI component has built-in text internationalization, +// such as confirmation, cancellation, etc +const languageType = + localStorage.getItem('languageType') === 'en-US' ? enUS : zhCN; +ReactDOM.render( + + + , + document.getElementById('root') +);