| | |
| | | |
| | | @Component |
| | | export default class UiDateFormat extends Vue { |
| | | @Prop() date!: Date | string; |
| | | @Prop() onlyShowSection!: 'DAY' | 'TIME'; |
| | | compareTarget!: Date; |
| | | @Prop() |
| | | date!: Date | string; |
| | | |
| | | @Prop() |
| | | onlyShowSection!: 'YEAR' | 'DATE' | 'DAY' | 'TIME'; |
| | | |
| | | compareTarget!: Date; |
| | | displayValue = ''; |
| | | |
| | | @Watch('date', {immediate: true}) formattedDate(): void { |
| | | |
| | | @Watch('date', {immediate: true}) |
| | | formattedDate(): void { |
| | | if (!this.date) return; |
| | | |
| | | const toDatePromise = new Promise((resolve, reject) => { |
| | | const date: Date = typeof(this.date) === 'string' ? new Date(this.date) : this.date; |
| | | const date: Date = typeof(this.date) === 'string' ? new Date(this.date) : this.date as Date; |
| | | resolve(date); |
| | | }); |
| | | |
| | |
| | | const isThisYear = (compareDate: Date): boolean => { |
| | | return compareDate.getFullYear() === _now.getFullYear(); |
| | | }; |
| | | |
| | | |
| | | const minutes = compareTarget.getMinutes() > 9 ? compareTarget.getMinutes() : `0${compareTarget.getMinutes()}`; |
| | | const thisYearDayLabel = isToday(compareTarget) ? `今天` : `${compareTarget.getMonth() + 1}/${compareTarget.getDate()}`; |
| | | |
| | |
| | | this.displayValue = isThisYear(compareTarget) ? thisYearDayLabel : `${compareTarget.getFullYear()}/${compareTarget.getMonth() + 1}/${compareTarget.getDate()}`; |
| | | } else if (this.onlyShowSection === 'TIME') { |
| | | this.displayValue = `${compareTarget.getHours()}:${minutes}`; |
| | | } else if (this.onlyShowSection === 'DATE') { |
| | | this.displayValue = isThisYear(compareTarget) |
| | | ? thisYearDayLabel |
| | | : `${compareTarget.getMonth() + 1}/${compareTarget.getDate()}`; |
| | | } else if (this.onlyShowSection === 'YEAR') { |
| | | this.displayValue = `${compareTarget.getFullYear()}`; |
| | | } |
| | | |
| | | if (this.onlyShowSection) return; |
| | | |
| | | this.displayValue = isThisYear(compareTarget) |
| | | ? `${thisYearDayLabel} ${compareTarget.getHours()}:${minutes}` |
| | | this.displayValue = isThisYear(compareTarget) |
| | | ? `${thisYearDayLabel} ${compareTarget.getHours()}:${minutes}` |
| | | : `${compareTarget.getFullYear()}/${compareTarget.getMonth() + 1}/${compareTarget.getDate()} ${compareTarget.getHours()}:${minutes}`; |
| | | } |
| | | } |
| | | )} |
| | | |
| | | } |
| | | </script> |
| | | </script> |