tntd 1.3.51 → 1.3.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/components/Layout/Avatar.js +6 -3
  2. package/components/Layout/GlobalNavigation/NavigationPopup.js +6 -4
  3. package/components/Layout/GlobalNavigation/index.js +2 -1
  4. package/components/Layout/HeaderActions.js +1 -0
  5. package/components/Layout/README.md +2 -1
  6. package/components/Layout/createActions.js +10 -2
  7. package/components/Layout/index.js +10 -1
  8. package/components/Page/Box.js +3 -3
  9. package/components/Page/README.md +17 -5
  10. package/components/Page/index.js +4 -4
  11. package/components/Page/index.less +31 -7
  12. package/components/QueryForm/index.js +12 -8
  13. package/components/QueryListScene/List.js +2 -1
  14. package/components/locale.js +60 -0
  15. package/lib/Layout/Avatar.js +11 -3
  16. package/lib/Layout/GlobalNavigation/NavigationPopup.js +7 -4
  17. package/lib/Layout/GlobalNavigation/index.js +2 -1
  18. package/lib/Layout/README.md +2 -1
  19. package/lib/Layout/createActions.js +14 -1
  20. package/lib/Layout/index.js +19 -5
  21. package/lib/Page/Box.js +4 -3
  22. package/lib/Page/README.md +17 -5
  23. package/lib/Page/demo.js +302 -0
  24. package/lib/Page/index.js +4 -4
  25. package/lib/Page/index.less +31 -7
  26. package/lib/QueryForm/index.js +14 -11
  27. package/lib/QueryListScene/Field/SelectInput.js +2 -10
  28. package/lib/QueryListScene/Field/fieldsMap.js +1 -16
  29. package/lib/QueryListScene/Field/index.js +47 -131
  30. package/lib/QueryListScene/List.js +3 -1
  31. package/lib/QueryListScene/QueryForm/index.js +89 -93
  32. package/lib/QueryListScene/QueryForm/index.less +3 -17
  33. package/lib/locale.js +75 -0
  34. package/package.json +1 -1
  35. package/lib/0645cf743e4e44ca9da321d689897f07.png +0 -0
  36. package/lib/09db77de0c24fa0f45f8a5cf299a3d11.png +0 -0
  37. package/lib/1d0b52448de217857b270af807e9360d.png +0 -0
  38. package/lib/25d78d77c9c2f0d403e5d899ceb5b1ef.png +0 -0
  39. package/lib/27fa44ff0c98e1594d79b73045aabedf.png +0 -0
  40. package/lib/2c95075adb68d6131b59cae9fa554ec2.png +0 -0
  41. package/lib/377c871d922a25c773a9e7c2f42ed7c0.png +0 -0
  42. package/lib/3d901589b40bd56ff1fde2bbb700bfe1.png +0 -0
  43. package/lib/4abe481e130d7be0574e45573de8beb7.png +0 -0
  44. package/lib/95ee2260a509cd630d89c5367ed1973b.png +0 -0
  45. package/lib/b9dd5ff3622296fbee51ed68f4bca1bf.png +0 -0
  46. package/lib/bd2921989f9296089ba58efb7a76f3ef.png +0 -0
  47. package/lib/index.html +0 -6
  48. package/lib/main.css +0 -16420
  49. package/lib/tntd.js +0 -2
  50. package/lib/tntd.js.LICENSE.txt +0 -36
@@ -1,8 +1,10 @@
1
+ import { useContext } from 'react';
1
2
  import styled, { createGlobalStyle } from 'styled-components';
2
3
  import { Popover, Button } from 'antd';
3
4
  import deleteAllCookiesFactory from 'delete-all-cookies';
4
5
  import { get } from 'lodash';
5
6
  import images from './images';
7
+ import ActionsContext from './ActionsContext';
6
8
 
7
9
  const Avatar = styled.li`
8
10
  margin-right: 0;
@@ -73,6 +75,7 @@ const UserInfoWrapper = styled.div`
73
75
 
