2018-03-09 02:19:00 +00:00
|
|
|
|
<script>
|
|
|
|
|
import Hours from './12hours'
|
|
|
|
|
import Addon from './addon'
|
|
|
|
|
import Basic from './basic'
|
|
|
|
|
import Disabled from './disabled'
|
|
|
|
|
import HideColumn from './hide-column'
|
|
|
|
|
import IntervalOptions from './interval-options'
|
|
|
|
|
import Size from './size'
|
|
|
|
|
import Value from './value'
|
|
|
|
|
|
|
|
|
|
import CN from '../index.zh-CN.md'
|
|
|
|
|
import US from '../index.en-US.md'
|
|
|
|
|
const md = {
|
|
|
|
|
cn: `# TimePicker 时间选择框
|
|
|
|
|
输入或选择时间的控件。
|
|
|
|
|
## 何时使用
|
|
|
|
|
当用户需要输入一个时间,可以点击标准输入框,弹出时间面板进行选择。
|
|
|
|
|
## 代码演示`,
|
|
|
|
|
us: `# TimePicker
|
|
|
|
|
To select/input a time.
|
|
|
|
|
## When To Use
|
|
|
|
|
By clicking the input box, you can select a time from a popup panel.`,
|
|
|
|
|
}
|
|
|
|
|
export default {
|
|
|
|
|
category: 'Components',
|
|
|
|
|
subtitle: '时间选择框',
|
|
|
|
|
type: 'Data Entry',
|
|
|
|
|
title: 'TimePicker',
|
|
|
|
|
render () {
|
|
|
|
|
return (
|
2018-03-09 04:20:21 +00:00
|
|
|
|
<div id='components-timepicker-demo'>
|
2018-03-09 02:19:00 +00:00
|
|
|
|
<md cn={md.cn} us={md.us}/>
|
|
|
|
|
<Hours/>
|
|
|
|
|
<Addon/>
|
|
|
|
|
<Basic/>
|
|
|
|
|
<Disabled/>
|
|
|
|
|
<HideColumn/>
|
|
|
|
|
<IntervalOptions/>
|
|
|
|
|
<Size/>
|
|
|
|
|
<Value/>
|
|
|
|
|
<api>
|
|
|
|
|
<CN slot='cn' />
|
|
|
|
|
<US/>
|
|
|
|
|
</api>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
<style>
|
2018-03-09 04:20:21 +00:00
|
|
|
|
#components-timepicker-demo .ant-time-picker { margin: 0 8px 12px 0; }
|
2018-03-09 02:19:00 +00:00
|
|
|
|
</style>
|