perf: 优化日期组件多语言结构

NSFI · Jul 21, 2022 · 123b4fc · 123b4fc
1 parent 8edd344
commit 123b4fc
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 100 deletions.
diff --git a/source/components/DatePicker/panel/DatePanel.js b/source/components/DatePicker/panel/DatePanel.js
@@ -270,9 +270,9 @@ class DatePanel extends React.Component {
   // 切换月份
   handleChangeMonth = (month, locales) => {
     const { currentDate } = this.state;
-    // FIXME: 通过截取 month 的方式不好扩展功能
+    const monthNumber = locales.MONTH_ARRAY.indexOf(month);
     this.setState({
-      currentDate: new Date(new Date(currentDate).setMonth(parseInt(locales[month]) - 1)),
+      currentDate: new Date(new Date(currentDate).setMonth(monthNumber)),
     });
   };
 
@@ -340,7 +340,7 @@ class DatePanel extends React.Component {
                   active: currentView === 'month',
                 })}
               >
-                {Locales[`month${month + 1}`]}
+                {Locales.MONTH_ARRAY[month]}
               </span>
             </YearAndMonthPopover>
           );
@@ -353,7 +353,7 @@ class DatePanel extends React.Component {
               onChange={this.handleChangeYear}
             >
               <span className={`${prefixCls}-date-picker__header-label`}>
-                {`${currentDate.getFullYear()} ${Locales.year}`}
+                {`${currentDate.getFullYear()}${Locales.year}`}
               </span>
             </YearAndMonthPopover>
           );

