docs(time-picker): [time-picker] optimize docs and demos (#1273)

* fix(switch): [switch] amend demo and api bug of switch

* feat(switch): [switch] amend demo and API bug of switch

* feat(switch): [switch] amend demo and API bug of switch

* docs(time-picker): [time-picker] optimize docs and demos

* docs(time-picker): [time-picker] optimize docs and demos

examples/sites/demos/pc/app/time-picker/event.vue

@@ -29,13 +29,13 @@ export default {
       this.$refs.timePickerRef.$el.querySelector('input').focus()
     },
     blur() {
-      Modal.message('blur事件')
+      Modal.message({ message: 'blur事件', status: 'info' })
     },
     change() {
-      Modal.message('change事件')
+      Modal.message({ message: 'change事件', status: 'info' })
     },
     focus() {
-      Modal.message('focus事件')
+      Modal.message({ message: 'focus事件', status: 'info' })
     }
   }
 }

examples/sites/demos/pc/app/time-picker/webdoc/time-picker.js

@@ -59,7 +59,7 @@ export default {
       'name': { 'zh-CN': '步长', 'en-US': 'Step' },
       'desc': {
         'zh-CN':
-          '<p>通过 <code>step</code> 设置步长，默认值为 <code>{ hour: 1, minute: 1, second: 1 }</code>，其中 <code>hour</code> 的设置范围是 <code>0-23</code>，<code>minute</code>、<code>second</code> 的设置范围是 <code>0-60</code>。可单独设置其中的一项或多项值，未设置的默认值为 <code>1</code>。</p>',
+          '<p>通过 <code>step</code> 设置步长，默认值为 <code>{ hour: 1, minute: 1, second: 1 }</code>，其中 <code>hour</code> 的设置范围是 <code>0-23</code>，<code>minute</code>、<code>second</code> 的设置范围是 <code>0-59</code>。可单独设置其中的一项或多项值，未设置的默认值为 <code>1</code>。</p>',
         'en-US':
           '<p>Set the step size through <code> step </code>. The default value is <code> {hour: 1, minute: 1, second: 1} </code>, where the setting range of <code> hour </code> is <code> 0-23 </code>, <code> minute </code>, <code> second </code> is <code> 0-60 </code>. One or more of these values can be set separately, and the unset default value is <code> 1 </code>.</p>'
       },
@@ -161,7 +161,7 @@ export default {
             'zh-CN': '是否使用箭头进行时间选择',
             'en-US': 'Whether to use arrows for time selection'
           },
-          'demoId': 'arrow-control'
+          'demoId': 'basic-usage'
         },
         {
           'name': 'clearable',
@@ -175,14 +175,14 @@ export default {
         },
         {
           'name': 'clear-icon',
-          'type': 'object',
+          'type': 'Component',
           'defaultValue': 'IconOperationfaild',
           'desc': {
             'zh-CN': '自定义清空图标',
             'en-US':
               'Indicates whether to insert a pop-up box to the body element. If a fault occurs in locating the fault in the dialog box that is displayed, you can set this attribute to false'
           },
-          'demoId': 'clear-icon'
+          'demoId': 'clearable'
         },
         {
           'name': 'default-value',
@@ -261,8 +261,7 @@ export default {
           'typeAnchorName': 'IPickerOptions',
           'defaultValue': '--',
           'desc': {
-            'zh-CN':
+            'zh-CN': '配置可选的时间范围、下拉框中显示的格式',
-              '配置可选的时间范围、下拉框中显示的格式，包含 selectableRange / format 属性，详细用法可参考 IPickerOptions 类型声明',
             'en-US': ''
           },
           'demoId': 'disabled'

packages/renderless/src/picker/index.ts

@@ -731,9 +731,11 @@ export const showPicker =
     state.pickerVisible = state.picker.state.visible = true
     state.picker.state.value = state.parsedValue
     state.picker.resetView && state.picker.resetView()
-
+    // 使用nextTick方法解决time-picker组件的demo"下拉框类名"点击input，时间选择框弹出位置错误的问题，
+    nextTick(() => {
       updatePopper(state.picker.$el)
       state.picker.adjustSpinners && state.picker.adjustSpinners()
+    })
   }
 
 export const handlePick =

packages/theme/src/index.less

@@ -125,6 +125,7 @@
 @import './rich-text-editor/index.less';
 @import './roles/index.less';
 @import './row/index.less';
+@import './time-spinner/index.less';
 @import './scroll-text/index.less';
 @import './scrollbar/index.less';
 @import './search/index.less';
@@ -151,7 +152,6 @@
 @import './time-picker/index.less';
 @import './time-range/index.less';
 @import './time-select/index.less';
-@import './time-spinner/index.less';
 @import './tip/index.less';
 @import './toggle-menu/index.less';
 @import './tooltip/index.less';