feat(h5): picker i18n

src/core/helpers/i18n/en.json

@@ -4,6 +4,8 @@
   "uni.showLoading.unpaired": "Please note showLoading must be paired with hideLoading",
   "uni.showModal.cancel": "cancel",
   "uni.showModal.confirm": "confirm",
+  "uni.picker.done": "Done",
+  "uni.picker.cancel": "Cancel",
   "uni.button.feedback.title": "feedback",
   "uni.button.feedback.send": "send"
-}
+}

src/core/helpers/i18n/es.json

@@ -3,7 +3,9 @@
   "uni.showToast.unpaired": "Tenga en cuenta que showToast debe estar emparejado con hideToast",
   "uni.showLoading.unpaired": "Tenga en cuenta que showLoading debe estar emparejado con hideLoading",
   "uni.showModal.cancel": "cancelar",
-  "uni.showModal.confirm": "confirmar",
-  "uni.button.feedback.title": "realimentación",
+  "uni.showModal.confirm": "confirmar",
+  "uni.picker.done": "OK",
+  "uni.picker.cancel": "Cancelar",
+  "uni.button.feedback.title": "realimentación",
   "uni.button.feedback.send": "enviar"
-}
+}

src/core/helpers/i18n/fr.json

@@ -4,6 +4,8 @@
   "uni.showLoading.unpaired": "Veuillez noter que showLoading doit être associé à hideLoading",
   "uni.showModal.cancel": "Annuler",
   "uni.showModal.confirm": "confirmer",
+  "uni.picker.done": "OK",
+  "uni.picker.cancel": "Annuler",
   "uni.button.feedback.title": "retour d'information",
   "uni.button.feedback.send": "envoyer"
-}
+}

src/core/helpers/i18n/index.js

@@ -21,4 +21,5 @@ const fallbackLocale = 'en'
 const i18n = initVueI18n(__PLATFORM__ === 'app-plus' || __PLATFORM__ === 'h5' ? messages : {}, fallbackLocale)
 export const t = i18n.t
 export const i18nMixin = i18n.mixin
-export const setLocale = i18n.setLocale
+export const setLocale = i18n.setLocale
+export const getLocale = i18n.getLocale

src/core/helpers/i18n/zh-Hans.json

@@ -4,6 +4,8 @@
   "uni.showLoading.unpaired": "请注意 showLoading 与 hideLoading 必须配对使用",
   "uni.showModal.cancel": "取消",
   "uni.showModal.confirm": "确认",
+  "uni.picker.done": "完成",
+  "uni.picker.cancel": "取消",
   "uni.button.feedback.title": "问题反馈",
   "uni.button.feedback.send": "发送"
-}
+}

src/core/helpers/i18n/zh-Hant.json

@@ -4,6 +4,8 @@
   "uni.showLoading.unpaired": "請注意 showLoading 與 hideLoading 必須配對使用",
   "uni.showModal.cancel": "取消",
   "uni.showModal.confirm": "確認",
+  "uni.picker.done": "完成",
+  "uni.picker.cancel": "取消",
   "uni.button.feedback.title": "問題反饋",
   "uni.button.feedback.send": "發送"
-}
+}

src/platforms/h5/view/components/picker/index.vue

@@ -33,22 +33,23 @@
             class="uni-picker-action uni-picker-action-cancel"
             @click="_cancel"
           >
-            取消
+            {{ $$t("uni.picker.cancel") }}
           </div>
           <div
             class="uni-picker-action uni-picker-action-confirm"
             @click="_change"
           >
-            确定
+            {{ $$t("uni.picker.done") }}
           </div>
         </div>
         <v-uni-picker-view
           v-if="contentVisible"
-          :value.sync="valueArray"
+          :value="_l10nColumn(valueArray)"
           class="uni-picker-content"
+          @change="_pickerViewChange"
         >
           <v-uni-picker-view-column
-            v-for="(rangeItem, index0) in rangeArray"
+            v-for="(rangeItem, index0) in _l10nColumn(rangeArray)"
             :key="index0"
           >
             <div
@@ -56,8 +57,7 @@
               :key="index"
               class="uni-picker-item"
             >
-              {{ typeof item === "object" ? item[rangeKey] || "" : item
-              }}{{ units[index0] || "" }}
+              {{ typeof item === "object" ? item[rangeKey] || "" : _l10nItem(item, index0) }}
             </div>
           </v-uni-picker-view-column>
         </v-uni-picker-view>
@@ -115,6 +115,10 @@ import { emitter } from 'uni-mixins'
 import { formatDateTime } from 'uni-shared'
 import popup from '../../../components/app/popup/mixins/popup'
 import keypress from '../../../helpers/keypress'
+import {
+  i18nMixin,
+  getLocale
+} from 'uni-core/helpers/i18n'
 
 function getDefaultStartValue () {
   if (this.mode === mode.TIME) {
@@ -172,7 +176,7 @@ const selectorType = {
 export default {
   name: 'Picker',
   components: { keypress },
-  mixins: [emitter, popup],
+  mixins: [i18nMixin, emitter, popup],
   props: {
     name: {
       type: String,
@@ -264,16 +268,6 @@ export default {
     endArray () {
       return this._getDateValueArray(this.end, getDefaultEndValue.bind(this)())
     },
-    units () {
-      switch (this.mode) {
-        case mode.DATE:
-          return ['年', '月', '日']
-        case mode.TIME:
-          return ['时', '分']
-        default:
-          return []
-      }
-    },
     selectorTypeComputed () {
       const type = this.selectorType
       if (Object.values(selectorType).includes(type)) {
@@ -610,6 +604,50 @@ export default {
         style.left = `${$event.clientX - rect.left - fontSize * 1.5}px`
         style.top = `${$event.clientY - rect.top - fontSize * 0.5}px`
       }
+    },
+    _pickerViewChange (event) {
+      this.valueArray == this._l10nColumn(event.detail.value, true)
+    },
+    _l10nColumn (array, normalize) {
+      if (this.mode === mode.DATE) {
+        const local = getLocale()
+        if (!local.startsWith('zh')) {
+          switch (local) {
+            case 'es':
+            case 'fr':
+              return [array[2], array[1], array[0]]
+            // case 'en':
+            default:
+              return normalize ? [array[2], array[0], array[1]] : [array[1], array[2], array[0]]
+          }
+        }
+      }
+      return array
+    },
+    _l10nItem (item, index) {
+      if (this.mode === mode.DATE) {
+        const local = getLocale()
+        if (local.startsWith('zh')) {
+          const array = ['年', '月', '日']
+          return item + array[index]
+        } else if (index === (local === 'es' || local === 'fr' ? 1 : 0)) {
+          let array
+          switch (local) {
+            case 'es':
+              array = ['enero', 'febrero', 'marzo', 'abril', 'mayo', 'junio', '​​julio', 'agosto', 'septiembre', 'octubre', 'noviembre', 'diciembre']
+              break
+            case 'fr':
+              array = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre']
+              break
+            // case 'en':
+            default:
+              array = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
+              break
+          }
+          return array[Number(item) - 1]
+        }
+      }
+      return item
     }
   }
 }