diff --git a/source/components/DatePicker/panel/DateRangePanel.js b/source/components/DatePicker/panel/DateRangePanel.js
@@ -531,9 +531,10 @@ class DateRangePanel extends React.Component {
 
   // 切换月份
   handleChangeMonth(type, date, month, locales) {
+    const monthNumber = locales.MONTH_ARRAY.indexOf(month);
     this.setState(
       {
-        [type]: new Date(new Date(date).setMonth(parseInt(locales[month]) - 1)),
+        [type]: new Date(new Date(date).setMonth(monthNumber)),
       },
       () => {
         // 切换完月份，若左边日历小于等于右边日历，保持右边日历是左边日历的下一月
@@ -783,7 +784,7 @@ class DateRangePanel extends React.Component {
                       onChange={this.handleChangeYear.bind(this, 'leftDate', leftDate)}
                     >
                       <span className={`${prefixCls}-date-range-picker__header-label`}>
-                        {`${leftDate.getFullYear()} ${Locales.year}`}
+                        {`${leftDate.getFullYear()}${Locales.year}`}
                       </span>
                     </YearAndMonthPopover>
                     <YearAndMonthPopover
@@ -794,7 +795,7 @@ class DateRangePanel extends React.Component {
                       }
                     >
                       <span className={`${prefixCls}-date-range-picker__header-label`}>
-                        {Locales[`month${leftDate.getMonth() + 1}`]}
+                        {Locales.MONTH_ARRAY[leftDate.getMonth()]}
                       </span>
                     </YearAndMonthPopover>
                     <Icon
@@ -872,7 +873,7 @@ class DateRangePanel extends React.Component {
                       }
                     >
                       <span className={`${prefixCls}-date-range-picker__header-label`}>
-                        {Locales[`month${rightDate.getMonth() + 1}`]}
+                        {Locales.MONTH_ARRAY[rightDate.getMonth()]}
                       </span>
                     </YearAndMonthPopover>
                     <Icon

diff --git a/source/components/Locale/en_US.ts b/source/components/Locale/en_US.ts
@@ -38,7 +38,7 @@ const LocaleValue: LocaleProperties = {
     okText: 'OK',
     cancelText: 'Cancel',
     draggableTitle: 'Field',
-    draggableAction: 'Adjust the order'
+    draggableAction: 'Adjust the order',
   },
   DatePicker: {
     now: 'Now',
@@ -56,30 +56,6 @@ const LocaleValue: LocaleProperties = {
     endDate: 'End date',
     endTime: 'End time',
     year: '',
-    month1: 'Jan',
-    month2: 'Feb',
-    month3: 'Mar',
-    month4: 'Apr',
-    month5: 'May',
-    month6: 'Jun',
-    month7: 'Jul',
-    month8: 'Aug',
-    month9: 'Sep',
-    month10: 'Oct',
-    month11: 'Nov',
-    month12: 'Dec',
-    Jan: '1',
-    Feb: '2',
-    Mar: '3',
-    Apr: '4',
-    May: '5',
-    Jun: '6',
-    Jul: '7',
-    Aug: '8',
-    Sep: '9',
-    Oct: '10',
-    Nov: '11',
-    Dec: '12',
     MONTH_ARRAY: [
       'Jan',
       'Feb',

diff --git a/source/components/Locale/zh_CN.ts b/source/components/Locale/zh_CN.ts
@@ -3,14 +3,14 @@ import { LocaleProperties } from '.';
 const localeValues: LocaleProperties = {
   locale: 'zh_CN',
   AudioPlayer: {
-    notSupport: '您的浏览器不支持 audio 标签。'
+    notSupport: '您的浏览器不支持 audio 标签。',
   },
   AutoComplete: {
-    notFoundContent: '无匹配结果'
+    notFoundContent: '无匹配结果',
   },
   Cascader: {
     placeholder: '请选择',
-    notFoundContent: '无匹配结果'
+    notFoundContent: '无匹配结果',
   },
   Table: {
     filterTitle: '筛选',
@@ -54,17 +54,18 @@ const localeValues: LocaleProperties = {
   },
   RichEditor: {
     // editor
-    insertImageTip: '支持jpg、jpeg、png、gif、bmp格式的图片，最佳显示高度不超过400px，宽度不超过270px。',
+    insertImageTip:
+      '支持jpg、jpeg、png、gif、bmp格式的图片，最佳显示高度不超过400px，宽度不超过270px。',
     rule1: '1、单个视频不超过10M，支持MP4、3GP格式视频。',
     rule2: '2、最佳显示高度不超过400px',
-    PleaseEnterTheVideolinkURL: "请输入视频链接URL",
+    PleaseEnterTheVideolinkURL: '请输入视频链接URL',
     selectLocalVideo: '选择本地视频',
     videoLink: '视频链接',
-    localVideo: "本地视频",
+    localVideo: '本地视频',
     insertVideo: '插入视频',
-    selectLocalImage: "选择本地图片",
-    insertAttachment: "插入附件",
-    selectLocalFile: "选择本地文件",
+    selectLocalImage: '选择本地图片',
+    insertAttachment: '插入附件',
+    selectLocalFile: '选择本地文件',
     HyperlinkAddress: '超链接地址',
     insertPicture: '插入图片',
     noVideoLinkErrorTip: '请设置视频源地址',
@@ -116,7 +117,7 @@ const localeValues: LocaleProperties = {
     deleteText: '删除',
   },
   Spin: {
-    loading: '加载中'
+    loading: '加载中',
   },
   Select: {
     errorMessage: '超过选项上限',
@@ -127,7 +128,7 @@ const localeValues: LocaleProperties = {
     selectAllText: '选择所有',
     confirmText: '确定',
     cancelText: '取消',
-    loading: '加载中...'
+    loading: '加载中...',
   },
   Transfer: {
     notFoundContent: '无匹配结果',
@@ -150,7 +151,7 @@ const localeValues: LocaleProperties = {
     previewFile: '预览文件',
     cancelText: '取消',
     deleteText: '全部删除',
-    uploadedTip: '已上传 ${length} 项'
+    uploadedTip: '已上传 ${length} 项',
   },
   List: {
     emptyText: '暂无数据',
@@ -183,31 +184,20 @@ const localeValues: LocaleProperties = {
     endDate: '结束日期',
     endTime: '结束时间',
     year: '年',
-    month1: '1 月',
-    month2: '2 月',
-    month3: '3 月',
-    month4: '4 月',
-    month5: '5 月',
-    month6: '6 月',
-    month7: '7 月',
-    month8: '8 月',
-    month9: '9 月',
-    month10: '10 月',
-    month11: '11 月',
-    month12: '12 月',
-    '1月': '1',
-    '2月': '2',
-    '3月': '3',
-    '4月': '4',
-    '5月': '5',
-    '6月': '6',
-    '7月': '7',
-    '8月': '8',
-    '9月': '9',
-    '10月': '10',
-    '11月': '11',
-    '12月': '12',
-    MONTH_ARRAY: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
+    MONTH_ARRAY: [
+      '1月',
+      '2月',
+      '3月',
+      '4月',
+      '5月',
+      '6月',
+      '7月',
+      '8月',
+      '9月',
+      '10月',
+      '11月',
+      '12月',
+    ],
     week: '周次',
     weeks: {
       sun: '日',
@@ -216,7 +206,7 @@ const localeValues: LocaleProperties = {
       wed: '三',
       thu: '四',
       fri: '五',
-      sat: '六'
+      sat: '六',
     },
     months: {
       jan: '一月',
@@ -230,15 +220,15 @@ const localeValues: LocaleProperties = {
       sep: '九月',
       oct: '十月',
       nov: '十一月',
-      dec: '十二月'
-    }
+      dec: '十二月',
+    },
   },
   VideoViewer: {
     fullScreen: '全屏',
     cancelFullScreen: '取消全屏',
     download: '下载',
-    retry: '重试'
-  }
+    retry: '重试',
+  },
 };
 
 export default localeValues;
diff --git a/source/components/Locale/zh_TW.ts b/source/components/Locale/zh_TW.ts
@@ -32,7 +32,7 @@ const localeValues: LocaleProperties = {
     okText: '確定',
     cancelText: '取消',
     draggableTitle: '字段',
-    draggableAction: '拖拽排序'
+    draggableAction: '拖拽排序',
   },
   Modal: {
     okText: '確定',
@@ -184,30 +184,6 @@ const localeValues: LocaleProperties = {
     endDate: '結束日期',
     endTime: '結束時間',
     year: '年',
-    month1: '1 月',
-    month2: '2 月',
-    month3: '3 月',
-    month4: '4 月',
-    month5: '5 月',
-    month6: '6 月',
-    month7: '7 月',
-    month8: '8 月',
-    month9: '9 月',
-    month10: '10 月',
-    month11: '11 月',
-    month12: '12 月',
-    '1月': '1',
-    '2月': '2',
-    '3月': '3',
-    '4月': '4',
-    '5月': '5',
-    '6月': '6',
-    '7月': '7',
-    '8月': '8',
-    '9月': '9',
-    '10月': '10',
-    '11月': '11',
-    '12月': '12',
     MONTH_ARRAY: [
       '1月',
       '2月',