Skip to content

Commit

Permalink
feat: galaxybase 包国际化
Browse files Browse the repository at this point in the history
  • Loading branch information
yangzy0603 committed Jun 27, 2023
1 parent f6fbe5a commit 726c732
Show file tree
Hide file tree
Showing 21 changed files with 683 additions and 189 deletions.
93 changes: 93 additions & 0 deletions packages/gi-assets-galaxybase/.must.config.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
// more config: http://gitlab.alibaba-inc.com/parrot/parrot-tool-must/blob/master/doc/config.md
module.exports = {
extract: {
name: 'galaxybase',
sourcePath: 'src',
fileType: 'ts',
prettier: true,
exclude: (path)=>{
return path.includes('/pages/') ; //
},
macro: {
path: 'src/i18n',
method: '$i18n.get({id:"$key$",dm:"$defaultMessage$"})',
import: 'import $i18n from "src/i18n"',
keySplitter: '.',
placeholder: variable => {
return `{${variable}}`;
},
implement: `import locale from '@aligov/global-locale';
import stringFormat from '@aligov/global-string-format';
import strings from './strings';
let language; // Current language
let intl; // Instance of intl-universal. Create by provideIntl
function update() {
const { lang } = locale.getLocale();
language = lang;
intl = stringFormat.init(lang, strings, { name: 'galaxybase' });
}
function change(langTag) {
locale.setLang(langTag);
update();
}
function get(id, variable = {}) {
if (!intl) update();
if (typeof id === 'string') {
return stringFormat.format(
{
id: id,
},
variable,
{ name: 'galaxybase' }
);
} else if (typeof id === 'object' && id.dm) {
id.defaultMessage = id.dm;
}
return stringFormat.format(
{
id: id.id,
defaultString: id.dm,
},
variable,
{ name: 'galaxybase' }
);
}
export default {
get,
update,
change,
language,
};
`,
dependencies: ['@aligov/global-locale', '@aligov/global-string-format'],
},
babel: {
allowImportExportEverywhere: true,
decoratorsBeforeExport: true,
plugins: [
'asyncGenerators',
'classProperties',
'decorators-legacy',
'doExpressions',
'exportExtensions',
'exportDefaultFrom',
'typescript',
'functionSent',
'functionBind',
'jsx',
'objectRestSpread',
'dynamicImport',
'numericSeparator',
'optionalChaining',
'optionalCatchBinding',
],
},
isNeedUploadCopyToMedusa: false,
sourceLang: 'zh-CN',
},
};
13 changes: 8 additions & 5 deletions packages/gi-assets-galaxybase/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,19 +29,21 @@
"antd": "4.x"
},
"dependencies": {
"@antv/gi-sdk": "workspace:*",
"@aligov/global-locale": "^1.0.5",
"@aligov/global-string-format": "^1.0.7",
"@ant-design/icons": "^4.6.2",
"@antv/gi-sdk": "workspace:*",
"@antv/graphin": "2.x",
"@antv/graphin-icons": "^1.0.0",
"antd": "4.x",
"codemirror": "^5.25.0",
"monaco-editor": "^0.34.0",
"node-rsa": "^1.1.1",
"qs": "^6.5.3",
"react": "17.x",
"react-monaco-editor": "^0.48.0",
"umi-request": "^1.4.0",
"use-immer": "^0.7.0",
"node-rsa": "^1.1.1",
"qs": "^6.5.3"
"use-immer": "^0.7.0"
},
"devDependencies": {
"dumi": "^1.1.38",
Expand All @@ -55,5 +57,6 @@
"peerDependencies": {},
"publishConfig": {
"access": "public"
}
},
"repository": "[email protected]:antvis/G6VP.git"
}
5 changes: 4 additions & 1 deletion packages/gi-assets-galaxybase/src/components/DataManage/Component.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import * as React from 'react';
import ContainerHeader from '../../components-ui/ContainerHeader';
import DataImport from './DataImport';
import DataSchema from './DataSchema';
import $i18n from '../../i18n';

const { GIAComponent, deepClone } = extra;

