diff --git a/jikimo_frontend/static/src/list/custom_width.js b/jikimo_frontend/static/src/list/custom_width.js index e7cc7b68..3a1443a4 100644 --- a/jikimo_frontend/static/src/list/custom_width.js +++ b/jikimo_frontend/static/src/list/custom_width.js @@ -10,14 +10,13 @@ patch(ListRenderer.prototype, 'jikimo_frontend.ListRenderer', { // The following code manipulates the DOM directly to avoid having to wait for a // render + patch which would occur on the next frame and cause flickering. freezeColumnWidths() { + console.log('ccccccccccccccccccccccccccc') if (!this.keepColumnWidths) { this.columnWidths = null; } const table = this.tableRef.el; const headers = [...table.querySelectorAll("thead th:not(.o_list_actions_header)")]; - // 列数+1 - const columnsLength = headers.length + 1; if (!this.columnWidths || !this.columnWidths.length) { // no column widths to restore @@ -29,7 +28,7 @@ patch(ListRenderer.prototype, 'jikimo_frontend.ListRenderer', { th.style.maxWidth = null; }); - this.setDefaultColumnWidths(columnsLength); + this.setDefaultColumnWidths(); // Squeeze the table by applying a max-width on largest columns to // ensure that it doesn't overflow @@ -43,60 +42,25 @@ patch(ListRenderer.prototype, 'jikimo_frontend.ListRenderer', { }); }, - setDefaultColumnWidths(columnsLength) { + setDefaultColumnWidths() { const widths = this.state.columns.map((col) => this.calculateColumnWidth(col)); - const sumOfRelativeWidths = widths + const sumOfRelativeWidths = (widths .filter(({ type }) => type === "relative") - .reduce((sum, { value }) => sum + value, 0); + .reduce((sum, { value }) => sum + value, 0)) + 1; - // // 计算新增列的权重 - // const newColumnWeight = 0.1; - // - // // 新增列后的总权重 - // const totalWeights = sumOfRelativeWidths + newColumnWeight; + // 获取数组的最后一项 + const lastItem = widths[widths.length - 1]; + // 复制最后一项 + const newItem = { ...lastItem }; + + // 将新的对象添加到数组的末尾 + widths.push(newItem); // 1 because nth-child selectors are 1-indexed, 2 when the first column contains // the checkboxes to select records. const columnOffset = this.hasSelectors ? 2 : 1; - // widths.forEach(({ type, value }, i) => { - // const headerEl = this.tableRef.el.querySelector(`th:nth-child(${i + columnOffset})`); - // if (type === "absolute") { - // if (this.isEmpty) { - // headerEl.style.width = value; - // } else { - // headerEl.style.minWidth = value; - // } - // } else if (type === "relative" && this.isEmpty) { - // // headerEl.style.width = `${((value / sumOfRelativeWidths) * 100).toFixed(2)}%`; - // headerEl.style.width = `${100 / columnsLength}%`; - // } - // }); - - // widths.forEach(({ type, value }, i) => { - // const headerEl = this.tableRef.el.querySelector(`th:nth-child(${i + columnOffset})`); - // if (type === "absolute") { - // if (this.isEmpty) { - // headerEl.style.width = value; - // } else { - // headerEl.style.minWidth = value; - // } - // } else if (type === "relative" && this.isEmpty) { - // - // if (i === 0) { - // // 第一列 - // headerEl.style.width = `3.2%`; - // - // } else { - // headerEl.style.width = `${100 / columnsLength}%`; - // } - // - // } - // - // }); - widths.forEach(({ type, value }, i) => { const headerEl = this.tableRef.el.querySelector(`th:nth-child(${i + columnOffset})`); - const column = this.state.columns[i]; // 获取当前列的对象 if (type === "absolute") { if (this.isEmpty) { headerEl.style.width = value; @@ -104,69 +68,9 @@ patch(ListRenderer.prototype, 'jikimo_frontend.ListRenderer', { headerEl.style.minWidth = value; } } else if (type === "relative" && this.isEmpty) { - - if (i === 0) { - // 第一列 - headerEl.style.width = `${1}%`; - } else if (column.name === "sequence") { - // sequence列 - headerEl.style.width = `${1}%`; - } else if (column.name === "name") { - // name列 - headerEl.style.width = `${20}%`; - - } else { - headerEl.style.width = `${100 / columnsLength}%`; - } - - } else { - headerEl.style.width = `${100 / columnsLength}%`; + headerEl.style.width = `${((value / sumOfRelativeWidths) * 100).toFixed(2)}%`; } - }); - - - - - - - // widths.forEach(({type, value}, i) => { - // - // const headerEl = this.tableRef.el.querySelector(`th:nth-child(${i + columnOffset})`); - // - // if (type === 'absolute') { - // // 原有绝对宽度逻辑 - // } else if (type === 'relative' && this.isEmpty) { - // - // if (i === columnsLength - 1) { - // // 新增列按权重分配 - // headerEl.style.width = `${(newColumnWeight/totalWeights) * 100}%`; - // - // } else { - // // 原相对列按权重分配 - // headerEl.style.width = `${(value/totalWeights) * 100}%`; - // } - // - // } - // - // }); }, - // calculateColumnWidth(column) { - // if (column.options && column.rawAttrs.width) { - // return { type: "absolute", value: column.rawAttrs.width }; - // } - // - // if (column.type !== "field") { - // return { type: "relative", value: 1 }; - // } - // - // const type = column.widget || this.props.list.fields[column.name].type; - // if (type in FIXED_FIELD_COLUMN_WIDTHS) { - // return { type: "absolute", value: FIXED_FIELD_COLUMN_WIDTHS[type] }; - // } - // - // return { type: "relative", value: 1 }; - // } - } );