fix(locale): 修复国际化配置不生效 close #1394 (#1397)

* fix(locale): 修复国际化配置不生效 close #1394 * fix: 去掉 isEnUS
antvis · Jun 2, 2022 · be9d4ad · be9d4ad
1 parent 541ef89
commit be9d4ad
Show file tree

Hide file tree

Showing 26 changed files with 473 additions and 352 deletions.
diff --git a/packages/s2-core/__tests__/unit/common/i18n/index-spec.ts b/packages/s2-core/__tests__/unit/common/i18n/index-spec.ts
@@ -1,6 +1,20 @@
-import { i18n, setLang } from '@/common/i18n';
+import { getLang, i18n, setLang } from '@/common/i18n';
 
 describe('I18n Test', () => {
+  test('should get default chinese lang', () => {
+    expect(getLang()).toEqual('zh_CN');
+  });
+
+  test('should set custom lang', () => {
+    setLang('en_US');
+    expect(getLang()).toEqual('en_US');
+  });
+
+  test('should get default chinese lang if receive a empty lang type', () => {
+    setLang(null);
+    expect(getLang()).toEqual('zh_CN');
+  });
+
   test('should show english text when set lang to en', () => {
     setLang('en_US');
     expect(i18n('小计')).toEqual('Total');

diff --git a/packages/s2-core/src/common/constant/tooltip.ts b/packages/s2-core/src/common/constant/tooltip.ts
@@ -13,19 +13,19 @@ export const TOOLTIP_POSITION_OFFSET: TooltipPosition = {
   y: 10,
 };
 
-export const TOOLTIP_OPERATOR_HIDDEN_COLUMNS_MENU: TooltipOperatorMenu = {
+export const getTooltipOperatorHiddenColumnsMenu = (): TooltipOperatorMenu => ({
   key: 'hiddenColumns',
   text: i18n('隐藏'),
   icon: 'EyeOutlined',
-};
+});
 
-export const TOOLTIP_OPERATOR_TREND_MENU: TooltipOperatorMenu = {
+export const getTooltipOperatorTrendMenu = (): TooltipOperatorMenu => ({
   key: 'trend',
   text: i18n('趋势'),
   icon: 'Trend',
-};
+});
 
-export const TOOLTIP_OPERATOR_SORT_MENUS: TooltipOperatorMenu[] = [
+export const getTooltipOperatorSortMenus = (): TooltipOperatorMenu[] => [
   {
     key: 'asc',
     icon: 'groupAsc',
@@ -42,7 +42,7 @@ export const TOOLTIP_OPERATOR_SORT_MENUS: TooltipOperatorMenu[] = [
   },
 ];
 
-export const TOOLTIP_OPERATOR_TABLE_SORT_MENUS: TooltipOperatorMenu[] = [
+export const getTooltipOperatorTableSortMenus = (): TooltipOperatorMenu[] => [
   {
     key: 'asc',
     icon: 'groupAsc',

diff --git a/packages/s2-core/src/common/i18n/index.ts b/packages/s2-core/src/common/i18n/index.ts
@@ -2,13 +2,15 @@ import { get, merge } from 'lodash';
 import { ZH_CN as BASE_ZH_CN } from './zh_CN';
 import { EN_US as BASE_EN_US } from './en_US';
 
+const DEFAULT_LANG: LangType = 'zh_CN';
+
 export type LangType = 'zh_CN' | 'en_US';
 
 export type LocaleType = {
   [K in LangType]: Record<string, string>;
 };
 
-let lang: LangType = 'zh_CN';
+let lang: LangType = DEFAULT_LANG;
 
 let locale: LocaleType = {
   zh_CN: BASE_ZH_CN,
@@ -17,28 +19,23 @@ let locale: LocaleType = {
 
 export const getLang = () => lang;
 
-const isEnUS = (l: LangType) => l.indexOf('en') === 0;
-
 /**
  * 设置语言
  * @param lang
  */
-export const setLang = (l: LangType) => {
-  lang = isEnUS(l) ? 'en_US' : 'zh_CN';
+export const setLang = (langType: LangType) => {
+  lang = langType || DEFAULT_LANG;
 };
 
 /**
  * 拓展locale配置
  */
-export const extendLocale = (extend: LocaleType) => {
-  locale = merge({}, locale, extend);
+export const extendLocale = (extraLocale: LocaleType) => {
+  locale = merge({}, locale, extraLocale);
 };
 
-/**
- * 国际化方法
- * 国际化是 eva 整个整体设置，不跟着实例走！默认认为同一页面，不可能出现中文和英文两种语言
- *
- */
+export const getLocale = () => locale;
+
 export const i18n = (key: string, defaultValue = key) => {
   return get(locale, [lang, key], defaultValue);
 };
diff --git a/packages/s2-core/src/interaction/base-interaction/click/data-cell-click.ts b/packages/s2-core/src/interaction/base-interaction/click/data-cell-click.ts
@@ -7,7 +7,7 @@ import {
   InteractionStateName,
   InterceptType,
   S2Event,
-  TOOLTIP_OPERATOR_TREND_MENU,
+  getTooltipOperatorTrendMenu,
 } from '@/common/constant';
 import {
   CellAppendInfo,
@@ -59,6 +59,7 @@ export class DataCellClick extends BaseEvent implements BaseEventImplement {
     event: CanvasEvent,
     meta: ViewMeta,
   ): TooltipOperatorOptions {
+    const TOOLTIP_OPERATOR_TREND_MENU = getTooltipOperatorTrendMenu();
     const cell = this.spreadsheet.getCell(event.target);
     const { operation } = getTooltipOptions(this.spreadsheet, event);
     const trendMenu = operation.trend && {

diff --git a/packages/s2-core/src/interaction/base-interaction/click/row-column-click.ts b/packages/s2-core/src/interaction/base-interaction/click/row-column-click.ts
@@ -10,7 +10,7 @@ import {
   S2Event,
   InterceptType,
   CellTypes,
-  TOOLTIP_OPERATOR_HIDDEN_COLUMNS_MENU,
+  getTooltipOperatorHiddenColumnsMenu,
 } from '@/common/constant';
 import {
   TooltipOperation,
@@ -114,6 +114,9 @@ export class RowColumnClick extends BaseEvent implements BaseEventImplement {
     const isOnlyOneLeafColumn =
       this.spreadsheet.getColumnLeafNodes().length === 1;
 
+    const TOOLTIP_OPERATOR_HIDDEN_COLUMNS_MENU =
+      getTooltipOperatorHiddenColumnsMenu();
+
     const enableHiddenColumnOperator =
       isColCell &&
       !isOnlyOneLeafColumn &&

diff --git a/packages/s2-core/src/sheet-type/pivot-sheet.ts b/packages/s2-core/src/sheet-type/pivot-sheet.ts
@@ -7,7 +7,7 @@ import {
   EXTRA_FIELD,
   InterceptType,
   S2Event,
-  TOOLTIP_OPERATOR_SORT_MENUS,
+  getTooltipOperatorTableSortMenus,
 } from '@/common/constant';
 import {
   S2Options,
@@ -196,6 +196,8 @@ export class PivotSheet extends SpreadSheet {
   public handleGroupSort(event: CanvasEvent, meta: Node) {
     event.stopPropagation();
     this.interaction.addIntercepts([InterceptType.HOVER]);
+
+    const TOOLTIP_OPERATOR_SORT_MENUS = getTooltipOperatorTableSortMenus();
     const operator: TooltipOperatorOptions = {
       onClick: ({ key }) => {
         this.groupSortByMethod(key as unknown as SortMethod, meta);

diff --git a/packages/s2-core/src/sheet-type/table-sheet.ts b/packages/s2-core/src/sheet-type/table-sheet.ts
@@ -13,7 +13,7 @@ import {
   KEY_GROUP_PANEL_FROZEN_TRAILING_ROW,
   PANEL_GROUP_FROZEN_GROUP_Z_INDEX,
   S2Event,
-  TOOLTIP_OPERATOR_TABLE_SORT_MENUS,
+  getTooltipOperatorSortMenus,
 } from '@/common/constant';
 import {
   S2Options,
@@ -168,6 +168,8 @@ export class TableSheet extends SpreadSheet {
   public handleGroupSort(event: CanvasEvent, meta: Node) {
     event.stopPropagation();
     this.interaction.addIntercepts([InterceptType.HOVER]);
+
+    const TOOLTIP_OPERATOR_TABLE_SORT_MENUS = getTooltipOperatorSortMenus();
     const operator: TooltipOperatorOptions = {
       onClick: (params: { key: string }) =>
         this.onSortTooltipClick(params, meta),

diff --git a/packages/s2-react/playground/index.tsx b/packages/s2-react/playground/index.tsx
@@ -32,6 +32,8 @@ import {
   DataType,
   generatePalette,
   getPalette,
+  getLang,
+  setLang,
 } from '@antv/s2';
 import corePkg from '@antv/s2/package.json';
 import { debounce, forEach, random } from 'lodash';
@@ -57,6 +59,8 @@ import { SheetComponent, PartDrillDown, PartDrillDownInfo } from '@/index';
 import './index.less';
 import 'antd/dist/antd.min.css';
 
+// setLang('en_US');
+
 const { TabPane } = Tabs;
 
 const fieldMap = {
@@ -841,6 +845,9 @@ function MainLayout() {
                     <span>
                       {corePkg.name}: <Tag>{corePkg.version}</Tag>
                     </span>
+                    <span>
+                      lang: <Tag>{getLang()}</Tag>
+                    </span>
                   </Space>
                 ),
                 switcherCfg: { open: true },

diff --git a/packages/s2-react/src/common/constant/index.ts b/packages/s2-react/src/common/constant/index.ts
@@ -1,2 +1 @@
 export * from './options';
-export * from './sort';
diff --git a/packages/s2-react/src/components/advanced-sort/custom-sort.tsx b/packages/s2-react/src/components/advanced-sort/custom-sort.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Card } from 'antd';
+import { ADVANCED_SORT_PRE_CLS } from '@antv/s2-shared';
 import { HtmlIcon } from '@/common/icons';
-import { ADVANCED_PRE_CLS } from '@/common/constant';
 
 export interface CustomSortProps {
   splitOrders: string[];
@@ -38,23 +38,23 @@ export const CustomSort: React.FC<CustomSortProps> = (props) => {
       <>
         <span className="split-text">{value}</span>
         <span
-          className={`${ADVANCED_PRE_CLS}-split-icon`}
+          className={`${ADVANCED_SORT_PRE_CLS}-split-icon`}
           onClick={() => {
             upHandler(value);
           }}
         >
           <HtmlIcon name="groupAsc" />
         </span>
         <span
-          className={`${ADVANCED_PRE_CLS}-split-icon`}
+          className={`${ADVANCED_SORT_PRE_CLS}-split-icon`}
           onClick={() => {
             downHandler(value);
           }}
         >
           <HtmlIcon name="groupDesc" />
         </span>
         <span
-          className={`${ADVANCED_PRE_CLS}-split-icon`}
+          className={`${ADVANCED_SORT_PRE_CLS}-split-icon`}
           onClick={() => {
             toTopHandler(value);
           }}
@@ -66,11 +66,11 @@ export const CustomSort: React.FC<CustomSortProps> = (props) => {
   };
 
   return (
-    <Card className={`${ADVANCED_PRE_CLS}-card-content`}>
+    <Card className={`${ADVANCED_SORT_PRE_CLS}-card-content`}>
       {splitOrders.map((value) => (
         <li
           key={value}
-          className={`${ADVANCED_PRE_CLS}-split-value`}
+          className={`${ADVANCED_SORT_PRE_CLS}-split-value`}
           title={value}
         >
           {renderItem(value)}
Original file line number	Diff line number	Diff line change
		@@ -1,2 +1 @@
		export * from './options';
		export * from './sort';