Expand All @@ -11,7 +12,9 @@ export interface DataManagerProps {}
const DataManager: React.FunctionComponent<DataManagerProps> = props => {
return (
<div>
<ContainerHeader title="数据管理" />
<ContainerHeader
title={$i18n.get({ id: 'galaxybase.components.DataManage.Component.DataManagement', dm: '数据管理' })}
/>
<DataImport />
<DataSchema />
</div>
Expand Down
53 changes: 27 additions & 26 deletions packages/gi-assets-galaxybase/src/components/DataManage/DataImport/Import.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,28 +1,29 @@
import { DisconnectOutlined, LinkOutlined } from "@ant-design/icons";
import { Button, Drawer, message } from "antd";
import * as React from "react";
import GalaxybaseDataLoadPanel from "../../../services/ServerComponent";
import { DisconnectOutlined, LinkOutlined } from '@ant-design/icons';
import { Button, Drawer, message } from 'antd';
import * as React from 'react';
import GalaxybaseDataLoadPanel from '../../../services/ServerComponent';
import $i18n from '../../../i18n';

interface DataImportProps {}

const DataImport: React.FunctionComponent<DataImportProps> = (props) => {
const useToken = localStorage.getItem("GALAXYBASE_USER_TOKEN");
const DataImport: React.FunctionComponent<DataImportProps> = props => {
const useToken = localStorage.getItem('GALAXYBASE_USER_TOKEN');

const [state, stateState] = React.useState({
visible: true,
connectStatus: useToken,
});
const { visible } = state;
const handleImport = () => {
stateState((preState) => {
stateState(preState => {
return {
...preState,
visible: true,
};
});
};
const handleClose = () => {
stateState((preState) => {
stateState(preState => {
return {
...preState,
visible: false,
Expand All @@ -31,11 +32,16 @@ const DataImport: React.FunctionComponent<DataImportProps> = (props) => {
};

const closeConnect = () => {
localStorage.removeItem("GALAXYBASE_USER_TOKEN");
localStorage.removeItem("CURRENT_GALAXYBASE_SUBGRAPH");
message.success("已断开与 Galaxybase 的连接");
localStorage.removeItem('GALAXYBASE_USER_TOKEN');
localStorage.removeItem('CURRENT_GALAXYBASE_SUBGRAPH');
message.success(
$i18n.get({
id: 'galaxybase.DataManage.DataImport.Import.DisconnectedFromGalaxybase',
dm: '已断开与 Galaxybase 的连接',
}),
);

stateState((preState) => {
stateState(preState => {
return {
...preState,
connectStatus: null,
Expand All @@ -44,37 +50,32 @@ const DataImport: React.FunctionComponent<DataImportProps> = (props) => {
};

React.useEffect(() => {
stateState((preState) => {
stateState(preState => {
return {
...preState,
connectStatus: localStorage.getItem("GALAXYBASE_USER_TOKEN"),
connectStatus: localStorage.getItem('GALAXYBASE_USER_TOKEN'),
};
});
}, [localStorage.getItem("GALAXYBASE_USER_TOKEN")]);
}, [localStorage.getItem('GALAXYBASE_USER_TOKEN')]);
return (
<div>
{state.connectStatus ? (
<Button
danger
onClick={closeConnect}
size="small"
style={{ marginRight: 8 }}
icon={<DisconnectOutlined />}
>
断开连接
<Button danger onClick={closeConnect} size="small" style={{ marginRight: 8 }} icon={<DisconnectOutlined />}>
{$i18n.get({ id: 'galaxybase.DataManage.DataImport.Import.Disconnect', dm: '断开连接' })}
</Button>
) : (
<Button onClick={handleImport} size="small" icon={<LinkOutlined />}>
连接
{$i18n.get({ id: 'galaxybase.DataManage.DataImport.Import.Connection', dm: '连接' })}
</Button>
)}

<Drawer
title="连接图数据库"
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.Import.ConnectToGraphDatabase', dm: '连接图数据库' })}
visible={visible}
onClose={handleClose}
width="1000"
contentWrapperStyle={{
transform: "none",
transform: 'none',
}}
>
<GalaxybaseDataLoadPanel onClose={handleClose} />
Expand Down
65 changes: 52 additions & 13 deletions packages/gi-assets-galaxybase/src/components/DataManage/DataImport/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import { useImmer } from 'use-immer';
import { CollapseCard } from '../../../components-ui';
import { queryGraphSchema, querySubGraphList, queryVertexLabelCount } from '../../../services/GraphService';
import Import from './Import';
import $i18n from '../../../i18n';

const { Option } = Select;
export interface DataImportProps {}
Expand Down Expand Up @@ -46,8 +47,17 @@ const DataImport: React.FunctionComponent<DataImportProps> = props => {
const result = await querySubGraphList();
if (!result.success) {
notification.error({
message: '查询子图列表失败',
description: `查询失败：${result.message}`,
message: $i18n.get({
id: 'galaxybase.DataManage.DataImport.FailedToQuerySubgraphList',
dm: '查询子图列表失败',
}),
description: $i18n.get(
{
id: 'galaxybase.DataManage.DataImport.QueryFailedResultmessage',
dm: '查询失败：{resultMessage}',
},
{ resultMessage: result.message },
),
});
return;
}
Expand Down Expand Up @@ -98,7 +108,10 @@ const DataImport: React.FunctionComponent<DataImportProps> = props => {

return (
<div>
<CollapseCard title="图数据" extra={<Import />}>
<CollapseCard
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.GraphData', dm: '图数据' })}
extra={<Import />}
>
<div
style={{
borderBottom: '1px solid #d9d9d9',
Expand All @@ -108,22 +121,36 @@ const DataImport: React.FunctionComponent<DataImportProps> = props => {
>
{useToken ? (
<>
<Tag color="green">已连接</Tag>
<span style={{ color: 'rgba(0, 0, 0, 0.45)' }}>Galaxybase 数据源已连接, 开始分析</span>
<Tag color="green">{$i18n.get({ id: 'galaxybase.DataManage.DataImport.Connected', dm: '已连接' })}</Tag>
<span style={{ color: 'rgba(0, 0, 0, 0.45)' }}>
{$i18n.get({
id: 'galaxybase.DataManage.DataImport.GalaxybaseDataSourceConnectedStart',
dm: 'Galaxybase 数据源已连接, 开始分析',
})}
</span>
</>
) : (
<>
<Tag color="red">未连接</Tag>
<span style={{ color: 'rgba(0, 0, 0, 0.45)' }}>Galaxybase 数据源未连接, 请先连接</span>
<Tag color="red">{$i18n.get({ id: 'galaxybase.DataManage.DataImport.NotConnected', dm: '未连接' })}</Tag>
<span style={{ color: 'rgba(0, 0, 0, 0.45)' }}>
{$i18n.get({
id: 'galaxybase.DataManage.DataImport.GalaxybaseTheDataSourceIs',
dm: 'Galaxybase 数据源未连接, 请先连接',
})}
</span>
</>
)}
</div>

<div style={{ marginBottom: 8 }}>
选择子图：
{$i18n.get({ id: 'galaxybase.DataManage.DataImport.SelectASubgraph', dm: '选择子图：' })}

<Select
showSearch
placeholder="请选择要查询的子图"
placeholder={$i18n.get({
id: 'galaxybase.DataManage.DataImport.SelectASubgraphToQuery',
dm: '请选择要查询的子图',
})}
size="small"
defaultValue={state.defaultGraphName}
onChange={handleChange}
Expand All @@ -136,18 +163,30 @@ const DataImport: React.FunctionComponent<DataImportProps> = props => {
</div>
<Row gutter={[0, 12]}>
<Col span={12}>
<Statistic title="节点规模" value={count.node} />
<Statistic
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.NodeSize', dm: '节点规模' })}
value={count.node}
/>
</Col>
<Col span={12}>
<Statistic title="边规模" value={count.edge} />
<Statistic
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.EdgeScale', dm: '边规模' })}
value={count.edge}
/>
</Col>
</Row>
<Row gutter={[0, 12]}>
<Col span={12}>
<Statistic title="当前节点" value={data.nodes.length} />
<Statistic
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.CurrentNode', dm: '当前节点' })}
value={data.nodes.length}
/>
</Col>
<Col span={12}>
<Statistic title="当前边" value={data.edges.length} />
<Statistic
title={$i18n.get({ id: 'galaxybase.DataManage.DataImport.CurrentEdge', dm: '当前边' })}
value={data.edges.length}
/>
</Col>
</Row>
</CollapseCard>
Expand Down
3 changes: 2 additions & 1 deletion packages/gi-assets-galaxybase/src/components/DataManage/DataSchema/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { useContext, utils } from '@antv/gi-sdk';
import Graphin from '@antv/graphin';
import * as React from 'react';
import CollapseCard from '../../../components-ui/CollapseCard';
import $i18n from '../../../i18n';

const { getSchemaGraph } = utils;

Expand All @@ -17,7 +18,7 @@ const DataSchema = () => {

return (
<div>
<CollapseCard title="图模型">
<CollapseCard title={$i18n.get({ id: 'galaxybase.DataManage.DataSchema.GraphModel', dm: '图模型' })}>
<Graphin
style={{ width: '322px', height: '300px', minHeight: '300px' }}
data={schemaGraph}
Expand Down
Loading

0 comments on commit 726c732

Please sign in to comment.