[FIX] web: pivot style in right-to-left

Headers of columns and rows are not properly aligned on RTL direction.

After this commit, they will be.

closes odoo/odoo#78261

X-original-commit: 2fb992d3ced438fd012d7702bdfbe23cce6000a6
Related: odoo/enterprise#21645
Signed-off-by: Géry Debongnie (ged) <ged@openerp.com>
This commit is contained in:
Bruno Boi
2021-10-13 06:03:58 +00:00
parent 3594b8cebd
commit e8bbc5cd44
3 changed files with 32 additions and 6 deletions
@@ -1,6 +1,7 @@
/** @odoo-module **/
import { PivotGroupByMenu } from "@web/views/pivot/pivot_group_by_menu";
import { localization } from "@web/core/l10n/localization";
import { registry } from "@web/core/registry";
import fieldUtils from "web.field_utils";
@@ -11,6 +12,7 @@ export class PivotRenderer extends Component {
setup() {
this.model = this.props.model;
this.table = this.model.getTable();
this.l10n = localization;
}
willUpdateProps() {
this.table = this.model.getTable();
@@ -47,10 +47,24 @@
</t>
<t t-name="web.PivotHeader" owl="1">
<th t-att-colspan="isXAxis ? cell.width : undefined" t-att-rowspan="isXAxis ? cell.height : undefined" t-att-class="{
<th
t-att-colspan="isXAxis ? cell.width : undefined"
t-att-rowspan="isXAxis ? cell.height : undefined"
t-att-class="{
o_pivot_header_cell_closed: cell.isLeaf,
o_pivot_header_cell_opened: !cell.isLeaf,
}" t-attf-style="{{ isXAxis ? undefined : 'padding-left: ' + getPadding(cell) + 'px;' }}" t-att-data-tooltip="cell.label" data-tooltip-position="right" t-on-click.prevent="onHeaderClick(cell, isXAxis ? 'col' : 'row')">
}"
t-attf-style="{{
isXAxis
? undefined
: l10n.direction === 'ltr'
? 'padding-left: ' + getPadding(cell) + 'px;'
: 'padding-right: ' + getPadding(cell) + 'px;'
}}"
t-att-data-tooltip="cell.label"
t-attf-data-tooltip-position="{{ l10n.direction === 'ltr' ? 'right' : 'left' }}"
t-on-click.prevent="onHeaderClick(cell, isXAxis ? 'col' : 'row')"
>
<t t-if="cell.isLeaf and !cell.isFolded">
<PivotGroupByMenu
toggler="'parent'"
@@ -68,20 +68,30 @@
.o_pivot_header_cell_closed {
@include o-pivot-header-cell;
&::before {
&::after, &::before {
font-family: FontAwesome;
content: "";
margin-right: 8px;
}
&::after {
content: #{"/*!rtl:''*/"} none;
}
&::before {
content: #{"/*!rtl:none*/"} "";
}
}
.o_pivot_header_cell_opened {
@include o-pivot-header-cell;
&::before {
&::after, &::before {
font-family: FontAwesome;
content: "";
margin-right: 8px;
}
&::after {
content: #{"/*!rtl:''*/"} none;
}
&::before {
content: #{"/*!rtl:none*/"} "";
}
}
.o_pivot_sort_order_asc::after {