74d5b24f9a
* Update shell.handlebars adding two options: search_button search_placeholder * Update table.handlebars adding search_placeholder option * Update 01_documentation.sql documentation update for the shell component options: search_placeholder search_button and for the table component option: search_placeholder * avoid failing tests on long loading map tiles * add an example for search_placeholder --------- Co-authored-by: lovasoa <contact@ophir.dev>
102 lines
5.6 KiB
Handlebars
102 lines
5.6 KiB
Handlebars
<div class="card my-2 {{class}}" {{#if overflow}}style="width: fit-content;"{{/if}} {{#if id}}id="{{id}}"{{/if}}>
|
|
<div class="card-body p-0" data-pre-init="table">
|
|
{{#if (or search initial_search_value)}}
|
|
<div class="p-3">
|
|
<input
|
|
type="search"
|
|
class="form-control form-control-rounded fs-6 search"
|
|
placeholder="{{default search_placeholder 'Search…'}}"
|
|
value="{{initial_search_value}}"
|
|
{{#if initial_search_value}}autocomplete="off"{{/if}}
|
|
>
|
|
</div>
|
|
{{/if}}
|
|
<div class="table-responsive
|
|
{{~#if freeze_columns}} table-freeze-columns text-nowrap {{/if~}}
|
|
{{~#if freeze_headers}} table-freeze-headers text-nowrap {{/if~}}
|
|
{{~#if freeze_footers}} table-freeze-footers text-nowrap {{/if~}}
|
|
">
|
|
<table class="table
|
|
{{~#if striped_rows}} table-striped {{/if~}}
|
|
{{~#if striped_columns}} table-striped-columns {{/if~}}
|
|
{{~#if hover}} table-hover {{/if~}}
|
|
{{~#if border}} table-bordered {{/if~}}
|
|
{{~#if small}} table-sm {{/if~}}
|
|
"
|
|
{{~#if number_format_locale}} data-number_format_locale="{{number_format_locale}}"{{/if~}}
|
|
{{~#if number_format_digits}} data-number_format_digits="{{number_format_digits}}"{{/if~}}
|
|
{{~#if currency}} data-currency="{{currency}}"{{/if~}}
|
|
>
|
|
{{#if description}}<caption class="text-center text-muted">{{description}}</caption>{{/if}}
|
|
{{#each_row}}
|
|
{{#if (eq @row_index 0)}}
|
|
{{! Since we are inside the first data row, render the header }}
|
|
<thead>
|
|
<tr>
|
|
{{#each this}}
|
|
{{#if (not (starts_with @key '_sqlpage_'))}}
|
|
<th class="
|
|
_col_{{replace @key ' ' '_'~}}
|
|
{{~#if (array_contains_case_insensitive ../../align_right @key)}} text-end {{/if~}}
|
|
{{~#if (array_contains_case_insensitive ../../align_center @key)}} text-center {{/if~}}
|
|
"
|
|
data-column_type="{{typeof this}}"
|
|
{{~#if (array_contains_case_insensitive ../../raw_numbers @key)}} data-raw_number="1"{{/if~}}
|
|
{{~#if (array_contains_case_insensitive ../../money @key)}} data-money="1"{{/if~}}
|
|
>
|
|
{{~#if ../../sort~}}
|
|
<button class="table-sort sort d-inline" data-sort="{{@key}}">{{@key}}</button>
|
|
{{~else~}}
|
|
{{~@key~}}
|
|
{{~/if~}}
|
|
</th>
|
|
{{/if}}
|
|
{{/each}}
|
|
</tr>
|
|
</thead>
|
|
<tbody class="table-tbody list">{{#delay}}</tbody>{{/delay}}
|
|
{{~/if~}}
|
|
{{!~ If this data row should go into the footer, close the <tbody>, open the <tfoot> ~}}
|
|
{{~#if _sqlpage_footer~}} </tbody><tfoot> {{/if~}}
|
|
<tr class="{{_sqlpage_css_class}} {{#if _sqlpage_color}}bg-{{_sqlpage_color}}-lt{{/if}}" {{#if _sqlpage_id}}id="{{_sqlpage_id}}"{{/if}}>
|
|
{{~#each this~}}
|
|
{{~#if (not (starts_with @key '_sqlpage_'))~}}
|
|
<td class="align-middle _col_{{replace @key ' ' '_'~}}
|
|
{{~#if (array_contains_case_insensitive ../../align_right @key)}} text-end {{/if~}}
|
|
{{~#if (array_contains_case_insensitive ../../align_center @key)}} text-center {{/if~}}
|
|
{{~#if (array_contains_case_insensitive ../../monospace @key)}} font-monospace {{/if~}}
|
|
">
|
|
{{~#if (array_contains_case_insensitive ../../markdown @key)~}}
|
|
{{{markdown this}}}
|
|
{{~else~}}
|
|
{{~#if (array_contains_case_insensitive ../../icon @key)~}}
|
|
{{~icon_img this~}}
|
|
{{~else~}}
|
|
{{this}}
|
|
{{~/if~}}
|
|
{{~/if~}}
|
|
</td>
|
|
{{/if~}}
|
|
{{~/each~}}
|
|
</tr>
|
|
{{!~
|
|
After this <tr> has been rendered, if this was a footer, we need to reopen a new <tbody>
|
|
No need for another delayed closure since the previous one still applies
|
|
~}}
|
|
{{~#if _sqlpage_footer}} </tfoot><tbody class="table-tbody list"> {{/if~}}
|
|
{{/each_row}}
|
|
{{flush_delayed}}
|
|
|
|
{{! If not enough rows were rendered, we need to place a 'No data' cell. "Not enough rows" depends on the footer settings }}
|
|
{{#if (eq @row_index 0)}}
|
|
<tbody class="table-tbody list">
|
|
<tr>
|
|
<td class="text-center">{{default empty_description 'No data'}}</td>
|
|
</tr>
|
|
</tbody>
|
|
{{/if}}
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|