[IMP] web: add hooks to calendar controler, fix css for filterPanel

- For the Planning app calendar we now need to be able to fetch specific fields from the filters record
we don't want to inherit the whole loadDynamicFilterSection method so we created an addFilterFields method
used to fetch specific fields from the record accroding to the filterInfo ()

- we also need to display specific text when creating a new record from the calendar view, for exemple in calendar 'New Shift'
rather than 'New event' but we don't need to override the whole editRecord() method so we created a getter: editRecordDefaultDisplayText()

- For the css files, we lowered a bit the checkmark icon in the filters, and we added a new class that prevents the icons background
to become invisible when the filter checkmark isn't changed

Task-3251698

Part-of: odoo/odoo#126358
This commit is contained in:
Bastien (bvdn)
2023-08-29 09:11:52 +00:00
parent 1008383d9e
commit ee52f87a36
6 changed files with 52 additions and 5 deletions
@@ -116,6 +116,10 @@ export class CalendarController extends Component {
return this.props.className;
}
get editRecordDefaultDisplayText() {
return _t("New Event");
}
getQuickCreateProps(record) {
return {
record,
@@ -174,7 +178,9 @@ export class CalendarController extends Component {
resModel: this.model.resModel,
resId: record.id || false,
context,
title: record.id ? _t("Open: %s", record.title) : _t("New Event"),
title: record.id
? _t("Open: %s", record.title)
: this.editRecordDefaultDisplayText,
viewId: this.model.formViewId,
onRecordSaved: () => this.model.load(),
},
@@ -193,11 +193,14 @@ $o-cw-filter-avatar-size: 20px;
height: $o-cw-filter-avatar-size;
border-radius: 2px;
object-fit: cover;
align-items: center;
}
}
input:not(:checked) + label .o_cw_filter_input_bg {
background: transparent !important;
&:not(.o_cw_filter_avatar) {
background: transparent !important;
}
i.fa {
visibility: hidden;
@@ -554,6 +554,14 @@ export class CalendarModel extends Model {
};
}
/**
* @protected
*/
addFilterFields(record, filterInfo) {
return {
colorIndex: record.colorIndex,
};
}
//--------------------------------------------------------------------------
/**
@@ -662,7 +670,7 @@ export class CalendarModel extends Model {
filters.push({
id: value,
[fieldName]: rawValue,
colorIndex: record.colorIndex,
...this.addFilterFields(record, filterInfo),
});
}
}
@@ -617,7 +617,7 @@
}
.o_cw_filter_color_#{$i - 1} {
.o_cw_filter_input_bg {
.o_cw_filter_input_bg:not(.no_filter_color) {
border-color: $color;
background: $color;
color: color-contrast($color);
@@ -87,7 +87,7 @@
t-attf-for="o_calendar_filter_item_{{filterId}}"
>
<span
class="o_cw_filter_input_bg align-items-start d-flex flex-shrink-0 justify-content-center position-relative me-1 o_beside_avatar"
class="o_cw_filter_input_bg d-flex flex-shrink-0 justify-content-center position-relative me-1 o_beside_avatar"
t-att-style="filter.colorIndex and typeof filter.colorIndex !== 'number' ? `border-color: ${filter.colorIndex}; background-color: ${filter.colorIndex};` : ''"
>
<i class="fa fa-check position-relative" />
@@ -4779,4 +4779,34 @@ QUnit.module("Views", ({ beforeEach }) => {
assert.verifySteps(["onWillStartModel", "render"]);
});
QUnit.test("check apply default record label", async (assert) => {
assert.expect(1);
class TestCalendarController extends CalendarController {
get editRecordDefaultDisplayText() {
return "Test Display";
}
}
viewRegistry.add("test_calendar_view", {
...calendarView,
Controller: TestCalendarController,
});
await makeView({
type: "calendar",
resModel: "event",
serverData,
arch: `
<calendar js_class="test_calendar_view" date_start="start" date_stop="stop" all_day="allday" mode="month" quick_add="0" event_open_popup="1" />
`,
});
await clickDate(target, "2016-12-13");
assert.strictEqual(
target.querySelector(".modal-title").textContent,
"Test Display",
"The text in the title should be Test Display"
);
});
});