smaa/octopus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Компактная компоновка фильтров в одну строку

Browse Source 
- Фильтры теперь в одну строку с flexbox
- Убраны обёртки col-auto, используется d-flex gap-2
- Селекты с width: auto для компактности
- Чекбокс 'Только в наличии' прижат к правому краю (ms-auto)
- Более компактный и чистый UI
- Убран класс product-picker-filters и удалён комментарий про счётчик
This commit is contained in:
Andrey Smakotin
2025-12-11 00:43:09 +03:00
parent b550b459dc
commit 608ac25d43
1 changed files with 23 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
myproject/products/templates/products/components/product_search_picker.html
View File

@@ -82,47 +82,39 @@ ProductSearchPicker.init('#writeoff-products', {
{% if show_filters|default:True %} {% if show_filters|default:True %}
<!-- Фильтры --> <!-- Фильтры -->
<div class="card-body border-bottom py-2 product-picker-filters"> <div class="card-body border-bottom py-2">
<div class="row g-2 align-items-center"> <div class="d-flex gap-2 align-items-center flex-wrap">
{% if categories %} {% if categories %}
<!-- Фильтр по категории --> <!-- Фильтр по категории -->
<div class="col-auto"> <select class="form-select form-select-sm product-picker-category" style="width: auto;">
<select class="form-select form-select-sm product-picker-category"> <option value="">Все категории</option>
<option value="">Все категории</option> {% for cat in categories %}
{% for cat in categories %} <option value="{{ cat.id }}">{{ cat.name }}</option>
<option value="{{ cat.id }}">{{ cat.name }}</option> {% endfor %}
{% endfor %} </select>
</select>
</div>
{% endif %} {% endif %}
{% if tags %} {% if tags %}
<!-- Фильтр по тегам --> <!-- Фильтр по тегам -->
<div class="col-auto"> <select class="form-select form-select-sm product-picker-tag" style="width: auto;">
<select class="form-select form-select-sm product-picker-tag"> <option value="">Все теги</option>
<option value="">Все теги</option> {% for tag in tags %}
{% for tag in tags %} <option value="{{ tag.id }}">{{ tag.name }}</option>
<option value="{{ tag.id }}">{{ tag.name }}</option> {% endfor %}
{% endfor %} </select>
</select>
</div>
{% endif %} {% endif %}
<!-- Фильтр по наличию --> <!-- Фильтр по наличию -->
<div class="col-auto"> <div class="form-check form-switch ms-auto">
<div class="form-check form-switch"> <input class="form-check-input product-picker-in-stock"
<input class="form-check-input product-picker-in-stock" type="checkbox"
type="checkbox" id="{{ container_id|default:'product-search-picker' }}-in-stock"
id="{{ container_id|default:'product-search-picker' }}-in-stock" {% if filter_in_stock_only|default:False %}checked{% endif %}>
{% if filter_in_stock_only|default:False %}checked{% endif %}> <label class="form-check-label small"
<label class="form-check-label small" for="{{ container_id|default:'product-search-picker' }}-in-stock">
for="{{ container_id|default:'product-search-picker' }}-in-stock"> Только в наличии
Только в наличии </label>
</label>
</div>
</div> </div>
<!-- Счетчик выбранных - УБРАН в single-select режиме -->
</div> </div>
</div> </div>
{% endif %} {% endif %}