[Improvement] DatetimePicker: support all picker props (#788)

docs/markdown/en-US/datetime-picker.md

@@ -99,12 +99,17 @@ export default {
 
 | Attribute | Description | Type | Default | Accepted Values |
 |-----------|-----------|-----------|-------------|-------------|
-| type | Picker type | `String` | `datetime` |  `date` `time` `year-month` |
+| type | Picker type | `String` | `datetime` |  `date` `time` <br> `year-month` |
 | min-date | Min date | `Date` | Ten years ago on January 1 | - |
 | max-date | Max date | `Date` | Ten years later on December 31 | - |
 | min-hour | Min hour | `Number` | `0` | - |
 | max-hour | Max hour | `Number` | `23` | - |
-| visible-item-count | Count of columns to show | `Number` | `5` | - |
+| title | Toolbar title | `String` | `''` | - |
+| loading | Whether to show loading prompt | `Boolean` | `false` | - |
+| item-height | Option height | `Number` | `44` | - |
+| confirm-button-text | Text of confirm button | `String` | `Confirm` | - |
+| cancel-button-text | Text of cancel button | `String` | `Cancel` | - |
+| visible-item-count | Count of visible columns | `Number` | `5` | - |
 
 ### Event
 

docs/markdown/en-US/picker.md

@@ -132,11 +132,11 @@ When Picker columns data is acquired asynchronously, use `loading` prop to show
 | show-toolbar | Whether to show toolbar | `Boolean` | `false` | - |
 | title | Toolbar title | `String` | `''` | - |
 | loading | Whether to show loading prompt | `Boolean` | `false` | - |
+| value-key | Key of option text | `String` | `text` | - |
+| item-height | Option height | `Number` | `44` | - |
 | confirm-button-text | Text of confirm button | `String` | `Confirm` | - |
 | cancel-button-text | Text of cancel button | `String` | `Cancel` | - |
-| item-height | Option height | `Number` | `44` | - |
 | visible-item-count | Count of visible columns | `Number` | `5` | - |
-| value-key | Key of option text | `String` | `text` | - |
 
 ### Event
 Picker events will pass different parameters according to the columns are single or multiple

docs/markdown/zh-CN/datetime-picker.md

@@ -104,7 +104,12 @@ export default {
 | max-date | 可选的最大日期 | `Date` | 十年后的 12 月 31 日 | - |
 | min-hour | 可选的最小小时，针对 time 类型 | `Number` | `0` | - |
 | max-hour | 可选的最大小时，针对 time 类型 | `Number` | `23` | - |
-| visible-item-count | 每一列可见备选元素的个数 | `Number` | `5` | - |
+| title | 顶部栏标题 | `String` | `''` | - |
+| loading | 是否显示加载状态 | `Boolean` | `false` | - |
+| item-height | 选项高度 | `Number` | `44` | - |
+| confirm-button-text | 确认按钮文字 | `String` | `确认` | - |
+| cancel-button-text | 取消按钮文字 | `String` | `取消` | - |
+| visible-item-count | 可见的选项个数 | `Number` | `5` | - |
 
 ### Event
 

docs/markdown/zh-CN/picker.md

@@ -134,11 +134,11 @@ export default {
 | show-toolbar | 是否显示顶部栏 | `Boolean` | `false` | - |
 | title | 顶部栏标题 | `String` | `''` | - |
 | loading | 是否显示加载状态 | `Boolean` | `false` | - |
+| value-key | 选项对象中，文字对应的 key | `String` | `text` | - |
+| item-height | 选项高度 | `Number` | `44` | - |
 | confirm-button-text | 确认按钮文字 | `String` | `确认` | - |
 | cancel-button-text | 取消按钮文字 | `String` | `取消` | - |
-| item-height | 选项高度 | `Number` | `44` | - |
 | visible-item-count | 可见的选项个数 | `Number` | `5` | - |
-| value-key | 选项对象中，文字对应的 key | `String` | `text` | - |
 
 ### Event
 Picker 组件的事件会根据 columns 是单列或多列返回不同的参数

packages/datetime-picker/index.vue

@@ -1,9 +1,13 @@
 <template>
   <picker
     ref="picker"
-    :show-toolbar="showToolbar"
+    :title="title"
     :columns="columns"
-    :visible-item-count="visibleItemCount"
+    :item-height="itemHeight"
+    :show-toolbar="showToolbar"
+    :visibie-item-height="visibleItemCount"
+    :confirm-button-text="confirmButtonText"
+    :cancel-button-text="cancelButtonText"
     @change="onChange"
     @confirm="onConfirm"
     @cancel="$emit('cancel')"
@@ -25,6 +29,12 @@ export default create({
   },
 
   props: {
+    value: {},
+    title: String,
+    itemHeight: Number,
+    visibleItemCount: Number,
+    confirmButtonText: String,
+    cancelButtonText: String,
     type: {
       type: String,
       default: 'datetime'
@@ -37,10 +47,6 @@ export default create({
       type: String,
       default: 'YYYY.MM.DD HH时 mm分'
     },
-    visibleItemCount: {
-      type: Number,
-      default: 5
-    },
     minDate: {
       type: Date,
       default: () => new Date(currentYear - 10, 0, 1),
@@ -58,8 +64,7 @@ export default create({
     maxHour: {
       type: Number,
       default: 23
-    },
-    value: {}
+    }
   },
 
   data() {