74
76
  const UserInfoContent = props => {
75
77
  const { userInfo, onLogout, onChangePassword = () => true, onPersonalSetting = () => true } = props;
78
+ const { getText } = useContext(ActionsContext);
76
79
 
77
80
  return (
78
81
  <UserInfoWrapper className="user-info-setting-wrap">
@@ -83,8 +86,8 @@ const UserInfoContent = props => {
83
86
  <p className="user-info-body-account">
84
87
  {userInfo.account}
85
88
  </p>
86
- <a onClick={onPersonalSetting} href="/bridge/userCenter?currentTab=1">个人设置</a>
87
- <a onClick={onChangePassword} href="/bridge/userCenter?currentTab=2">修改密码</a>
89
+ <a onClick={onPersonalSetting} href="/bridge/userCenter?currentTab=1">{getText('personalSettings')}</a>
90
+ <a onClick={onChangePassword} href="/bridge/userCenter?currentTab=2">{getText('changePwd')}</a>
88
91
  </div>
89
92
  <div className="user-info-footer">
90
93
  <Button
@@ -99,7 +102,7 @@ const UserInfoContent = props => {
99
102
  }
100
103
  }}
101
104
  >
102
- <a>退出</a>
105
+ <a>{getText('signOut')}</a>
103
106
  </Button>
104
107
  </div>
105
108
  </UserInfoWrapper>
@@ -4,6 +4,7 @@ import styled from 'styled-components';
4
4
  import { debounce } from 'lodash';
5
5
  import { traverseTree, hasLevel3 } from '../utils';
6
6
  import Icon from '../Iconfont';
7
+ import { getText } from '../../locale';
7
8
 
8
9
  const SearchArea = styled.div`
9
10
  position: relative;
@@ -143,6 +144,7 @@ const SearchList = ({ items, onSelectMenu, theme }) => (
143
144
  export default ({ theme, menus = [], close, actions, popupRef, containerRef }) => {
144
145
  const [active, setActive] = useState(false);
145
146
  const [searchValue, setSearchValue] = useState();
147
+ const language = actions?.getLanguage();
146
148
  const isLevel3 = hasLevel3(menus);
147
149
  const [activeTopMenu, setActiveTopMenu] = useState(isLevel3 ? menus?.[0] : null);
148
150
  const selectedMenuKey = actions.getSelectedMenuKey();
@@ -274,7 +276,7 @@ export default ({ theme, menus = [], close, actions, popupRef, containerRef }) =
274
276
  <SearchArea theme={theme} className={cn({ active })}>
275
277
  <Icon type="search" />
276
278
  <input
277
- placeholder="菜单搜索"
279
+ placeholder={actions?.getText('menuSearch')}
278
280
  value={searchValue}
279
281
  onChange={onSearchChange}
280
282
  onFocus={() => setActive(true)}
@@ -300,7 +302,7 @@ export default ({ theme, menus = [], close, actions, popupRef, containerRef }) =
300
302
  className={cn({ active: menu.code === activeTopMenu?.code})}
301
303
  onClick={() => onSelectAppTab(menu)}
302
304
  >
303
- {menu?.groupName}
305
+ {menu?.[language === 'cn' ? 'groupName' : 'enName']}
304
306
  </li>
305
307
  ))
306
308
  }
@@ -314,7 +316,7 @@ export default ({ theme, menus = [], close, actions, popupRef, containerRef }) =
314
316
  {
315
317
  groups?.map(group => (
316
318
  <GroupMenuItem theme={theme}>
317
- <h5>{group.groupName}</h5>
319
+ <h5>{group?.[language === 'cn' ? 'groupName' : 'enName']}</h5>
318
320
  <MenuList>
319
321
  {
320
322
  (group.children || []).map(menu => (
@@ -328,7 +330,7 @@ export default ({ theme, menus = [], close, actions, popupRef, containerRef }) =
328
330
  href={menu.path}
329
331
  onClick={evt => evt.preventDefault()}
330
332
  >
331
- {menu.menuName}
333
+ {menu?.[language === 'cn' ? 'menuName' : 'enName']}
332
334
  </a>
333
335
  </MenuItem>
334
336
  ))
@@ -63,6 +63,7 @@ const GlobalStyle = createGlobalStyle`
63
63
  export default withTheme(
64
64
  props => {
65
65
  const actions = useContext(ActionsContext);
66
+ const { getText } = actions;
66
67
  const { headerRef, menus } = props;
67
68
  const [visible, setVisible] = useState(false);
68
69
  const popupRef = useRef();
@@ -108,7 +109,7 @@ export default withTheme(
108
109
  className={cn({ active: visible })}
109
110
  >
110
111
  <Icon type="unordered-list" />
111
- <span>全局导航</span>
112
+ <span>{getText('globalNavigation')}</span>
112
113
  <GlobalStyle hasLevel3={hasLevel3(menus)}/>
113
114
  </Navigation>
114
115
  );
@@ -82,6 +82,7 @@ export default withTheme(
82
82
  AvatarCustom,
83
83
  ...rest
84
84
  } = props;
85
+
85
86
  return (
86
87
  <Actions {...rest}>
87
88
  {extraActions}
@@ -262,7 +262,8 @@ ReactDOM.render(
262
262
  enName="Private Cloud"
263
263
  config={{
264
264
  globalNavigation: true,
265
- theme:true
265
+ theme:true,
266
+ language: true
266
267
  }}
267
268
  appList={[
268
269
  { key: 'movie', name: '电影图谱', children: [{ key: 'movie1', name: 'subitem' }] },
@@ -1,9 +1,11 @@
1
1
  import EventEmitter from 'eventemitter3';
2
+ import { getText } from '../locale';
2
3
 
3
- export default () => {
4
+ export default (params) => {
4
5
  const eventEmitter = new EventEmitter();
5
6
  const data = {
6
- selectedMenuKey: null
7
+ language: params?.language || 'cn',
8
+ selectedMenuKey: null,
7
9
  };
8
10
 
9
11
  return {
@@ -16,6 +18,12 @@ export default () => {
16
18
  },
17
19
  getSelectedMenuKey: () => data.selectedMenuKey,
18
20
 
21
+ getLanguage: () => data.language,
22
+
23
+ setLanguage: language => data.language = language,
24
+
25
+ getText: (key, language = data.language) => getText(key, language),
26
+
19
27
  on: (eventName, callback) => {
20
28
  eventEmitter.on(eventName, callback);
21
29
  },
@@ -9,6 +9,7 @@ import AuthContext from '../AuthContext';
9
9
  import { safeParseJSON, findMenuInfoByPath } from './utils';
10
10
  import ActionsContext from './ActionsContext';
11
11
  import createActions from './createActions';
12
+ import { getLanguageStore } from './storage';
12
13
 
13
14
  export const HeaderActionItem = props => (
14
15
  <li {...props}>
@@ -42,6 +43,11 @@ const TNTLayout = ({ type, config, ...props }) => {
42
43
  const extendMap = typeof props.extendMap === 'string' ? safeParseJSON(props.extendMap, {}) : props.extendMap;
43
44
  const { displayType = 'default', menuAlignMode, globalNavigation = false, language = ['cn'], themeSwitch = true } = extendMap || {};
44
45
  const userInfo = props.userInfo || {};
46
+ const actionsContextValue = createActions({ language: getLanguageStore() || userInfo.lang || 'cn' });
47
+ const onLanguageChange = language => {
48
+ actionsContextValue.setLanguage(language);
49
+ props?.onLanguageChange(language);
50
+ };
45
51
 
46
52
  // layout上的指定的属性优先级会高于extendMap中的属性
47
53
  type = type || displayType;
@@ -55,7 +61,7 @@ const TNTLayout = ({ type, config, ...props }) => {
55
61
  return (
56
62
  <ThemeProvider theme={theme}>
57
63
  <AuthContext.Provider value={getCheckAuth(props.menus)}>
58
- <ActionsContext.Provider value={createActions()}>
64
+ <ActionsContext.Provider value={actionsContextValue}>
59
65
  {
60
66
  type === 'paas' &&
61
67
  <PaasLayout
@@ -65,6 +71,7 @@ const TNTLayout = ({ type, config, ...props }) => {
65
71
  extraHeaderActions={extraHeaderActions}
66
72
  isInIframe={isInIframe}
67
73
  userInfo={userInfo}
74
+ onLanguageChange={onLanguageChange}
68
75
  />
69
76
  }
70
77
  {
@@ -76,6 +83,7 @@ const TNTLayout = ({ type, config, ...props }) => {
76
83
  extraHeaderActions={extraHeaderActions}
77
84
  isInIframe={isInIframe}
78
85
  userInfo={userInfo}
86
+ onLanguageChange={onLanguageChange}
79
87
  />
80
88
  }
81
89
  {
@@ -87,6 +95,7 @@ const TNTLayout = ({ type, config, ...props }) => {
87
95
  extraHeaderActions={extraHeaderActions}
88
96
  isInIframe={isInIframe}
89
97
  userInfo={userInfo}
98
+ onLanguageChange={onLanguageChange}
90
99
  />
91
100
  }
92
101
  </ActionsContext.Provider>
@@ -4,7 +4,7 @@ import { addUnitForValue } from './utils';
4
4
 
5
5
  const Box = ({
6
6
  inLayout,
7
- clsPrefix,
7
+ clsPrefix = 'tnt-page',
8
8
  children,
9
9
  noPadding = false,
10
10
  headerHeight,
@@ -46,8 +46,8 @@ const Box = ({
46
46
  bordered={bordered}
47
47
  bodyStyle={{
48
48
  ...bodyStyle,
49
- overflow: 'auto',
50
- height: inLayout ? 'auto' : cardBodyHeight
49
+ // overflow: 'auto',
50
+ height: inLayout ? `calc(100% - ${headerHeight})` : cardBodyHeight
51
51
  }}
52
52
  size={size}
53
53
  headStyle={headStyle}
@@ -67,8 +67,8 @@ const Demo = (props) => {
67
67
  <h3>第三种场景, 无标题栏</h3>
68
68
 
69
69
  <Page height="400px">
70
- <Box title='分组列表' extra={<Button type="primary" size="small">添加</Button>}>第一列</Box>
71
- <Box mode="white" title='菜单列表' extra={<Button type="primary" size="small">添加</Button>}>第二列</Box>
70
+ <Box title='分组列表' extra={<Button type="primary" size='small'>添加</Button>}>第一列</Box>
71
+ <Box mode="white" title='菜单列表' extra={<Button type="primary" size='small'>添加</Button>}>第二列</Box>
72
72
  <Box title="系统列表">第三列</Box>
73
73
  <Box title="功能注册">第四列</Box>
74
74
  </Page>
@@ -86,7 +86,13 @@ const Demo = (props) => {
86
86
  // extra={right}
87
87
  inLayout
88
88
  >
89
- <Box title="系统列表" width={320}>第三列</Box>
89
+ <Box
90
+ title="系统列表"
91
+ width={320}
92
+ mode='white'
93
+ >
94
+ 第三列
95
+ </Box>
90
96
  <Box title="功能注册">
91
97
  第四列<br/>
92
98
  第四列<br/>
@@ -114,7 +120,14 @@ const Demo = (props) => {
114
120
  第四列<br/>
115
121
  第四列<br/>
116
122
  第四列<br/>
117
- 第四列<br/>
123
+ 第四列end
124
+ </Box>
125
+ <Box
126
+ title="系统列表"
127
+ width={200}
128
+ mode='white'
129
+ >
130
+ 第三列
118
131
  </Box>
119
132
  </Page>
120
133
  </Layout>
@@ -154,7 +167,6 @@ ReactDOM.render(<Demo />, document.getElementById('root'))
154
167
 
155
168
 
156
169
 
157
-
158
170
  #### Page.Box
159
171
 
160
172
  描述:Page.Box包裹了antd库中的Card组件,Box属性都会透传到Card组件。
@@ -62,13 +62,13 @@ const PageLayout = ({
62
62
  console.log(boxCount);
63
63
 
64
64
  whiteCols = childrenToArray?.filter(({ props }) => props?.mode === 'white')?.length;
65
- const total = childrenToArray?.length;
65
+ const total = childrenToArray?.length + 5;
66
66
  let startIndex = total - whiteCols - 1;
67
- let endIndex = total - 1;
67
+ let endIndex = total - 2;
68
68
  const headerStyle = {
69
69
  height: computedHeaderHeight,
70
70
  padding: `${size === 'small' ? 20 : 24}px`,
71
- zIndex: total || 2
71
+ zIndex: inLayout ? 1 : total || 1
72
72
  };
73
73
  const contentStyle = {
74
74
  display: boxCount > 0 ? 'flex' : 'block',
@@ -140,7 +140,7 @@ const PageLayout = ({
140
140
  const style = {
141
141
  flex: computeWidth(width),
142
142
  // 设置cols层级关系
143
- zIndex: mode === 'gray' ? startIndex-- : endIndex--
143
+ zIndex: mode === 'gray' ? endIndex-- : startIndex++
144
144
  };
145
145
 
146
146
  const className = cn(`${clsPrefix}-box ${clsPrefix}-box-${mode}`);
@@ -1,26 +1,46 @@
1
+ .large-size > .ant-layout-content {
2
+ .tnt-page.in-layout {
3
+ height: calc(100vh - 60px);
4
+ }
5
+ }
1
6
  .tnt-page {
2
7
  position: relative;
3
8
  width: 100%;
4
9
  height: 100%;
5
10
  overflow-y: hidden;
6
11
 
12
+ &.in-layout {
13
+ box-shadow: none;
14
+ height: calc(100vh - 50px);
15
+ .tnt-page-box,
16
+ .tnt-page-box > .ant-card {
17
+ height: 100%;
18
+ }
19
+ .tnt-page-content .tnt-page-box .ant-card .ant-card-body {
20
+ overflow-x: hidden;
21
+ overflow-y: auto;
22
+ }
23
+ }
24
+
7
25
  &-box-white {
8
26
  z-index: 1;
9
27
  background: #f3f5f6;
10
28
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1), 0 10px 12px 2px rgba(170, 182, 206, 0.2);
11
- .inLayout & {
12
- background: #fbfcfe;
13
- box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1), 0 6px 10px 2px rgba(170, 182, 206, 0.2);
29
+
30
+ .in-layout & {
31
+ background: #fafbfc;
14
32
  }
15
33
  }
16
34
 
35
+
17
36
  &-box-gray {
18
37
  background: #e8ebed;
19
38
  box-shadow: 0 10px 12px 2px rgba(0, 0, 0, 0.1);
20
39
 
21
- .inLayout & {
40
+ .in-layout & {
22
41
  background: #f8f9fa;
23
- box-shadow: 0 5px 5px 2px rgba(0, 0, 0, 0.1);
42
+ // box-shadow: 0 5px 5px 2px rgba(0, 0, 0, 0.1);
43
+ box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.1);
24
44
  }
25
45
  }
26
46
 
@@ -36,7 +56,7 @@
36
56
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1),
37
57
  0 10px 6px 0 rgba(170, 182, 206, 0.2);
38
58
 
39
- .inLayout & {
59
+ .in-layout & {
40
60
  background: #ffffff;
41
61
  box-shadow: none;
42
62
  }
@@ -76,9 +96,13 @@
76
96
  .ant-card-head {
77
97
  border-bottom: 1px solid #e0e0e0;
78
98
  margin-bottom: 0;
79
- height: 60px;
99
+ // height: 60px;
80
100
  .small & {
81
101
  height: 40px;
102
+ line-height: 40px;
103
+ }
104
+ .ant-card-head-title {
105
+ font-weight: normal;
82
106
  }
83
107
  }
84
108
  .ant-card-body {
@@ -6,10 +6,10 @@ import useForm from './useForm';
6
6
  import createActions from './createActions';
7
7
  import Icon from '../Icon';
8
8
  import Field from './Field';
9
+ import { getText, getLanguage } from '../locale';
9
10
  import './index.less';
10
11
 
11
12
  const clsPrefix = 'tnt-queryform';
12
- const isInput = type => ['input', 'string', 'search'].includes(type);
13
13
 
14
14
  class QueryForm extends React.PureComponent {
15
15
  constructor(props) {
@@ -50,7 +50,7 @@ class QueryForm extends React.PureComponent {
50
50
  <Badge count={drawerFieldsValueCount}>
51
51
  <Button onClick={this.onShowDrawer}>
52
52
  <Icon type="filter" />
53
- 更多过滤
53
+ {this.getText('moreFiltering')}
54
54
  </Button>
55
55
  </Badge>
56
56
  )
@@ -58,14 +58,14 @@ class QueryForm extends React.PureComponent {
58
58
  {
59
59
  showSearch && (
60
60
  <Button type="primary" onClick={this.onSearch}>
61
- 搜索
61
+ {this.getText('search')}
62
62
  </Button>
63
63
  )
64
64
  }
65
65
  {
66
66
  showReset && (
67
67
  <Button onClick={this.onReset}>
68
- 重置
68
+ {this.getText('reset')}
69
69
  </Button>
70
70
  )
71
71
  }
@@ -76,7 +76,7 @@ class QueryForm extends React.PureComponent {
76
76
  type="link"
77
77
  onClick={this.onToggleExpand}
78
78
  >
79
- {expanded ? '收起' : '展开'}
79
+ {this.getText(expanded ? 'collapse' : 'expand')}
80
80
  </Button>
81
81
  )
82
82
  }
@@ -117,7 +117,7 @@ class QueryForm extends React.PureComponent {
117
117
  {
118
118
  showFieldCount && (
119
119
  <Drawer
120
- title="更多过滤"
120
+ title={this.getText('moreFiltering')}
121
121
  visible={drawerVisible}
122
122
  onClose={() => this.setState({ drawerVisible: false })}
123
123
  width={300}
@@ -143,10 +143,10 @@ class QueryForm extends React.PureComponent {
143
143
  )
144
144
  }
145
145
  <Button type="primary" onClick={this.onSearch}>
146
- 搜索
146
+ {this.getText('search')}
147
147
  </Button>
148
148
  <Button onClick={this.onReset}>
149
- 重置
149
+ {this.getText('reset')}
150
150
  </Button>
151
151
  </Drawer>
152
152
  )
@@ -163,6 +163,10 @@ class QueryForm extends React.PureComponent {
163
163
  );
164
164
  }
165
165
 
166
+ getText(key) {
167
+ return getText(key, this.props.language || getLanguage());
168
+ }
169
+
166
170
  isFieldsWidthOverflow() {
167
171
  const { current } = this.fieldsRef;
168
172
 
@@ -8,6 +8,7 @@ import cn from 'classnames';
8
8
  import { get, pickBy, isEmpty, debounce, throttle } from 'lodash';
9
9
  import { Spin } from 'antd';
10
10
  import Table from '../Table';
11
+ import { getText, getLanguage } from '../locale';
11
12
 
12
13
  export default class QueryList extends React.PureComponent {
13
14
  constructor(props) {
@@ -57,7 +58,7 @@ export default class QueryList extends React.PureComponent {
57
58
  // size: 'small',
58
59
  showQuickJumper: true,
59
60
  showSizeChanger: true,
60
- showTotal: total => `共${total}条记录`,
61
+ showTotal: total => getText('totalRecords', getLanguage(), total),
61
62
  ...(pagination || {})
62
63
  };
63
64
  const expandProps = {
@@ -0,0 +1,60 @@
1
+
2
+ export const zh_CN = {
3
+ globalNavigation: '全局导航',
4
+ menuSearch: '菜单搜索',
5
+
6
+ // QueryForm
7
+ search: '搜索',
8
+ reset: '重置',
9
+ moreFiltering: '更多过滤',
10
+ expand: '展开',
11
+ collapse: '收起',
12
+
13
+ // QueryListScene
14
+ totalRecords: '共%s条记录',
15
+
16
+ // user popover
17
+ personalSettings: '个人设置',
18
+ changePwd: '修改密码',
19
+ signOut: '退出'
20
+ };
21
+
22
+ export const en_US = {
23
+ globalNavigation: 'Global Navigation',
24
+ menuSearch: 'Menu Search',
25
+
26
+
27
+ // QueryForm
28
+ search: 'Search',
29
+ reset: 'Reset',
30
+ moreFiltering: 'More filtering',
31
+ expand: 'Expand',
32
+ collapse: 'Collapse',
33
+
34
+ // QueryListScene
35
+ totalRecords: 'Total of %s records',
36
+
37
+ // user popover
38
+ personalSettings: 'Personal settings',
39
+ changePwd: 'Change password',
40
+ signOut: 'Sign out'
41
+ };
42
+
43
+ export const getText = (key, language = 'cn', ...params) => {
44
+ const text = ({
45
+ cn: zh_CN,
46
+ en: en_US
47
+ }[language] || zh_CN)?.[key];
48
+
49
+ if (params?.length) {
50
+ return params.reduce((acc, cur) => {
51
+ return acc.replace(/%s/, cur);
52
+ }, text);
53
+ }
54
+
55
+ return text;
56
+ };
57
+
58
+ export const getLanguage = () => localStorage.getItem('lang') || 'cn';
59
+
60
+ export default { en_US, zh_CN };
@@ -15,6 +15,8 @@ require("antd/lib/button/style");
15
15
 
16
16
  var _button = _interopRequireDefault(require("antd/lib/button"));
17
17
 
18
+ var _react = require("react");
19
+
18
20
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
19
21
 
20
22
  var _deleteAllCookies = _interopRequireDefault(require("delete-all-cookies"));
@@ -23,6 +25,8 @@ var _lodash = require("lodash");
23
25
 
24
26
  var _images = _interopRequireDefault(require("./images"));
25
27
 
28
+ var _ActionsContext = _interopRequireDefault(require("./ActionsContext"));
29
+
26
30
  function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
27
31
 
28
32
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -78,6 +82,10 @@ var UserInfoContent = function UserInfoContent(props) {
78
82
  onPersonalSetting = _props$onPersonalSett === void 0 ? function () {
79
83
  return true;
80
84
  } : _props$onPersonalSett;
85
+
86
+ var _useContext = (0, _react.useContext)(_ActionsContext["default"]),
87
+ getText = _useContext.getText;
88
+
81
89
  return React.createElement(UserInfoWrapper, {
82
90
  className: "user-info-setting-wrap"
83
91
  }, React.createElement("div", {
@@ -89,10 +97,10 @@ var UserInfoContent = function UserInfoContent(props) {
89
97
  }, userInfo.account), React.createElement("a", {
90
98
  onClick: onPersonalSetting,
91
99
  href: "/bridge/userCenter?currentTab=1"
92
- }, "\u4E2A\u4EBA\u8BBE\u7F6E"), React.createElement("a", {
100
+ }, getText('personalSettings')), React.createElement("a", {
93
101
  onClick: onChangePassword,
94
102
  href: "/bridge/userCenter?currentTab=2"
95
- }, "\u4FEE\u6539\u5BC6\u7801")), React.createElement("div", {
103
+ }, getText('changePwd'))), React.createElement("div", {
96
104
  className: "user-info-footer"
97
105
  }, React.createElement(_button["default"], {
98
106
  className: "user-info-footer-signout",
@@ -105,7 +113,7 @@ var UserInfoContent = function UserInfoContent(props) {
105
113
  window.location.href = "/user/login?callbackUrl=".concat(window.encodeURI(location.href));
106
114
  }
107
115
  }
108
- }, React.createElement("a", null, "\u9000\u51FA"))));
116
+ }, React.createElement("a", null, getText('signOut')))));
109
117
  };
110
118
 
111
119
  var _default = function _default(props) {
@@ -17,6 +17,8 @@ var _utils = require("../utils");
17
17
 
18
18
  var _Iconfont = _interopRequireDefault(require("../Iconfont"));
19
19
 
20
+ var _locale = require("../../locale");
21
+
20
22
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
21
23
 
22
24
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
@@ -177,6 +179,7 @@ var _default = function _default(_ref2) {
177
179
  searchValue = _useState4[0],
178
180
  setSearchValue = _useState4[1];
179
181
 
182
+ var language = actions == null ? void 0 : actions.getLanguage();
180
183
  var isLevel3 = (0, _utils.hasLevel3)(menus);
181
184
 
182
185
  var _useState5 = (0, _react.useState)(isLevel3 ? menus == null ? void 0 : menus[0] : null),
@@ -359,7 +362,7 @@ var _default = function _default(_ref2) {
359
362
  }, React.createElement(_Iconfont["default"], {
360
363
  type: "search"
361
364
  }), React.createElement("input", {
362
- placeholder: "\u83DC\u5355\u641C\u7D22",
365
+ placeholder: actions == null ? void 0 : actions.getText('menuSearch'),
363
366
  value: searchValue,
364
367
  onChange: onSearchChange,
365
368
  onFocus: function onFocus() {
@@ -385,7 +388,7 @@ var _default = function _default(_ref2) {
385
388
  onClick: function onClick() {
386
389
  return onSelectAppTab(menu);
387
390
  }
388
- }, menu == null ? void 0 : menu.groupName);
391
+ }, menu == null ? void 0 : menu[language === 'cn' ? 'groupName' : 'enName']);
389
392
  })), React.createElement(GroupMenus, {
390
393
  theme: theme,
391
394
  isLevel3: isLevel3
@@ -393,7 +396,7 @@ var _default = function _default(_ref2) {
393
396
  return React.createElement("div", null, groups == null ? void 0 : groups.map(function (group) {
394
397
  return React.createElement(GroupMenuItem, {
395
398
  theme: theme
396
- }, React.createElement("h5", null, group.groupName), React.createElement(MenuList, null, (group.children || []).map(function (menu) {
399
+ }, React.createElement("h5", null, group == null ? void 0 : group[language === 'cn' ? 'groupName' : 'enName']), React.createElement(MenuList, null, (group.children || []).map(function (menu) {
397
400
  return React.createElement(MenuItem, {
398
401
  key: menu.code,
399
402
  className: (0, _classnames["default"])({
@@ -408,7 +411,7 @@ var _default = function _default(_ref2) {
408
411
  onClick: function onClick(evt) {
409
412
  return evt.preventDefault();
410
413
  }
411
- }, menu.menuName));
414
+ }, menu == null ? void 0 : menu[language === 'cn' ? 'menuName' : 'enName']));
412
415
  })));
413
416
  }));
414
417
  })));
@@ -100,6 +100,7 @@ var GlobalStyle = (0, _styledComponents.createGlobalStyle)(_templateObject2(), f
100
100
 
101
101
  var _default = (0, _styledComponents.withTheme)(function (props) {
102
102
  var actions = (0, _react.useContext)(_ActionsContext["default"]);
103
+ var getText = actions.getText;
103
104
  var headerRef = props.headerRef,
104
105
  menus = props.menus;
105
106
 
@@ -156,7 +157,7 @@ var _default = (0, _styledComponents.withTheme)(function (props) {
156
157
  })
157
158
  }, React.createElement(_Iconfont["default"], {
158
159
  type: "unordered-list"
159
- }), React.createElement("span", null, "\u5168\u5C40\u5BFC\u822A"), React.createElement(GlobalStyle, {
160
+ }), React.createElement("span", null, getText('globalNavigation')), React.createElement(GlobalStyle, {
160
161
  hasLevel3: (0, _utils.hasLevel3)(menus)
161
162
  }));
162
163
  });
@@ -262,7 +262,8 @@ ReactDOM.render(
262
262
  enName="Private Cloud"
263
263
  config={{
264
264
  globalNavigation: true,
265
- theme:true
265
+ theme:true,
266
+ language: true
266
267
  }}
267
268
  appList={[
268
269
  { key: 'movie', name: '电影图谱', children: [{ key: 'movie1', name: 'subitem' }] },