mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-18 12:34:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(time-picker): remove momentjs

Browse Source
This commit is contained in:
07akioni 2019-10-19 21:42:14 +08:00
parent 8ad56d6010
commit 413f32edce
8 changed files with 36 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -101,7 +101,6 @@
"date-fns": "^2.5.1",
"ionicons": "^4.5.8",
"masonry-layout": "^4.2.2",
"moment": "^2.24.0",
"node-sass": "^4.12.0",
"resize-observer-polyfill": "^1.5.1",
"sass-loader": "^7.1.0"

2
packages/common/DatePicker/src/main.vue
View File

@ -151,7 +151,7 @@ import NInput from '../../Input'
import withapp from '../../../mixins/withapp'
import themeable from '../../../mixins/themeable'
import { format, getTime, isValid } from 'date-fns'
import { strictParse } from './utils'
import { strictParse } from '../../../utils/dateUtils'
import isEqual from 'lodash/isEqual'
const DATE_FORMAT = {

2
packages/common/DatePicker/src/panel/datetimerange.vue
View File

@ -236,7 +236,7 @@ import NInput from '../../../Input'
import dualCalendarMixin from './dualCalendarMixin'
import NBaseIcon from '../../../../base/Icon'
import { startOfSecond, format, set, getYear, getMonth, getDate, isValid } from 'date-fns'
import { strictParse } from '../utils'
import { strictParse } from '../../../../utils/dateUtils'
const DATETIME_FORMAT = 'yyyy-MM-dd HH:mm:ss'
const DATE_FORMAT = 'yyyy-MM-dd'

2
packages/common/DatePicker/src/panel/dualCalendarMixin.js
View File

@ -1,6 +1,6 @@
// import moment from 'moment'
import { isValid, getMonth, getYear, getTime, format, addMonths, startOfMonth } from 'date-fns'
import { dateArray } from '../utils'
import { dateArray } from '../../../../utils/dateUtils'
import commonCalendarMixin from './commonCalendarMixin'

2
packages/common/DatePicker/src/panel/uniCalendarMixin.js
View File

@ -1,7 +1,7 @@
// import moment from 'moment'
import commonCalendarMixin from './commonCalendarMixin'
import { isValid, getDate, getMonth, getYear, getTime, isSameMonth, format, addMonths, addYears, set } from 'date-fns'
import { dateArray, strictParse } from '../utils'
import { dateArray, strictParse } from '../../../../utils/dateUtils'
// import { setYMD } from '../utils'

6
packages/common/Time/src/main.js
View File

@ -1,12 +1,12 @@
import moment from 'moment'
// import moment from 'moment'
export default {
name: 'NTime',
props: {
time: {
validator (time) {
if (time === null) return
return moment(time).isValid()
if (time === null) return false
// return moment(time).isValid()
},
default: null
},

56
packages/common/TimePicker/src/main.vue
View File

@ -43,7 +43,7 @@
'n-time-picker-selector-time-row__item--active':
hour === computedHour
}"
@click="setHour(hour)"
@click="setHours(hour)"
>
{{ hour }}
</div>
@ -66,7 +66,7 @@
'n-time-picker-selector-time-row__item--active':
minute === computedMinute
}"
@click="setMinute(minute)"
@click="setMinutes(minute)"
>
{{ minute }}
</div>
@ -92,7 +92,7 @@
validator &&
!validator(computedHour, computedMinute, second)
}"
@click="setSecond(second)"
@click="setSeconds(second)"
>
{{ second }}
</div>
@ -132,13 +132,14 @@
<script>
import NScrollbar from '../../Scrollbar'
import NInput from '../../Input'
import moment from 'moment'
import detachable from '../../../mixins/detachable'
import placeable from '../../../mixins/placeable'
import clickoutside from '../../../directives/clickoutside'
import zindexable from '../../../mixins/zindexable'
import withapp from '../../../mixins/withapp'
import themeable from '../../../mixins/themeable'
import { isValid, startOfSecond, startOfMinute, startOfHour, setHours, setMinutes, setSeconds, getTime, format, getMinutes, getHours, getSeconds, set } from 'date-fns'
import { strictParse } from '../../../utils/dateUtils'
const DEFAULT_FORMAT = 'HH:mm:ss'
const TIME_CONST = {
@ -203,7 +204,7 @@ export default {
data () {
return {
active: false,
displayTimeString: this.value === null ? null : moment(this.value).format(this.format),
displayTimeString: this.value === null ? null : format(this.value, this.format),
...TIME_CONST,
memorizedValue: this.value
}
@ -211,18 +212,18 @@ export default {
computed: {
computedTime () {
if (this.value === null) return null
else return moment(this.value)
else return new Date(this.value)
},
computedHour () {
if (this.computedTime) return this.computedTime.format('HH')
if (this.computedTime) return format(this.computedTime, 'HH')
else return null
},
computedMinute () {
if (this.computedTime) return this.computedTime.format('mm')
if (this.computedTime) return format(this.computedTime, 'mm')
else return null
},
computedSecond () {
if (this.computedTime) return this.computedTime.format('ss')
if (this.computedTime) return format(this.computedTime, 'ss')
else return null
}
},
@ -234,44 +235,45 @@ export default {
},
methods: {
justifyValueAfterChangeDisplayTimeString () {
const time = moment(this.displayTimeString, this.format, true)
if (time.isValid()) {
const time = strictParse(this.displayTimeString, this.format, new Date())
if (isValid(time)) {
if (this.computedTime !== null) {
const newTime = this.computedTime
newTime.hour(time.hour())
newTime.minute(time.minute())
newTime.second(time.second())
this.$emit('input', newTime.valueOf())
const newTime = set(this.computedTime, {
hours: getHours(time),
minutes: getMinutes(time),
seconds: getSeconds(time)
})
this.$emit('input', getTime(newTime))
} else {
this.$emit('input', time.valueOf())
this.$emit('input', getTime(time))
}
}
},
setHour (hour) {
setHours (hour) {
if (this.value === null) {
this.$emit('input', moment().hour(hour).startOf('hour').valueOf())
this.$emit('input', getTime(startOfHour(new Date())))
} else {
this.$emit('input', moment(this.value).hour(hour).valueOf())
this.$emit('input', getTime(setHours(this.value, hour)))
}
},
setMinute (minute) {
setMinutes (minute) {
if (this.value === null) {
this.$emit('input', moment().minute(minute).startOf('minute').valueOf())
this.$emit('input', getTime(startOfMinute(new Date())))
} else {
this.$emit('input', moment(this.value).minute(minute).valueOf())
this.$emit('input', getTime(setMinutes(this.value, minute)))
}
},
setSecond (second) {
setSeconds (second) {
if (this.value === null) {
this.$emit('input', moment().second(second).startOf('second').valueOf())
this.$emit('input', getTime(startOfSecond(new Date())))
} else {
this.$emit('input', moment(this.value).second(second).valueOf())
this.$emit('input', getTime(setSeconds(this.value, second)))
}
},
refreshTimeString (time) {
if (time === undefined) time = this.computedTime
if (time === null) this.displayTimeString = ''
else this.displayTimeString = time.format(this.format)
else this.displayTimeString = format(time, this.format)
},
handleTimeInputBlur () {
this.refreshTimeString()

0
packages/common/DatePicker/src/utils.js → packages/utils/dateUtils.js
View File