diff --git a/examples/sites/demos/apis/calendar-view.js b/examples/sites/demos/apis/calendar-view.js
index 92be41da0e..fe5950b5ea 100644
--- a/examples/sites/demos/apis/calendar-view.js
+++ b/examples/sites/demos/apis/calendar-view.js
@@ -171,6 +171,20 @@ export default {
mode: ['pc', 'mobile-first'],
pcDemo: 'basic-usage',
mfDemo: 'basic-usage'
+ },
+ {
+ name: 'show-back-today',
+ type: 'boolean',
+ defaultValue: 'true',
+ desc: {
+ 'zh-CN': '是否展示左上侧按钮显示,默认展示',
+ 'en-US': 'Should the upper left button be displayed, Default Display'
+ },
+ meta: {
+ stable: '3.22.0'
+ },
+ mode: ['mobile-first'],
+ mfDemo: 'calendar-mode'
}
],
events: [
diff --git a/examples/sites/demos/mobile-first/app/calendar-view/calendar-mode.vue b/examples/sites/demos/mobile-first/app/calendar-view/calendar-mode.vue
index 82716365f9..03018618ba 100644
--- a/examples/sites/demos/mobile-first/app/calendar-view/calendar-mode.vue
+++ b/examples/sites/demos/mobile-first/app/calendar-view/calendar-mode.vue
@@ -1,5 +1,11 @@
-
+
diff --git a/examples/sites/demos/mobile-first/app/calendar-view/webdoc/calendar-view.js b/examples/sites/demos/mobile-first/app/calendar-view/webdoc/calendar-view.js
index a0ab9010c0..d0fc4d780d 100644
--- a/examples/sites/demos/mobile-first/app/calendar-view/webdoc/calendar-view.js
+++ b/examples/sites/demos/mobile-first/app/calendar-view/webdoc/calendar-view.js
@@ -22,9 +22,9 @@ export default {
},
desc: {
'zh-CN':
- '
通过 mode
属性指定以年的形式显示,将展示当年的每个月份。可选值有 month
/ timeline
/ schedule
。
\n',
+ '通过 mode
属性指定以年的形式显示,将展示当年的每个月份。可选值有 month
/ timeline
/ schedule
。通过show-back-today
属性控制左侧按钮显示。
\n',
'en-US':
- 'The mode
attribute specifies that each month of the current year is displayed. The options are month
/ timeline
/ schedule
.
\n'
+ 'The mode
attribute specifies that each month of the current year is displayed. The options are month
/ timeline
/ schedule
. Control the display of the left button through theshow back today
attribute.
\n'
},
codeFiles: ['calendar-mode.vue']
},
diff --git a/packages/renderless/src/calendar-view/index.ts b/packages/renderless/src/calendar-view/index.ts
index 0742be2eb3..7914ad0ec9 100644
--- a/packages/renderless/src/calendar-view/index.ts
+++ b/packages/renderless/src/calendar-view/index.ts
@@ -104,15 +104,31 @@ export const parseDate = (time) => {
} else {
date = new Date()
}
-
- return {
- year: date.getFullYear(),
- month: date.getMonth() + 1,
- day: date.getDate(),
- hours: date.getHours(),
- minutes: date.getMinutes(),
- seconds: date.getSeconds()
+ // 识别无时分秒的日期时间
+ const timeParts = hasNoTime(time)
+ let timesPartsOne = {}
+ let timesPartsTwo = {}
+ if (!timeParts.hours) {
+ timesPartsOne = {
+ year: timeParts.year,
+ month: timeParts.month,
+ day: timeParts.day,
+ hours: 0,
+ minutes: 0,
+ seconds: 0
+ }
+ } else {
+ timesPartsTwo = {
+ year: date.getFullYear(),
+ month: date.getMonth() + 1,
+ day: date.getDate(),
+ hours: date.getHours(),
+ minutes: date.getMinutes(),
+ seconds: date.getSeconds()
+ }
}
+ const timePartsList = Object.assign(timesPartsOne, timesPartsTwo)
+ return timePartsList
}
export const computedCalendar =
@@ -160,6 +176,36 @@ const getCalendarItem = function (item, props, isFunction, type, isNext, isLast)
return res
}
+const hasNoTime = (date) => {
+ const datetimeStr = date
+ let hoursTime = 0
+ let minutesTime = 0
+ let secondsTime = 0
+ const [datePart, timePart] = datetimeStr.split(' ')
+ const [year, month, day] = datePart && datePart.split('-')
+ if (timePart) {
+ const [hours, minutes, seconds] = timePart && timePart.split(':')
+ hoursTime = hours
+ minutesTime = minutes
+ secondsTime = seconds
+ }
+ // 提取时间
+ return {
+ year: Number(year),
+ month: Number(month),
+ day: Number(day),
+ hours: hoursTime,
+ minutes: minutesTime,
+ seconds: secondsTime
+ }
+}
+// 时间转GMT8
+const timesToGMT8 = (date) => {
+ const originalDate = new Date(date)
+ const gmt8 = new Date(originalDate.getTime() + 15 * 60 * 60 * 1000)
+ return gmt8
+}
+
export const handleEvents =
({ props, state }) =>
() => {
@@ -197,14 +243,23 @@ export const handleEvents =
([lastYear, +state.activeYear, nextYear].includes(endYear) &&
[lastMon, +state.activeMonth, nextMon].includes(endMonth))
) {
- item.start = getTime(item.start)
- item.end = getTime(item.end)
- item.startTime = makeUpZero(startHours) + ':' + makeUpZero(startMinutes) + ':' + makeUpZero(startSeconds)
- item.endTime = makeUpZero(endHours) + ':' + makeUpZero(endMinutes) + ':' + makeUpZero(endSeconds)
+ const timeStartPart = hasNoTime(item.start)
+ const timeEndPart = hasNoTime(item.end)
+
+ item.start = timeStartPart.hours ? getTime(item.start) : timesToGMT8(item.start)
+ item.end = timeEndPart.hours ? getTime(item.end) : timesToGMT8(item.end)
+
+ item.startTime = timeStartPart.hours
+ ? makeUpZero(startHours) + ':' + makeUpZero(startMinutes) + ':' + makeUpZero(startSeconds)
+ : ''
+ item.endTime = timeEndPart.hours
+ ? makeUpZero(endHours) + ':' + makeUpZero(endMinutes) + ':' + makeUpZero(endSeconds)
+ : ''
+
item.startDay = startYear + '-' + startMonth + '-' + startDay
item.endDay = endYear + '-' + endMonth + '-' + endDay
- const startTimestamp = getTime(startYear + '-' + startMonth + '-' + startDay)
- const endTimestamp = getTime(endYear + '-' + endMonth + '-' + endDay)
+ const startTimestamp = getTime(item.startDay)
+ const endTimestamp = getTime(item.endDay)
const days = Math.abs(endTimestamp - startTimestamp) / dayMillisecond
item.dayNumber = days >= 1 ? days + 1 : 1
diff --git a/packages/vue/src/calendar-view/src/index.ts b/packages/vue/src/calendar-view/src/index.ts
index 802b10071f..5e8122f0b5 100644
--- a/packages/vue/src/calendar-view/src/index.ts
+++ b/packages/vue/src/calendar-view/src/index.ts
@@ -76,6 +76,10 @@ export const calendarViewProps = {
multiSelect: {
type: Boolean,
default: false
+ },
+ showBackToday: {
+ type: Boolean,
+ default: true
}
}
diff --git a/packages/vue/src/calendar-view/src/mobile-first.vue b/packages/vue/src/calendar-view/src/mobile-first.vue
index 2ea9e05e41..e5e8f654d3 100644
--- a/packages/vue/src/calendar-view/src/mobile-first.vue
+++ b/packages/vue/src/calendar-view/src/mobile-first.vue
@@ -20,10 +20,10 @@
-
{{ t('ui.calendarView.backToday') }}
+
{{ t('ui.calendarView.backToday') }}
- {{ event.title }}
+ {{ event.title }}
{{ getEventShowTime('start', event, date.value) }} - {{ getEventShowTime('end', event, date.value) }}
@@ -376,7 +376,8 @@ export default defineComponent({
'events',
'height',
'mark-color',
- 'multi-select'
+ 'multi-select',
+ 'showBackToday'
],
setup(props, context) {
return setup({