feat(core): 添加默认国际化的支持 (didi#729)

lizzie0802 · Mar 2, 2021 · 2b0b6ab · 2b0b6ab
1 parent 3c17be6
commit 2b0b6ab
Show file tree

Hide file tree

Showing 14 changed files with 160 additions and 43 deletions.
diff --git a/components/_locale/index.js b/components/_locale/index.js
@@ -0,0 +1,37 @@
+import defaultLang from './lang/zh-cn'
+
+let lang = defaultLang
+
+function template(str, option) {
+  if (!str || !option) {
+    return str
+  }
+
+  return str.replace(/\{(\w+)\}/g, (match, key) => {
+    return option[key]
+  })
+}
+
+export const t = (path, option) => {
+  let value
+  const array = path.split('.')
+  let current = lang
+  for (let i = 0, j = array.length; i < j; i++) {
+    const property = array[i]
+    value = current[property]
+    if (i === j - 1) {
+      return template(value, option)
+    }
+    if (!value) {
+      return ''
+    }
+    current = value
+  }
+  return ''
+}
+
+export const setLocale = l => {
+  lang = l || lang
+}
+
+export default {setLocale, t}
diff --git a/components/_locale/lang/zh-cn.js b/components/_locale/lang/zh-cn.js
@@ -0,0 +1,59 @@
+export default {
+  // [\u4e00-\u9fa5]
+  name: 'zh-cn',
+  md: {
+    'action-sheet': {
+      cancel: '取消',
+    },
+    captcha: {
+      sendCaptcha: '发送验证码',
+      countdown: '{$1}秒后重发'
+    },
+    cashier: {
+      payCash: '\u652f\u4ed8\u91d1\u989d\u0028\u5143\u0029',
+      confirmPay: '\u786e\u5b9a\u652f\u4ed8',
+      morePayWays: '\u66f4\u591a\u652f\u4ed8\u65b9\u5f0f',
+      pay: '\u652f\u4ed8',
+      payResultSearch: '\u652f\u4ed8\u7ed3\u679c\u67e5\u8be2\u4e2d\u002e\u002e\u002e',
+      paySuccess: '\u652f\u4ed8\u6210\u529f',
+      payFail: '\u652f\u4ed8\u5931\u8d25\uff0c\u8bf7\u7a0d\u540e\u91cd\u8bd5',
+      confirm: '\u6211\u77e5\u9053\u4e86',
+    },
+    'date-picker': {
+      year: '年',
+      month: '月',
+      day: '日',
+      hour: '时',
+      minute: '分',
+    },
+    'number-keyboard': {
+      confirm: '确定',
+    },
+    'picker': {
+      confirm: '确认',
+      cancel: '取消',
+    },
+    'result-page': {
+      networkError: '\u7f51\u7edc\u8fde\u63a5\u5f02\u5e38',
+      noInformation: '\u6682\u65e0\u4fe1\u606f',
+      lostWay: '\u60a8\u8981\u8bbf\u95ee\u7684\u9875\u9762\u5df2\u4e22\u5931',
+    },
+    'scroll-view': {
+      more: {
+        loading: '更多加载中...',
+        allLoaded: '全部已加载',
+      },
+      refresh: {
+        pullDownRefresh: '下拉刷新',
+        freedRefresh: '释放刷新',
+        refreshing: '刷新中...',
+      },
+    },
+    'selector': {
+      cancel: '取消',
+    },
+    'tab-picker': {
+      choose: '请选择',
+    }
+  }
+}
diff --git a/components/action-sheet/action-sheet.vue b/components/action-sheet/action-sheet.vue
@@ -35,6 +35,7 @@
 
 <script>import Popup from '../popup'
 import {inArray} from '../_util'
+import {t} from '../_locale'
 
 export default {
   name: 'md-action-sheet',
@@ -68,7 +69,7 @@ export default {
     },
     cancelText: {
       type: String,
-      default: '取消',
+      default: t('md.action-sheet.cancel'),
     },
   },
 

diff --git a/components/captcha/index.vue b/components/captcha/index.vue
@@ -80,6 +80,7 @@
 import Codebox from '../codebox'
 import Button from '../button'
 import {mdDocument} from '../_util'
+import {t} from '../_locale'
 
 export default {
   name: 'md-captcha',
@@ -131,11 +132,11 @@ export default {
     },
     countNormalText: {
       type: String,
-      default: '发送验证码',
+      default: t('md.captcha.sendCaptcha'),
     },
     countActiveText: {
       type: String,
-      default: '{$1}秒后重发',
+      default: t('md.captcha.countdown'),
     },
     isView: {
       type: Boolean,

diff --git a/components/cashier/index.vue b/components/cashier/index.vue
@@ -136,6 +136,7 @@ import Captcha from '../captcha'
 import Icon from '../icon'
 import RollerSuccess from '../activity-indicator/roller-success'
 import {noop, extend} from '../_util'
+import {t} from '../_locale'
 import Channel from './channel'
 import ChannelButton from './channel-button'
 
@@ -171,7 +172,7 @@ export default {
     },
     paymentTitle: {
       type: String,
-      default: '\u652f\u4ed8\u91d1\u989d\u0028\u5143\u0029', // 支付金额
+      default: t('md.cashier.payCash'), // 支付金额
     },
     paymentAmount: {
       type: String,
@@ -183,18 +184,18 @@ export default {
     },
     payButtonText: {
       type: String,
-      default: '\u786e\u5b9a\u652f\u4ed8', // 确定支付
+      default: t('md.cashier.confirmPay'), // 确定支付
     },
     payButtonDisabled: {
       type: Boolean,
       default: false,
     },
     moreButtonText: {
       type: String,
-      default: '\u66f4\u591a\u652f\u4ed8\u65b9\u5f0f', // 更多支付方式
+      default: t('md.cashier.morePayWays'), // 更多支付方式
     },
     title: {
-      default: '\u652f\u4ed8', // 支付
+      default: t('md.cashier.pay'), // 支付
     },
 
     // Mixin Props
@@ -215,16 +216,16 @@ export default {
       sceneKey: Date.now(),
       sceneOption: {
         loading: {
-          text: '\u652f\u4ed8\u7ed3\u679c\u67e5\u8be2\u4e2d\u002e\u002e\u002e', // 支付结果查询中...
+          text: t('md.cashier.payResultSearch'), // 支付结果查询中...
         },
         success: {
-          text: '\u652f\u4ed8\u6210\u529f', // 支付成功
-          buttonText: '\u6211\u77e5\u9053\u4e86', // 我知道了
+          text: t('md.cashier.paySuccess'), // 支付成功
+          buttonText: t('md.cashier.confirm'), // 我知道了
           handler: null,
         },
         fail: {
-          text: '\u652f\u4ed8\u5931\u8d25\uff0c\u8bf7\u7a0d\u540e\u91cd\u8bd5', // 支付失败，请稍后重试
-          buttonText: '\u6211\u77e5\u9053\u4e86', // 我知道了
+          text: t('md.cashier.payFail'), // 支付失败，请稍后重试
+          buttonText: t('md.cashier.confirm'), // 我知道了
           handler: null,
         },
         captcha: {
@@ -335,7 +336,7 @@ export default {
         padding 0 40px 40px
         box-sizing border-box
       // &.md-cashier-choose
-        
+
       &.md-cashier-captcha
         .md-captcha
           block()

diff --git a/components/date-picker/index.vue b/components/date-picker/index.vue
@@ -33,6 +33,7 @@ import {
   toArray,
   warn
 } from '../_util'
+import {t} from '../_locale'
 
 // yyyy-MM-dd hh:mm:ss => Year-Month-Date Hour:Minute
 const TYPE_FORMAT = {
@@ -107,7 +108,13 @@ export default {
     unitText: {
       type: Array,
       default () {
-        return ['年', '月', '日', '时', '分']
+        return [
+          t('md.date-picker.year'),
+          t('md.date-picker.month'),
+          t('md.date-picker.day'),
+          t('md.date-picker.hour'),
+          t('md.date-picker.minute'),
+        ]
       }
     },
     todayText: {
@@ -268,8 +275,8 @@ export default {
       this.$_generateDateData.type = 'Date'
       this.$_generateHourData.type = 'Hour'
       this.$_generateMinuteData.type = 'Minute'
-    
-      const defaultDate = this.$_getDefaultDate()     
+
+      const defaultDate = this.$_getDefaultDate()
       switch (this.type) {
         case 'date':
           this.$_initColumnDataGeneratorForDate(defaultDate)
@@ -316,7 +323,7 @@ export default {
 
         if (defaultDate) {
           let value = defaultDate[TYPE_METHODS[type]]()
-          
+
           if (type === 'Month') {
             value += 1
           }
@@ -386,7 +393,7 @@ export default {
     },
     $_generateDateData () {
       const args = this.$_getGeneratorArguments(toArray(arguments))
-      
+
       let start, end
 
       if (this.$_isDateTimeEqual(this.minDate, args.Year, args.Month)) {
@@ -403,7 +410,7 @@ export default {
 
       const dateData = this.$_generateData(start, end, 'Date', this.unitText[2] || '', 1, arguments)
 
-      if (this.$_isDateTimeEqual(this.currentDateIns, args.Year, args.Month) && 
+      if (this.$_isDateTimeEqual(this.currentDateIns, args.Year, args.Month) &&
           this.currentDate >= start && this.currentDate <= end &&
           this.todayText) {
         const currentDateIndex = this.currentDate - start
@@ -438,7 +445,7 @@ export default {
         warn('MinDate Hour should be earlier than MaxDate')
         return
       }
-  
+
       return this.$_generateData(start, end, 'Hour', this.unitText[3] || '', 1, arguments)
     },
     $_generateMinuteData () {
@@ -468,7 +475,7 @@ export default {
       })
 
       while (count <= to) {
-        this.textRender 
+        this.textRender
         && (text = this.textRender.apply(this, [
             TYPE_FORMAT_INVERSE[type],
             ...defaultArgs,
@@ -486,7 +493,7 @@ export default {
       return data
     },
     /**
-     * Determine whether year, month, date, etc of 
+     * Determine whether year, month, date, etc of
      * the current date are equal to the given value
      * @params Date
      * @params year, month, date ...
@@ -556,7 +563,7 @@ export default {
         if (value < 10) {
           value = '0' + value
         }
-        
+
         format = format.replace('HH', 'hh') // deal with HH as hh
         format = format.replace(item.type, value)
         format = format.replace(TYPE_FORMAT_INVERSE[item.type], value)

diff --git a/components/index.js b/components/index.js
@@ -3,6 +3,7 @@
 // Import components core
 import './_style/global.styl'
 import {transformCamelCase, warn} from './_util'
+import {setLocale, t} from './_locale'
 import Button from './button'
 import Icon from './icon'
 import Popup from './popup'
@@ -228,6 +229,8 @@ export {
   Ruler,
   TextareaItem,
   Skeleton,
+  setLocale,
+  t,
   /* @init<%${componentNameUpper},%> */
 }
 

diff --git a/components/number-keyboard/board.vue b/components/number-keyboard/board.vue
@@ -64,6 +64,7 @@
 </template>
 
 <script>import {noop} from '../_util'
+import {t} from '../_locale'
 import Key from './key'
 
 export default {
@@ -89,7 +90,7 @@ export default {
     },
     okText: {
       type: String,
-      default: '确定',
+      default: t('md.number-keyboard.confirm'),
     },
     isView: {
       type: Boolean,

diff --git a/components/picker/mixins/index.js b/components/picker/mixins/index.js
@@ -1,3 +1,4 @@
+import {t} from '../../_locale'
 import popupMixin from '../../popup/mixins'
 import popupTitleBarMixin from '../../popup/mixins/title-bar'
 
@@ -9,10 +10,10 @@ export default {
       default: false,
     },
     okText: {
-      default: '确认',
+      default: t('md.picker.confirm'),
     },
     cancelText: {
-      default: '取消',
+      default: t('md.picker.cancel'),
     },
     lineHeight: {
       type: Number,

diff --git a/components/result-page/index.vue b/components/result-page/index.vue
@@ -25,7 +25,8 @@
   </div>
 </template>
 
-<script>import Button from '../button'
+<script>import {t} from '../_locale'
+import Button from '../button'
 
 export default {
   name: 'md-result-page',
@@ -69,9 +70,9 @@ export default {
         this.text ||
         {
           // 网络连接异常
-          network: '\u7f51\u7edc\u8fde\u63a5\u5f02\u5e38',
+          network: t('md.result-page.networkError'),
           // 暂无信息
-          empty: '\u6682\u65e0\u4fe1\u606f',
+          empty: t('md.result-page.noInformation'),
         }[this.type] ||
         ''
       )
@@ -81,7 +82,7 @@ export default {
         this.subtext ||
         {
           // 您要访问的页面已丢失
-          lost: '\u60a8\u8981\u8bbf\u95ee\u7684\u9875\u9762\u5df2\u4e22\u5931',
+          lost: t('md.result-page.lostWay'),
         }[this.type] ||
         ''
       )