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