[FIX] web: ListView colspan for empty lines
Before this commit, empty lines on non-editable form's list are 1 column too long and breaks the list's layout (ie. squish other columns and empty space on non-empty columns). This commit fixes it by properly calculating the number of columns and their application on the empty lines' colspan. It also fixes an assert in the list view's tests which mistakenly required that list's records should be editable in a non-editable form. Steps to reproduce: - Open a Contact - In the notebook, choose the Accounting tab => The Bank Accounts list has broken layout closes odoo/odoo#101550 X-original-commit: 543134e215200bafd89edc1303032a210a4206cf Signed-off-by: Aaron Bohy (aab) <aab@odoo.com> Signed-off-by: Pierre Paridans (app) <app@odoo.com>
This commit is contained in:
@@ -338,7 +338,10 @@ export class ListRenderer extends Component {
|
||||
if (this.hasSelectors) {
|
||||
nbCols++;
|
||||
}
|
||||
if (this.props.activeActions && this.props.activeActions.onDelete) {
|
||||
if (
|
||||
(this.props.activeActions && this.props.activeActions.onDelete) ||
|
||||
this.displayOptionalFields
|
||||
) {
|
||||
nbCols++;
|
||||
}
|
||||
return nbCols;
|
||||
|
||||
@@ -126,7 +126,7 @@
|
||||
</tr>
|
||||
<t t-if="!props.list.isGrouped">
|
||||
<tr t-foreach="getEmptyRowIds" t-as="emptyRowId" t-key="emptyRowId">
|
||||
<td t-att-colspan="props.list.editedRecord ? nbCols : nbCols + 1">​</td>
|
||||
<td t-att-colspan="nbCols">​</td>
|
||||
</tr>
|
||||
</t>
|
||||
</t>
|
||||
|
||||
@@ -3291,9 +3291,8 @@ QUnit.module("Views", (hooks) => {
|
||||
resModel: "foo",
|
||||
serverData,
|
||||
resId: 1,
|
||||
mode: "readonly",
|
||||
arch: `
|
||||
<form>
|
||||
<form edit="0">
|
||||
<sheet>
|
||||
<field name="foo_o2m">
|
||||
<tree editable="bottom">
|
||||
@@ -3303,8 +3302,8 @@ QUnit.module("Views", (hooks) => {
|
||||
</sheet>
|
||||
</form>`,
|
||||
});
|
||||
// in readonly mode, the delete action is available and the empty lines should cover that col
|
||||
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "2");
|
||||
// in readonly mode, the delete action is not available
|
||||
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "1");
|
||||
});
|
||||
|
||||
QUnit.test("colspan of empty lines is correct in edit", async function (assert) {
|
||||
@@ -3333,6 +3332,66 @@ QUnit.module("Views", (hooks) => {
|
||||
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "2");
|
||||
});
|
||||
|
||||
QUnit.test(
|
||||
"colspan of empty lines is correct in readonly with optional fields",
|
||||
async function (assert) {
|
||||
serverData.models.foo.fields.foo_o2m = {
|
||||
string: "Foo O2M",
|
||||
type: "one2many",
|
||||
relation: "foo",
|
||||
};
|
||||
await makeView({
|
||||
type: "form",
|
||||
resModel: "foo",
|
||||
serverData,
|
||||
resId: 1,
|
||||
arch: `
|
||||
<form edit="0">
|
||||
<sheet>
|
||||
<field name="foo_o2m">
|
||||
<tree editable="bottom">
|
||||
<field name="int_field"/>
|
||||
<field name="foo" optional="hidden"/>
|
||||
</tree>
|
||||
</field>
|
||||
</sheet>
|
||||
</form>`,
|
||||
});
|
||||
// in readonly mode, the delete action is not available but the optional fields is and the empty lines should cover that col
|
||||
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "2");
|
||||
}
|
||||
);
|
||||
|
||||
QUnit.test(
|
||||
"colspan of empty lines is correct in edit with optional fields",
|
||||
async function (assert) {
|
||||
serverData.models.foo.fields.foo_o2m = {
|
||||
string: "Foo O2M",
|
||||
type: "one2many",
|
||||
relation: "foo",
|
||||
};
|
||||
await makeView({
|
||||
type: "form",
|
||||
resModel: "foo",
|
||||
serverData,
|
||||
resId: 1,
|
||||
arch: `
|
||||
<form>
|
||||
<sheet>
|
||||
<field name="foo_o2m">
|
||||
<tree editable="bottom">
|
||||
<field name="int_field"/>
|
||||
<field name="foo" optional="hidden"/>
|
||||
</tree>
|
||||
</field>
|
||||
</sheet>
|
||||
</form>`,
|
||||
});
|
||||
// in edit mode, both the delete action and the optional fields are available and the empty lines should cover that col
|
||||
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "2");
|
||||
}
|
||||
);
|
||||
|
||||
QUnit.test(
|
||||
"width of some fields should be hardcoded if no data, and list initially invisible",
|
||||
async function (assert) {
|
||||
|
||||
Reference in New Issue
Block a user