odoo16/addons_main/jc_bi/reports/multi_head_table.html

{% macro get_table(headers1, headers2, rows, table_height, table_width, lock_column_count) %}
<div style="overflow: auto;height: {{table_height}};width:{{table_width}};float: left;">
    <table class="table table-striped table-bordered table-hover" style="border:1px solid gray;">
        <thead>
        <tr>
            {% set _left = 0 %}
            {% for item in headers1 %}
            {% set name = item[0] %}
            {% set data_type = item[1] %}
            {% set value = item[2] %}
            {% set width = item[3] %}
            <th
                    style="line-height: 30px;border: 1px solid #ddd;padding: unset;vertical-align: middle;text-align: center;
                    {% if width %} width: {{width}}px;{% endif %}
                    {% if loop.index==1 %}z-index: 3;{% endif %}
                    {% if lock_column_count and loop.index<=lock_column_count %}
                    {% if loop.index>1 %}{% set _left = _left + headers1[(loop.index-2)][3] %}{% endif %}
                    left:{{_left}}px;{% endif %}"
                    {% if data_type== 1 %} rowspan="{{value}}" {% endif %}
                    {% if data_type== 2 %} colspan="{{value}}" {% endif %}
                    {% if loop.index<=lock_column_count %}class="row_and_column" {% endif %}
            >{{name}}
            </th>
            {% endfor %}
        </tr>
        <tr>
            {% for item in headers2 %}
            {% set name = item[0] %}
            <th style="top:31px;line-height: 30px;border: 1px solid #ddd;padding: unset;vertical-align: middle;text-align: center;">
                {{name}}
            </th>
            {% endfor %}
        </tr>
        </thead>
        <tbody>
        {% for row in rows %}
        <tr>
            {% set _left = 0 %}
            {% for item in row %}
            <td
                    {% if lock_column_count and loop.index<=lock_column_count %}
            {% if loop.index>1 %}{% set _left = _left + headers1[(loop.index-2)][3] %}{% endif %}
            style="left:{{_left}}px;background-color:
            lightpink;z-index: 1;position: sticky;{{item[1]}}"
            {% endif %}
            {% if item[2] %} {{item[2]}} {% endif %}
            >{{item[0]}}
            </td>
            {% endfor %}
        </tr>
        {% endfor %}
        </tbody>
    </table>
</div>
{% endmacro %}