feat: update calendar from 9.6.2 to 9.7.9
parent
75ca6435aa
commit
f24d5efb2b
|
@ -218,6 +218,7 @@ export default {
|
|||
onChange={onStandaloneChange}
|
||||
disabledDate={disabledDate}
|
||||
onSelect={onStandaloneSelect}
|
||||
renderFooter={() => 'extra footer'}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ float: 'left', width: '300px' }}>
|
||||
|
|
|
@ -148,6 +148,7 @@ export default {
|
|||
onChange={onStandaloneChange}
|
||||
monthCellContentRender={onMonthCellContentRender}
|
||||
defaultValue={defaultCalendarValue}
|
||||
renderFooter={() => 'extra footer'}
|
||||
/>
|
||||
|
||||
<div style={{ marginTop: '200px' }}>
|
||||
|
|
|
@ -143,6 +143,7 @@ const Demo = {
|
|||
locale={cn ? zhCN : enUS}
|
||||
disabledTime={disabledTime}
|
||||
timePicker={timePickerElement(h)}
|
||||
renderFooter={() => 'extra footer'}
|
||||
/>
|
||||
)
|
||||
return (
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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 = [
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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>)
|
||||
}
|
||||
|
|
|
@ -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)}
|
||||
|
|
|
@ -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>)
|
||||
},
|
||||
}
|
||||
|
|
|
@ -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: 'המאה הבאה',
|
||||
}
|
|
@ -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',
|
||||
}
|
|
@ -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: 'နောက် ရာစုနှစ်',
|
||||
}
|
|
@ -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: 'Дараа зуун',
|
||||
}
|
|
@ -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',
|
||||
}
|
|
@ -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: {
|
||||
|
|
Loading…
Reference in New Issue