Part-DB-server/templates/parts/lists/search_list.html.twig
d-buchmann 1686df968f
Implement extensive search (#1406)
* Implement advanced search

Up to 5 individual tokens (separated by spaces) can be given as search string.
Each token is individually searched for in all selected fields.

Examples (assuming the relevant fields are selected for search):
- a part named `foo` with a tag `bar` will be found with the search string "foo bar".
- a part named `bar baz` will be found with the search string "baz bar".
- a part with the ID 123 and in storage location `a_qux_b` will be found with the search string "qux 123".

* Add tests

These were created with the help of GPT-5.2.
Disclaimer: I don't have the experience to judge the quality or validity of the results.

* Restructure query buildup

* Update tests

* Move options from Settings to localStorage

* Consider mutual exclusivity of search options

If regex search is enabled, the other two options are disabled (only visually). This should give the user a fair idea of what's happening while keeping things as simple as possible.

* Added translations for the checkboxes

* Fix stimulus controller to allow handling multiple instances of the dropdown menu

* Added tooltips for the different search mode options

---------

Co-authored-by: Jan Böhmer <mail@jan-boehmer.de>
2026-07-27 18:42:32 +02:00

90 lines
5.8 KiB
Twig

{% extends "base.html.twig" %}
{% block title %}
{% trans %}parts_list.search.title{% endtrans %}: {{ keyword }}
{% endblock %}
{% block content %}
<div class="accordion mb-3" id="listAccordion">
<div class="accordion-item">
<div class="accordion-header">
<button class="accordion-button collapsed py-2" data-bs-toggle="collapse" data-bs-target="#searchInfo">
<i class="fa-solid fa-magnifying-glass fa-fw"></i>
{% trans %}parts_list.search.title{% endtrans %}:&nbsp;<b>{{ keyword }}</b>
</button>
</div>
<div id="searchInfo" class="accordion-collapse collapse" data-bs-parent="#listAccordion">
<div class="accordion-body">
<h4>{% trans with {"%keyword%": keyword|escape} %}parts_list.search.searching_for{% endtrans %}</h4>
{% trans %}parts_list.search_options.caption{% endtrans %}:
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.name %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}name.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.category %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}category.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.description %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}description.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.mpn %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}part.edit.mpn{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.tags %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}tags.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.storelocation %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}storelocation.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.comment %}checked{% endif %}>
<label class="form-check-label justify-content-start">{% trans %}comment.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.ordernr %}checked{% endif %}>
<label for="search_supplierpartnr" class="form-check-label justify-content-start">{% trans %}orderdetails.edit.supplierpartnr{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.supplier %}checked{% endif %}>
<label for="search_supplier" class="form-check-label justify-content-start">{% trans %}supplier.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.manufacturer %}checked{% endif %}>
<label for="search_manufacturer" class="form-check-label justify-content-start">{% trans %}manufacturer.label{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.footprint %}checked{% endif %}>
<label for="search_footprint" class="form-check-label justify-content-start">{% trans %}footprint.label{% endtrans %}</label>
</div>
<hr>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.regex %}checked{% endif %}>
<label for="regex" class="form-check-label justify-content-start">{% trans %}search.regexmatching{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.extensive %}checked{% endif %}>
<label for="extensive" class="form-check-label justify-content-start">{% trans %}search.extensive_matching{% endtrans %}</label>
</div>
<div class="form-check">
<input type="checkbox" class="form-check-input" disabled {% if searchFilter.extensive %}checked{% endif %}>
<label for="wildcard" class="form-check-label justify-content-start">{% trans %}search.permit_wildcards{% endtrans %}</label>
</div>
</div>
</div>
</div>
{% include "parts/lists/_filter.html.twig" %}
</div>
{% include "parts/lists/_parts_list.html.twig" %}
{% endblock %}