github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

merge master

pull/9/head
wangxueliang 2018-03-13 10:17:25 +08:00
parent 1d12f17f79 a8fa9d81be
commit cee7acf327
43 changed files with 1325 additions and 586 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/_util/BaseMixin.js
View File

@ -16,9 +16,7 @@ export default {
} else {
this.$listeners[eventName](...args.slice(1))
}
return true
}
return false
},
},
}

14
components/_util/props-util.js
View File

@ -52,7 +52,7 @@ const getOptionProps = (instance) => {
const res = {}
for (const [k, v] of Object.entries(props)) {
if (v.default !== undefined) {
res[k] = v
res[k] = typeof v.default === 'function' ? v.default() : v.default
}
}
return { ...res, ...propsData }
@ -179,6 +179,18 @@ const initDefaultProps = (propTypes, defaultProps) => {
Object.keys(defaultProps).forEach(k => { propTypes[k] = propTypes[k].def(defaultProps[k]) })
return propTypes
}
export function mergeProps () {
const args = [].slice.call(arguments, 0)
const props = {}
args.forEach((p, i) => {
for (const [k, v] of Object.entries(p)) {
props[k] = props[k] || {}
Object.assign(props[k], v)
}
})
return props
}
export {
hasProp,
filterProps,

2
components/_util/vnode.js
View File

@ -70,6 +70,7 @@ export function cloneElement (n, nodeProps, deep) {
domProps = {},
style: tempStyle = {},
class: tempCls = {},
scopedSlots = {},
} = nodeProps
if (typeof data.style === 'string') {
@ -99,6 +100,7 @@ export function cloneElement (n, nodeProps, deep) {
attrs: { ...data.attrs, ...attrs },
class: cls,
domProps: { ...data.domProps, ...domProps },
scopedSlots: { ...data.scopedSlots, ...scopedSlots },
})
if (node.componentOptions) {

4
components/pagination/index.en-US.md
View File

@ -1,7 +1,7 @@
## API
```html
<Pagination @change="onChange" :total="50" />
<a-pagination @change="onChange" :total="50" />
```
| Property | Description | Type | Default |
@ -11,7 +11,7 @@
| defaultPageSize | default number of data items per page | number | 10 |
| hideOnSinglePage | Whether to hide pager on single page | boolean | false |
| itemRender | to customize item innerHTML | (page, type: 'page' \| 'prev' \| 'next', originalElement) => vNode | - |
| pageSize | number of data items per page | number | - |
| pageSize(.sync) | number of data items per page | number | - |
| pageSizeOptions | specify the sizeChanger options | string\[] | ['10', '20', '30', '40'] |
| showQuickJumper | determine whether you can jump to pages directly | boolean | false |
| showSizeChanger | determine whether `pageSize` can be changed | boolean | false |

4
components/pagination/index.zh-CN.md
View File

@ -1,7 +1,7 @@
## API
```html
<Pagination @change="onChange" :total="50" />
<a-pagination @change="onChange" :total="50" />
```
| 参数 | 说明 | 类型 | 默认值 |
@ -11,7 +11,7 @@
| defaultPageSize | 默认的每页条数 | number | 10 |
| hideOnSinglePage | 只有一页时是否隐藏分页器 | boolean | false |
| itemRender | 用于自定义页码的结构，可用于优化 SEO | (page, type: 'page' \| 'prev' \| 'next', originalElement) => vNode | - |
| pageSize | 每页条数 | number | - |
| pageSize(.sync) | 每页条数 | number | - |
| pageSizeOptions | 指定每页可以显示多少条 | string\[] | ['10', '20', '30', '40'] |
| showQuickJumper | 是否可以快速跳转至某页 | boolean | false |
| showSizeChanger | 是否可以改变 pageSize | boolean | false |

29
components/steps/demo/customized-progress-dot.md
View File

@ -10,30 +10,19 @@ You can customize the display for Steps with progress dot style.
```html
<template>
<a-steps :current="1" :progressDot="customDot">
<div>
<a-steps :current="1">
<a-popover slot="progressDot" slot-scope="{index, status, prefixCls}">
<template slot="content">
<span>step {{index}} status: {{status}}</span>
</template>
<span :class="`${prefixCls}-icon-dot`"></span>
</a-popover>
<a-step title="Finished" description="You can hover on the dot." />
<a-step title="In Progress" description="You can hover on the dot." />
<a-step title="Waiting" description="You can hover on the dot." />
<a-step title="Waiting" description="You can hover on the dot." />
</a-steps>
</div>
</template>
<script>
export default {
data() {
return {}
},
methods: {
customDot(dot, {index, status}) {
return (
<a-popover>
<template slot="content">
<span>step {index} status: {status}</span>
</template>
{dot}
</a-popover>
)
}
},
}
</script>
```

2
components/steps/index.en-US.md
View File

@ -6,7 +6,7 @@ The whole of the step bar.
| -------- | ----------- | ---- | ------- |
| current | to set the current step, counting from 0. You can overwrite this state by using `status` of `Step` | number | 0 |
| direction | to specify the direction of the step bar, `horizontal` and `vertical` are currently supported | string | `horizontal` |
| progressDot | Steps with progress dot style, customize the progress dot by setting it to a function | Boolean or (iconDot, {index, status, title, description}) => vNode | false |
| progressDot | Steps with progress dot style, customize the progress dot by setting a scoped slot | Boolean or slot="progressDot" slot-scope="{index, status, title, description, prefixCls})" | false |
| size | to specify the size of the step bar, `default` and `small` are currently supported | string | `default` |
| status | to specify the status of current step, can be set to one of the following values: `wait` `process` `finish` `error` | string | `process` |

1
components/steps/index.vue
View File

@ -32,6 +32,7 @@ export default {
const stepsProps = {
props,
on: this.$listeners,
scopedSlots: this.$scopedSlots,
}
return (
<VcSteps

2
components/steps/index.zh-CN.md
View File

@ -7,7 +7,7 @@
| --- | --- | --- | --- |
| current | 指定当前步骤，从 0 开始记数。在子 Step 元素中，可以通过 `status` 属性覆盖状态 | number | 0 |
| direction | 指定步骤条方向。目前支持水平（`horizontal`）和竖直（`vertical`）两种方向 | string | horizontal |
| progressDot | 点状步骤条，可以设置为一个 function | Boolean or (iconDot, {index, status, title, description}) => vNode | false |
| progressDot | 点状步骤条，可以设置为一个 作用域插槽 | Boolean or slot="progressDot" slot-scope="{index, status, title, description, prefixCls})" | false |
| size | 指定大小，目前支持普通（`default`）和迷你（`small`） | string | default |
| status | 指定当前步骤的状态，可选 `wait` `process` `finish` `error` | string | process |

1
components/tabs/src/Tabs.vue
View File

@ -1,4 +1,5 @@
<script>
// based on rc-tabs 9.2.4
import Icon from '../../icon'
import KeyCode from './KeyCode'
import TabContent from './TabContent'

236
components/vc-calendar/demo/antd-calendar.vue Normal file
View File

@ -0,0 +1,236 @@
<script>
/* eslint react/no-multi-comp:0, no-console:0 */
import '../assets/index.less'
import PropTypes from '@/components/_util/vue-types'
import Calendar from '../'
import DatePicker from '../src/Picker'
import zhCN from '../src/locale/zh_CN'
import enUS from '../src/locale/en_US'
import '../../vc-time-picker/assets/index.less'
import TimePickerPanel from '../../vc-time-picker/Panel'
import BaseMixin from '@/components/_util/BaseMixin'
import moment from 'moment'
import 'moment/locale/zh-cn'
import 'moment/locale/en-gb'
const format = 'YYYY-MM-DD HH:mm:ss'
const cn = window.location.search.indexOf('cn') !== -1
const now = moment()
if (cn) {
now.locale('zh-cn').utcOffset(8)
} else {
now.locale('en-gb').utcOffset(0)
}
function getFormat (time) {
return time ? format : 'YYYY-MM-DD'
}
const defaultCalendarValue = now.clone()
defaultCalendarValue.add(-1, 'month')
const timePickerElement = (h) => <TimePickerPanel defaultValue={moment('00:00:00', 'HH:mm:ss')} />
function disabledTime (date) {
console.log('disabledTime', date)
if (date && (date.date() === 15)) {
return {
disabledHours () {
return [3, 4]
},
}
}
return {
disabledHours () {
return [1, 2]
},
}
}
function disabledDate (current) {
if (!current) {
// allow empty select
return false
}
const date = moment()
date.hour(0)
date.minute(0)
date.second(0)
return current.valueOf() < date.valueOf() // can not select days before today
}
const Demo = {
props: {
defaultValue: PropTypes.object,
defaultCalendarValue: PropTypes.object,
},
mixins: [BaseMixin],
data () {
return {
showTime: true,
showDateInput: true,
disabled: false,
value: this.defaultValue,
}
},
methods: {
onChange (value) {
console.log('DatePicker change: ', (value && value.format(format)))
this.setState({
value,
})
},
onShowTimeChange (e) {
this.setState({
showTime: e.target.checked,
})
},
onShowDateInputChange (e) {
this.setState({
showDateInput: e.target.checked,
})
},
toggleDisabled () {
this.setState({
disabled: !this.disabled,
})
},
},
render (h) {
const state = this.$data
const calendar = (<Calendar
locale={cn ? zhCN : enUS}
style={{ zIndex: 1000 }}
dateInputPlaceholder='please input'
formatter={getFormat(state.showTime)}
disabledTime={state.showTime ? disabledTime : null}
timePicker={state.showTime ? timePickerElement(h) : null}
defaultValue={this.defaultCalendarValue}
showDateInput={state.showDateInput}
disabledDate={disabledDate}
/>)
return (<div style={{ width: '400px', margin: '20px' }}>
<div style={{ marginBottom: '10px' }}>
<label>
<input
type='checkbox'
checked={state.showTime}
onChange={this.onShowTimeChange}
/>
showTime
</label>
&nbsp;&nbsp;&nbsp;&nbsp;
<label>
<input
type='checkbox'
checked={state.showDateInput}
onChange={this.onShowDateInputChange}
/>
showDateInput
</label>
&nbsp;&nbsp;&nbsp;&nbsp;
<label>
<input
checked={state.disabled}
onChange={this.toggleDisabled}
type='checkbox'
/>
disabled
</label>
</div>
<div style={{
boxSizing: 'border-box',
position: 'relative',
display: 'block',
lineHeight: 1.5,
marginBottom: '22px',
}}
>
<DatePicker
animation='slide-up'
disabled={state.disabled}
calendar={calendar}
value={state.value}
onChange={this.onChange}
scopedSlots={{
default: ({ value }) => {
return (
<span tabIndex='0'>
<input
placeholder='please select'
style={{ width: '250px' }}
disabled={state.disabled}
readOnly
tabIndex='-1'
class='ant-calendar-picker-input ant-input'
value={value && value.format(getFormat(state.showTime)) || ''}
/>
</span>
)
},
}}
>
</DatePicker>
</div>
</div>)
},
}
function onStandaloneSelect (value) {
console.log('onStandaloneSelect')
console.log(value && value.format(format))
}
function onStandaloneChange (value) {
console.log('onStandaloneChange')
console.log(value && value.format(format))
}
export default {
render (h) {
return (
<div
style={{
zIndex: 1000,
position: 'relative',
width: '900px',
margin: '20px auto',
}}
>
<div>
<div style={{ margin: '10px' }}>
<Calendar
showWeekNumber={false}
locale={cn ? zhCN : enUS}
defaultValue={now}
disabledTime={disabledTime}
showToday
formatter={getFormat(true)}
showOk={false}
timePicker={timePickerElement(h)}
onChange={onStandaloneChange}
disabledDate={disabledDate}
onSelect={onStandaloneSelect}
/>
</div>
<div style={{ float: 'left', width: '300px' }}>
<Demo defaultValue={now} />
</div>
<div style={{ float: 'right', width: '300px' }}>
<Demo defaultCalendarValue={defaultCalendarValue} />
</div>
<div style={{ clear: 'both' }}></div>
</div>
</div>
)
},
}
</script>

160
components/vc-calendar/demo/antd-month-calendar.vue Normal file
View File

@ -0,0 +1,160 @@
<script>
/* eslint react/no-multi-comp:0, no-console:0 */
import '../assets/index.less'
import PropTypes from '@/components/_util/vue-types'
import DatePicker from '../src/Picker'
import zhCN from '../src/locale/zh_CN'
import enUS from '../src/locale/en_US'
import '../../vc-time-picker/assets/index.less'
import BaseMixin from '@/components/_util/BaseMixin'
import MonthCalendar from '../src/MonthCalendar'
import moment from 'moment'
import 'moment/locale/zh-cn'
import 'moment/locale/en-gb'
const format = 'YYYY-MM'
const cn = window.location.search.indexOf('cn') !== -1
const now = moment()
if (cn) {
now.locale('zh-cn').utcOffset(8)
} else {
now.locale('en-gb').utcOffset(0)
}
const defaultCalendarValue = now.clone()
defaultCalendarValue.add(-1, 'month')
const Demo = {
mixins: [BaseMixin],
props: {
defaultValue: PropTypes.object,
},
data () {
return {
showTime: true,
disabled: false,
value: this.defaultValue,
}
},
methods: {
onChange (value) {
console.log(`DatePicker change: ${value && value.format(format)}`)
this.setState({
value,
})
},
onShowTimeChange (e) {
this.setState({
showTime: e.target.checked,
})
},
toggleDisabled () {
this.setState({
disabled: !this.disabled,
})
},
},
render () {
const state = this.$data
const calendar = (<MonthCalendar
locale={cn ? zhCN : enUS}
style={{ zIndex: 1000 }}
/>)
return (<div style={{ width: '240px', margin: '20px' }}>
<div style={{ marginBottom: '10px' }}>
&nbsp;&nbsp;&nbsp;&nbsp;
<label>
<input
checked={state.disabled}
onChange={this.toggleDisabled}
type='checkbox'
/> disabled
</label>
</div>
<div style={{
boxSizing: 'border-box',
position: 'relative',
display: 'block',
lineHeight: 1.5,
marginBottom: '22px',
}}
>
<DatePicker
animation='slide-up'
disabled={state.disabled}
calendar={calendar}
value={state.value}
onChange={this.onChange}
scopedSlots={{
default: ({ value }) => {
return (
<input
style={{ width: '200px' }}
readOnly
disabled={state.disabled}
value={value && value.format(format)}
placeholder='请选择日期'
/>
)
},
}}
>
</DatePicker>
</div>
</div>)
},
}
function onStandaloneSelect (value) {
console.log('month-calendar select', (value && value.format(format)))
}
function onStandaloneChange (value) {
console.log('month-calendar change', (value && value.format(format)))
}
function disabledDate (value) {
return value.year() > now.year() ||
value.year() === now.year() && value.month() > now.month()
}
function onMonthCellContentRender (value) {
// console.log('month-calendar onMonthCellContentRender', (value && value.format(format)));
return `${value.month() + 1}月`
}
export default {
render () {
return (
<div
style={{
zIndex: 1000,
position: 'relative',
width: '600px',
margin: '0 auto',
}}
>
<MonthCalendar
locale={cn ? zhCN : enUS}
style={{ zIndex: 1000 }}
disabledDate={disabledDate}
onSelect={onStandaloneSelect}
onChange={onStandaloneChange}
monthCellContentRender={onMonthCellContentRender}
defaultValue={defaultCalendarValue}
/>
<div style={{ marginTop: '200px' }}>
<Demo defaultValue={now} />
</div>
</div>
)
},
}
</script>

204
components/vc-calendar/demo/antd-range-calendar.vue Normal file
View File

@ -0,0 +1,204 @@
<script>
/* eslint react/no-multi-comp:0, no-console:0 */
import '../assets/index.less'
import '@/components/vc-time-picker/assets/index.less'
import Picker from '../src/Picker'
import zhCN from '../src/locale/zh_CN'
import enUS from '../src/locale/en_US'
import '../../vc-time-picker/assets/index.less'
import TimePickerPanel from '../../vc-time-picker/Panel'
import BaseMixin from '@/components/_util/BaseMixin'
import RangeCalendar from '../src/RangeCalendar'
import moment from 'moment'
import 'moment/locale/zh-cn'
import 'moment/locale/en-gb'
const cn = window.location.search.indexOf('cn') !== -1
if (cn) {
moment.locale('zh-cn')
} else {
moment.locale('en-gb')
}
const now = moment()
if (cn) {
now.utcOffset(8)
} else {
now.utcOffset(0)
}
const defaultCalendarValue = now.clone()
defaultCalendarValue.add(-1, 'month')
const timePickerElement = (h) => <TimePickerPanel defaultValue={[moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')]}/>
function newArray (start, end) {
const result = []
for (let i = start; i < end; i++) {
result.push(i)
}
return result
}
function disabledDate (current) {
const date = moment()
date.hour(0)
date.minute(0)
date.second(0)
return current.isBefore(date) // can not select days before today
}
function disabledTime (time, type) {
console.log('disabledTime', time, type)
if (type === 'start') {
return {
disabledHours () {
const hours = newArray(0, 60)
hours.splice(20, 4)
return hours
},
disabledMinutes (h) {
if (h === 20) {
return newArray(0, 31)
} else if (h === 23) {
return newArray(30, 60)
}
return []
},
disabledSeconds () {
return [55, 56]
},
}
}
return {
disabledHours () {
const hours = newArray(0, 60)
hours.splice(2, 6)
return hours
},
disabledMinutes (h) {
if (h === 20) {
return newArray(0, 31)
} else if (h === 23) {
return newArray(30, 60)
}
return []
},
disabledSeconds () {
return [55, 56]
},
}
}
const formatStr = 'YYYY-MM-DD HH:mm:ss'
function format (v) {
return v ? v.format(formatStr) : ''
}
function isValidRange (v) {
return v && v[0] && v[1]
}
function onStandaloneChange (value) {
console.log('onChange')
console.log(value[0] && format(value[0]), value[1] && format(value[1]))
}
function onStandaloneSelect (value) {
console.log('onSelect')
console.log(format(value[0]), format(value[1]))
}
const Demo = {
mixins: [BaseMixin],
data () {
return {
value: [],
hoverValue: [],
}
},
methods: {
onChange (value) {
console.log('onChange', value)
this.setState({ value })
},
onHoverChange (hoverValue) {
this.setState({ hoverValue })
},
},
render (h) {
const state = this.$data
const calendar = (
<RangeCalendar
hoverValue={state.hoverValue}
onHoverChange={this.onHoverChange}
showWeekNumber={false}
dateInputPlaceholder={['start', 'end']}
defaultValue={[now, now.clone().add(1, 'months')]}
locale={cn ? zhCN : enUS}
disabledTime={disabledTime}
timePicker={timePickerElement(h)}
/>
)
return (
<Picker
value={state.value}
onChange={this.onChange}
animation='slide-up'
calendar={calendar}
>
{
({ value }) => {
return (<span>
<input
placeholder='please select'
style={{ width: '350px' }}
disabled={state.disabled}
readOnly
className='ant-calendar-picker-input ant-input'
value={isValidRange(value) && `${format(value[0])} - ${format(value[1])}` || ''}
/>
</span>)
}
}
</Picker>)
},
}
export default {
render (h) {
return (
<div>
<h2>calendar</h2>
<div style={{ margin: '10px' }}>
<RangeCalendar
showToday={false}
showWeekNumber
dateInputPlaceholder={['start', 'end']}
locale={cn ? zhCN : enUS}
showOk={false}
showClear
format={formatStr}
onChange={onStandaloneChange}
onSelect={onStandaloneSelect}
disabledDate={disabledDate}
timePicker={timePickerElement(h)}
disabledTime={disabledTime}
/>
</div>
<br />
<div style={{ margin: '20px' }}>
<Demo />
</div>
</div>
)
},
}
</script>

76
components/vc-calendar/demo/full-calendar.vue Normal file
View File

@ -0,0 +1,76 @@
<script>
/* eslint react/no-multi-comp:0, no-console:0 */
import '../assets/index.less'
import zhCN from '../src/locale/zh_CN'
import enUS from '../src/locale/en_US'
import '../../vc-time-picker/assets/index.less'
import BaseMixin from '@/components/_util/BaseMixin'
import FullCalendar from '@/components/vc-calendar/src/FullCalendar'
import '@/components/vc-select/assets/index.less'
import Select from '@/components/vc-select'
import moment from 'moment'
import 'moment/locale/zh-cn'
import 'moment/locale/en-gb'
const format = 'YYYY-MM-DD'
const cn = window.location.search.indexOf('cn') !== -1
const now = moment()
if (cn) {
now.locale('zh-cn').utcOffset(8)
} else {
now.locale('en-gb').utcOffset(0)
}
const defaultCalendarValue = now.clone()
defaultCalendarValue.add(-1, 'month')
function onSelect (value) {
console.log('select', value.format(format))
}
export default {
mixins: [BaseMixin],
data () {
return {
type: 'month',
}
},
methods: {
onTypeChange (type) {
this.setState({
type,
})
},
},
render () {
return (
<div style={{ zIndex: 1000, position: 'relative' }}>
<FullCalendar
style={{ margin: '10px' }}
Select={Select}
fullscreen={false}
onSelect={onSelect}
defaultValue={now}
locale={cn ? zhCN : enUS}
/>
<FullCalendar
style={{ margin: '10px' }}
Select={Select}
fullscreen
defaultValue={now}
onSelect={onSelect}
type={this.type}
onTypeChange={this.onTypeChange}
locale={cn ? zhCN : enUS}
/>
</div>
)
},
}
</script>

21
components/vc-calendar/src/Calendar.vue
View File

@ -10,8 +10,8 @@ import CalendarFooter from './calendar/CalendarFooter'
import CalendarMixin from './mixin/CalendarMixin'
import CommonMixin from './mixin/CommonMixin'
import DateInput from './date/DateInput'
import enUs from './locale/en_US'
import { getTimeConfig, getTodayTime, syncTime } from './util'
function goStartMonth () {
const next = this.sValue.clone()
next.startOf('month')
@ -48,12 +48,15 @@ function goDay (direction) {
const Calendar = {
props: {
prefixCls: PropTypes.string,
locale: PropTypes.object.def(enUs),
visible: PropTypes.bool.def(true),
prefixCls: PropTypes.string.def('rc-calendar'),
// prefixCls: PropTypes.string,
defaultValue: PropTypes.object,
value: PropTypes.object,
selectedValue: PropTypes.object,
mode: PropTypes.oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: PropTypes.object,
// locale: PropTypes.object,
showDateInput: PropTypes.bool.def(true),
showWeekNumber: PropTypes.bool,
showToday: PropTypes.bool.def(true),
@ -68,8 +71,8 @@ const Calendar = {
// onPanelChange: PropTypes.func,
disabledDate: PropTypes.func,
disabledTime: PropTypes.any,
renderFooter: PropTypes.func,
renderSidebar: PropTypes.func,
renderFooter: PropTypes.func.def(() => null),
renderSidebar: PropTypes.func.def(() => null),
},
mixins: [BaseMixin, CommonMixin, CalendarMixin],
@ -168,7 +171,8 @@ const Calendar = {
onDateTableSelect (value) {
const { timePicker, sSelectedValue } = this
if (!sSelectedValue && timePicker) {
const timePickerDefaultValue = timePicker.props.defaultValue
const timePickerProps = getOptionProps(timePicker)
const timePickerDefaultValue = timePickerProps.defaultValue
if (timePickerDefaultValue) {
syncTime(timePickerDefaultValue, value)
}
@ -215,6 +219,7 @@ const Calendar = {
let timePickerEle = null
if (timePicker && showTimePicker) {
console.log(timePicker)
const timePickerOriginProps = getOptionProps(timePicker)
const timePickerProps = {
props: {
@ -234,7 +239,7 @@ const Calendar = {
if (timePickerOriginProps.defaultValue !== undefined) {
timePickerProps.props.defaultOpenValue = timePickerOriginProps.defaultValue
}
console.log(timePickerProps)
timePickerEle = cloneElement(timePicker, timePickerProps)
}
@ -320,4 +325,4 @@ const Calendar = {
}
export default Calendar
</script>
</script>

15
components/vc-calendar/src/FullCalendar.vue
View File

@ -7,24 +7,28 @@ import MonthTable from './month/MonthTable'
import CalendarMixin from './mixin/CalendarMixin'
import CommonMixin from './mixin/CommonMixin'
import CalendarHeader from './full-calendar/CalendarHeader'
import enUs from './locale/en_US'
const FullCalendar = {
props: {
locale: PropTypes.object.def(enUs),
visible: PropTypes.bool.def(true),
prefixCls: PropTypes.string.def('rc-calendar'),
defaultType: PropTypes.string.def('date'),
type: PropTypes.string,
prefixCls: PropTypes.string,
locale: PropTypes.object,
// locale: PropTypes.object,
// onTypeChange: PropTypes.func,
fullscreen: PropTypes.bool.def(false),
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func,
showTypeSwitch: PropTypes.bool.def(true),
Select: PropTypes.func.isRequired,
Select: PropTypes.object.isRequired,
headerComponents: PropTypes.array,
headerComponent: PropTypes.object, // The whole header component
headerRender: PropTypes.func,
showHeader: PropTypes.bool.def(true),
disabledDate: PropTypes.func,
renderFooter: PropTypes.func.def(() => null),
renderSidebar: PropTypes.func.def(() => null),
},
mixins: [BaseMixin, CommonMixin, CalendarMixin],
data () {
@ -72,7 +76,7 @@ const FullCalendar = {
headerRender,
disabledDate,
} = props
const { sValue: value, sType: type } = this
const { sValue: value, sType: type, $listeners } = this
let header = null
if (showHeader) {
@ -88,6 +92,7 @@ const FullCalendar = {
value,
},
on: {
...$listeners,
typeChange: this.setType,
valueChange: this.setValue,
},

28
components/vc-calendar/src/MonthCalendar.vue
View File

@ -6,11 +6,18 @@ import CalendarHeader from './calendar/CalendarHeader'
import CalendarFooter from './calendar/CalendarFooter'
import CalendarMixin from './mixin/CalendarMixin'
import CommonMixin from './mixin/CommonMixin'
import enUs from './locale/en_US'
const MonthCalendar = {
props: {
locale: PropTypes.object.def(enUs),
visible: PropTypes.bool.def(true),
prefixCls: PropTypes.string.def('rc-calendar'),
monthCellRender: PropTypes.func,
dateCellRender: PropTypes.func,
disabledDate: PropTypes.func,
monthCellContentRender: PropTypes.func,
renderFooter: PropTypes.func.def(() => null),
renderSidebar: PropTypes.func.def(() => null),
},
mixins: [BaseMixin, CommonMixin, CalendarMixin],
@ -74,25 +81,26 @@ const MonthCalendar = {
render () {
const { mode, sValue: value, $props: props } = this
const { prefixCls, locale, disabledDate, monthCellRender, monthCellContentRender, renderFooter } = props
const children = (
<div class={`${props.prefixCls}-month-calendar-content`}>
<div class={`${props.prefixCls}-month-header-wrap`}>
<div class={`${prefixCls}-month-calendar-content`}>
<div class={`${prefixCls}-month-header-wrap`}>
<CalendarHeader
prefixCls={props.prefixCls}
prefixCls={prefixCls}
mode={mode}
value={value}
locale={props.locale}
disabledMonth={props.disabledDate}
monthCellRender={props.monthCellRender}
monthCellContentRender={props.monthCellContentRender}
locale={locale}
disabledMonth={disabledDate}
monthCellRender={monthCellRender}
monthCellContentRender={monthCellContentRender}
onMonthSelect={this.onSelect}
onValueChange={this.setValue}
onPanelChange={this.handlePanelChange}
/>
</div>
<CalendarFooter
prefixCls={props.prefixCls}
renderFooter={props.renderFooter}
prefixCls={prefixCls}
renderFooter={renderFooter}
/>
</div>
)

27
components/vc-calendar/src/Picker.vue
View File

@ -78,7 +78,7 @@ const Picker = {
onCalendarKeyDown (event) {
if (event.keyCode === KeyCode.ESC) {
event.stopPropagation()
this.close(this.focus)
this.closeCalendar(this.focus)
}
},
@ -94,7 +94,7 @@ const Picker = {
cause.source === 'keyboard' ||
(!calendarProps.timePicker && cause.source !== 'dateInput') ||
cause.source === 'todayButton') {
this.close(this.focus)
this.closeCalendar(this.focus)
}
this.__emit('change', value)
},
@ -107,11 +107,11 @@ const Picker = {
},
onCalendarOk () {
this.close(this.focus)
this.closeCalendar(this.focus)
},
onCalendarClear () {
this.close(this.focus)
this.closeCalendar(this.focus)
},
onVisibleChange (open) {
@ -153,11 +153,11 @@ const Picker = {
}
},
open (callback) {
openCalendar (callback) {
this.setOpen(true, callback)
},
close (callback) {
closeCalendar (callback) {
this.setOpen(false, callback)
},
@ -183,20 +183,25 @@ const Picker = {
align, animation,
disabled,
dropdownClassName,
transitionName, children,
transitionName,
} = props
const state = this.$data
const { sValue, sOpen } = this
const children = this.$scopedSlots.default
const childrenState = {
value: sValue,
open: sOpen,
}
return (<Trigger
popupAlign={align}
builtinPlacements={placements}
popupPlacement={placement}
action={(disabled && !state.sOpen) ? [] : ['click']}
action={(disabled && !sOpen) ? [] : ['click']}
destroyPopupOnHide
getPopupContainer={getCalendarContainer}
popupStyle={style}
popupAnimation={animation}
popupTransitionName={transitionName}
popupVisible={state.sOpen}
popupVisible={sOpen}
onPopupVisibleChange={this.onVisibleChange}
prefixCls={prefixCls}
popupClassName={dropdownClassName}
@ -204,7 +209,7 @@ const Picker = {
<template slot='popup'>
{this.getCalendarElement()}
</template>
{cloneElement(children(state, props), { on: { keydown: this.onKeyDown }})}
{cloneElement(children(childrenState, props), { on: { keydown: this.onKeyDown }})}
</Trigger>)
},
}

886
components/vc-calendar/src/RangeCalendar.vue
View File

File diff suppressed because it is too large Load Diff

21
components/vc-calendar/src/calendar/CalendarFooter.vue
View File

@ -2,9 +2,9 @@
import PropTypes from '@/components/_util/vue-types'
import BaseMixin from '@/components/_util/BaseMixin'
import { getOptionProps } from '@/components/_util/props-util'
import TodayButton from '../calendar/TodayButton'
import OkButton from '../calendar/OkButton'
import TimePickerButton from '../calendar/TimePickerButton'
import TodayButton from './TodayButton'
import OkButton from './OkButton'
import TimePickerButton from './TimePickerButton'
const CalendarFooter = {
mixins: [BaseMixin],
@ -19,6 +19,11 @@ const CalendarFooter = {
value: PropTypes.object,
renderFooter: PropTypes.func,
defaultValue: PropTypes.object,
locale: PropTypes.object,
showToday: PropTypes.bool,
disabledDate: PropTypes.func,
showTimePicker: PropTypes.bool,
okDisabled: PropTypes.bool,
},
methods: {
onSelect (value) {
@ -44,16 +49,16 @@ const CalendarFooter = {
},
on: $listeners,
}
let nowEl
let nowEl = null
if (showToday) {
nowEl = <TodayButton {...btnProps} />
}
delete btnProps.props.value
let okBtn
let okBtn = null
if (showOk === true || showOk !== false && !!timePicker) {
okBtn = <OkButton {...btnProps} />
}
let timePickerBtn
let timePickerBtn = null
if (timePicker) {
timePickerBtn = <TimePickerButton {...btnProps} />
}
@ -61,12 +66,12 @@ const CalendarFooter = {
let footerBtn
if (nowEl || timePickerBtn || okBtn) {
footerBtn = (<span class={`${prefixCls}-footer-btn`}>
{[nowEl, timePickerBtn, okBtn]}
{nowEl}{timePickerBtn}{okBtn}
</span>)
}
const cls = {
[`${prefixCls}-footer`]: true,
[`${prefixCls}-footer-show-ok`]: okBtn,
[`${prefixCls}-footer-show-ok`]: !!okBtn,
}
footerEl = (
<div class={cls}>

11
components/vc-calendar/src/calendar/CalendarHeader.vue
View File

@ -5,7 +5,7 @@ import { getOptionProps } from '@/components/_util/props-util'
import MonthPanel from '../month/MonthPanel'
import YearPanel from '../year/YearPanel'
import DecadePanel from '../decade/DecadePanel'
function noop () {}
function goMonth (direction) {
const next = this.value.clone()
next.add(direction, 'months')
@ -34,6 +34,7 @@ const CalendarHeader = {
enablePrev: PropTypes.any.def(1),
enableNext: PropTypes.any.def(1),
disabledMonth: PropTypes.func,
mode: PropTypes.any,
},
data () {
this.nextMonth = goMonth.bind(this, 1)
@ -47,7 +48,9 @@ const CalendarHeader = {
methods: {
onMonthSelect (value) {
this.__emit('panelChange', value, 'date')
if (this.__emit('monthSelect', value)) {
if (this.$listeners.monthSelect) {
this.__emit('monthSelect', value)
} else {
this.__emit('valueChange', value)
}
},
@ -75,7 +78,7 @@ const CalendarHeader = {
const year = (<a
class={`${prefixCls}-year-select`}
role='button'
onClick={showTimePicker ? null : () => this.showYearPanel('date')}
onClick={showTimePicker ? noop : () => this.showYearPanel('date')}
title={locale.yearSelect}
>
{value.format(locale.yearFormat)}
@ -83,7 +86,7 @@ const CalendarHeader = {
const month = (<a
class={`${prefixCls}-month-select`}
role='button'
onClick={showTimePicker ? null : this.showMonthPanel}
onClick={showTimePicker ? noop : this.showMonthPanel}
title={locale.monthSelect}
>
{locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)}

18
components/vc-calendar/src/calendar/OkButton.vue
View File

@ -2,21 +2,19 @@
function noop () {}
export default {
functional: true,
render: function (createElement, context) {
const { data, listeners = {}} = context
const { prefixCls, locale, okDisabled } = data
render (createElement, context) {
const { props, listeners = {}} = context
const { prefixCls, locale, okDisabled } = props
const { ok = noop } = listeners
let className = `${prefixCls}-ok-btn`
if (okDisabled) {
className += ` ${prefixCls}-ok-btn-disabled`
}
return (<a
class={className}
role='button'
onClick={okDisabled ? noop : ok}
>
{locale.ok}
</a>)
return (
<a class={className} role='button' onClick={okDisabled ? noop : ok}>
{locale.ok}
</a>
)
},
}

18
components/vc-calendar/src/calendar/TimePickerButton.vue
View File

@ -2,11 +2,11 @@
function noop () {}
export default {
functional: true,
render: function (createElement, context) {
const { data, listeners = {}} = context
render (h, context) {
const { props, listeners = {}} = context
const {
prefixCls, locale, showTimePicker,
timePickerDisabled } = data
timePickerDisabled } = props
const { closeTimePicker = noop, openTimePicker = noop } = listeners
const className = {
[`${prefixCls}-time-picker-btn`]: true,
@ -16,13 +16,11 @@ export default {
if (!timePickerDisabled) {
onClick = showTimePicker ? closeTimePicker : openTimePicker
}
return (<a
class={className}
role='button'
onClick={onClick}
>
{showTimePicker ? locale.dateSelect : locale.timeSelect}
</a>)
return (
<a class={className} role='button' onClick={onClick}>
{showTimePicker ? locale.dateSelect : locale.timeSelect}
</a>
)
},
}

4
components/vc-calendar/src/calendar/TodayButton.vue
View File

@ -4,7 +4,7 @@ function noop () {}
export default {
functional: true,
render (createElement, context) {
const { data, listeners = {}} = context
const { props, listeners = {}} = context
const {
prefixCls,
locale,
@ -14,7 +14,7 @@ export default {
disabledDate,
// onToday,
text,
} = data
} = props
const { today = noop } = listeners
const localeNow = (!text && timePicker ? locale.now : text) || locale.today
const disabledToday =

5
components/vc-calendar/src/date/DateInput.vue
View File

@ -23,7 +23,7 @@ const DateInput = {
data () {
const selectedValue = this.selectedValue
return {
str: selectedValue && selectedValue.format(this.props.format) || '',
str: selectedValue && selectedValue.format(this.format) || '',
invalid: false,
}
},
@ -45,7 +45,6 @@ const DateInput = {
},
methods: {
updateState () {
console.log('关注下')
this.cachedSelectionStart = this.$refs.dateInputInstance.selectionStart
this.cachedSelectionEnd = this.$refs.dateInputInstance.selectionEnd
// when popup show, click body will call this, bug!
@ -131,7 +130,7 @@ const DateInput = {
value={str}
disabled={disabled}
placeholder={placeholder}
onChange={this.onInputChange}
onInput={this.onInputChange}
/>
</div>
{showClear ? <a

13
components/vc-calendar/src/date/DateTBody.vue
View File

@ -4,7 +4,7 @@ import { getOptionProps } from '@/components/_util/props-util'
import cx from 'classnames'
import DateConstants from './DateConstants'
import { getTitleString, getTodayTime } from '../util/'
function noop () {}
function isSameDay (one, two) {
return one && two && one.isSame(two, 'day')
}
@ -35,7 +35,7 @@ const DateTBody = {
dateRender: PropTypes.func,
disabledDate: PropTypes.func,
prefixCls: PropTypes.string,
selectedValue: PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object)]),
selectedValue: PropTypes.oneOfType([PropTypes.any, PropTypes.arrayOf(PropTypes.any)]),
value: PropTypes.object,
hoverValue: PropTypes.any.def([]),
showWeekNumber: PropTypes.bool,
@ -48,6 +48,8 @@ const DateTBody = {
showWeekNumber, dateRender, disabledDate,
hoverValue,
} = props
const { $listeners = {}} = this
const { select = noop, dayHover = noop } = $listeners
let iIndex
let jIndex
let current
@ -97,7 +99,7 @@ const DateTBody = {
if (showWeekNumber) {
weekNumberCell = (
<td
key={dateTable[passed].week()}
key={`week-${dateTable[passed].week()}`}
role='gridcell'
class={weekNumberCellClass}
>
@ -208,9 +210,8 @@ const DateTBody = {
dateCells.push(
<td
key={passed}
onClick={disabled ? undefined : props.onSelect.bind(null, current)}
onMouseenter={disabled
? undefined : props.onDayHover && props.onDayHover.bind(null, current) || undefined}
onClick={disabled ? noop : select.bind(null, current)}
onMouseenter={disabled ? noop : dayHover.bind(null, current)}
role='gridcell'
title={getTitleString(current)} class={cls}
>

4
components/vc-calendar/src/date/DateTHead.vue
View File

@ -5,7 +5,7 @@ import moment from 'moment'
export default {
functional: true,
render (createElement, context) {
const { data: props } = context
const { props } = context
const value = props.value
const localeData = value.localeData()
const prefixCls = props.prefixCls
@ -51,4 +51,4 @@ export default {
</thead>)
},
}
</script>
</script>

14
components/vc-calendar/src/date/DateTable.vue
View File

@ -5,15 +5,15 @@ import DateTBody from './DateTBody'
export default {
functional: true,
render (createElement, context) {
const { data, listeners = {}} = context
const prefixCls = data.prefixCls
const props = {
props: data,
const { props, listeners = {}} = context
const prefixCls = props.prefixCls
const bodyProps = {
props,
on: listeners,
}
return (<table class = {`${prefixCls}-table`} cellSpacing='0' role='grid'>
<DateTHead {...props}/>
<DateTBody {...props}/>
return (<table class={`${prefixCls}-table`} cellSpacing='0' role='grid'>
<DateTHead {...bodyProps}/>
<DateTBody {...bodyProps}/>
</table>)
},
}

7
components/vc-calendar/src/decade/DecadePanel.vue
View File

@ -29,10 +29,9 @@ export default {
rootPrefixCls: PropTypes.string,
},
data () {
this.prefixCls = `${this.rootPrefixCls}-decade-panel`
this.nextCentury = goYear.bind(this, 100)
this.previousCentury = goYear.bind(this, -100)
this.state = {
return {
sValue: this.value || this.defaultValue,
}
},
@ -46,7 +45,7 @@ export default {
const endYear = startYear + 99
const decades = []
let index = 0
const prefixCls = this.prefixCls
const prefixCls = `${this.rootPrefixCls}-decade-panel`
for (let rowIndex = 0; rowIndex < ROW; rowIndex++) {
decades[rowIndex] = []
@ -99,7 +98,7 @@ export default {
})
return (
<div class={this.prefixCls}>
<div class={prefixCls}>
<div class={`${prefixCls}-header`}>
<a
class={`${prefixCls}-prev-century-btn`}

2
components/vc-calendar/src/full-calendar/CalendarHeader.vue
View File

@ -12,7 +12,7 @@ const CalendarHeader = {
yearSelectTotal: PropTypes.number.def(20),
// onValueChange: PropTypes.func,
// onTypeChange: PropTypes.func,
Select: PropTypes.func,
Select: PropTypes.object,
prefixCls: PropTypes.string,
type: PropTypes.string,
showTypeSwitch: PropTypes.bool,

6
components/vc-calendar/src/mixin/CalendarMixin.js
View File

@ -3,7 +3,7 @@ import BaseMixin from '@/components/_util/BaseMixin'
import { hasProp } from '@/components/_util/props-util'
import moment from 'moment'
import { isAllowedDate, getTodayTime } from '../util/index'
function noop () {}
function getNow () {
return moment()
}
@ -56,7 +56,7 @@ const CalendarMixin = {
},
renderRoot (newProps) {
const props = this.props
const props = this.$props
const prefixCls = props.prefixCls
const className = {
@ -71,7 +71,7 @@ const CalendarMixin = {
ref='rootInstance'
class={className}
tabIndex='0'
onKeydown={this.onKeyDown}
onKeydown={this.onKeyDown || noop}
>
{newProps.children}
</div>

12
components/vc-calendar/src/mixin/CommonMixin.js
View File

@ -1,16 +1,4 @@
import PropTypes from '@/components/_util/vue-types'
import enUs from '../locale/en_US'
export default {
props: {
locale: PropTypes.object.def(enUs),
visible: PropTypes.bool.def(true),
// onSelect: PropTypes.func,
prefixCls: PropTypes.string.def('rc-calendat'),
// onChange: PropTypes.func,
// onOk: PropTypes.func,
},
// getDefaultProps () {
// return {
// locale: enUs,

6
components/vc-calendar/src/month/MonthPanel.vue
View File

@ -17,6 +17,12 @@ function noop () {
const MonthPanel = {
mixins: [BaseMixin],
props: {
value: PropTypes.any,
defaultValue: PropTypes.any,
cellRender: PropTypes.any,
contentRender: PropTypes.any,
locale: PropTypes.any,
rootPrefixCls: PropTypes.string,
// onChange: PropTypes.func,
disabledDate: PropTypes.func,
// onSelect: PropTypes.func,

9
components/vc-calendar/src/month/MonthTable.vue
View File

@ -22,6 +22,9 @@ const MonthTable = {
cellRender: PropTypes.func,
prefixCls: PropTypes.string,
value: PropTypes.object,
locale: PropTypes.any,
contentRender: PropTypes.any,
disabledDate: PropTypes.func,
},
data () {
return {
@ -71,14 +74,14 @@ const MonthTable = {
const today = getTodayTime(value)
const months = this.months()
const currentMonth = value.month()
const { prefixCls, locale, contentRender, cellRender } = props
const { prefixCls, locale, contentRender, cellRender, disabledDate } = props
const monthsEls = months.map((month, index) => {
const tds = month.map(monthData => {
let disabled = false
if (props.disabledDate) {
if (disabledDate) {
const testValue = value.clone()
testValue.month(monthData.value)
disabled = props.disabledDate(testValue)
disabled = disabledDate(testValue)
}
const classNameMap = {
[`${prefixCls}-cell`]: 1,

4
components/vc-calendar/src/range-calendar/CalendarPart.vue
View File

@ -19,6 +19,7 @@ const CalendarPart = {
locale: PropTypes.any,
showDateInput: PropTypes.bool,
showTimePicker: PropTypes.bool,
showWeekNumber: PropTypes.bool,
format: PropTypes.any,
placeholder: PropTypes.any,
disabledDate: PropTypes.any,
@ -62,7 +63,6 @@ const CalendarPart = {
}
const index = direction === 'left' ? 0 : 1
const timePickerProps = getOptionProps(timePicker)
console.log('timePickerProps', timePickerProps)
const timePickerEle = shouldShowTimePicker &&
cloneElement(timePicker, {
props: {
@ -141,4 +141,4 @@ const CalendarPart = {
}
export default CalendarPart
</script>
</script>

10
components/vc-calendar/src/year/YearPanel.vue
View File

@ -25,6 +25,7 @@ export default {
rootPrefixCls: PropTypes.string,
value: PropTypes.object,
defaultValue: PropTypes.object,
locale: PropTypes.object,
},
data () {
this.nextDecade = goYear.bind(this, 10)
@ -59,9 +60,8 @@ export default {
},
render () {
const props = this.$props
const value = this.sValue
const locale = props.locale
const { sValue: value, locale, $listeners = {}} = this
const decadePanelShow = $listeners.decadePanelShow || noop
const years = this.years()
const currentYear = value.year()
const startYear = parseInt(currentYear / 10, 10) * 10
@ -103,7 +103,7 @@ export default {
})
return (
<div class={this.prefixCls}>
<div class={prefixCls}>
<div>
<div class={`${prefixCls}-header`}>
<a
@ -115,7 +115,7 @@ export default {
<a
class={`${prefixCls}-decade-select`}
role='button'
onClick={props.onDecadePanelShow}
onClick={decadePanelShow}
title={locale.decadeSelect}
>
<span class={`${prefixCls}-decade-select-content`}>

2
components/vc-pagination/Options.vue
View File

@ -112,7 +112,7 @@ export default {
<input
type='text'
value={this.goInputText}
onChange={this.handleChange}
onInput={this.handleChange}
onKeyup={this.go}
/>
{locale.page}

2
components/vc-pagination/Pagination.vue
View File

@ -301,7 +301,7 @@ export default {
value={this.stateCurrentInputValue}
onKeydown={this.handleKeyDown}
onKeyup={this.handleKeyUp}
onChange={this.handleKeyUp}
onInput={this.handleKeyUp}
size='3'
/>
<span class={`${prefixCls}-slash`}>／</span>

8
components/vc-steps/Step.vue
View File

@ -28,9 +28,13 @@ export default {
methods: {
renderIconNode () {
const {
prefixCls, progressDot, stepNumber, status,
prefixCls, stepNumber, status,
iconPrefix,
} = getOptionProps(this)
let progressDot = this.progressDot
if (progressDot === undefined) {
progressDot = this.$scopedSlots.progressDot
}
const icon = getComponentFromProp(this, 'icon')
const title = getComponentFromProp(this, 'title')
const description = getComponentFromProp(this, 'description')
@ -48,7 +52,7 @@ export default {
if (typeof progressDot === 'function') {
iconNode = (
<span class={`${prefixCls}-icon`}>
{progressDot(iconDot, { index: stepNumber - 1, status, title, description })}
{progressDot({ index: stepNumber - 1, status, title, description, prefixCls })}
</span>
)
} else {

13
components/vc-steps/Steps.vue
View File

@ -24,7 +24,7 @@ export default {
progressDot: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.func,
]).def(false),
]),
current: PropTypes.number.def(0),
},
data () {
@ -84,8 +84,12 @@ export default {
render () {
const {
prefixCls, direction,
labelPlacement, iconPrefix, status, size, current, progressDot,
} = getOptionProps(this)
labelPlacement, iconPrefix, status, size, current, $scopedSlots,
} = this
let progressDot = this.progressDot
if (progressDot === undefined) {
progressDot = $scopedSlots.progressDot
}
const { lastStepOffsetWidth, flexSupported } = this
const filteredChildren = filterEmpty(this.$slots.default)
const lastIndex = filteredChildren.length - 1
@ -112,10 +116,11 @@ export default {
stepNumber: `${index + 1}`,
prefixCls,
iconPrefix,
progressDot,
progressDot: this.progressDot,
...childProps,
},
on: getEvents(child),
scopedSlots: $scopedSlots,
}
if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
stepProps.props.itemWidth = `${100 / lastIndex}%`

1
components/vc-time-picker/Panel.vue
View File

@ -29,6 +29,7 @@ const Panel = {
},
},
value: PropTypes.object,
defaultValue: PropTypes.object,
placeholder: PropTypes.string,
format: PropTypes.string,
inputReadOnly: PropTypes.bool.def(false),

6
components/vc-time-picker/TimePicker.vue
View File

@ -56,6 +56,7 @@ export default {
focusOnOpen: PropTypes.bool,
// onKeyDown: PropTypes.func,
autoFocus: PropTypes.bool,
id: PropTypes.string,
}, {
clearText: 'clear',
prefixCls: 'rc-time-picker',
@ -63,6 +64,7 @@ export default {
inputReadOnly: false,
popupClassName: '',
align: {},
id: '',
allowEmpty: true,
showHour: true,
showMinute: true,
@ -252,7 +254,7 @@ export default {
render () {
const {
prefixCls, placeholder, placement, align,
prefixCls, placeholder, placement, align, id,
disabled, transitionName, getPopupContainer, name, autoComplete,
autoFocus, inputReadOnly, sOpen, sValue, onFocus, onBlur,
} = this
@ -288,8 +290,8 @@ export default {
onFocus={onFocus}
onBlur={onBlur}
autoFocus={autoFocus}
onChange={noop}
readOnly={!!inputReadOnly}
id={id}
/>
<span class={`${prefixCls}-icon`}/>
</span>

1
components/vc-time-picker/index.js
View File

@ -1 +1,2 @@
// based on rc-time-picker 3.3.1
export { default } from './TimePicker'