pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] board,web: namespace legacy view root classnames

Browse Source 
The pivot and graph views have been rewrote in owl in [1]. However,
the former implemention has been kept as it is still used in some
cases (e.g. board application, studio, PieChart widget), but they
are lazy loaded [2].

Before this commit, both the new and former implementations mostly
shared the same DOM (in particular, their root element had the
same classnames). It means that the scss rules of an implementation
might interfer with the other, and vice versa.

This commit adds the "legacy" keyword in the root classnames of
those views, and properly namespaces the scss rules of legacy views
to properly dissociate the style of new and legacy views.

For the pivot view, we re-used the same scss file, so in this
commit, we duplicate it (one for the new view, the other, lazy
loaded, for the legacy view).

[1] 0134495ba5
[2] bd3cf85c841168dfd87f7166b545dd00d9b38bf4

closes odoo/odoo#77323

X-original-commit: 3862d5aae1df72d3585f915e8a2a2626322e74ad
Related: odoo/enterprise#21223
Signed-off-by: Géry Debongnie (ged) <ged@openerp.com>
This commit is contained in:
Aaron Bohy
2021-09-29 08:32:55 +00:00
parent c0f736c056
commit 09da30fbcd
10 changed files with 124 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/board/static/tests/dashboard_tests.js
+2 -2
View File
@@ -1061,7 +1061,7 @@ QUnit.test('click on a cell of pivot view inside dashboard', async function (ass
assert.verifySteps([]);
await testUtils.dom.click(form.$('.o_pivot .o_pivot_cell_value'));
await testUtils.dom.click(form.$('.o_legacy_pivot .o_pivot_cell_value'));
assert.verifySteps(['do action']);
@@ -1183,7 +1183,7 @@ QUnit.test('correctly display the time range descriptions of a reporting view in
});
assert.deepEqual(
[...form.el.querySelectorAll('div.o_pivot th.o_pivot_origin_row')].map(el => el.innerText),
[...form.el.querySelectorAll('div.o_legacy_pivot th.o_pivot_origin_row')].map(el => el.innerText),
['June 2020', 'July 2020', 'Variation']
);
addons/web/__manifest__.py
+1 -2
View File
@@ -116,7 +116,6 @@ This module provides the core of the Odoo Web Client.
'web/static/src/legacy/scss/fields.scss',
'web/static/src/legacy/scss/file_upload.scss',
'web/static/src/legacy/scss/views.scss',
'web/static/src/legacy/scss/graph_view.scss',
'web/static/src/legacy/scss/form_view.scss',
'web/static/src/legacy/scss/list_view.scss',
'web/static/src/legacy/scss/kanban_dashboard.scss',
@@ -186,7 +185,6 @@ This module provides the core of the Odoo Web Client.
'web/static/src/legacy/js/model.js',
'web/static/src/legacy/js/owl_compatibility.js',
("remove", 'web/static/src/legacy/js/views/graph/**/*'),
("remove", 'web/static/src/legacy/scss/graph_view.scss'),
("remove", 'web/static/src/legacy/js/views/pivot/**/*'),
],
"web.assets_backend_legacy_lazy": [
@@ -198,6 +196,7 @@ This module provides the core of the Odoo Web Client.
'web/static/src/legacy/scss/graph_view.scss',
# pivot
'web/static/src/legacy/js/views/pivot/**/*',
'web/static/src/legacy/scss/pivot_view.scss',
],
'web.assets_frontend_minimal': [
'web/static/src/legacy/js/public/lazyloader.js',
addons/web/static/src/legacy/scss/graph_view.scss
+1 -1
View File
@@ -1,4 +1,4 @@
.o_graph_renderer {
.o_legacy_graph_renderer {
height: 100%;
.o_graph_canvas_container {
padding-top: 5px;
addons/web/static/src/legacy/scss/pivot_view.scss
+104
View File
@@ -0,0 +1,104 @@
.o_legacy_pivot {
.o_pivot_cell_value {
font-size: 1em;
.o_comparison {
font-size: 0.61em;
}
.o_variation {
&.o_positive {
color: green;
}
&.o_negative {
color: red;
}
}
}
table {
background-color: $o-view-background-color;
width: auto; // bootstrap override
// Inform the user that he may click on a cell to be redirected to a list view of the
// items corresponding to the clicked cell
&.o_enable_linking {
.o_pivot_cell_value:not(.o_empty):hover {
color: $o-brand-primary;
cursor: pointer;
}
}
thead th:not(.o_pivot_header_cell_closed):not(.o_pivot_header_cell_opened):not(.o_pivot_header_cell) {
text-align: center;
}
th {
font-weight: normal; // bootstrap override
background-color: lighten($o-brand-secondary, 40%);
}
@mixin o-pivot-header-cell {
background-color: lighten($o-brand-secondary, 40%);
cursor: pointer;
white-space: nowrap;
user-select: none;
&:hover {
background-color: lighten($o-brand-secondary, 30%);
}
}
.o_pivot_measure_row {
@include o-pivot-header-cell;
}
.o_pivot_header_cell {
white-space: nowrap;
user-select: none;
}
.o_pivot_header_cell_closed {
@include o-pivot-header-cell;
&::before {
font-family: FontAwesome;
content: "";
margin-right: 8px;
}
}
.o_pivot_header_cell_opened {
@include o-pivot-header-cell;
&::before {
font-family: FontAwesome;
content: "";
margin-right: 8px;
}
}
.o_pivot_sort_order_asc::after {
@include o-caret-up;
margin-left: 5px;
}
.o_pivot_sort_order_desc::after {
@include o-caret-down;
margin-left: 5px;
}
.o_pivot_cell_value.o_cell_hover {
background-color: $table-hover-bg;
}
}
.o_pivot_field_selection::after {
@include o-caret-right;
position: absolute;
right: 6px;
top: 9px;
}
.o_pivot_field_menu .dropdown-item.disabled {
color: $text-muted;
cursor: default;
}
}
addons/web/static/src/legacy/xml/graph.xml
+1 -1
View File
@@ -2,7 +2,7 @@
<templates>
<t t-name="web.Legacy.GraphRenderer" owl="1">
<div class="o_graph_renderer">
<div class="o_legacy_graph_renderer">
<label t-if="props.title" t-esc="props.title"/>
<t t-if="noContentHelperData" t-call="web.NoContentHelper">
<t t-set="title" t-value="noContentHelperData.title"/>
addons/web/static/src/legacy/xml/pivot.xml
+1 -1
View File
@@ -1,7 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<templates>
<div t-name="web.legacy.PivotRenderer" class="o_pivot" owl="1">
<div t-name="web.legacy.PivotRenderer" class="o_legacy_pivot" owl="1">
<t t-if="!(props.hasData and props.measures.length) or (props.isSample and !props.isEmbedded)">
<t t-if="props.noContentHelp" t-call="web.ActionHelper" >
<t t-set="noContentHelp" t-value="props.noContentHelp"/>
addons/web/static/src/views/pivot/pivot_view.scss
-7
View File
@@ -19,8 +19,6 @@
background: none!important;
border: none!important;
padding: 0!important;
// width: 100%!important;
// text-align: left!important;
}
background-color: $o-view-background-color;
width: auto; // bootstrap override
@@ -112,9 +110,4 @@
@include o-caret-down;
top: 10px;
}
// .o_pivot_field_menu .dropdown-item.disabled {
// color: $text-muted;
// cursor: default;
// }
}
addons/web/static/tests/legacy/views/graph_tests.js
+1 -1
View File
@@ -196,7 +196,7 @@ QUnit.module('Views', {
</graph>`,
});
assert.strictEqual(graph.$('.o_graph_renderer label').text(), "Partners",
assert.strictEqual(graph.$('.o_legacy_graph_renderer label').text(), "Partners",
"should have 'Partners as title'");
graph.destroy();
addons/web/static/tests/legacy/views/pivot_tests.js
+11 -11
View File
@@ -197,7 +197,7 @@ QUnit.module('Views', {
'<field name="fubar" string="fubar" type="measure"/>' +
'</pivot>',
});
assert.containsOnce(pivot, '.o_pivot', 'Non stored fields can have a string attribute');
assert.containsOnce(pivot, '.o_legacy_pivot', 'Non stored fields can have a string attribute');
pivot.destroy();
});
@@ -622,24 +622,24 @@ QUnit.module('Views', {
// click on closed header to open dropdown
await testUtils.dom.click(pivot.el.querySelector('tbody .o_pivot_header_cell_closed'));
assert.containsOnce(pivot, ".o_pivot .o_dropdown_menu");
assert.containsOnce(pivot, ".o_legacy_pivot .o_dropdown_menu");
assert.strictEqual(
pivot.el.querySelector(".o_pivot .o_dropdown_menu").innerText.replace(/\s/g, ""),
pivot.el.querySelector(".o_legacy_pivot .o_dropdown_menu").innerText.replace(/\s/g, ""),
"CompanyTypeCustomerDateOtherProductProductbar"
);
// open the Date sub dropdown
await testUtils.dom.click(pivot.el.querySelector(".o_pivot .o_dropdown_menu .o_dropdown_toggler.o_menu_item"));
await testUtils.dom.click(pivot.el.querySelector(".o_legacy_pivot .o_dropdown_menu .o_dropdown_toggler.o_menu_item"));
assert.strictEqual(
pivot.el
.querySelector(".o_pivot .o_dropdown_menu .o_dropdown_menu")
.querySelector(".o_legacy_pivot .o_dropdown_menu .o_dropdown_menu")
.innerText.replace(/\s/g, ""),
"YearQuarterMonthWeekDay"
);
await testUtils.dom.click(
pivot.el.querySelectorAll(
".o_pivot .o_dropdown_menu .o_dropdown_menu .o_dropdown_item"
".o_legacy_pivot .o_dropdown_menu .o_dropdown_menu .o_dropdown_item"
)[2]
);
@@ -2664,7 +2664,7 @@ QUnit.module('Views', {
await cpHelpers.toggleComparisonMenu(pivot.el);
await cpHelpers.toggleMenuItem(pivot.el, 'Date: Previous period');
assert.strictEqual(pivot.$('.o_pivot p.o_view_nocontent_empty_folder').length, 1);
assert.strictEqual(pivot.$('.o_legacy_pivot p.o_view_nocontent_empty_folder').length, 1);
await cpHelpers.toggleFilterMenu(pivot.el);
await cpHelpers.toggleMenuItem(pivot.el, 'Date');
@@ -2672,7 +2672,7 @@ QUnit.module('Views', {
await cpHelpers.toggleMenuItemOption(pivot.el, 'Date', '2016');
await cpHelpers.toggleMenuItemOption(pivot.el, 'Date', '2015');
assert.containsN(pivot, '.o_pivot thead tr:last th', 9,
assert.containsN(pivot, '.o_legacy_pivot thead tr:last th', 9,
"last header row should contains 9 cells (3*[December 2016, November 2016, Variation]");
var values = [
"19", "0", "-100%", "0", "13", "100%", "19", "13", "-31.58%"
@@ -2680,7 +2680,7 @@ QUnit.module('Views', {
assert.strictEqual(getCurrentValues(pivot), values.join());
// with data, with row groupby
await testUtils.dom.click(pivot.$('.o_pivot .o_pivot_header_cell_closed').eq(2));
await testUtils.dom.click(pivot.$('.o_legacy_pivot .o_pivot_header_cell_closed').eq(2));
await testUtils.dom.click(pivot.el.querySelectorAll("tbody .o_dropdown_menu .o_dropdown_item")[4]);
values = [
"19", "0", "-100%", "0", "13", "100%", "19", "13", "-31.58%",
@@ -2708,7 +2708,7 @@ QUnit.module('Views', {
];
assert.strictEqual(getCurrentValues(pivot), values.join());
await testUtils.dom.clickFirst(pivot.$('.o_pivot .o_pivot_header_cell_opened'));
await testUtils.dom.clickFirst(pivot.$('.o_legacy_pivot .o_pivot_header_cell_opened'));
values = [
"2", "2", "0%",
"2", "1", "-50%",
@@ -2789,7 +2789,7 @@ QUnit.module('Views', {
await cpHelpers.toggleMenuItem(pivot.el, 'Date: Previous period');
// With the data above, the time ranges contain no record.
assert.strictEqual(pivot.$('.o_pivot p.o_view_nocontent_empty_folder').length, 1, "there should be no data");
assert.strictEqual(pivot.$('.o_legacy_pivot p.o_view_nocontent_empty_folder').length, 1, "there should be no data");
// export data should be impossible since the pivot buttons
// are deactivated (exception: the 'Measures' button).
assert.ok(pivot.$('.o_control_panel button.o_pivot_download').prop('disabled'));
addons/web/static/tests/legacy/views/search_panel_tests.js
+2 -2
View File
@@ -2393,7 +2393,7 @@ QUnit.module('Views', {
assert.containsNone(webClient, '.o_content .o_search_panel');
await switchView(webClient, 'pivot');
assert.containsOnce(webClient, '.o_content.o_component_with_search_panel .o_pivot');
assert.containsOnce(webClient, '.o_content.o_component_with_search_panel .o_legacy_pivot');
assert.containsOnce(webClient, '.o_content.o_component_with_search_panel .o_search_panel');
});
@@ -2517,7 +2517,7 @@ QUnit.module('Views', {
// switch to pivot
await switchView(webClient, 'pivot');
await legacyExtraNextTick();
assert.containsOnce(webClient, '.o_content .o_pivot');
assert.containsOnce(webClient, '.o_content .o_legacy_pivot');
assert.containsNone(webClient, '.o_content .o_search_panel');
assert.strictEqual($(webClient.el).find('.o_pivot_cell_value').text(), '15');