diff options
5 files changed, 125 insertions, 10 deletions
diff --git a/addons/web/static/src/js/views/calendar/calendar_model.js b/addons/web/static/src/js/views/calendar/calendar_model.js index 0fe12456e46..2f2c6339ac6 100644 --- a/addons/web/static/src/js/views/calendar/calendar_model.js +++ b/addons/web/static/src/js/views/calendar/calendar_model.js @@ -728,6 +728,7 @@ return AbstractModel.extend({ r.allDay = true; r.start = date_start.format('YYYY-MM-DD'); r.end = date_stop.startOf('day').format('YYYY-MM-DD'); + r.showTime = true; } return r; diff --git a/addons/web/static/src/js/views/calendar/calendar_renderer.js b/addons/web/static/src/js/views/calendar/calendar_renderer.js index a22f39ec4ec..f563f793203 100644 --- a/addons/web/static/src/js/views/calendar/calendar_renderer.js +++ b/addons/web/static/src/js/views/calendar/calendar_renderer.js @@ -422,7 +422,6 @@ return AbstractRenderer.extend({ element.find('.fc-content').after($('<div/>', {class: 'fc-bg'})); } - // For month view: Show background for all-day/multidate events only if (view.name === 'month' && event.record) { var start = event.r_start || event.start; var end = event.r_end || event.end; @@ -430,7 +429,12 @@ return AbstractRenderer.extend({ // note: add & remove 1 min to avoid issues with 00:00 var isSameDayEvent = start.clone().add(1, 'minute').isSame(end.clone().subtract(1, 'minute'), 'day'); if (!event.record.allday && isSameDayEvent) { + // For month view: do not show background for non allday, single day events element.addClass('o_cw_nobg'); + if (event.showTime && !self.hideTime) { + const displayTime = start.format(self._getDbTimeFormat()); + element.find('.fc-content .fc-time').text(displayTime); + } } } @@ -662,6 +666,16 @@ return AbstractRenderer.extend({ return Promise.resolve(prom); }, /** + * Returns the time format from database parameters (only hours and minutes). + * FIXME: this looks like a weak heuristic... + * + * @private + * @returns {string} + */ + _getDbTimeFormat: function () { + return _t.database.parameters.time_format.search('%H') !== -1 ? 'HH:mm' : 'hh:mm a'; + }, + /** * Prepare context to display in the popover. * * @private @@ -686,8 +700,7 @@ return AbstractRenderer.extend({ // Do not display timing if the event occur across multiple days. Otherwise use user's timing preferences if (!this.hideTime && !eventData.record.allday && isSameDayEvent) { - // Fetch user's preferences - var dbTimeFormat = _t.database.parameters.time_format.search('%H') != -1 ? 'HH:mm': 'hh:mm a'; + var dbTimeFormat = this._getDbTimeFormat(); context.eventTime.time = start.clone().format(dbTimeFormat) + ' - ' + end.clone().format(dbTimeFormat); diff --git a/addons/web/static/src/scss/web_calendar.scss b/addons/web/static/src/scss/web_calendar.scss index 1a5bdf5c078..8ba1157f003 100644 --- a/addons/web/static/src/scss/web_calendar.scss +++ b/addons/web/static/src/scss/web_calendar.scss @@ -277,11 +277,9 @@ $o-cw-filter-avatar-size: 20px; .fc-event { margin: 0 3px 2px; - .o_event_title { - @include text-truncate(); - } .fc-content { + @include text-truncate(); margin: 4px 4px 3px; } diff --git a/addons/web/static/src/xml/web_calendar.xml b/addons/web/static/src/xml/web_calendar.xml index 80b60d2902a..4166b5e123e 100644 --- a/addons/web/static/src/xml/web_calendar.xml +++ b/addons/web/static/src/xml/web_calendar.xml @@ -13,6 +13,7 @@ <t t-name="calendar-box"> <div t-att-style="typeof color === 'string' ? ('background-color:' + color) + ';' : ''" t-attf-class="#{record.is_highlighted ? 'o_event_hightlight' : ''} #{typeof color === 'number' ? _.str.sprintf('o_calendar_color_%s', color) : 'o_calendar_color_1'}"> + <span class="fc-time"/> <div class="o_event_title" t-esc="record.display_name"/> </div> </t> diff --git a/addons/web/static/tests/views/calendar_tests.js b/addons/web/static/tests/views/calendar_tests.js index 0a3c31474e1..0bdddb7bfae 100644 --- a/addons/web/static/tests/views/calendar_tests.js +++ b/addons/web/static/tests/views/calendar_tests.js @@ -1732,6 +1732,108 @@ QUnit.module('Views', { assert.strictEqual($('#ui-datepicker-div:empty').length, 0, "should have a clean body"); }); + QUnit.test('show start time of single day event for month mode', async function (assert) { + assert.expect(4); + + var calendar = await createCalendarView({ + View: CalendarView, + model: 'event', + data: this.data, + arch: + '<calendar class="o_calendar_test" ' + + 'string="Events" ' + + 'date_start="start" ' + + 'date_stop="stop" ' + + 'all_day="allday" ' + + 'mode="month"/>', + archs: archs, + viewOptions: { + initialDate: initialDate, + }, + session: { + getTZOffset: function () { + return -240; + }, + }, + }); + + assert.strictEqual(calendar.$('.fc-event:contains(event 2) .fc-content .fc-time').text(), "06:55", + "should have a correct time 06:55 AM in month mode"); + assert.strictEqual(calendar.$('.fc-event:contains(event 4) .fc-content .fc-time').text(), "", + "should not display a time for all day event"); + assert.strictEqual(calendar.$('.fc-event:contains(event 5) .fc-content .fc-time').text(), "", + "should not display a time for multiple days event"); + // switch to week mode + await testUtils.dom.click(calendar.$('.o_calendar_button_week')); + assert.strictEqual(calendar.$('.fc-event:contains(event 2) .fc-content .fc-time').text(), "", + "should not show time in week mode as week mode already have time on y-axis"); + + calendar.destroy(); + }); + + QUnit.test('start time should not shown for date type field', async function (assert) { + assert.expect(1); + + this.data.event.fields.start.type = "date"; + + var calendar = await createCalendarView({ + View: CalendarView, + model: 'event', + data: this.data, + arch: + '<calendar class="o_calendar_test" ' + + 'string="Events" ' + + 'date_start="start" ' + + 'date_stop="stop" ' + + 'mode="month"/>', + archs: archs, + viewOptions: { + initialDate: initialDate, + }, + session: { + getTZOffset: function () { + return -240; + }, + }, + }); + + assert.strictEqual(calendar.$('.fc-event:contains(event 2) .fc-content .fc-time').text(), "", + "should not show time for date type field"); + + calendar.destroy(); + }); + + QUnit.test('start time should not shown in month mode if hide_time is true', async function (assert) { + assert.expect(1); + + var calendar = await createCalendarView({ + View: CalendarView, + model: 'event', + data: this.data, + arch: + '<calendar class="o_calendar_test" ' + + 'string="Events" ' + + 'date_start="start" ' + + 'date_stop="stop" ' + + 'hide_time="True" ' + + 'mode="month"/>', + archs: archs, + viewOptions: { + initialDate: initialDate, + }, + session: { + getTZOffset: function () { + return -240; + }, + }, + }); + + assert.strictEqual(calendar.$('.fc-event:contains(event 2) .fc-content .fc-time').text(), "", + "should not show time for hide_time attribute"); + + calendar.destroy(); + }); + QUnit.test('readonly date_start field', async function (assert) { assert.expect(4); @@ -2523,11 +2625,11 @@ QUnit.module('Views', { }, }); - assert.strictEqual(calendar.$('.fc-event:eq(0)').text().trim(), "event 1"); + assert.strictEqual(calendar.$('.fc-event:eq(0)').text().replace(/\s/g, ''), "08:00event1"); await testUtils.dom.click(calendar.$('.fc-event:eq(0)')); assert.strictEqual(calendar.$('.o_field_widget[name="start"]').text(), "12/09/2016 08:00:00"); - assert.strictEqual(calendar.$('.fc-event:eq(5)').text().trim(), "event 6"); + assert.strictEqual(calendar.$('.fc-event:eq(5)').text().replace(/\s/g, ''), "16:00event6"); await testUtils.dom.click(calendar.$('.fc-event:eq(5)')); assert.strictEqual(calendar.$('.o_field_widget[name="start"]').text(), "12/16/2016 16:00:00"); @@ -2538,11 +2640,11 @@ QUnit.module('Views', { ); await testUtils.nextTick(); - assert.strictEqual(calendar.$('.fc-event:first').text().trim(), "event 6"); + assert.strictEqual(calendar.$('.fc-event:eq(0)').text().replace(/\s/g, ''), "16:00event6"); await testUtils.dom.click(calendar.$('.fc-event:eq(0)')); assert.strictEqual(calendar.$('.o_field_widget[name="start"]').text(), "11/27/2016 16:00:00"); - assert.strictEqual(calendar.$('.fc-event:eq(1)').text().trim(), "event 1"); + assert.strictEqual(calendar.$('.fc-event:eq(1)').text().replace(/\s/g, ''), "08:00event1"); await testUtils.dom.click(calendar.$('.fc-event:eq(1)')); assert.strictEqual(calendar.$('.o_field_widget[name="start"]').text(), "12/09/2016 08:00:00"); |