diff options
Diffstat (limited to 'ishtar_common/templates/blocks/DataTables.html')
| -rw-r--r-- | ishtar_common/templates/blocks/DataTables.html | 158 |
1 files changed, 99 insertions, 59 deletions
diff --git a/ishtar_common/templates/blocks/DataTables.html b/ishtar_common/templates/blocks/DataTables.html index 096650115..07725353c 100644 --- a/ishtar_common/templates/blocks/DataTables.html +++ b/ishtar_common/templates/blocks/DataTables.html @@ -27,50 +27,79 @@ </div> </div> -<div id="grid_{{name}}_meta_wrapper"> - <table id='grid_{{name}}' class="display" width="100%"> - <thead> - <tr> - <th></th> - <th></th>{% for col in col_names %} - <th>{{col}}</th> - {% endfor %}</tr> - </thead> - </table> -</div> +<ul class="nav nav-tabs m-3"> + <li class="nav-item"> + <a class="nav-link active" id="tab-grid-{{name}}" data-toggle="tab" + href="#tab-content-grid-{{name}}" role="tab" + aria-controls="tab-content-grid-{{name}}" aria-selected="true"> + {% trans "Table" %} + </a> + </li> + <li class="nav-item"> + <a class="nav-link" id="tab-gallery-{{name}}" data-toggle="tab" + href="#tab-content-gallery-{{name}}" role="tab" + aria-controls="tab-content-gallery-{{name}}" aria-selected="true"> + {% trans "Gallery" %} + </a> + </li> +</ul> -<div id='foot_{{name}}' class="gridfooter row toolbar"> - <div class='col-md-2'> - <div class="btn-group btn-group-sm" role="group"> - <button type='button' class="btn btn-secondary" data-toggle="modal" - data-target="#modal_grid_{{name}}"> - {% trans "Expand table" %} <i class="fa fa-expand" aria-hidden="true"></i> - </button> - </div> + +<div class="tab-content"> + <div class="tab-pane active" + id="tab-content-grid-{{name}}" role="tabpanel" + aria-labelledby="tab-grid-{{name}}"> + + <div id="grid_{{name}}_meta_wrapper"> + <table id='grid_{{name}}' class="display" width="100%"> + <thead> + <tr> + <th></th> + <th></th>{% for col in col_names %} + <th>{{col}}</th> + {% endfor %}</tr> + </thead> + </table> </div> - <div class='col-md-2'> - <div class="btn-group btn-group-sm" role="group" - aria-label="{% trans 'Export'%}"> - {% if source_full or extra_sources %} - <a class="btn btn-secondary" href='{{source}}csv' target='_blank' - title="{% trans 'Export as CSV - ' %}{% trans 'simple'%}">{% trans "Simple CSV" %}</a> - {% if source_full %}<a class='btn btn-secondary' href='{{source_full}}csv' target='_blank' title="{% trans 'Export as CSV - full' %}">{% trans "CSV full" %}</a>{% endif %} - {% for slug, name, extra_source in extra_sources %} - <a class="btn btn-secondary" href='{{extra_source}}csv' target='_blank' title="{% trans 'Export as CSV - ' %}{{name}}">{{name}}</a> - {% endfor %} - {% else %} - <a class="btn btn-secondary" href="{{source}}csv" target="_blank" title="{% trans 'Export as CSV' %}">{% trans "CSV" %}</a> - {% endif %} + + <div id='foot_{{name}}' class="gridfooter row toolbar"> + <div class='col-md-2'> + <div class="btn-group btn-group-sm" role="group"> + <button type='button' class="btn btn-secondary" data-toggle="modal" + data-target="#modal_grid_{{name}}"> + {% trans "Expand table" %} <i class="fa fa-expand" aria-hidden="true"></i> + </button> + </div> + </div> + <div class='col-md-2'> + <div class="btn-group btn-group-sm" role="group" + aria-label="{% trans 'Export'%}"> + {% if source_full or extra_sources %} + <a class="btn btn-secondary" href='{{source}}csv' target='_blank' + title="{% trans 'Export as CSV - ' %}{% trans 'simple'%}">{% trans "Simple CSV" %}</a> + {% if source_full %}<a class='btn btn-secondary' href='{{source_full}}csv' target='_blank' title="{% trans 'Export as CSV - full' %}">{% trans "CSV full" %}</a>{% endif %} + {% for slug, name, extra_source in extra_sources %} + <a class="btn btn-secondary" href='{{extra_source}}csv' target='_blank' title="{% trans 'Export as CSV - ' %}{{name}}">{{name}}</a> + {% endfor %} + {% else %} + <a class="btn btn-secondary" href="{{source}}csv" target="_blank" title="{% trans 'Export as CSV' %}">{% trans "CSV" %}</a> + {% endif %} + </div> </div> </div> -</div> -{% if multiple %} -<input type="button" id="add_button_{{name}}" value="{% trans 'Add' %}"/> -<ul id="selectmulti_{{name}}" class="selectmulti"></ul> -{% endif %} + {% if multiple %} + <input type="button" id="add_button_{{name}}" value="{% trans 'Add' %}"/> + <ul id="selectmulti_{{name}}" class="selectmulti"></ul> + {% endif %} -<input type="hidden" id="hidden_{{name}}" name="{{name}}"/> + <input type="hidden" id="hidden_{{name}}" name="{{name}}"/> + </div> + <div class="tab-pane active" + id="tab-content-gallery-{{name}}" role="tabpanel" + aria-labelledby="tab-gallery-{{name}}"> + </div> +</div> <script type="text/javascript" language='javascript'> $('#modal_grid_{{name}}').on('show.bs.modal', function (e) { @@ -90,33 +119,41 @@ $('#modal_grid_{{name}}').on('hide.bs.modal', function (e) { current_modal = null; }); +$("#tab-gallery-{{name}}").click(function(){ + current_tab = "gallery"; + gallery_submit_search(); +}); + +$("#tab-grid-{{name}}").click(function(){ + current_tab = "table"; + datatable_submit_search(); +}); + var query_vars = new Array({{col_idx|safe}}); var selItems_{{sname}} = new Array(); +gallery_submit_search = function(){ + var data = search_get_query_data(query_vars, "{{name}}"); + var nb_select = jQuery("#id_{{name}}-length_image").val(); + if (!nb_select) nb_select = 10; + + var url = "{{source}}json-image?length=" + nb_select + "&submited=1&" + data; + $.getJSON(url, function(data) { + $("#tab-content-gallery-{{name}}").html( + render_gallery(data, "{{name}}", nb_select)); + $("#id_{{name}}-length_image").change(gallery_submit_search); + register_image_paginate(); + }); -datatable_submit_search = function(){ - $("#id_search_vector").removeClass('input-progress'); if ($('.modal-progress').length > 0){ - $('.modal-progress').modal('show'); - } - var data = ""; - for (idx in query_vars){ - var key = query_vars[idx]; - var item = jQuery("#id_"+key); - var val = null; - if (item.prop('type') == 'checkbox'){ - if (item.prop('checked')){ - var val = item.val(); - } - } else { - var val = item.val(); - } - if (val){ - if (data) data += "&"; - data += key + "=" + encodeURIComponent(val); - } + $('.modal-progress').modal('hide'); } + return false; +}; + +datatable_submit_search = function(){ + var data = search_get_query_data(query_vars, "{{name}}"); var mygrid = jQuery("#grid_{{name}}"); var url = "{{source}}?submited=1&" + data; datatable_{{sname}}.ajax.url(url).load(); @@ -134,8 +171,11 @@ datatable_submit_search = function(){ return false; }; + jQuery(document).ready(function(){ - jQuery("#search_{{name}}").click(datatable_submit_search); + jQuery("#search_{{name}}").click( + main_submit_search + ); var base_source = "{{source}}"; |