Merge branch 'dev' into dev_zhou
This commit is contained in:
+1
-1
@@ -1,7 +1,7 @@
|
||||
.sticky-column {
|
||||
position: sticky !important;
|
||||
background-color: white;
|
||||
z-index: 2;
|
||||
z-index: 4 !important;
|
||||
}
|
||||
.o_list_view .o_list_table td.sticky-column {
|
||||
z-index: 4 !important;
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
"license": "OPL-1",
|
||||
"price": 95.00,
|
||||
"currency": "USD",
|
||||
"depends": ["web", "sale_management"],
|
||||
"depends": ["web", "sale_management", "account", "purchase", "hr_expense"],
|
||||
"data": [],
|
||||
"assets": {
|
||||
"web.assets_backend": [
|
||||
@@ -65,8 +65,12 @@
|
||||
"tree_view_advanced_filter/static/src/libs/**/*",
|
||||
"tree_view_advanced_filter/static/src/tree_view_advanced_filter/**/*",
|
||||
"tree_view_advanced_filter/static/src/web_list_num/**/*",
|
||||
"tree_view_advanced_filter/static/src/list_view_sticky_header_and_column/js/*",
|
||||
"tree_view_advanced_filter/static/src/list_view_sticky_header_and_column/xml/*",
|
||||
"tree_view_advanced_filter/static/src/list_view_sticky_header_and_column/scss/*"
|
||||
]
|
||||
},
|
||||
|
||||
"images": ["static/description/banner.jpg"],
|
||||
"installable": True,
|
||||
"auto_install": False,
|
||||
|
||||
+65
@@ -0,0 +1,65 @@
|
||||
/** @odoo-module **/
|
||||
/** This file will used to stick the selected header and column in the list view **/
|
||||
import { patch } from "@web/core/utils/patch";
|
||||
import { ListRenderer } from "@web/views/list/list_renderer";
|
||||
patch(ListRenderer.prototype, {
|
||||
/** super the setup function **/
|
||||
setup() {
|
||||
super.setup();
|
||||
|
||||
},
|
||||
/**
|
||||
* function defining the button having t-on-click _onClick
|
||||
*/
|
||||
_onClickIcon(ev, record) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation()
|
||||
const $clickedHeader = $(ev.currentTarget).closest('th');
|
||||
const columnIndex = $clickedHeader.index();
|
||||
console.log(this.__owl__.bdom.parentEl)
|
||||
$(this.__owl__.bdom.parentEl.querySelectorAll('.sticky-column')).removeClass('sticky-column');
|
||||
console.log($(this.__owl__.bdom.parentEl.querySelectorAll('.sticky-column')).removeClass('sticky-column'))
|
||||
$(this.__owl__.bdom.parentEl.querySelectorAll('.clicked-header')).removeClass('clicked-header');
|
||||
$clickedHeader.addClass('clicked-header');
|
||||
const $tableHeaders = $(this.__owl__.bdom.parentEl.querySelectorAll('.o_list_table th'));
|
||||
const $tableRows = $(this.__owl__.bdom.parentEl.querySelectorAll('.o_list_table tr'));
|
||||
const $tfootRow = $(this.__owl__.bdom.parentEl.querySelectorAll('.o_list_table tfoot tr')[0].children);
|
||||
const $selectedFooterCells = $tfootRow.filter(`td:nth-child(-n+${columnIndex + 1})`);
|
||||
$selectedFooterCells.addClass('sticky-column');
|
||||
const $selectedSearchTds = $(this.__owl__.bdom.parentEl.querySelectorAll(`.search_td:nth-child(-n+${columnIndex + 1})`));
|
||||
$selectedSearchTds.removeClass('sticky-column').css('left', '');
|
||||
$selectedSearchTds.addClass('sticky-column');
|
||||
const $selectedColumns = $(this.__owl__.bdom.parentEl.querySelectorAll(`.o_data_row td:nth-child(-n+${columnIndex + 1})`));
|
||||
const $selectedHeaderCells = $tableHeaders.filter(`th:nth-child(-n+${columnIndex + 1})`);
|
||||
$tableHeaders.removeClass('sticky-column').css('left', '');
|
||||
$(this.__owl__.bdom.parentEl.querySelectorAll('.o_data_row td')).removeClass('sticky-column').css('left', '');
|
||||
$selectedColumns.addClass('sticky-column');
|
||||
$selectedHeaderCells.addClass('sticky-column');
|
||||
$tableHeaders.filter('.sticky-column').css('top', '0');
|
||||
const $targetColumn = $selectedColumns.eq(columnIndex);
|
||||
// const targetLeftPosition = $targetColumn.position().left;
|
||||
const columnsToAdjust = columnIndex + 1;
|
||||
$tableRows.each(function (index, row) {
|
||||
const $headerCells = $(row).find('th');
|
||||
const $rowCells = $(row).find('td');
|
||||
for (let i = 0; i < columnsToAdjust; i++) {
|
||||
if ($headerCells.eq(i).length > 0) {
|
||||
$headerCells.eq(i).css('left', `${$headerCells.eq(i).position().left}px`);
|
||||
}
|
||||
if ($rowCells.eq(i).length > 0) {
|
||||
$rowCells.eq(i).css('left', `${$rowCells.eq(i).position().left}px`);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* super onClickSortColumn function and remove the icon and element having the class sticky-column
|
||||
*/
|
||||
onClickSortColumn(column) {
|
||||
super.onClickSortColumn(...arguments);
|
||||
$(this.__owl__.bdom.parentEl.querySelectorAll('.sticky-column')).removeClass('sticky-column');
|
||||
$(this.__owl__.bdom.parentEl.querySelectorAll('.clicked-header')).removeClass('clicked-header');
|
||||
const $tableHeaders = $(this.__owl__.bdom.parentEl.querySelectorAll('.o_list_table th'));
|
||||
$tableHeaders.removeClass('sticky-column').css('left', '');
|
||||
}
|
||||
});
|
||||
+51
@@ -0,0 +1,51 @@
|
||||
.sticky-column {
|
||||
position: sticky !important;
|
||||
background-color: white;
|
||||
z-index: 4 !important;
|
||||
}
|
||||
.o_list_view .o_list_table td.sticky-column {
|
||||
z-index: 4 !important;
|
||||
background-color: white;
|
||||
}
|
||||
.o_list_view .o_list_table thead {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 3;
|
||||
background-color: white;
|
||||
}
|
||||
.o_list_view .o_list_table th.sticky-column {
|
||||
z-index: 4;
|
||||
background-color: white;
|
||||
}
|
||||
.o_account_reports_page .table-responsive {
|
||||
overflow-x: auto;
|
||||
overflow-y: visible;
|
||||
}
|
||||
.table-responsive {
|
||||
overflow: visible;
|
||||
}
|
||||
.o_list_view .table-responsive .table thead {
|
||||
z-index: 5;
|
||||
}
|
||||
.o_list_renderer .o_list_table thead {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 6;
|
||||
}
|
||||
th.sticky-column::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 5px;
|
||||
height: 100%;
|
||||
background: white;
|
||||
top: 0;
|
||||
left: -4px;
|
||||
}
|
||||
.fa-thumb-tack {
|
||||
display: none;
|
||||
}
|
||||
|
||||
th:hover .fa-thumb-tack,
|
||||
th.clicked-header .fa-thumb-tack {
|
||||
display: block;
|
||||
}
|
||||
+49
@@ -0,0 +1,49 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<templates xml:space="preserve">
|
||||
<!--Adding the icon in purchase -->
|
||||
<t t-name="sticky_header_and_column_in_list_view.PurchaseListRender"
|
||||
t-inherit="purchase.PurchaseListView"
|
||||
t-inherit-mode="extension" owl="1">
|
||||
<xpath expr="//div[hasclass('o_list_renderer')]/table/thead/tr/t/th/t/div/span"
|
||||
position="after">
|
||||
<i class="fa fa-thumb-tack"
|
||||
style="color: #27ae60; font-size: 16px; margin-right: 5px;"
|
||||
t-on-click="(ev) => this._onClickIcon(ev,record)"/>
|
||||
</xpath>
|
||||
|
||||
</t>
|
||||
<!--Adding the icon in account -->
|
||||
<t t-name="sticky_header_ and_column_in_list_view.AccountListRender"
|
||||
t-inherit="account.ListRenderer" t-inherit-mode="extension"
|
||||
owl="1">
|
||||
<xpath expr="//div[hasclass('o_list_renderer')]/table/thead/tr/t/th/t/div/span"
|
||||
position="after">
|
||||
<i class="fa fa-thumb-tack"
|
||||
style="color: #27ae60; font-size: 16px; margin-right: 5px;"
|
||||
t-on-click="(ev) => this._onClickIcon(ev,record)"/>
|
||||
</xpath>
|
||||
</t>
|
||||
<!--Adding the icon in Hr Expense -->
|
||||
<t t-name="sticky_header_and_column_in_list_view.HrExpenseListRender"
|
||||
t-inherit="hr_expense.DashboardListRenderer"
|
||||
t-inherit-mode="extension" owl="1">
|
||||
<xpath expr="//div[hasclass('o_list_renderer')]/table/thead/tr/t/th/t/div/span"
|
||||
position="after">
|
||||
<i class="fa fa-thumb-tack"
|
||||
style="color: #27ae60; font-size: 16px; margin-right: 5px;"
|
||||
t-on-click="(ev) => this._onClickIcon(ev,record)"/>
|
||||
</xpath>
|
||||
</t>
|
||||
<!--Adding the icon in All-->
|
||||
<t t-name="sticky_header_and_column_in_list_view.RowListView"
|
||||
t-inherit="web.ListRenderer" t-inherit-mode="extension"
|
||||
owl="1">
|
||||
<xpath expr="//div[hasclass('o_list_renderer')]/table/thead/tr/t/th/t/div/span"
|
||||
position="after">
|
||||
<i class="fa fa-thumb-tack"
|
||||
style="color: #27ae60; font-size: 16px; margin-right: 5px;"
|
||||
t-on-click="(ev) => this._onClickIcon(ev,record)"
|
||||
/>
|
||||
</xpath>
|
||||
</t>
|
||||
</templates>
|
||||
@@ -10,3 +10,12 @@
|
||||
text-overflow: clip !important; // 移除省略号(或直接不设置)
|
||||
min-width: max-content !important; // 按内容撑开列宽(可选)
|
||||
}
|
||||
|
||||
.o_list_renderer .o_list_table{
|
||||
table-layout: auto !important;
|
||||
}
|
||||
|
||||
.o_list_renderer .o_list_table > thead > tr > th{
|
||||
max-width: max-content !important;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user