浏览代码

feat: datepicker 国际化 (#1305)

yangxiaolu1993 3 年之前
父节点
当前提交
06f805dde9

+ 36 - 46
src/packages/__VUE/audio/index.vue

@@ -67,54 +67,40 @@ export default create({
   props: {
     url: {
       type: String,
-      default() {
-        return '';
-      }
+      default: ''
     },
     // 静音
     muted: {
       type: Boolean,
-      default() {
-        return false;
-      }
+      default: false
     },
     // 自动播放
     autoplay: {
       type: Boolean,
-      default() {
-        return false;
-      }
+      default: false
     },
 
     // 循环播放
     loop: {
       type: Boolean,
-      default() {
-        return false;
-      }
+      default: false
     },
 
     // 是否预加载音频
     preload: {
       type: String,
-      default() {
-        return 'auto';
-      }
+      default: 'auto'
     },
     /* 总时长秒数 */
     second: {
       type: Number,
-      default() {
-        return 0;
-      }
+      default: 0
     },
 
     // 展示的形式   controls 控制面板   progress 进度条  icon 图标 none 自定义
     type: {
       type: String,
-      default() {
-        return 'progress';
-      }
+      default: 'progress'
     }
   },
   components: {},
@@ -130,7 +116,8 @@ export default create({
       duration: '00:00:00',
       second: 0,
       hanMuted: props.muted,
-      playing: props.autoplay
+      playing: props.autoplay,
+      handPlaying: false
     });
 
     onMounted(() => {
@@ -160,38 +147,40 @@ export default create({
 
       // 获取当前音频播放时长
       setTimeout(() => {
+        const audioR = audioRef.value as any;
         // 自动播放
         if (props.autoplay) {
-          if (audioRef.value && audioRef.value.paused) {
-            audioRef.value.play();
+          if (audioR && audioR.paused) {
+            audioR.play();
           }
         }
-        audioData.second = audioRef.value.duration;
-        audioData.duration = formatSeconds(audioRef.value.duration);
+        audioData.second = audioR.duration;
+        audioData.duration = formatSeconds(audioR.duration);
       }, 500);
     });
 
     //播放时间
-    const onTimeupdate = (e) => {
+    const onTimeupdate = (e: any) => {
       audioData.currentTime = parseInt(e.target.currentTime);
     };
 
     //后退
     const fastBack = () => {
       audioData.currentTime--;
-      audioRef.value.currentTime = audioData.currentTime;
+      (audioRef.value as any).currentTime = audioData.currentTime;
 
       emit('fastBack', audioData.currentTime);
     };
 
     //改变播放状态
     const changeStatus = () => {
+      const audioR = audioRef.value as any;
       if (audioData.playing) {
-        audioRef.value.pause();
+        audioR.pause();
 
         audioData.handPlaying = false;
       } else {
-        audioRef.value.play();
+        audioR.play();
         audioData.handPlaying = true;
       }
       audioData.playing = !audioData.playing;
@@ -202,16 +191,16 @@ export default create({
     //快进
     const forward = () => {
       audioData.currentTime++;
-      audioRef.value.currentTime = audioData.currentTime;
+      (audioRef.value as any).currentTime = audioData.currentTime;
 
       emit('forward', audioData.currentTime);
     };
 
     //处理
-    const handle = (val) => {
+    const handle = (val: number | string) => {
       //毫秒数转为时分秒
-      audioData.currentDuration = formatSeconds(val);
-      audioData.percent = (val / audioData.second) * 100;
+      audioData.currentDuration = formatSeconds(val as string);
+      audioData.percent = ((val as number) / audioData.second) * 100;
     };
     //播放结束 修改播放状态
     const audioEnd = () => {
@@ -220,10 +209,11 @@ export default create({
     };
 
     //点击进度条
-    const progressChange = (val) => {
-      audioRef.value.currentTime = (audioData.second * val) / 100;
+    const progressChange = (val: number) => {
+      const ar = audioRef.value as any;
+      ar.currentTime = (audioData.second * val) / 100;
 
-      emit('changeProgress', audioRef.value.currentTime);
+      emit('changeProgress', ar.currentTime);
     };
 
     // 静音
@@ -233,24 +223,24 @@ export default create({
       emit('mute', audioData.hanMuted);
     };
 
-    const formatSeconds = (value) => {
+    const formatSeconds = (value: string) => {
       let theTime = parseInt(value); // 秒
       let theTime1 = 0; // 分
       let theTime2 = 0; // 小时
       if (theTime > 60) {
-        theTime1 = parseInt(theTime / 60);
-        theTime = parseInt(theTime % 60);
+        theTime1 = Math.floor(theTime / 60);
+        theTime = Math.floor(theTime % 60);
         if (theTime1 > 60) {
-          theTime2 = parseInt(theTime1 / 60);
-          theTime1 = parseInt(theTime1 % 60);
+          theTime2 = Math.floor(theTime1 / 60);
+          theTime1 = Math.floor(theTime1 % 60);
         }
       }
-      let result = '' + parseInt(theTime);
-      if (result < 10) {
+      let result = '';
+      if (theTime < 10) {
         result = '0' + result;
       }
       if (theTime1 > 0) {
-        result = '' + parseInt(theTime1) + ':' + result;
+        result = '' + theTime1 + ':' + result;
         if (theTime1 < 10) {
           result = '0' + result;
         }
@@ -258,7 +248,7 @@ export default create({
         result = '00:' + result;
       }
       if (theTime2 > 0) {
-        result = '' + parseInt(theTime2) + ':' + result;
+        result = '' + theTime2 + ':' + result;
         if (theTime2 < 10) {
           result = '0' + result;
         }

+ 95 - 37
src/packages/__VUE/datepicker/demo.vue

@@ -1,19 +1,33 @@
 <template>
   <div class="demo">
-    <h2>选择年月日</h2>
-    <nut-cell title="显示中文" :desc="desc1" @click="show = true"></nut-cell>
-    <h2>选择月日</h2>
-    <nut-cell title="限制开始结束时间" :desc="desc2" @click="show2 = true"></nut-cell>
-    <h2>选择年月日时分</h2>
-    <nut-cell title="日期时间选择" :desc="desc3" @click="show3 = true"></nut-cell>
-    <h2>选择时分秒</h2>
-    <nut-cell title="时间选择" :desc="desc4" @click="show4 = true"></nut-cell>
-    <h2>格式化选项</h2>
-    <nut-cell title="时间选择" :desc="desc5" @click="show5 = true"></nut-cell>
-    <h2>分钟数递增步长设置</h2>
-    <nut-cell title="时间选择" :desc="desc6" @click="show6 = true"></nut-cell>
-    <h2>过滤选项</h2>
-    <nut-cell title="时间选择" :desc="desc7" @click="show7 = true"></nut-cell>
+    <nut-cell-group :title="translate('basic')">
+      <nut-cell :title="translate('showChinese')" :desc="desc1" @click="show = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('mmdd')">
+      <nut-cell :title="translate('setStartEnd')" :desc="desc2" @click="show2 = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('showAll')">
+      <nut-cell :title="translate('chooseDate')" :desc="desc3" @click="show3 = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('time')">
+      <nut-cell :title="translate('chooseTime')" :desc="desc4" @click="show4 = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('format')">
+      <nut-cell :title="translate('chooseTime')" :desc="desc5" @click="show5 = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('stepMins')">
+      <nut-cell :title="translate('chooseTime')" :desc="desc6" @click="show6 = true"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group :title="translate('filter')">
+      <nut-cell :title="translate('chooseTime')" :desc="desc7" @click="show7 = true"></nut-cell>
+    </nut-cell-group>
+
     <!-- 选择年月日 -->
     <nut-datepicker
       v-model="currentDate"
@@ -31,7 +45,7 @@
     <nut-datepicker
       v-model="currentDate2"
       type="month-day"
-      title="日期选择"
+      :title="translate('basic')"
       :min-date="new Date(2022, 0, 1)"
       :max-date="new Date(2022, 7, 1)"
       @confirm="
@@ -44,7 +58,7 @@
     <!-- 选择年月日时分 -->
     <nut-datepicker
       v-model="currentDate3"
-      title="日期时间选择"
+      :title="translate('chooseDate')"
       type="datetime"
       :min-date="minDate"
       :max-date="maxDate"
@@ -58,7 +72,7 @@
     <!-- 选择时分秒 -->
     <nut-datepicker
       v-model="currentDate4"
-      title="时间选择"
+      :title="translate('chooseTime')"
       type="time"
       :min-date="minDate"
       :max-date="maxDate"
@@ -72,7 +86,7 @@
     <!-- 格式化选项 -->
     <nut-datepicker
       v-model="currentDate5"
-      title="日期选择"
+      :title="translate('chooseTime')"
       type="datetime"
       :min-date="new Date(2022, 0, 1)"
       :max-date="new Date(2022, 10, 1)"
@@ -83,12 +97,12 @@
         }
       "
       v-model:visible="show5"
-      ><nut-button block type="primary" @click="alwaysFun">永远有效</nut-button></nut-datepicker
+      ><nut-button block type="primary" @click="alwaysFun">{{ translate('forever') }}</nut-button></nut-datepicker
     >
     <!-- 分钟数递增步长设置 -->
     <nut-datepicker
       v-model="currentDate6"
-      title="时间选择"
+      :title="translate('chooseTime')"
       type="time"
       :min-date="minDate"
       :max-date="maxDate"
@@ -103,7 +117,7 @@
     <!-- 过滤选项 -->
     <nut-datepicker
       v-model="currentDate7"
-      title="时间选择"
+      :title="translate('chooseTime')"
       type="datehour"
       :min-date="minDate"
       :max-date="maxDate"
@@ -122,7 +136,50 @@
 <script lang="ts">
 import { toRefs, watch, ref, reactive } from 'vue';
 import { createComponent } from '@/packages/utils/create';
-const { createDemo } = createComponent('datepicker');
+const { createDemo, translate } = createComponent('datepicker');
+import { useTranslate } from '@/sites/assets/util/useTranslate';
+useTranslate({
+  'zh-CN': {
+    basic: '选择日期',
+    showChinese: '显示中文',
+    mmdd: '选择月日',
+    showAll: '选择年月日时分',
+    time: '选择时分秒',
+    format: '格式化选项',
+    stepMins: '分钟数递增步长设置',
+    filter: '过滤选项',
+    setStartEnd: '限制开始结束时间',
+    chooseDate: '日期时间选择',
+    chooseTime: '时间选择',
+    forever: '永远有效',
+    year: '年',
+    month: '月',
+    day: '日',
+    hour: '时',
+    min: '分',
+    seconds: '秒'
+  },
+  'en-US': {
+    basic: 'Choose Date',
+    showChinese: 'Show Chinese',
+    mmdd: 'Choose Month-Day',
+    showAll: 'Choose DateTime',
+    time: 'Choose Time',
+    format: 'Option Formatter',
+    stepMins: 'Option Steps',
+    filter: 'Option Filter',
+    setStartEnd: 'Limit the start and end time',
+    chooseDate: 'Choose Time',
+    chooseTime: 'Choose Time',
+    forever: 'Forever',
+    year: 'Year',
+    month: 'Month',
+    day: 'Day',
+    hour: 'Hour',
+    min: 'Minute',
+    seconds: 'Second'
+  }
+});
 export default createDemo({
   props: {},
   setup() {
@@ -144,13 +201,13 @@ export default createDemo({
       currentDate7: new Date(2022, 4, 10, 0, 0)
     });
 
-    const desc1 = ref('2022年05月10日');
+    const desc1 = ref(`2022${translate('year')} 05${translate('month')} 10${translate('day')}`);
     const desc2 = ref('05-10');
     const desc3 = ref('2022-05-10 10:10');
     const desc4 = ref('10:10:00');
-    const desc5 = ref('2022年05月10日 10:10');
+    const desc5 = ref(`2022${translate('year')} 05${translate('month')} 10${translate('day')} 10:10`);
     const desc6 = ref('10:10:00');
-    const desc7 = ref('2022年05月10日 00时');
+    const desc7 = ref(`2022${translate('year')} 05${translate('month')} 10${translate('day')} 00${translate('hour')}`);
     const descList = [desc1, desc2, desc3, desc4, desc5, desc6, desc7];
 
     const formatter = (type: string, option) => {
@@ -159,16 +216,16 @@ export default createDemo({
           option.text += '';
           break;
         case 'month':
-          option.text += '月';
+          option.text += `${translate('month')}`;
           break;
         case 'day':
-          option.text += '日';
+          option.text += `${translate('day')}`;
           break;
         case 'hour':
-          option.text += '时';
+          option.text += `${translate('hour')}`;
           break;
         case 'minute':
-          option.text += '分';
+          option.text += `${translate('min')}`;
           break;
         default:
           option.text += '';
@@ -179,16 +236,16 @@ export default createDemo({
     const formatter1 = (type: string, option) => {
       switch (type) {
         case 'year':
-          option.text += '年';
+          option.text += `${translate('year')}`;
           break;
         case 'month':
-          option.text += '月';
+          option.text += `${translate('month')}`;
           break;
         case 'day':
-          option.text += '日';
+          option.text += `${translate('day')}`;
           break;
         case 'hour':
-          option.text += '时';
+          option.text += `${translate('hour')}`;
           break;
         default:
           option.text += '';
@@ -213,7 +270,7 @@ export default createDemo({
       switch (index) {
         case 0:
         case 6:
-          descList[index].value = selectedOptions.map((option) => option.text).join('');
+          descList[index].value = selectedOptions.map((option) => option.text).join(' ');
           break;
         case 2:
           date = selectedValue.slice(0, 3).join('-');
@@ -233,7 +290,7 @@ export default createDemo({
             .slice(3)
             .map((op) => op.value)
             .join(':');
-          descList[index].value = selectedOptions[0].text + '年' + date + ' ' + time;
+          descList[index].value = selectedOptions[0].text + translate('year') + date + ' ' + time;
           break;
         default:
           descList[index].value = selectedValue.join('-');
@@ -242,7 +299,7 @@ export default createDemo({
 
     const alwaysFun = () => {
       show5.value = false;
-      desc5.value = '永久有效';
+      desc5.value = translate('forever');
     };
     return {
       show,
@@ -266,7 +323,8 @@ export default createDemo({
       formatter,
       formatter1,
       filter,
-      alwaysFun
+      alwaysFun,
+      translate
     };
   }
 });

+ 226 - 0
src/packages/__VUE/datepicker/doc.en-US.md

@@ -0,0 +1,226 @@
+# Dialog
+
+
+### Intro
+
+Modal dialog box is displayed in the floating layer to guide users to carry out relevant operations. It is often used for message prompt, message confirmation, or completing specific interactive operations in the current page.
+
+The popup box component supports function call and component call.
+
+### Install
+    
+```javascript
+import { createApp } from 'vue';
+import { Dialog,Popup,OverLay } from '@nutui/nutui';
+
+const app = createApp();
+app.use(Dialog).use(Popup).use(OverLay)
+```
+
+
+## Function use
+
+:::demo
+```html
+<template>
+ <nut-cell-group title="Function Use">
+  <nut-cell title="Title" @click="baseClick"></nut-cell>
+  <nut-cell title="Title" @click="noTitleClick"></nut-cell>
+  <nut-cell title="Title" @click="tipsClick"></nut-cell>
+  <nut-cell title="Title" @click="verticalClick"></nut-cell>
+</nut-cell-group>
+</template>
+<script lang="ts">
+import { ref } from 'vue';
+import { Dialog } from '@nutui/nutui';
+export default {
+    setup() {
+        const onCancel = () => {
+          console.log('event cancel');
+        };
+        const onOk = () => {
+          console.log('event ok');
+        };
+        const baseClick = (): void => {
+          Dialog({
+            title: 'Basic spring frame',
+            content: 'Function call and component call are supported.',
+            onCancel,
+            onOk
+          });
+        };
+        const noTitleClick = () => {
+          Dialog({
+            content: 'Content',
+            onCancel,
+            onOk
+          });
+        };
+        const tipsClick = () => {
+          Dialog({
+            title: 'Title',
+            content: 'Function call and component call are supported.',
+            noCancelBtn: true,
+            onCancel,
+            onOk
+          });
+        };
+        const verticalClick = () => {
+          Dialog({
+            title: 'Title',
+            content: 'Support vertical arrangement of bottom buttons.',
+            footerDirection: 'vertical',
+            onCancel,
+            onOk
+          });
+        };
+        return {
+          baseClick,
+          noTitleClick,
+          tipsClick,
+          verticalClick
+        };
+    }
+}
+</script>
+```
+::: 
+
+## Teleport use, mount to the specified element node
+
+``` html
+<nut-dialog teleport="#app" ... />
+```
+
+``` javascript
+Dialog({
+  teleport: '#app',
+  ...
+});
+Dialog({
+  teleport: '.demo',
+  ...
+});
+```
+
+## Function use proxy.&dialog(...)
+
+```javascript
+import { ref } from 'vue';
+import { Dialog } from '@nutui/nutui';
+import { getCurrentInstance } from 'vue';
+
+export default {
+  setup() {
+    const { proxy } = getCurrentInstance();
+    proxy.$dialog({
+      title: 'Basic spring frame',
+      content: 'Function call and component call are supported.'
+    });
+  }
+}
+```
+
+
+## Template use
+
+
+:::demo
+```html
+<template>
+  <nut-cell-group title="Template use">
+    <nut-cell title="Template use" @click="componentClick"></nut-cell>
+    <nut-dialog
+      teleport="#app"
+      title="Template use"
+      content="Function call and template call are supported."
+      v-model:visible="visible"
+    >
+    </nut-dialog>
+    <nut-cell title="Bottom button vertical use" @click="componentvVrticalClick"></nut-cell>
+    <nut-dialog
+      footer-direction="vertical"
+      teleport="#app"
+      title="Template use"
+      content="Function call and template call are supported."
+      v-model:visible="visible1"
+    >
+    </nut-dialog>
+  </nut-cell-group>
+</template>
+<script lang="ts">
+import { ref } from 'vue';
+export default {
+  setup() {
+    const visible = ref(false);
+    const visible1 = ref(false);
+    const componentClick = () => {
+      visible.value = true;
+    };
+    const componentvVrticalClick = () => {
+      visible1.value = true;
+    };
+    return { visible,visible1,componentClick,componentvVrticalClick };
+  }
+}
+</script>
+```
+:::
+
+## API
+| Attribute           | Description                                                                    | Type             | Default              |
+|---------------------|--------------------------------------------------------------------------------|------------------|----------------------|
+| title               | Title                                                                          | String           | -                    |
+| id                  | Identifier, share one instance at the same time, default to multiple instances | String or Number | new Date().getTime() |
+| content             | Content, support HTML                                                          | String           | -                    |
+| teleport            | Specifies a target element where Dialog will be mounted                        | String           | "body"               |
+| closeOnClickOverlay | Whether to close when overlay is clicked                                       | Boolean          | false                |
+| noFooter            | Hide bottom button bar                                                         | Boolean          | false                |
+| noOkBtn             | Hide OK button                                                                 | Boolean          | false                |
+| noCancelBtn         | Hide cancel button                                                             | Boolean          | false                |
+| cancelText          | Cancel button text                                                             | String           | "Cancel"             |
+| okText              | OK button text                                                                 | String           | "Confirm"            |
+| cancelAutoClose     | Click Cancel to close the popup                                                | Boolean          | true                 |
+| textAlign           | Text alignment direction, the optional value is the same as css text-align     | String           | "center"             |
+| closeOnPopstate     | Whether to close when popstate                                                 | Boolean          | false                |
+| onUpdate            | Update                                                                         | Boolean          | false                |
+| onOk                | Emitted when the confirm button is clicked                                     | Function         | -                    |
+| onCancel            | Emitted when the cancel button is clicked                                      | Function         | -                    |
+| onClosed            | Emitted when Dialog is closed                                                  | Function         | -                    |
+
+
+## Props
+
+| Attribute              | Description                                                                                               | Type    | Default    |
+|------------------------|-----------------------------------------------------------------------------------------------------------|---------|------------|
+| title                  | Title                                                                                                     | String  | -          |
+| content                | Content, support HTML                                                                                     | String  | -          |
+| teleport               | Specifies a target element where Dialog will be mounted                                                   | String  | "body"     |
+| close-on-click-overlay | Whether to close when overlay is clicked                                                                  | Boolean | false      |
+| no-footer              | Hide bottom button bar                                                                                    | Boolean | false      |
+| no-ok-btn              | Hide OK button                                                                                            | Boolean | false      |
+| no-cancel-btn          | Hide cancel button                                                                                        | Boolean | false      |
+| cancel-text            | Cancel button text                                                                                        | String  | "Cancel"   |
+| ok-text                | OK button text                                                                                            | String  | "Confirm"  |
+| cancel-auto-close      | Click Cancel to close the popup                                                                           | Boolean | true       |
+| text-align             | Text alignment direction, the optional value is the same as css text-align                                | String  | "center"   |
+| close-on-popstate      | Whether to close when popstate                                                                            | Boolean | false      |
+| lock-scroll            | Whether to lock background scroll                                                                         | Boolean | false      |
+| footer-direction       | The bottom button uses the horizontal and vertical directions. Optional values ​​are horizontal and vertical. | string  | horizontal |
+
+## Events
+
+| Event  | Description                                | Type     | Default |
+|--------|--------------------------------------------|----------|---------|
+| ok     | Emitted when the confirm button is clicked | Function | -       |
+| cancel | Emitted when the cancel button is clicked  | Function | -       |
+| closed | Emitted when Dialog is closed              | Function | -       |
+
+
+## Slots
+
+| Name    | Description    |
+|---------|----------------|
+| header  | Custom title   |
+| default | Custom default |
+| footer  | Custom footer  |

+ 15 - 11
src/packages/__VUE/datepicker/index.vue

@@ -19,9 +19,13 @@ import { toRefs, watch, computed, reactive, onBeforeMount } from 'vue';
 import type { PropType } from 'vue';
 import Picker from '../picker/index.vue';
 import { popupProps } from '../popup/index.vue';
+import { PickerOption } from '../picker/types';
 import { createComponent } from '@/packages/utils/create';
 import { padZero } from './utils';
-const { componentName, create } = createComponent('datepicker');
+const { componentName, create, translate } = createComponent('datepicker');
+
+type Formatter = (type: string, option: PickerOption) => PickerOption;
+type Filter = (columnType: string, options: PickerOption[]) => PickerOption[];
 
 const currentYear = new Date().getFullYear();
 function isDate(val: Date): val is Date {
@@ -31,12 +35,12 @@ function isDate(val: Date): val is Date {
 const zhCNType: {
   [props: string]: string;
 } = {
-  day: '日',
-  year: '年',
-  month: '月',
-  hour: '时',
-  minute: '分',
-  seconds: '秒'
+  day: translate('day'),
+  year: translate('year'),
+  month: translate('month'),
+  hour: translate('hour'),
+  minute: translate('minute'),
+  seconds: translate('seconds')
 };
 export default create({
   components: {
@@ -80,10 +84,10 @@ export default create({
       validator: isDate
     },
     formatter: {
-      type: Function as PropType<import('./type').Formatter>,
+      type: Function as PropType<Formatter>,
       default: null
     },
-    filter: Function as PropType<import('./type').Filter>
+    filter: Function as PropType<Filter>
   },
   emits: ['click', 'update:visible', 'change', 'confirm', 'update:moduleValue'],
 
@@ -225,7 +229,7 @@ export default create({
     }: {
       columnIndex: number;
       selectedValue: (string | number)[];
-      selectedOptions: import('../picker/types').PickerOption[];
+      selectedOptions: PickerOption[];
     }) => {
       if (['date', 'datetime', 'datehour', 'month-day'].includes(props.type)) {
         let formatDate: (number | string)[] = [];
@@ -269,7 +273,7 @@ export default create({
 
     // min 最小值  max 最大值  val  当前显示的值   type 类型(year、month、day、time)
     const generateValue = (min: number, max: number, val: number | string, type: string, columnIndex: number) => {
-      const arr: Array<import('../picker/types').PickerOption> = [];
+      const arr: Array<PickerOption> = [];
       let index = 0;
       while (min <= max) {
         arr.push(formatterOption(type, min));

+ 8 - 0
src/packages/locale/lang/en-US.ts

@@ -84,5 +84,13 @@ class Lang extends BaseLang {
     pullTxt: 'Loose to refresh',
     loadMoreTxt: 'Oops, this is the bottom'
   };
+  datepicker = {
+    year: 'Year',
+    month: 'Month',
+    day: 'Day',
+    hour: 'Hour',
+    min: 'Minute',
+    seconds: 'Second'
+  };
 }
 export default Lang;

+ 8 - 0
src/packages/locale/lang/zh-CN.ts

@@ -84,5 +84,13 @@ class Lang extends BaseLang {
     pullTxt: '松开刷新',
     loadMoreTxt: '哎呀,这里是底部了啦'
   };
+  datepicker = {
+    year: '年',
+    month: '月',
+    day: '日',
+    hour: '时',
+    min: '分',
+    seconds: '秒'
+  };
 }
 export default Lang;

+ 8 - 0
src/packages/locale/lang/zh-TW.ts

@@ -84,5 +84,13 @@ class Lang extends BaseLang {
     pullTxt: '鬆開刷新',
     loadMoreTxt: '哎呀,這裡是底部了啦'
   };
+  datepicker = {
+    year: '年',
+    month: '月',
+    day: '日',
+    hour: '時',
+    min: '分',
+    seconds: '秒'
+  };
 }
 export default Lang;