Inventur/templates/table.html.tera

{# vim: set filetype=html: #}
{% extends "base" %}

{# This file is part of inventur.
 # inventur is a simple web app using rocket to help maintain inventory data.
 # Copyright (C) 2024 Johannes Randerath
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU Affero General Public License as published by
 # the Free Software Foundation, either version 3 of the License, or
 # (at your option) any later version.
 #
 # This program is distributed in the hope that it will be useful,
 # but WITHOUT ANY WARRANTY; without even the implied warranty of
 # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 # GNU Affero General Public License for more details.
 #
 # You should have received a copy of the GNU Affero General Public License
 # along with this program.  If not, see <https://www.gnu.org/licenses/>.
 #}

{% block pagename %}Table{% endblock pagename %}

{% block body %}

<!-- Table header and editing -->
<div class="row justify-content-between">
  <div class="col-2 me-0 pe-0 pt-0 mt-0">
    <h1>
      <div class='input-group mt-0'>
	<span id="tname">{{ tblname }}</span>
	{% block edit_tname %}
	{% endblock edit_tname %}
      </div>
    </h1>
  </div>

  <div class="col-1 align-self-start align-content-start ms-0 ps-0 mt-0 pt-0">
    {% block share %}
    {% endblock share %}
  </div>

  <div class="col-6">
    
  </div>

<!-- Search bar -->
  <div class="col-3 align-self-end align-content-end pt-0 mt-0">
    <div class="btn-toolbar mt-0 pt-0" role="toolbar">
      {% block new_entry %}
      {% endblock new_entry %}
      <form method="get" action="/table/{{ tblid }}">
	<div class="input-group">
	  <div class="input-group-text dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false">
	    <i class="bi bi-table"></i>
	  </div>
	  <input id="input_search_value" name="search_value" type="text" placeholder="Search" value="{{ search_value }}" class="form-control">
	  <button class="btn btn-outline-primary" type="submit"><i class="bi bi-search"></i></button>
	  <ul class="dropdown-menu">
	    <select name="search_fields" class="form-select" multiple>
	      <option disabled class="dropdown-header">Search in</option>
	      {% for column in column_names %}
	      <option class="dropdown-option" value="{{ loop.index - 1 }}" {% if (loop.index - 1) in search_fields %}selected{% endif %}>{{ column }}</option>
	      {% endfor %}
	    </select>
	  </ul>
	</div>
      </form>
    </div>
  </div>
</div>


<br>

<!-- Table contents -->
<table id="content_table" class="table table-striped table-hover table-responsive table-bordered mt-2">
  <!-- column headings -->
  <thead>
    <tr>
      <!-- Index (#) column -->
      <th style="width:7%">
	<div class="row justify-content-between">
	  <div class="col-auto">
	    #
	  </div>
	  <div class="col-auto">
	    <div class="btn-toolbar">
	      {% block new_column %}
	      {% endblock new_column %}
	      <form method="get" action="/table/{{ tblid }}">
		<input value="0" name="sort_field" hidden />
		<input value="{% if sort_field == 0 %}{{ (sort_dir + 1) % 2}}{% else %}0{% endif %}" name="sort_dir" hidden />
		{% if sort_field == 0 and sort_dir == 0 %}
		{% set dir='up' %}
		{% else %}
		{% set dir='down' %}
		{% endif %}
		<button class="btn p-0" type="submit"><i class="bi bi-sort-{{ dir }}"></i></button>
	      </form>
	    </div>
	  </div>
	</div>
      </th>
      <!-- individual columns -->
      {% for column in column_names %}
      <th>
	<div class="row justify-content-between">
	  <div class="col-auto">
	    {{ column }}
	  </div>
	  <div class="col-auto">
	    <div class="btn-toolbar">
	      <button class="btn p-0 me-2 edit_column_btn" type="button" data-bs-toggle="modal" data-bs-target="#edit_column_modal" onclick="edit_column({{ loop.index0 }});" hidden><i class="bi bi-pencil"></i></button>
	      <form method="GET" action="/table/{{ tblid }}">
		<input value="{{ loop.index }}" name="sort_field" hidden />
		<input value="{% if sort_field == loop.index %}{{ (sort_dir + 1) % 2}}{% else %}0{% endif %}" name="sort_dir" hidden />
		{% if sort_field == loop.index and sort_dir == 0 %}
		{% set dir='up' %}
		{% else %}
		{% set dir='down'%}
		{% endif %}
		<button class="btn p-0" type="submit"><i class="bi bi-sort-{{ dir }}"></i></button>
	      </form>
	    </div>
	  </div>
	</div>
      </th>
      {% endfor %}
    </tr>
  </thead>

  <!-- Table rows -->
  <tbody>
    {% for row in rows %}
    <tr>
      {% for column in row %}
      <td>{{ column }}</td>
      {% endfor %}
    </tr>
    {% endfor %}
  </tbody>
</table>
{% endblock body %}