feat: update calendar from 9.6.2 to 9.7.9

pull/309/head
tangjinzhou 2018-10-29 20:48:23 +08:00
parent 75ca6435aa
commit f24d5efb2b
15 changed files with 186 additions and 25 deletions

View File

@ -218,6 +218,7 @@ export default {
onChange={onStandaloneChange}
disabledDate={disabledDate}
onSelect={onStandaloneSelect}
renderFooter={() => 'extra footer'}
/>
</div>
<div style={{ float: 'left', width: '300px' }}>

View File

@ -148,6 +148,7 @@ export default {
onChange={onStandaloneChange}
monthCellContentRender={onMonthCellContentRender}
defaultValue={defaultCalendarValue}
renderFooter={() => 'extra footer'}
/>
<div style={{ marginTop: '200px' }}>

View File

@ -143,6 +143,7 @@ const Demo = {
locale={cn ? zhCN : enUS}
disabledTime={disabledTime}
timePicker={timePickerElement(h)}
renderFooter={() => 'extra footer'}
/>
)
return (

View File

@ -1,3 +1,3 @@
// based on rc-calendar 9.6.2
// based on rc-calendar 9.7.9
import Calendar from './src/'
export default Calendar

View File

@ -1,7 +1,7 @@
import PropTypes from '../../_util/vue-types'
import BaseMixin from '../../_util/BaseMixin'
import { getOptionProps, hasProp } from '../../_util/props-util'
import { getOptionProps, hasProp, getComponentFromProp } from '../../_util/props-util'
import { cloneElement } from '../../_util/vnode'
import KeyCode from '../../_util/KeyCode'
import * as moment from 'moment'
@ -49,9 +49,10 @@ const Calendar = {
// onPanelChange: PropTypes.func,
disabledDate: PropTypes.func,
disabledTime: PropTypes.any,
dateRender: PropTypes.func,
renderFooter: PropTypes.func.def(() => null),
renderSidebar: PropTypes.func.def(() => null),
dateRender: PropTypes.func,
clearIcon: PropTypes.any,
},
mixins: [BaseMixin, CommonMixin, CalendarMixin],
@ -200,6 +201,7 @@ const Calendar = {
sValue, sSelectedValue, sMode,
$props: props,
} = this
const clearIcon = getComponentFromProp(this, 'clearIcon')
const showTimePicker = sMode === 'time'
const disabledTimeConfig = showTimePicker && disabledTime && timePicker
? getTimeConfig(sSelectedValue, disabledTime) : null
@ -243,6 +245,7 @@ const Calendar = {
prefixCls={prefixCls}
selectedValue={sSelectedValue}
onChange={this.onDateInputChange}
clearIcon={clearIcon}
/>
) : null
const children = [

View File

@ -1,7 +1,7 @@
import PropTypes from '../../_util/vue-types'
import BaseMixin from '../../_util/BaseMixin'
import { getOptionProps, hasProp, mergeProps } from '../../_util/props-util'
import { getOptionProps, hasProp, mergeProps, getComponentFromProp } from '../../_util/props-util'
import moment from 'moment'
import KeyCode from '../../_util/KeyCode'
import CalendarPart from './range-calendar/CalendarPart'
@ -105,6 +105,7 @@ const RangeCalendar = {
renderFooter: PropTypes.func.def(() => null),
renderSidebar: PropTypes.func.def(() => null),
dateRender: PropTypes.func,
clearIcon: PropTypes.any,
},
mixins: [BaseMixin, CommonMixin],
@ -583,6 +584,7 @@ const RangeCalendar = {
timePicker, showOk, locale, showClear,
showToday, type,
} = props
const clearIcon = getComponentFromProp(this, 'clearIcon')
const {
sHoverValue,
sSelectedValue,
@ -657,6 +659,7 @@ const RangeCalendar = {
showTimePicker: showTimePicker,
enablePrev: true,
enableNext: !isClosestMonths || this.isMonthYearPanelShow(sMode[1]),
clearIcon,
},
on: {
inputSelect: this.onStartInputSelect,
@ -680,6 +683,7 @@ const RangeCalendar = {
disabledMonth: this.disabledEndMonth,
enablePrev: !isClosestMonths || this.isMonthYearPanelShow(sMode[0]),
enableNext: true,
clearIcon,
},
on: {
inputSelect: this.onEndInputSelect,
@ -699,7 +703,7 @@ const RangeCalendar = {
today: this.onToday,
},
})
TodayButtonNode = <TodayButton {...todayButtonProps}/>
TodayButtonNode = <TodayButton key='todayButton' {...todayButtonProps}/>
}
let TimePickerButtonNode = null
@ -714,7 +718,7 @@ const RangeCalendar = {
closeTimePicker: this.onCloseTimePicker,
},
})
TimePickerButtonNode = <TimePickerButton {...timePickerButtonProps} />
TimePickerButtonNode = <TimePickerButton key='timePickerButton' {...timePickerButtonProps} />
}
let OkButtonNode = null
@ -727,9 +731,9 @@ const RangeCalendar = {
ok: this.onOk,
},
})
OkButtonNode = <OkButton {...okButtonProps}/>
OkButtonNode = <OkButton key='okButtonNode' {...okButtonProps}/>
}
const extraFooter = this.renderFooter()
return (
<div
ref='rootInstance'
@ -741,11 +745,12 @@ const RangeCalendar = {
<div class={`${prefixCls}-panel`}>
{showClear && sSelectedValue[0] && sSelectedValue[1]
? <a
class={`${prefixCls}-clear-btn`}
role='button'
title={locale.clear}
onClick={this.clear}
/> : null}
>
{clearIcon || <span class={`${prefixCls}-clear-btn`} />}
</a> : null}
<div
class={`${prefixCls}-date-panel`}
onMouseleave={type !== 'both' ? this.onDatePanelLeave : noop}
@ -757,8 +762,9 @@ const RangeCalendar = {
</div>
<div class={cls}>
{props.renderFooter()}
{showToday || props.timePicker || showOkButton ? (
{(showToday || props.timePicker || showOkButton || extraFooter) ? (
<div class={`${prefixCls}-footer-btn`}>
{extraFooter}
{TodayButtonNode}
{TimePickerButtonNode}
{OkButtonNode}

View File

@ -51,21 +51,22 @@ const CalendarFooter = {
}
let nowEl = null
if (showToday) {
nowEl = <TodayButton {...btnProps} />
nowEl = <TodayButton key='todayButton' {...btnProps} />
}
delete btnProps.props.value
let okBtn = null
if (showOk === true || showOk !== false && !!timePicker) {
okBtn = <OkButton {...btnProps} />
okBtn = <OkButton key='okButton' {...btnProps} />
}
let timePickerBtn = null
if (timePicker) {
timePickerBtn = <TimePickerButton {...btnProps} />
timePickerBtn = <TimePickerButton key='timePickerButton' {...btnProps} />
}
let footerBtn
if (nowEl || timePickerBtn || okBtn) {
if (nowEl || timePickerBtn || okBtn || extraFooter) {
footerBtn = (<span class={`${prefixCls}-footer-btn`}>
{extraFooter}
{nowEl}{timePickerBtn}{okBtn}
</span>)
}
@ -75,7 +76,6 @@ const CalendarFooter = {
}
footerEl = (
<div class={cls}>
{extraFooter}
{footerBtn}
</div>)
}

View File

@ -77,26 +77,27 @@ const CalendarHeader = {
const localeData = value.localeData()
const monthBeforeYear = locale.monthBeforeYear
const selectClassName = `${prefixCls}-${monthBeforeYear ? 'my-select' : 'ym-select'}`
const timeClassName = showTimePicker ? ` ${prefixCls}-time-status` : ''
const year = (<a
class={`${prefixCls}-year-select`}
class={`${prefixCls}-year-select${timeClassName}`}
role='button'
onClick={showTimePicker ? noop : () => this.showYearPanel('date')}
title={locale.yearSelect}
title={showTimePicker ? null : locale.yearSelect}
>
{value.format(locale.yearFormat)}
</a>)
const month = (<a
class={`${prefixCls}-month-select`}
class={`${prefixCls}-month-select${timeClassName}`}
role='button'
onClick={showTimePicker ? noop : this.showMonthPanel}
title={locale.monthSelect}
title={showTimePicker ? null : locale.monthSelect}
>
{locale.monthFormat ? value.format(locale.monthFormat) : localeData.monthsShort(value)}
</a>)
let day
if (showTimePicker) {
day = (<a
class={`${prefixCls}-day-select`}
class={`${prefixCls}-day-select${timeClassName}`}
role='button'
>
{value.format(locale.dayFormat)}

View File

@ -1,6 +1,7 @@
import PropTypes from '../../../_util/vue-types'
import BaseMixin from '../../../_util/BaseMixin'
import { getComponentFromProp } from '../../../_util/props-util'
import moment from 'moment'
const DateInput = {
@ -18,6 +19,7 @@ const DateInput = {
placeholder: PropTypes.string,
// onSelect: PropTypes.func,
selectedValue: PropTypes.object,
clearIcon: PropTypes.any,
},
data () {
@ -38,7 +40,8 @@ const DateInput = {
updated () {
this.$nextTick(() => {
if (!this.invalid) {
if (!this.invalid &&
!(this.cachedSelectionStart === 0 && this.cachedSelectionEnd === 0)) {
this.$refs.dateInputInstance.setSelectionRange(this.cachedSelectionStart, this.cachedSelectionEnd)
}
})
@ -121,6 +124,7 @@ const DateInput = {
render () {
const { invalid, str, locale, prefixCls, placeholder, disabled, showClear } = this
const clearIcon = getComponentFromProp(this, 'clearIcon')
const invalidClass = invalid ? `${prefixCls}-input-invalid` : ''
return (<div class={`${prefixCls}-input-wrap`}>
<div class={`${prefixCls}-date-input-wrap`}>
@ -134,11 +138,12 @@ const DateInput = {
/>
</div>
{showClear ? <a
class={`${prefixCls}-clear-btn`}
role='button'
title={locale.clear}
onClick={this.onClear}
/> : null}
>
{clearIcon || <span class={`${prefixCls}-clear-btn`}/>}
</a> : null}
</div>)
},
}

View File

@ -0,0 +1,28 @@
export default {
today: 'היום',
now: 'עכשיו',
backToToday: 'חזור להיום',
ok: 'אישור',
clear: 'איפוס',
month: 'חודש',
year: 'שנה',
timeSelect: 'בחר שעה',
dateSelect: 'בחר תאריך',
weekSelect: 'בחר שבוע',
monthSelect: 'בחר חודש',
yearSelect: 'בחר שנה',
decadeSelect: 'בחר עשור',
yearFormat: 'YYYY',
dateFormat: 'M/D/YYYY',
dayFormat: 'D',
dateTimeFormat: 'M/D/YYYY HH:mm:ss',
monthBeforeYear: true,
previousMonth: 'חודש קודם (PageUp)',
nextMonth: 'חודש הבא (PageDown)',
previousYear: 'שנה שעברה (Control + left)',
nextYear: 'שנה הבאה (Control + right)',
previousDecade: 'העשור הקודם',
nextDecade: 'העשור הבא',
previousCentury: 'המאה הקודמת',
nextCentury: 'המאה הבאה',
}

View File

@ -0,0 +1,28 @@
export default {
today: 'Hari ini',
now: 'Sekarang',
backToToday: 'Kembali ke hari ini',
ok: 'Baik',
clear: 'Bersih',
month: 'Bulan',
year: 'Tahun',
timeSelect: 'pilih waktu',
dateSelect: 'pilih tanggal',
weekSelect: 'Pilih satu minggu',
monthSelect: 'Pilih satu bulan',
yearSelect: 'Pilih satu tahun',
decadeSelect: 'Pilih satu dekade',
yearFormat: 'YYYY',
dateFormat: 'M/D/YYYY',
dayFormat: 'D',
dateTimeFormat: 'M/D/YYYY HH:mm:ss',
monthBeforeYear: true,
previousMonth: 'Bulan sebelumnya (PageUp)',
nextMonth: 'Bulan depan (PageDown)',
previousYear: 'Tahun lalu (Control + kiri)',
nextYear: 'Tahun depan (Kontrol + kanan)',
previousDecade: 'Dekade terakhir',
nextDecade: 'Dekade berikutnya',
previousCentury: 'Abad terakhir',
nextCentury: 'Abad berikutnya',
}

View File

@ -0,0 +1,28 @@
export default {
today: 'ယနေ့',
now: 'ယခု',
backToToday: 'ယနေ့ မတိုင်ခင် သို့',
ok: 'Ok',
clear: 'ရှင်းမည်',
month: 'လ',
year: 'နှစ်',
timeSelect: 'အချိန်ကို ရွေး',
dateSelect: 'နေ့ကို ရွေး',
weekSelect: 'အပတ်ကို ရွေး',
monthSelect: 'လကို ရွေး',
yearSelect: 'နှစ်ကို ရွေး',
decadeSelect: 'ဆယ်စုနှစ်ကို ရွေး',
yearFormat: 'YYYY',
dateFormat: 'M/D/YYYY',
dayFormat: 'D',
dateTimeFormat: 'M/D/YYYY HH:mm:ss',
monthBeforeYear: true,
previousMonth: 'ယခင် လ (PageUp)',
nextMonth: 'နောက် လ (PageDown)',
previousYear: 'ယခင် နှစ် (Control + left)',
nextYear: 'နောက် နှစ် (Control + right)',
previousDecade: 'ယခင် ဆယ်စုနှစ်',
nextDecade: 'နောက် ဆယ်စုနှစ်',
previousCentury: 'ယခင် ရာစုနှစ်',
nextCentury: 'နောက် ရာစုနှစ်',
}

View File

@ -0,0 +1,28 @@
export default {
today: 'Өнөөдөр',
now: 'Одоо',
backToToday: 'Өнөөдөрлүү буцах',
ok: 'Ok',
clear: 'Цэвэрлэх',
month: 'Сар',
year: 'Жил',
timeSelect: 'Цаг сонгох',
dateSelect: 'Огноо сонгох',
weekSelect: '7 хоног сонгох',
monthSelect: 'Сар сонгох',
yearSelect: 'Жил сонгох',
decadeSelect: 'Арван сонгох',
yearFormat: 'YYYY',
dateFormat: 'YYYY/MM/DD',
dayFormat: 'DD',
dateTimeFormat: 'YYYY/MM/DD HH:mm:ss',
monthBeforeYear: true,
previousMonth: 'Өмнөх сар (PageUp)',
nextMonth: 'Дараа сар (PageDown)',
previousYear: 'Өмнөх жил (Control + left)',
nextYear: 'Дараа жил (Control + right)',
previousDecade: 'Өмнөх арван',
nextDecade: 'Дараа арван',
previousCentury: 'Өмнөх зуун',
nextCentury: 'Дараа зуун',
}

View File

@ -0,0 +1,28 @@
export default {
today: 'Hôm nay',
now: 'Bây giờ',
backToToday: 'Trở về hôm nay',
ok: 'Ok',
clear: 'Xóa',
month: 'Tháng',
year: 'Năm',
timeSelect: 'Chọn thời gian',
dateSelect: 'Chọn ngày',
weekSelect: 'Chọn tuần',
monthSelect: 'Chọn tháng',
yearSelect: 'Chọn năm',
decadeSelect: 'Chọn thập kỷ',
yearFormat: 'YYYY',
dateFormat: 'D/M/YYYY',
dayFormat: 'D',
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
monthBeforeYear: true,
previousMonth: 'Tháng trước (PageUp)',
nextMonth: 'Tháng sau (PageDown)',
previousYear: 'Năm trước (Control + left)',
nextYear: 'Năm sau (Control + right)',
previousDecade: 'Thập kỷ trước',
nextDecade: 'Thập kỷ sau',
previousCentury: 'Thế kỷ trước',
nextCentury: 'Thế kỷ sau',
}

View File

@ -1,7 +1,7 @@
import PropTypes from '../../../_util/vue-types'
import BaseMixin from '../../../_util/BaseMixin'
import { getOptionProps } from '../../../_util/props-util'
import { getOptionProps, getComponentFromProp } from '../../../_util/props-util'
import { cloneElement } from '../../../_util/vnode'
import CalendarHeader from '../calendar/CalendarHeader'
import DateTable from '../date/DateTable'
@ -32,6 +32,7 @@ const CalendarPart = {
enableNext: PropTypes.any,
enablePrev: PropTypes.any,
dateRender: PropTypes.func,
clearIcon: PropTypes.any,
},
render () {
const { $props: props, $listeners = {}} = this
@ -48,6 +49,7 @@ const CalendarPart = {
enablePrev, enableNext, disabledMonth,
showDateInput, dateRender, showWeekNumber,
} = props
const clearIcon = getComponentFromProp(this, 'clearIcon')
const { inputSelect = noop,
valueChange = noop,
panelChange = noop,
@ -99,6 +101,7 @@ const CalendarPart = {
showClear={false}
selectedValue={selectedValue[index]}
onChange={inputSelect}
clearIcon={clearIcon}
/>
const headerProps = {
props: {