Compare commits
9 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8085052b2b | ||
|
|
1cf330e4e8 | ||
|
|
031f86adb0 | ||
|
|
96c428eadd | ||
|
|
5e6263e853 | ||
|
|
5a474f3474 | ||
|
|
1e66bfd657 | ||
|
|
f512fbbb94 | ||
|
|
1ecfac2ad6 |
@@ -77,3 +77,108 @@
|
||||
|
||||
/* Hide Alpine x-cloak elements until Alpine initializes. */
|
||||
[x-cloak] { display: none !important; }
|
||||
|
||||
/* === Rich text editor (Quill "snow") =======================
|
||||
* Vendored Quill (assets/static/vendor/quill) drives the admin
|
||||
* product short/long description fields. Stock snow already suits
|
||||
* the light theme; the admin panel is locked to data-theme="dark",
|
||||
* so the rules below repaint the toolbar/editor for dark. Editor
|
||||
* height is per-instance via the --rich-min-height custom prop set
|
||||
* by the ui::rich_editor macro.
|
||||
* ============================================================ */
|
||||
.rich-editor .ql-editor {
|
||||
min-height: var(--rich-min-height, 12rem);
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.ql-editor.ql-blank::before { font-style: normal; }
|
||||
|
||||
[data-theme="dark"] .rich-editor { background: var(--color-surface-dark-alt); }
|
||||
[data-theme="dark"] .ql-toolbar.ql-snow,
|
||||
[data-theme="dark"] .ql-container.ql-snow { border-color: var(--color-outline-dark); }
|
||||
[data-theme="dark"] .ql-toolbar.ql-snow { background: var(--color-surface-dark); }
|
||||
[data-theme="dark"] .ql-container.ql-snow { color: var(--color-on-surface-dark); }
|
||||
[data-theme="dark"] .ql-snow .ql-stroke,
|
||||
[data-theme="dark"] .ql-snow .ql-stroke-miter { stroke: var(--color-on-surface-dark); }
|
||||
[data-theme="dark"] .ql-snow .ql-fill,
|
||||
[data-theme="dark"] .ql-snow .ql-stroke.ql-fill { fill: var(--color-on-surface-dark); }
|
||||
[data-theme="dark"] .ql-snow .ql-picker { color: var(--color-on-surface-dark); }
|
||||
[data-theme="dark"] .ql-snow .ql-picker-options {
|
||||
background: var(--color-surface-dark);
|
||||
border-color: var(--color-outline-dark);
|
||||
}
|
||||
/* active / hover toolbar state -> primary accent */
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button:hover,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label:hover,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label.ql-active,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-item:hover,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-item.ql-selected { color: var(--color-primary-dark); }
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button:hover .ql-stroke,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active .ql-stroke,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke { stroke: var(--color-primary-dark); }
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button:hover .ql-fill,
|
||||
[data-theme="dark"] .ql-snow.ql-toolbar button.ql-active .ql-fill { fill: var(--color-primary-dark); }
|
||||
[data-theme="dark"] .ql-snow .ql-tooltip {
|
||||
background-color: var(--color-surface-dark);
|
||||
border-color: var(--color-outline-dark);
|
||||
color: var(--color-on-surface-dark);
|
||||
box-shadow: 0 2px 8px rgb(0 0 0 / 0.45);
|
||||
}
|
||||
[data-theme="dark"] .ql-snow .ql-tooltip input[type=text] {
|
||||
background: var(--color-surface-dark-alt);
|
||||
border-color: var(--color-outline-dark);
|
||||
color: var(--color-on-surface-dark);
|
||||
}
|
||||
[data-theme="dark"] .ql-snow .ql-editor a,
|
||||
[data-theme="dark"] .ql-snow .ql-tooltip a { color: var(--color-primary-dark); }
|
||||
|
||||
/* Image size controls under the editor. */
|
||||
.rich-image-size-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
|
||||
.rich-image-size-controls.hidden { display: none; }
|
||||
.rich-image-size-controls button {
|
||||
border: 1px solid var(--color-outline);
|
||||
border-radius: var(--radius-radius);
|
||||
padding: 0.3rem 0.65rem;
|
||||
line-height: 1;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
.rich-image-size-controls button:hover { border-color: var(--color-primary); color: var(--color-primary); }
|
||||
[data-theme="dark"] .rich-image-size-controls button { border-color: var(--color-outline-dark); }
|
||||
[data-theme="dark"] .rich-image-size-controls button:hover {
|
||||
border-color: var(--color-primary-dark);
|
||||
color: var(--color-primary-dark);
|
||||
}
|
||||
|
||||
/* Image sizing classes shared by the editor and rendered output. */
|
||||
.rich-editor img, .rich-content img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
margin: 1rem auto;
|
||||
border-radius: var(--radius-radius);
|
||||
}
|
||||
.rich-editor img { cursor: pointer; }
|
||||
.rich-image-small { width: min(100%, 18rem); }
|
||||
.rich-image-medium { width: min(100%, 34rem); }
|
||||
.rich-image-full { width: 100%; }
|
||||
|
||||
/* === Rendered rich content (storefront product description) =
|
||||
* Inherits text color from context so it works in both themes;
|
||||
* only structural spacing + link/heading treatment is set here. */
|
||||
.rich-content { line-height: 1.7; }
|
||||
.rich-content h2 { margin: 1.25rem 0 0.6rem; font-size: 1.3rem; font-weight: 700; }
|
||||
.rich-content h3 { margin: 1rem 0 0.5rem; font-size: 1.1rem; font-weight: 700; }
|
||||
.rich-content p, .rich-content ul, .rich-content ol { margin: 0.6rem 0; }
|
||||
.rich-content ul { list-style: disc; padding-left: 1.4rem; }
|
||||
.rich-content ol { list-style: decimal; padding-left: 1.4rem; }
|
||||
.rich-content a { color: var(--color-primary); text-decoration: underline; }
|
||||
[data-theme="dark"] .rich-content a { color: var(--color-primary-dark); }
|
||||
.rich-content :first-child { margin-top: 0; }
|
||||
.rich-content :last-child { margin-bottom: 0; }
|
||||
|
||||
/* Compact rich blurb for product cards: neutralize block spacing so the
|
||||
* line-clamp truncation stays tidy regardless of the authored markup. */
|
||||
.rich-blurb :where(p, ul, ol, h2, h3) { margin: 0; }
|
||||
.rich-blurb :where(ul, ol) { padding-left: 1.1rem; }
|
||||
|
||||
@@ -171,6 +171,8 @@ artist = Artist
|
||||
release-date = Release date
|
||||
cover-image = Cover image
|
||||
description = Description
|
||||
short-description = Short description
|
||||
short-description-hint = Shown on product cards. Keep it short.
|
||||
songs-in-album = Songs in this album
|
||||
admin-new-album-desc = Fill in the details, then tick the songs to include.
|
||||
cover-help = Optional - png, jpg, webp or gif; shown on the album page.
|
||||
@@ -308,7 +310,29 @@ shop-title = Shop
|
||||
shop-subtitle = browse our products.
|
||||
shop-empty = There are no products here yet.
|
||||
search-placeholder = Search products…
|
||||
order-search-placeholder = Search orders…
|
||||
search-empty = Nothing matched your search:
|
||||
results-count = { $count } products
|
||||
sort-label = Sort
|
||||
sort-relevance = Relevance
|
||||
sort-newest = Newest
|
||||
sort-price_asc = Price: low to high
|
||||
sort-price_desc = Price: high to low
|
||||
sort-name_asc = Name: A–Z
|
||||
sort-name_desc = Name: Z–A
|
||||
filter-category = Category
|
||||
filter-all-categories = All categories
|
||||
filter-uncategorized = Uncategorized
|
||||
filter-price = Price
|
||||
filter-price-from = Price from
|
||||
filter-price-to = Price to
|
||||
filter-in-stock = In stock only
|
||||
filter-apply = Apply
|
||||
filter-clear = Clear
|
||||
pagination = Pagination
|
||||
page-of = Page { $page } of { $pages }
|
||||
prev = Previous
|
||||
next = Next
|
||||
view-grid = Grid view
|
||||
view-list = List view
|
||||
categories = Categories
|
||||
|
||||
@@ -171,6 +171,8 @@ artist = Interpret
|
||||
release-date = Dátum vydania
|
||||
cover-image = Obrázok obalu
|
||||
description = Popis
|
||||
short-description = Krátky popis
|
||||
short-description-hint = Zobrazuje sa na kartách produktov. Najlepšie krátke.
|
||||
songs-in-album = Skladby v albume
|
||||
admin-new-album-desc = Vyplň údaje a potom označ skladby, ktoré chceš zahrnúť.
|
||||
cover-help = Voliteľné - png, jpg, webp alebo gif; zobrazí sa na stránke albumu.
|
||||
@@ -308,7 +310,29 @@ shop-title = Obchod
|
||||
shop-subtitle = prezrite si našu ponuku produktov.
|
||||
shop-empty = Zatiaľ tu nie sú žiadne produkty.
|
||||
search-placeholder = Hľadať produkty…
|
||||
order-search-placeholder = Hľadať objednávky…
|
||||
search-empty = Pre váš výraz sme nič nenašli:
|
||||
results-count = { $count } produktov
|
||||
sort-label = Zoradiť
|
||||
sort-relevance = Relevancia
|
||||
sort-newest = Najnovšie
|
||||
sort-price_asc = Cena: od najnižšej
|
||||
sort-price_desc = Cena: od najvyššej
|
||||
sort-name_asc = Názov: A–Z
|
||||
sort-name_desc = Názov: Z–A
|
||||
filter-category = Kategória
|
||||
filter-all-categories = Všetky kategórie
|
||||
filter-uncategorized = Bez kategórie
|
||||
filter-price = Cena
|
||||
filter-price-from = Cena od
|
||||
filter-price-to = Cena do
|
||||
filter-in-stock = Len skladom
|
||||
filter-apply = Použiť
|
||||
filter-clear = Zrušiť
|
||||
pagination = Stránkovanie
|
||||
page-of = Strana { $page } z { $pages }
|
||||
prev = Predchádzajúce
|
||||
next = Ďalšie
|
||||
view-grid = Zobrazenie v mriežke
|
||||
view-list = Zobrazenie v zozname
|
||||
categories = Kategórie
|
||||
|
||||
File diff suppressed because one or more lines are too long
174
assets/static/js/rich-editor.js
Normal file
174
assets/static/js/rich-editor.js
Normal file
@@ -0,0 +1,174 @@
|
||||
// Quill-based rich text editor, ported from the universal_web blog editor and
|
||||
// adapted to this shop: each editor lives in a `[data-rich-field]` wrapper so a
|
||||
// single form can host several (e.g. short + long description); image uploads go
|
||||
// to this app's /images/upload and carry the CSRF token the middleware expects.
|
||||
(function () {
|
||||
function setImageSize(image, size) {
|
||||
image.classList.remove('rich-image-small', 'rich-image-medium', 'rich-image-full');
|
||||
image.style.removeProperty('width');
|
||||
image.style.removeProperty('height');
|
||||
image.classList.add('rich-image-' + size);
|
||||
}
|
||||
|
||||
function setImageWidth(image, width) {
|
||||
var px = parseInt(width, 10);
|
||||
if (!Number.isFinite(px) || px < 40) return;
|
||||
image.classList.remove('rich-image-small', 'rich-image-medium', 'rich-image-full');
|
||||
image.style.width = Math.min(px, 1200) + 'px';
|
||||
image.style.height = 'auto';
|
||||
}
|
||||
|
||||
function normalizeEditorImages(root) {
|
||||
root.querySelectorAll('img').forEach(function (image) {
|
||||
if (
|
||||
!image.classList.contains('rich-image-small')
|
||||
&& !image.classList.contains('rich-image-medium')
|
||||
&& !image.classList.contains('rich-image-full')
|
||||
) {
|
||||
image.classList.add('rich-image-full');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// The CSRF middleware accepts the token as an X-CSRF-Token header; read it from
|
||||
// the form's hidden _csrf field (rendered by ui::csrf_field()).
|
||||
function csrfToken(field) {
|
||||
var form = field.closest('form');
|
||||
var input = form && form.querySelector('input[name="_csrf"]');
|
||||
return input ? input.value : '';
|
||||
}
|
||||
|
||||
function initField(field) {
|
||||
var editorEl = field.querySelector('[data-rich-editor]');
|
||||
var contentInput = field.querySelector('[data-rich-content]');
|
||||
var status = field.querySelector('[data-rich-status]');
|
||||
var imageControls = field.querySelector('[data-image-size-controls]');
|
||||
var imageWidthInput = field.querySelector('[data-image-width]');
|
||||
if (!editorEl || !contentInput || !window.Quill) return;
|
||||
|
||||
var selectedImage = null;
|
||||
var toolbar = [
|
||||
[{ header: [2, 3, false] }],
|
||||
['bold', 'italic'],
|
||||
[{ list: 'ordered' }, { list: 'bullet' }],
|
||||
['link', 'image'],
|
||||
['clean']
|
||||
];
|
||||
var editor = new Quill(editorEl, {
|
||||
modules: { toolbar: toolbar },
|
||||
placeholder: editorEl.dataset.placeholder || '',
|
||||
theme: 'snow'
|
||||
});
|
||||
|
||||
var initialContent = contentInput.value.trim();
|
||||
if (initialContent) {
|
||||
if (initialContent.indexOf('<') >= 0) editor.clipboard.dangerouslyPasteHTML(initialContent);
|
||||
else editor.setText(initialContent);
|
||||
normalizeEditorImages(editor.root);
|
||||
}
|
||||
|
||||
function syncContent() {
|
||||
normalizeEditorImages(editor.root);
|
||||
// Quill leaves an empty editor as "<p><br></p>"; store empty instead so the
|
||||
// server sees a blank (nullable) value rather than stray markup.
|
||||
var html = editor.root.innerHTML;
|
||||
contentInput.value = editor.getText().trim() === '' && !editor.root.querySelector('img')
|
||||
? ''
|
||||
: html;
|
||||
}
|
||||
|
||||
function setStatus(message) {
|
||||
if (status) status.textContent = message || '';
|
||||
}
|
||||
|
||||
function chooseImageFile() {
|
||||
var input = document.createElement('input');
|
||||
input.type = 'file';
|
||||
input.accept = 'image/jpeg,image/png,image/webp,image/gif';
|
||||
input.addEventListener('change', function () {
|
||||
var file = input.files && input.files[0];
|
||||
if (!file) return;
|
||||
uploadImage(file);
|
||||
});
|
||||
input.click();
|
||||
}
|
||||
|
||||
async function uploadImage(file) {
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
setStatus(status ? status.dataset.uploading : '');
|
||||
try {
|
||||
var response = await fetch('/images/upload', {
|
||||
method: 'POST',
|
||||
body: formData,
|
||||
credentials: 'same-origin',
|
||||
headers: { 'X-CSRF-Token': csrfToken(field) }
|
||||
});
|
||||
if (!response.ok) throw new Error('upload failed');
|
||||
var result = await response.json();
|
||||
var range = editor.getSelection(true);
|
||||
editor.insertEmbed(range.index, 'image', result.url, 'user');
|
||||
editor.setSelection(range.index + 1, 0, 'silent');
|
||||
window.setTimeout(function () {
|
||||
var images = editor.root.querySelectorAll('img');
|
||||
var image = images[images.length - 1];
|
||||
if (image) {
|
||||
setImageSize(image, 'full');
|
||||
selectedImage = image;
|
||||
if (imageControls) imageControls.classList.remove('hidden');
|
||||
}
|
||||
syncContent();
|
||||
}, 0);
|
||||
setStatus(status ? status.dataset.uploaded : '');
|
||||
} catch (_error) {
|
||||
setStatus(status ? status.dataset.error : '');
|
||||
}
|
||||
}
|
||||
|
||||
editor.getModule('toolbar').addHandler('image', chooseImageFile);
|
||||
|
||||
editor.root.addEventListener('click', function (event) {
|
||||
if (event.target && event.target.tagName === 'IMG') {
|
||||
selectedImage = event.target;
|
||||
if (imageWidthInput) imageWidthInput.value = parseInt(selectedImage.style.width, 10) || '';
|
||||
if (imageControls) imageControls.classList.remove('hidden');
|
||||
}
|
||||
});
|
||||
|
||||
if (imageControls) {
|
||||
imageControls.addEventListener('click', function (event) {
|
||||
var button = event.target.closest('[data-image-size]');
|
||||
if (button && selectedImage) {
|
||||
setImageSize(selectedImage, button.dataset.imageSize);
|
||||
if (imageWidthInput) imageWidthInput.value = '';
|
||||
syncContent();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (imageWidthInput) {
|
||||
imageWidthInput.addEventListener('change', function () {
|
||||
if (!selectedImage) return;
|
||||
setImageWidth(selectedImage, imageWidthInput.value);
|
||||
syncContent();
|
||||
});
|
||||
}
|
||||
|
||||
editor.on('text-change', syncContent);
|
||||
var form = field.closest('form');
|
||||
if (form) form.addEventListener('submit', syncContent);
|
||||
syncContent();
|
||||
}
|
||||
|
||||
function initAll(root) {
|
||||
(root || document).querySelectorAll('[data-rich-field]').forEach(function (field) {
|
||||
if (field.dataset.richReady) return;
|
||||
field.dataset.richReady = '1';
|
||||
initField(field);
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () { initAll(document); });
|
||||
// Re-init after htmx swaps a fragment containing an editor into the page.
|
||||
document.addEventListener('htmx:afterSwap', function (event) { initAll(event.target); });
|
||||
})();
|
||||
31
assets/static/vendor/quill/LICENSE
vendored
Normal file
31
assets/static/vendor/quill/LICENSE
vendored
Normal file
@@ -0,0 +1,31 @@
|
||||
Copyright (c) 2017-2024, Slab
|
||||
Copyright (c) 2014, Jason Chen
|
||||
Copyright (c) 2013, salesforce.com
|
||||
All rights reserved.
|
||||
|
||||
Redistribution and use in source and binary forms, with or without
|
||||
modification, are permitted provided that the following conditions
|
||||
are met:
|
||||
|
||||
1. Redistributions of source code must retain the above copyright
|
||||
notice, this list of conditions and the following disclaimer.
|
||||
|
||||
2. Redistributions in binary form must reproduce the above copyright
|
||||
notice, this list of conditions and the following disclaimer in the
|
||||
documentation and/or other materials provided with the distribution.
|
||||
|
||||
3. Neither the name of the copyright holder nor the names of its
|
||||
contributors may be used to endorse or promote products derived from
|
||||
this software without specific prior written permission.
|
||||
|
||||
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS
|
||||
IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED
|
||||
TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
|
||||
PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||
3
assets/static/vendor/quill/quill.js
vendored
Normal file
3
assets/static/vendor/quill/quill.js
vendored
Normal file
File diff suppressed because one or more lines are too long
7
assets/static/vendor/quill/quill.js.LICENSE.txt
vendored
Normal file
7
assets/static/vendor/quill/quill.js.LICENSE.txt
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* Quill Editor v2.0.3
|
||||
* https://quilljs.com
|
||||
* Copyright (c) 2017-2024, Slab
|
||||
* Copyright (c) 2014, Jason Chen
|
||||
* Copyright (c) 2013, salesforce.com
|
||||
*/
|
||||
10
assets/static/vendor/quill/quill.snow.css
vendored
Normal file
10
assets/static/vendor/quill/quill.snow.css
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -15,82 +15,80 @@
|
||||
{{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/products?audience=" ~ audience, size="px-3 py-2 text-sm") }}
|
||||
</div>
|
||||
|
||||
{# One discount row per option (variant). Each row picks a fixed sale price or a #}
|
||||
{# percentage off its own regular price; a blank input clears that option's #}
|
||||
{# discount. Both the fixed and percent inputs always submit (the server reads the #}
|
||||
{# active mode); rows are pre-filled from `rows` (DB values, or submitted values #}
|
||||
{# when repainting after a validation error) and indexed as v[<variant id>][...]. #}
|
||||
<script id="discount-data" type="application/json">{{ rows | json_encode() | safe }}</script>
|
||||
|
||||
<form method="post" action="/admin/catalog/products/{{ product.id }}/discount?audience={{ audience }}"
|
||||
x-data="{
|
||||
mode: '{{ mode }}',
|
||||
fixed: '{{ fixed }}',
|
||||
percent: '{{ percent }}',
|
||||
regular: {{ product.regular_cents }},
|
||||
num(v) { let n = parseFloat(String(v).replace(',', '.')); return isFinite(n) ? n : null; },
|
||||
get afterCents() {
|
||||
if (this.mode === 'percent') {
|
||||
let p = this.num(this.percent); if (p === null) return null;
|
||||
return this.regular - Math.round(this.regular * p / 100);
|
||||
}
|
||||
let f = this.num(this.fixed); if (f === null) return null;
|
||||
return Math.round(f * 100);
|
||||
},
|
||||
money(c) { return (c / 100).toFixed(2); },
|
||||
get valid() { let a = this.afterCents; return a !== null && a > 0 && a < this.regular; },
|
||||
get percentOff() { let a = this.afterCents; return (a === null || this.regular <= 0) ? null : Math.round((this.regular - a) / this.regular * 100); }
|
||||
}"
|
||||
class="mt-6 max-w-md space-y-5 rounded-radius border border-outline bg-surface p-6 dark:border-outline-dark dark:bg-surface-dark-alt">
|
||||
x-data="discountEditor(JSON.parse(document.getElementById('discount-data').textContent))"
|
||||
class="mt-6 max-w-2xl space-y-5">
|
||||
{{ ui::csrf_field() }}
|
||||
|
||||
{% if error %}
|
||||
{{ ui::alert_danger(message=t(key=error, lang=lang | default(value='sk'))) }}
|
||||
{% endif %}
|
||||
|
||||
<div class="flex items-center justify-between gap-3 rounded-radius bg-surface-alt px-4 py-3 dark:bg-surface-dark/40">
|
||||
<span class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="price", lang=lang | default(value='sk')) }}</span>
|
||||
<span class="font-semibold tabular-nums text-on-surface-strong dark:text-on-surface-dark-strong">{{ product.regular_price }} {{ product.currency }}</span>
|
||||
<template x-for="row in rows" :key="row.id">
|
||||
<div class="space-y-4 rounded-radius border border-outline bg-surface p-5 dark:border-outline-dark dark:bg-surface-dark-alt">
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
<span class="font-semibold text-on-surface-strong dark:text-on-surface-dark-strong"
|
||||
x-text="row.label || ('#' + row.id)"></span>
|
||||
<span class="text-sm tabular-nums text-on-surface/70 dark:text-on-surface-dark/70">
|
||||
{{ t(key="price", lang=lang | default(value='sk')) }}:
|
||||
<span x-text="row.regular_price"></span> <span x-text="row.currency"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<input type="hidden" :name="`v[${row.id}][mode]`" :value="row.mode">
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2">
|
||||
<!-- mode toggle -->
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
|
||||
:class="mode === 'fixed' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
|
||||
<input type="radio" name="mode" value="fixed" x-model="mode" class="sr-only">
|
||||
:class="row.mode === 'fixed' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
|
||||
<input type="radio" :name="`mode-ui-${row.id}`" value="fixed" x-model="row.mode" class="sr-only">
|
||||
{{ t(key="discount-mode-fixed", lang=lang | default(value='sk')) }}
|
||||
</label>
|
||||
<label class="flex cursor-pointer items-center justify-center gap-2 rounded-radius border px-3 py-2 text-sm transition"
|
||||
:class="mode === 'percent' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
|
||||
<input type="radio" name="mode" value="percent" x-model="mode" class="sr-only">
|
||||
:class="row.mode === 'percent' ? 'border-primary bg-primary/10 text-on-surface-strong dark:border-primary-dark dark:bg-primary-dark/10 dark:text-on-surface-dark-strong' : 'border-outline text-on-surface dark:border-outline-dark dark:text-on-surface-dark'">
|
||||
<input type="radio" :name="`mode-ui-${row.id}`" value="percent" x-model="row.mode" class="sr-only">
|
||||
{{ t(key="discount-mode-percent", lang=lang | default(value='sk')) }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- fixed price input -->
|
||||
<div class="space-y-1.5" x-show="mode === 'fixed'">
|
||||
<label for="sale_price" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="sale-price", lang=lang | default(value='sk')) }}</label>
|
||||
{{ ui::input(name="sale_price", id="sale_price", value=fixed, placeholder="0.00", attrs='inputmode="decimal" x-model="fixed"') }}
|
||||
<!-- value input: both fields stay in the DOM and submit; the server reads
|
||||
whichever matches the row's mode -->
|
||||
<div class="space-y-1.5">
|
||||
<div x-show="row.mode === 'fixed'">
|
||||
<label class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="sale-price", lang=lang | default(value='sk')) }}</label>
|
||||
<input :name="`v[${row.id}][fixed]`" x-model="row.fixed" inputmode="decimal" placeholder="0.00"
|
||||
class="w-full rounded-radius border border-outline bg-surface-alt px-4 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark">
|
||||
</div>
|
||||
<div x-show="row.mode === 'percent'">
|
||||
<label class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="discount-percent", lang=lang | default(value='sk')) }}</label>
|
||||
<input :name="`v[${row.id}][percent]`" x-model="row.percent" inputmode="decimal" min="0" max="100" placeholder="0"
|
||||
class="w-full rounded-radius border border-outline bg-surface-alt px-4 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- percentage input -->
|
||||
<div class="space-y-1.5" x-show="mode === 'percent'">
|
||||
<label for="percent" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="discount-percent", lang=lang | default(value='sk')) }}</label>
|
||||
{{ ui::input(name="percent", id="percent", value=percent, placeholder="0", attrs='inputmode="decimal" min="0" max="100" x-model="percent"') }}
|
||||
</div>
|
||||
|
||||
<!-- live preview -->
|
||||
<div x-show="afterCents !== null" x-cloak
|
||||
class="space-y-2 rounded-radius border border-outline bg-surface-alt px-4 py-3 dark:border-outline-dark dark:bg-surface-dark/40">
|
||||
<div class="flex items-center justify-between gap-3 text-sm">
|
||||
<span class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-before", lang=lang | default(value='sk')) }}</span>
|
||||
<span class="tabular-nums text-on-surface/60 line-through dark:text-on-surface-dark/60"><span x-text="money(regular)"></span> {{ product.currency }}</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
<span class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-after", lang=lang | default(value='sk')) }}</span>
|
||||
<span class="text-lg font-semibold tabular-nums" :class="valid ? 'text-danger' : 'text-on-surface/40 dark:text-on-surface-dark/40'">
|
||||
<span x-text="money(afterCents)"></span> {{ product.currency }}
|
||||
<div x-show="afterCents(row) !== null" x-cloak
|
||||
class="flex flex-wrap items-center justify-between gap-3 rounded-radius border border-outline bg-surface-alt px-4 py-2.5 text-sm dark:border-outline-dark dark:bg-surface-dark/40">
|
||||
<span class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="discount-preview-after", lang=lang | default(value='sk')) }}</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<span class="tabular-nums text-on-surface/50 line-through dark:text-on-surface-dark/50" x-text="money(row.regular_cents) + ' ' + row.currency"></span>
|
||||
<span class="text-base font-semibold tabular-nums" :class="valid(row) ? 'text-danger' : 'text-on-surface/40 dark:text-on-surface-dark/40'"
|
||||
x-text="money(afterCents(row)) + ' ' + row.currency"></span>
|
||||
<span x-show="valid(row)" class="text-xs text-on-surface/60 dark:text-on-surface-dark/60" x-text="'(−' + percentOff(row) + '%)'"></span>
|
||||
</span>
|
||||
</div>
|
||||
<div x-show="valid" class="flex items-center justify-between gap-3 text-xs text-on-surface/60 dark:text-on-surface-dark/60">
|
||||
<span>{{ t(key="discount-preview-save", lang=lang | default(value='sk')) }}</span>
|
||||
<span class="tabular-nums"><span x-text="money(regular - afterCents)"></span> {{ product.currency }} (−<span x-text="percentOff"></span>%)</span>
|
||||
</div>
|
||||
<p x-show="!valid" class="text-xs text-danger">{{ t(key="discount-below-regular", lang=lang | default(value='sk')) }}</p>
|
||||
<p x-show="afterCents(row) !== null && !valid(row)" class="text-xs text-danger">{{ t(key="discount-below-regular", lang=lang | default(value='sk')) }}</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="flex flex-wrap gap-3 pt-2">
|
||||
{{ ui::button(label=t(key="save", lang=lang | default(value='sk')), type="submit", attrs=`onclick="return confirm('` ~ t(key="discount-apply-confirm", lang=lang | default(value='sk')) ~ `')"`) }}
|
||||
@@ -99,4 +97,36 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<script>
|
||||
function discountEditor(initial) {
|
||||
return {
|
||||
rows: (initial || []).map(r => ({
|
||||
id: r.id,
|
||||
label: r.label || '',
|
||||
regular_cents: r.regular_cents,
|
||||
regular_price: r.regular_price,
|
||||
currency: r.currency,
|
||||
mode: r.mode || 'fixed',
|
||||
fixed: r.fixed || '',
|
||||
percent: r.percent || '',
|
||||
})),
|
||||
num(v) { let n = parseFloat(String(v).replace(',', '.')); return isFinite(n) ? n : null; },
|
||||
money(c) { return (c / 100).toFixed(2); },
|
||||
afterCents(row) {
|
||||
if (row.mode === 'percent') {
|
||||
let p = this.num(row.percent); if (p === null) return null;
|
||||
return row.regular_cents - Math.round(row.regular_cents * p / 100);
|
||||
}
|
||||
let f = this.num(row.fixed); if (f === null) return null;
|
||||
return Math.round(f * 100);
|
||||
},
|
||||
valid(row) { let a = this.afterCents(row); return a !== null && a > 0 && a < row.regular_cents; },
|
||||
percentOff(row) {
|
||||
let a = this.afterCents(row);
|
||||
return (a === null || row.regular_cents <= 0) ? null : Math.round((row.regular_cents - a) / row.regular_cents * 100);
|
||||
},
|
||||
};
|
||||
}
|
||||
</script>
|
||||
{% endblock content %}
|
||||
|
||||
@@ -3,6 +3,9 @@
|
||||
|
||||
{% block title %}{% if product %}{{ t(key="edit-product", lang=lang | default(value='sk')) }}{% else %}{{ t(key="new-product", lang=lang | default(value='sk')) }}{% endif %}{% endblock title %}
|
||||
{% block crumb %}{{ t(key="admin-products", lang=lang | default(value='sk')) }}{% endblock crumb %}
|
||||
{% block head %}
|
||||
<link href="/static/vendor/quill/quill.snow.css" rel="stylesheet" type="text/css">
|
||||
{% endblock head %}
|
||||
|
||||
{% block content %}
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
@@ -18,9 +21,9 @@
|
||||
{{ ui::csrf_field() }}
|
||||
|
||||
{% if product %}
|
||||
{% set v_name = product.name %}{% set v_currency = product.currency %}{% set v_desc = product.description | default(value="") %}{% set v_pub = product.published %}
|
||||
{% set v_name = product.name %}{% set v_currency = product.currency %}{% set v_desc = product.description | default(value="") %}{% set v_short = product.short_description | default(value="") %}{% set v_pub = product.published %}
|
||||
{% else %}
|
||||
{% set v_name = "" %}{% set v_currency = "EUR" %}{% set v_desc = "" %}{% set v_pub = false %}
|
||||
{% set v_name = "" %}{% set v_currency = "EUR" %}{% set v_desc = "" %}{% set v_short = "" %}{% set v_pub = false %}
|
||||
{% endif %}
|
||||
{% set inp = "w-full rounded-radius border border-outline bg-surface-alt px-3 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark" %}
|
||||
{% set sublabel = "text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70" %}
|
||||
@@ -60,7 +63,7 @@
|
||||
{# items-end bottom-aligns every input regardless of how many lines each
|
||||
label takes, so the row stays aligned even with the "(optional)" notes. #}
|
||||
<div class="grid flex-1 grid-cols-2 gap-3 sm:grid-cols-12 sm:items-end">
|
||||
<div class="space-y-1 col-span-2 sm:col-span-4">
|
||||
<div class="space-y-1 col-span-2 sm:col-span-6">
|
||||
<label class="{{ sublabel }} block truncate">{{ t(key="option-label", lang=lang | default(value='sk')) }}{{ opt }}</label>
|
||||
<input :name="`variants[${i}][label]`" x-model="row.label" class="{{ inp }}" placeholder="napr. 10cm x 13cm">
|
||||
</div>
|
||||
@@ -76,10 +79,6 @@
|
||||
<label class="{{ sublabel }} block truncate">{{ t(key="price", lang=lang | default(value='sk')) }}</label>
|
||||
<input :name="`variants[${i}][price]`" x-model="row.price" inputmode="decimal" required class="{{ inp }}" placeholder="0.00">
|
||||
</div>
|
||||
<div class="space-y-1 sm:col-span-2">
|
||||
<label class="{{ sublabel }} block truncate">{{ t(key="business-price", lang=lang | default(value='sk')) }}{{ opt }}</label>
|
||||
<input :name="`variants[${i}][business_sale]`" x-model="row.business_sale" inputmode="decimal" class="{{ inp }}" placeholder="—">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="button" @click="remove(i)"
|
||||
@@ -90,7 +89,7 @@
|
||||
|
||||
<script>
|
||||
function variantEditor(initial) {
|
||||
const blank = () => ({ id: '', label: '', sku: '', stock: '', price: '', business_sale: '' });
|
||||
const blank = () => ({ id: '', label: '', sku: '', stock: '', price: '' });
|
||||
return {
|
||||
rows: (initial || []).map(r => ({
|
||||
id: r.id || '',
|
||||
@@ -98,7 +97,6 @@
|
||||
sku: r.sku || '',
|
||||
stock: (r.stock === null || r.stock === undefined) ? '' : r.stock,
|
||||
price: r.price || '',
|
||||
business_sale: r.business_sale || '',
|
||||
})),
|
||||
init() { if (this.rows.length === 0) this.add(); },
|
||||
add() { this.rows.push(blank()); },
|
||||
@@ -122,8 +120,14 @@
|
||||
</div>
|
||||
|
||||
<div class="space-y-1.5">
|
||||
<label for="description" class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="description", lang=lang | default(value='sk')) }}</label>
|
||||
{{ ui::textarea(name="description", id="description", rows="5", value=v_desc) }}
|
||||
<span class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="short-description", lang=lang | default(value='sk')) }}</span>
|
||||
<p class="{{ sublabel }}">{{ t(key="short-description-hint", lang=lang | default(value='sk')) }}</p>
|
||||
{{ ui::rich_editor(name="short_description", lang=lang | default(value='sk'), value=v_short, min_height="6rem") }}
|
||||
</div>
|
||||
|
||||
<div class="space-y-1.5">
|
||||
<span class="text-sm font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="description", lang=lang | default(value='sk')) }}</span>
|
||||
{{ ui::rich_editor(name="description", lang=lang | default(value='sk'), value=v_desc, min_height="16rem") }}
|
||||
</div>
|
||||
|
||||
{# --- Images gallery ------------------------------------------------------- #}
|
||||
@@ -215,4 +219,6 @@
|
||||
{{ ui::button(variant="outline-secondary", label=t(key="cancel", lang=lang | default(value='sk')), href="/admin/catalog/products") }}
|
||||
</div>
|
||||
</form>
|
||||
<script src="/static/vendor/quill/quill.js"></script>
|
||||
<script src="/static/js/rich-editor.js"></script>
|
||||
{% endblock content %}
|
||||
|
||||
@@ -7,6 +7,8 @@
|
||||
|
||||
{% block content %}
|
||||
{% set business = audience == "business" %}
|
||||
{% set L = lang | default(value='sk') %}
|
||||
{% set q_enc = query | default(value='') | urlencode %}
|
||||
<div class="flex flex-wrap items-end justify-between gap-3">
|
||||
<div>
|
||||
<h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-products", lang=lang | default(value='sk')) }}</h1>
|
||||
@@ -15,20 +17,34 @@
|
||||
{{ ui::button(label=t(key="new-product", lang=lang | default(value='sk')), href="/admin/catalog/products/new") }}
|
||||
</div>
|
||||
|
||||
<!-- audience tabs -->
|
||||
<div class="mt-4 inline-flex rounded-radius border border-outline p-1 dark:border-outline-dark">
|
||||
<a href="/admin/catalog/products?audience=personal"
|
||||
<div class="mt-4 flex flex-wrap items-center justify-between gap-3">
|
||||
<!-- audience tabs -->
|
||||
<div class="inline-flex rounded-radius border border-outline p-1 dark:border-outline-dark">
|
||||
<a href="/admin/catalog/products?audience=personal&q={{ q_enc }}"
|
||||
class="rounded-radius px-4 py-1.5 text-sm font-medium {% if not business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
|
||||
{{ t(key="audience-personal", lang=lang | default(value='sk')) }}
|
||||
{{ t(key="audience-personal", lang=L) }}
|
||||
</a>
|
||||
<a href="/admin/catalog/products?audience=business"
|
||||
<a href="/admin/catalog/products?audience=business&q={{ q_enc }}"
|
||||
class="rounded-radius px-4 py-1.5 text-sm font-medium {% if business %}bg-primary/10 text-on-surface-strong dark:bg-primary-dark/10 dark:text-on-surface-dark-strong{% else %}text-on-surface/70 dark:text-on-surface-dark/70{% endif %}">
|
||||
{{ t(key="audience-business", lang=lang | default(value='sk')) }}
|
||||
{{ t(key="audience-business", lang=L) }}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- product search (drafts included); keeps the active audience + category -->
|
||||
<form method="get" action="/admin/catalog/products" role="search" class="relative w-full max-w-xs">
|
||||
<input type="hidden" name="audience" value="{{ audience }}">
|
||||
<input type="hidden" name="category" value="{{ selected_category }}">
|
||||
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
{{ ui::icon(name="search", size="size-5") }}
|
||||
</span>
|
||||
<input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
|
||||
placeholder="{{ t(key='search-placeholder', lang=L) }}" aria-label="{{ t(key='search-placeholder', lang=L) }}"
|
||||
class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% set category_base = "/admin/catalog/products" %}
|
||||
{% set category_suffix = "&audience=" ~ audience %}
|
||||
{% set category_suffix = "&audience=" ~ audience ~ "&q=" ~ q_enc %}
|
||||
<div class="mt-4 flex flex-col gap-6 md:flex-row md:items-start">
|
||||
{% include "admin/partials/category_filter.html" %}
|
||||
|
||||
@@ -122,6 +138,14 @@
|
||||
<td class="px-4 py-3">
|
||||
<div class="flex flex-wrap justify-end gap-2">
|
||||
{{ ui::button(variant="outline-secondary", label=t(key="edit", lang=lang | default(value='sk')), href="/admin/catalog/products/" ~ product.id ~ "/edit", size="px-3 py-1.5 text-xs") }}
|
||||
{{ ui::button(variant="outline-secondary", label=t(key="set-discount", lang=lang | default(value='sk')), href="/admin/catalog/products/" ~ product.id ~ "/discount/edit?audience=" ~ audience, size="px-3 py-1.5 text-xs") }}
|
||||
{% if product.on_sale %}
|
||||
<form method="post" action="/admin/catalog/products/{{ product.id }}/discount/remove?audience={{ audience }}"
|
||||
onsubmit="return confirm('{{ t(key="discount-remove-confirm", lang=lang | default(value='sk')) }}')">
|
||||
{{ ui::csrf_field() }}
|
||||
{{ ui::button(variant="outline-danger", label=t(key="remove-discount", lang=lang | default(value='sk')), type="submit", size="px-3 py-1.5 text-xs") }}
|
||||
</form>
|
||||
{% endif %}
|
||||
{{ ui::button(variant="outline-secondary", label=t(key="view", lang=lang | default(value='sk')), href="/shop/" ~ product.slug, size="px-3 py-1.5 text-xs") }}
|
||||
<form method="post" action="/admin/catalog/products/{{ product.id }}/delete"
|
||||
onsubmit="return confirm('{{ t(key="confirm-delete", lang=lang | default(value='sk')) }}')">
|
||||
|
||||
@@ -5,6 +5,8 @@
|
||||
{% block crumb %}{{ t(key="admin-customers", lang=lang | default(value='sk')) }}{% endblock crumb %}
|
||||
|
||||
{% block content %}
|
||||
{% set L = lang | default(value='sk') %}
|
||||
{% set q_enc = query | default(value='') | urlencode %}
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
<div>
|
||||
<h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ customer.name }}</h1>
|
||||
@@ -41,10 +43,23 @@
|
||||
{% endif %}
|
||||
</section>
|
||||
|
||||
<p class="mt-6 text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="negotiated-prices-hint", lang=lang | default(value='sk')) }}</p>
|
||||
<div class="mt-6 flex flex-wrap items-center justify-between gap-3">
|
||||
<p class="text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="negotiated-prices-hint", lang=L) }}</p>
|
||||
|
||||
<!-- product search (drafts included); keeps the active category -->
|
||||
<form method="get" action="/admin/customers/{{ customer.id }}" role="search" class="relative w-full max-w-xs">
|
||||
<input type="hidden" name="category" value="{{ selected_category }}">
|
||||
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
{{ ui::icon(name="search", size="size-5") }}
|
||||
</span>
|
||||
<input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
|
||||
placeholder="{{ t(key='search-placeholder', lang=L) }}" aria-label="{{ t(key='search-placeholder', lang=L) }}"
|
||||
class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% set category_base = "/admin/customers/" ~ customer.id %}
|
||||
{% set category_suffix = "" %}
|
||||
{% set category_suffix = "&q=" ~ q_enc %}
|
||||
<div class="mt-3 flex flex-col gap-6 md:flex-row md:items-start">
|
||||
{% include "admin/partials/category_filter.html" %}
|
||||
<div class="min-w-0 flex-1 {{ ui::table_wrap_cls() }}">
|
||||
|
||||
@@ -5,7 +5,24 @@
|
||||
{% block crumb %}{{ t(key="admin-orders", lang=lang | default(value='sk')) }}{% endblock crumb %}
|
||||
|
||||
{% block content %}
|
||||
<h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-orders", lang=lang | default(value='sk')) }}</h1>
|
||||
{% set L = lang | default(value='sk') %}
|
||||
<div class="flex flex-wrap items-center justify-between gap-3">
|
||||
<h1 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="admin-orders", lang=L) }}</h1>
|
||||
|
||||
<!-- order search: order number, customer, email, company, phone, tracking -->
|
||||
<form method="get" action="/admin/orders" role="search" class="relative w-full max-w-xs">
|
||||
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
{{ ui::icon(name="search", size="size-5") }}
|
||||
</span>
|
||||
<input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
|
||||
placeholder="{{ t(key='order-search-placeholder', lang=L) }}" aria-label="{{ t(key='order-search-placeholder', lang=L) }}"
|
||||
class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-3 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% if query and query != "" %}
|
||||
<p class="mt-2 text-sm text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="results-count", lang=L, count=total) }} · “{{ query }}”</p>
|
||||
{% endif %}
|
||||
|
||||
<div class="mt-6 {{ ui::table_wrap_cls() }}">
|
||||
{% if orders | length > 0 %}
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
<h2 class="text-2xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=lang | default(value='sk')) }}</h2>
|
||||
<a href="/shop" class="text-sm font-medium text-primary dark:text-primary-dark">{{ t(key="cart-continue", lang=lang | default(value='sk')) }} →</a>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-5 sm:grid-cols-3 lg:grid-cols-4">
|
||||
<div x-data="{ view: 'grid' }" class="grid grid-cols-2 gap-5 sm:grid-cols-3 lg:grid-cols-4">
|
||||
{% for product in products %}
|
||||
{% include "shop/_card.html" %}
|
||||
{% endfor %}
|
||||
|
||||
@@ -153,6 +153,34 @@
|
||||
<textarea {% if id %}id="{{ id }}" {% endif %}name="{{ name }}" rows="{{ rows }}"{% if placeholder %} placeholder="{{ placeholder }}"{% endif %}{% if required %} required{% endif %} class="w-full rounded-radius border border-outline bg-surface-alt px-2.5 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary disabled:cursor-not-allowed disabled:opacity-75 dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark {{ extra }}" {{ attrs | safe }}>{{ value }}</textarea>
|
||||
{%- endmacro textarea %}
|
||||
|
||||
{# Quill rich-text editor (see /static/js/rich-editor.js + /static/vendor/quill).
|
||||
The real value rides in a hidden <textarea> the editor keeps in sync, so it
|
||||
submits like any other field. `value` pre-fills (HTML or plain text). Several
|
||||
editors may share one form — each is scoped to its own [data-rich-field].
|
||||
Requires the page to load quill.js + quill.snow.css + rich-editor.js (the
|
||||
product form does so) and a _csrf field in the form for image uploads. #}
|
||||
{% macro rich_editor(name, lang, value="", placeholder="", min_height="12rem") -%}
|
||||
<div data-rich-field>
|
||||
<textarea name="{{ name }}" data-rich-content class="hidden">{{ value }}</textarea>
|
||||
<div data-rich-editor class="rich-editor" style="--rich-min-height: {{ min_height }};"{% if placeholder %} data-placeholder="{{ placeholder }}"{% endif %}></div>
|
||||
<div data-image-size-controls class="rich-image-size-controls mt-2 hidden">
|
||||
<span class="text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="image-size", lang=lang) }}</span>
|
||||
<button type="button" data-image-size="small">{{ t(key="image-size-small", lang=lang) }}</button>
|
||||
<button type="button" data-image-size="medium">{{ t(key="image-size-medium", lang=lang) }}</button>
|
||||
<button type="button" data-image-size="full">{{ t(key="image-size-full", lang=lang) }}</button>
|
||||
<label class="inline-flex items-center gap-1.5">
|
||||
<span class="text-xs text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="image-width-px", lang=lang) }}</span>
|
||||
<input type="number" min="40" max="1200" step="10" data-image-width
|
||||
class="w-20 rounded-radius border border-outline bg-surface-alt px-2 py-1 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark">
|
||||
</label>
|
||||
</div>
|
||||
<p class="mt-1 text-xs text-on-surface/60 dark:text-on-surface-dark/60" data-rich-status
|
||||
data-uploading="{{ t(key='image-uploading', lang=lang) }}"
|
||||
data-uploaded="{{ t(key='image-uploaded', lang=lang) }}"
|
||||
data-error="{{ t(key='image-upload-error', lang=lang) }}"></p>
|
||||
</div>
|
||||
{%- endmacro rich_editor %}
|
||||
|
||||
{# File input. #}
|
||||
{% macro file_input(name, id="", accept="", attrs="", extra="") -%}
|
||||
<input {% if id %}id="{{ id }}" {% endif %}name="{{ name }}" type="file"{% if accept %} accept="{{ accept }}"{% endif %} class="w-full overflow-clip rounded-radius border border-outline bg-surface-alt/50 text-sm text-on-surface file:mr-4 file:border-none file:bg-surface-alt file:px-4 file:py-2 file:font-medium file:text-on-surface-strong focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary disabled:cursor-not-allowed disabled:opacity-75 dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:file:bg-surface-dark-alt dark:file:text-on-surface-dark-strong dark:focus-visible:outline-primary-dark {{ extra }}" {{ attrs | safe }}/>
|
||||
|
||||
@@ -27,6 +27,15 @@
|
||||
:class="view === 'list' ? 'p-4 sm:p-5' : 'p-6 pb-2'">
|
||||
<!-- Header: Title & Price (stacked so neither overflows the narrow card) -->
|
||||
<h3 class="break-words text-lg font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ product.name }}</h3>
|
||||
{# Short blurb for the card; falls back to the full description (clamped)
|
||||
for products without a dedicated short one. Both are authored as rich
|
||||
text (Quill), so render the stored HTML — `.rich-blurb` strips block
|
||||
spacing so the line-clamp stays tidy. Overflow is truncated with an
|
||||
ellipsis: 2 lines in the grid, 3 in the roomier list row. #}
|
||||
{% if product.short_description or product.description %}
|
||||
<div class="rich-blurb line-clamp-2 break-words text-sm text-on-surface/70 dark:text-on-surface-dark/70"
|
||||
:class="view === 'list' && 'line-clamp-3'">{% if product.short_description %}{{ product.short_description | safe }}{% else %}{{ product.description | safe }}{% endif %}</div>
|
||||
{% endif %}
|
||||
{% if product.on_sale %}
|
||||
<div class="flex flex-wrap items-baseline gap-x-2 leading-tight">
|
||||
<span class="text-xl font-semibold text-danger"><span class="sr-only">Price</span>{% if product.has_options %}{{ t(key="from-price", price=product.price, lang=lang | default(value='sk')) }}{% else %}{{ product.price }}{% endif %} {{ product.currency }}</span>
|
||||
|
||||
@@ -1,13 +1,46 @@
|
||||
{# Search / listing results, swapped in by htmx on each query and rendered
|
||||
server-side on first load. Mirrors the empty-state handling of index.html. #}
|
||||
{% if products | length > 0 %}
|
||||
{% include "shop/_product_grid.html" %}
|
||||
{% elif query and query != "" %}
|
||||
<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
|
||||
{{ t(key="search-empty", lang=lang | default(value='sk')) }} <span class="font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ query }}</span>
|
||||
{# Results region: swapped in by htmx on each query/filter change and rendered
|
||||
server-side on first load. Holds the result summary, the product grid and
|
||||
pagination. #}
|
||||
{% set L = lang | default(value='sk') %}
|
||||
<div class="space-y-4">
|
||||
<p class="text-sm text-on-surface/70 dark:text-on-surface-dark/70" aria-live="polite">
|
||||
{{ t(key="results-count", lang=L, count=total) }}{% if query and query != "" %} · “{{ query }}”{% endif %}
|
||||
</p>
|
||||
|
||||
{% if products | length > 0 %}
|
||||
{% include "shop/_product_grid.html" %}
|
||||
|
||||
{% if pages > 1 %}
|
||||
<nav class="flex items-center justify-center gap-2 pt-2" aria-label="{{ t(key='pagination', lang=L) }}">
|
||||
{% if has_prev %}
|
||||
<button type="button"
|
||||
hx-get="/search?{% if query_base %}{{ query_base }}&{% endif %}page={{ prev_page }}"
|
||||
hx-target="#shop-results" hx-swap="innerHTML" hx-push-url="true"
|
||||
class="rounded-radius border border-outline px-3 py-1.5 text-sm font-medium text-on-surface transition hover:bg-primary/5 hover:text-primary dark:border-outline-dark dark:text-on-surface-dark dark:hover:text-primary-dark">
|
||||
{{ t(key="prev", lang=L) }}
|
||||
</button>
|
||||
{% endif %}
|
||||
<span class="px-2 text-sm text-on-surface/70 dark:text-on-surface-dark/70">
|
||||
{{ t(key="page-of", lang=L, page=page, pages=pages) }}
|
||||
</span>
|
||||
{% if has_next %}
|
||||
<button type="button"
|
||||
hx-get="/search?{% if query_base %}{{ query_base }}&{% endif %}page={{ next_page }}"
|
||||
hx-target="#shop-results" hx-swap="innerHTML" hx-push-url="true"
|
||||
class="rounded-radius border border-outline px-3 py-1.5 text-sm font-medium text-on-surface transition hover:bg-primary/5 hover:text-primary dark:border-outline-dark dark:text-on-surface-dark dark:hover:text-primary-dark">
|
||||
{{ t(key="next", lang=L) }}
|
||||
</button>
|
||||
{% endif %}
|
||||
</nav>
|
||||
{% endif %}
|
||||
|
||||
{% elif query and query != "" %}
|
||||
<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
|
||||
{{ t(key="search-empty", lang=L) }} <span class="font-medium text-on-surface-strong dark:text-on-surface-dark-strong">{{ query }}</span>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
|
||||
{{ t(key="shop-empty", lang=L) }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
|
||||
{{ t(key="shop-empty", lang=lang | default(value='sk')) }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
102
assets/views/shop/_search.html
Normal file
102
assets/views/shop/_search.html
Normal file
@@ -0,0 +1,102 @@
|
||||
{# Shared storefront search + filter toolbar and results region, used by the shop
|
||||
index and every category page. One form drives the whole listing: htmx re-runs
|
||||
/search and swaps only #shop-results; the toolbar keeps its own DOM state.
|
||||
Triggers: live (debounced) typing in the search box, immediate on any
|
||||
select/checkbox change, and submit (Enter / Apply) for the price band. Degrades
|
||||
to a plain GET form without JS.
|
||||
Expects: query, category_groups, selected_category, selected_category_id,
|
||||
uncategorized_count, sort, min_price, max_price, price_floor, price_ceil,
|
||||
in_stock, plus the result vars consumed by _results.html. #}
|
||||
{% set L = lang | default(value='sk') %}
|
||||
<div class="space-y-6">
|
||||
<form action="/search" method="get" role="search"
|
||||
hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML"
|
||||
hx-push-url="true" hx-indicator="#search-spinner"
|
||||
hx-trigger="submit, change, keyup changed delay:350ms from:input[name='q']"
|
||||
class="space-y-3">
|
||||
|
||||
<!-- search box -->
|
||||
<div class="relative max-w-xl">
|
||||
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
{{ ui::icon(name="search", size="size-5") }}
|
||||
</span>
|
||||
<input type="search" name="q" value="{{ query | default(value='') }}" autocomplete="off"
|
||||
placeholder="{{ t(key='search-placeholder', lang=L) }}"
|
||||
aria-label="{{ t(key='search-placeholder', lang=L) }}"
|
||||
class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-10 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark" />
|
||||
<span id="search-spinner" class="htmx-indicator pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
<svg class="size-4 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
||||
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8V0C5.4 0 0 5.4 0 12h4Z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- filter toolbar -->
|
||||
<div class="flex flex-wrap items-end gap-3 rounded-radius border border-outline bg-surface-alt p-3 dark:border-outline-dark dark:bg-surface-dark-alt">
|
||||
<!-- category -->
|
||||
<label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
|
||||
{{ t(key="filter-category", lang=L) }}
|
||||
<select name="category"
|
||||
class="rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark">
|
||||
<option value="all"{% if selected_category == "all" %} selected{% endif %}>{{ t(key="filter-all-categories", lang=L) }}</option>
|
||||
{% for g in category_groups %}
|
||||
<option value="{{ g.id }}"{% if selected_category_id == g.id %} selected{% endif %}>{{ g.name }} ({{ g.count }})</option>
|
||||
{% for ch in g.children %}
|
||||
<option value="{{ ch.id }}"{% if selected_category_id == ch.id %} selected{% endif %}> — {{ ch.name }} ({{ ch.count }})</option>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% if uncategorized_count > 0 %}
|
||||
<option value="none"{% if selected_category == "none" %} selected{% endif %}>{{ t(key="filter-uncategorized", lang=L) }} ({{ uncategorized_count }})</option>
|
||||
{% endif %}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<!-- sort -->
|
||||
<label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
|
||||
{{ t(key="sort-label", lang=L) }}
|
||||
<select name="sort"
|
||||
class="rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark">
|
||||
{% for opt in ["newest", "relevance", "price_asc", "price_desc", "name_asc", "name_desc"] %}
|
||||
<option value="{{ opt }}"{% if sort == opt %} selected{% endif %}>{{ t(key="sort-" ~ opt, lang=L) }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<!-- price band -->
|
||||
<label class="flex flex-col gap-1 text-xs font-medium text-on-surface/70 dark:text-on-surface-dark/70">
|
||||
{{ t(key="filter-price", lang=L) }}
|
||||
<span class="flex items-center gap-1">
|
||||
<input type="number" name="min_price" min="0" step="0.01" inputmode="decimal"
|
||||
value="{{ min_price | default(value='') }}" placeholder="{{ price_floor }}"
|
||||
aria-label="{{ t(key='filter-price-from', lang=L) }}"
|
||||
class="w-24 rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark" />
|
||||
<span class="text-on-surface/50 dark:text-on-surface-dark/50">–</span>
|
||||
<input type="number" name="max_price" min="0" step="0.01" inputmode="decimal"
|
||||
value="{{ max_price | default(value='') }}" placeholder="{{ price_ceil }}"
|
||||
aria-label="{{ t(key='filter-price-to', lang=L) }}"
|
||||
class="w-24 rounded-radius border border-outline bg-surface px-2 py-1.5 text-sm text-on-surface dark:border-outline-dark dark:bg-surface-dark dark:text-on-surface-dark" />
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<!-- in stock -->
|
||||
<label class="flex items-center gap-2 pb-1.5 text-sm text-on-surface dark:text-on-surface-dark">
|
||||
<input type="checkbox" name="in_stock" value="1"{% if in_stock %} checked{% endif %}
|
||||
class="size-4 rounded border-outline text-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:text-primary-dark" />
|
||||
{{ t(key="filter-in-stock", lang=L) }}
|
||||
</label>
|
||||
|
||||
<div class="ml-auto flex items-end gap-2">
|
||||
{{ ui::button(label=t(key="filter-apply", lang=L), type="submit", variant="secondary") }}
|
||||
<a href="/shop" hx-get="/search" hx-target="#shop-results" hx-push-url="true"
|
||||
class="self-end pb-1.5 text-sm font-medium text-on-surface/70 underline-offset-2 transition hover:text-primary hover:underline dark:text-on-surface-dark/70 dark:hover:text-primary-dark">
|
||||
{{ t(key="filter-clear", lang=L) }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="shop-results">
|
||||
{% include "shop/_results.html" %}
|
||||
</div>
|
||||
</div>
|
||||
@@ -4,10 +4,11 @@
|
||||
{% block title %}{{ category.name }}{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="space-y-8">
|
||||
{% set L = lang | default(value='sk') %}
|
||||
<div class="space-y-6">
|
||||
<header class="space-y-2">
|
||||
<nav class="text-sm text-on-surface/60 dark:text-on-surface-dark/60">
|
||||
<a href="/shop" class="hover:text-primary dark:hover:text-primary-dark">{{ t(key="nav-shop", lang=lang | default(value='sk')) }}</a>
|
||||
<a href="/shop" class="hover:text-primary dark:hover:text-primary-dark">{{ t(key="nav-shop", lang=L) }}</a>
|
||||
{% for crumb in breadcrumbs %}
|
||||
<span class="px-1">/</span>
|
||||
<a href="/category/{{ crumb.slug }}" class="hover:text-primary dark:hover:text-primary-dark">{{ crumb.name }}</a>
|
||||
@@ -28,12 +29,7 @@
|
||||
{% endif %}
|
||||
</header>
|
||||
|
||||
{% if products | length > 0 %}
|
||||
{% include "shop/_product_grid.html" %}
|
||||
{% else %}
|
||||
<div class="rounded-radius border border-outline px-6 py-16 text-center text-on-surface/70 dark:border-outline-dark dark:text-on-surface-dark/70">
|
||||
{{ t(key="shop-empty", lang=lang | default(value='sk')) }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{# Same search + filters as the shop, with this category preselected. #}
|
||||
{% include "shop/_search.html" %}
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
@@ -4,42 +4,13 @@
|
||||
{% block title %}{{ t(key="nav-shop", lang=lang | default(value='sk')) }}{% endblock title %}
|
||||
|
||||
{% block content %}
|
||||
<div class="space-y-8">
|
||||
<header class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<h1 class="text-3xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=lang | default(value='sk')) }}</h1>
|
||||
<p class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="shop-subtitle", lang=lang | default(value='sk')) }}</p>
|
||||
</div>
|
||||
|
||||
{# Live search: htmx GETs /search as the customer types (debounced) and
|
||||
swaps only the results below. hx-push-url keeps the URL shareable; the
|
||||
spinner shows while a request is in flight. Degrades to a normal GET form
|
||||
submit when JS/htmx is unavailable. #}
|
||||
<form action="/search" method="get" role="search"
|
||||
class="relative max-w-md"
|
||||
hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML"
|
||||
hx-trigger="input changed delay:300ms from:input[name='q'], submit"
|
||||
hx-push-url="true" hx-indicator="#search-spinner">
|
||||
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
{{ ui::icon(name="search", size="size-5") }}
|
||||
</span>
|
||||
<input type="search" name="q" value="{{ query | default(value='') }}"
|
||||
autocomplete="off"
|
||||
placeholder="{{ t(key='search-placeholder', lang=lang | default(value='sk')) }}"
|
||||
aria-label="{{ t(key='search-placeholder', lang=lang | default(value='sk')) }}"
|
||||
class="w-full rounded-radius border border-outline bg-surface py-2 pl-10 pr-10 text-sm text-on-surface placeholder:text-on-surface/50 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt dark:text-on-surface-dark dark:placeholder:text-on-surface-dark/50 dark:focus-visible:outline-primary-dark" />
|
||||
<span id="search-spinner"
|
||||
class="htmx-indicator pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3 text-on-surface/50 dark:text-on-surface-dark/50">
|
||||
<svg class="size-4 animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
|
||||
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 0 1 8-8V0C5.4 0 0 5.4 0 12h4Z"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</form>
|
||||
{% set L = lang | default(value='sk') %}
|
||||
<div class="space-y-6">
|
||||
<header class="space-y-1">
|
||||
<h1 class="text-3xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ t(key="shop-title", lang=L) }}</h1>
|
||||
<p class="text-on-surface/70 dark:text-on-surface-dark/70">{{ t(key="shop-subtitle", lang=L) }}</p>
|
||||
</header>
|
||||
|
||||
<div id="shop-results">
|
||||
{% include "shop/_results.html" %}
|
||||
</div>
|
||||
{% include "shop/_search.html" %}
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
||||
@@ -83,7 +83,8 @@
|
||||
</div>
|
||||
|
||||
{% if product.description %}
|
||||
<div class="whitespace-pre-line leading-relaxed text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description }}</div>
|
||||
{# Authored as rich text (Quill) in the admin; render the stored HTML. #}
|
||||
<div class="rich-content text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description | safe }}</div>
|
||||
{% endif %}
|
||||
|
||||
<template x-if="current.in_stock">
|
||||
|
||||
@@ -44,6 +44,9 @@ mod m20260622_000002_product_variants;
|
||||
mod m20260622_000003_variant_stock_nullable;
|
||||
mod m20260622_000004_product_search;
|
||||
mod m20260622_000005_product_search_aggregate;
|
||||
mod m20260622_000006_order_search_indexes;
|
||||
mod m20260623_000001_add_short_description_to_products;
|
||||
mod m20260623_000002_strip_html_from_product_search;
|
||||
pub struct Migrator;
|
||||
|
||||
#[async_trait::async_trait]
|
||||
@@ -92,6 +95,9 @@ impl MigratorTrait for Migrator {
|
||||
Box::new(m20260622_000003_variant_stock_nullable::Migration),
|
||||
Box::new(m20260622_000004_product_search::Migration),
|
||||
Box::new(m20260622_000005_product_search_aggregate::Migration),
|
||||
Box::new(m20260622_000006_order_search_indexes::Migration),
|
||||
Box::new(m20260623_000001_add_short_description_to_products::Migration),
|
||||
Box::new(m20260623_000002_strip_html_from_product_search::Migration),
|
||||
// inject-above (do not remove this comment)
|
||||
]
|
||||
}
|
||||
|
||||
48
migration/src/m20260622_000006_order_search_indexes.rs
Normal file
48
migration/src/m20260622_000006_order_search_indexes.rs
Normal file
@@ -0,0 +1,48 @@
|
||||
//! Trigram indexes so the admin order search stays fast as orders pile up.
|
||||
//!
|
||||
//! Order search is a plain substring (`ILIKE`) match over the high-signal,
|
||||
//! free-text order fields — order number, email, customer/company name — run
|
||||
//! through `f_unaccent` so diacritics and case never matter (see
|
||||
//! `orders::Entity::search`). These `pg_trgm` GIN indexes let those `ILIKE`
|
||||
//! lookups use an index instead of scanning every row. `pg_trgm` + `f_unaccent`
|
||||
//! already exist from the product-search migration.
|
||||
|
||||
use sea_orm_migration::prelude::*;
|
||||
|
||||
#[derive(DeriveMigrationName)]
|
||||
pub struct Migration;
|
||||
|
||||
#[async_trait::async_trait]
|
||||
impl MigrationTrait for Migration {
|
||||
async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
m.get_connection()
|
||||
.execute_unprepared(
|
||||
r#"
|
||||
CREATE INDEX idx_orders_number_trgm
|
||||
ON orders USING GIN (f_unaccent(order_number) gin_trgm_ops);
|
||||
CREATE INDEX idx_orders_email_trgm
|
||||
ON orders USING GIN (f_unaccent(email) gin_trgm_ops);
|
||||
CREATE INDEX idx_orders_customer_name_trgm
|
||||
ON orders USING GIN (f_unaccent(COALESCE(customer_name, '')) gin_trgm_ops);
|
||||
CREATE INDEX idx_orders_company_name_trgm
|
||||
ON orders USING GIN (f_unaccent(COALESCE(company_name, '')) gin_trgm_ops);
|
||||
"#,
|
||||
)
|
||||
.await?;
|
||||
Ok(())
|
||||
}
|
||||
|
||||
async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
m.get_connection()
|
||||
.execute_unprepared(
|
||||
r#"
|
||||
DROP INDEX IF EXISTS idx_orders_company_name_trgm;
|
||||
DROP INDEX IF EXISTS idx_orders_customer_name_trgm;
|
||||
DROP INDEX IF EXISTS idx_orders_email_trgm;
|
||||
DROP INDEX IF EXISTS idx_orders_number_trgm;
|
||||
"#,
|
||||
)
|
||||
.await?;
|
||||
Ok(())
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
use loco_rs::schema::*;
|
||||
use sea_orm_migration::prelude::*;
|
||||
|
||||
#[derive(DeriveMigrationName)]
|
||||
pub struct Migration;
|
||||
|
||||
#[async_trait::async_trait]
|
||||
impl MigrationTrait for Migration {
|
||||
async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
// A short blurb shown on product cards (grid/list), distinct from the full
|
||||
// `description` rendered on the product detail page.
|
||||
add_column(m, "products", "short_description", ColType::TextNull).await
|
||||
}
|
||||
|
||||
async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
remove_column(m, "products", "short_description").await
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
//! Product descriptions are now authored as rich text (Quill) and stored as
|
||||
//! HTML. The product search vector (see m20260622_000005) tokenizes the raw
|
||||
//! description, so without this the markup itself (`p`, `strong`, `li`, `href`,
|
||||
//! `class`, `ql`, …) would land in the index and pollute matches.
|
||||
//!
|
||||
//! Redefine `kompress_build_product_search` so the description is run through a
|
||||
//! tag-stripping `regexp_replace` before `to_tsvector`, then backfill every
|
||||
//! product's stored vector. Everything else about the function is unchanged.
|
||||
|
||||
use sea_orm_migration::prelude::*;
|
||||
|
||||
#[derive(DeriveMigrationName)]
|
||||
pub struct Migration;
|
||||
|
||||
#[async_trait::async_trait]
|
||||
impl MigrationTrait for Migration {
|
||||
async fn up(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
let db = m.get_connection();
|
||||
db.execute_unprepared(
|
||||
r#"
|
||||
CREATE OR REPLACE FUNCTION kompress_build_product_search(
|
||||
p_name text, p_description text, p_id integer
|
||||
) RETURNS tsvector
|
||||
LANGUAGE sql STABLE AS $func$
|
||||
SELECT
|
||||
setweight(to_tsvector('sk_unaccent', COALESCE(p_name, '')), 'A')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(t.name, ' ')
|
||||
FROM product_product_tags ppt
|
||||
JOIN product_tags t ON t.id = ppt.product_tag_id
|
||||
WHERE ppt.product_id = p_id
|
||||
), '')), 'B')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(v.label, ' ')
|
||||
FROM product_variants v
|
||||
WHERE v.product_id = p_id
|
||||
), '')), 'B')
|
||||
|| setweight(to_tsvector('sk_unaccent',
|
||||
regexp_replace(COALESCE(p_description, ''), '<[^>]+>', ' ', 'g')
|
||||
), 'C')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(v.sku, ' ')
|
||||
FROM product_variants v
|
||||
WHERE v.product_id = p_id AND v.sku IS NOT NULL
|
||||
), '')), 'C');
|
||||
$func$;
|
||||
|
||||
-- Backfill: recompute every product's vector with the new definition.
|
||||
UPDATE products
|
||||
SET search_vector = kompress_build_product_search(name, description, id);
|
||||
"#,
|
||||
)
|
||||
.await?;
|
||||
Ok(())
|
||||
}
|
||||
|
||||
async fn down(&self, m: &SchemaManager) -> Result<(), DbErr> {
|
||||
// Restore the prior definition (raw, un-stripped description).
|
||||
let db = m.get_connection();
|
||||
db.execute_unprepared(
|
||||
r#"
|
||||
CREATE OR REPLACE FUNCTION kompress_build_product_search(
|
||||
p_name text, p_description text, p_id integer
|
||||
) RETURNS tsvector
|
||||
LANGUAGE sql STABLE AS $func$
|
||||
SELECT
|
||||
setweight(to_tsvector('sk_unaccent', COALESCE(p_name, '')), 'A')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(t.name, ' ')
|
||||
FROM product_product_tags ppt
|
||||
JOIN product_tags t ON t.id = ppt.product_tag_id
|
||||
WHERE ppt.product_id = p_id
|
||||
), '')), 'B')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(v.label, ' ')
|
||||
FROM product_variants v
|
||||
WHERE v.product_id = p_id
|
||||
), '')), 'B')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE(p_description, '')), 'C')
|
||||
|| setweight(to_tsvector('sk_unaccent', COALESCE((
|
||||
SELECT string_agg(v.sku, ' ')
|
||||
FROM product_variants v
|
||||
WHERE v.product_id = p_id AND v.sku IS NOT NULL
|
||||
), '')), 'C');
|
||||
$func$;
|
||||
|
||||
UPDATE products
|
||||
SET search_vector = kompress_build_product_search(name, description, id);
|
||||
"#,
|
||||
)
|
||||
.await?;
|
||||
Ok(())
|
||||
}
|
||||
}
|
||||
@@ -138,10 +138,17 @@ async fn show(
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
|
||||
let list = products::Entity::find()
|
||||
// Optional text search (drafts included), otherwise the whole catalog by
|
||||
// name. Reuses the storefront's hybrid full-text + fuzzy product search.
|
||||
let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
|
||||
let list = if query.is_empty() {
|
||||
products::Entity::find()
|
||||
.order_by_asc(products::Column::Name)
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
.await?
|
||||
} else {
|
||||
products::Entity::search(&ctx.db, &query, 1000, false).await?
|
||||
};
|
||||
|
||||
// Category sidebar tree (counts over the full, unfiltered product list) plus
|
||||
// the active `?category=` filter applied to the rows.
|
||||
@@ -212,6 +219,7 @@ async fn show(
|
||||
"products": rows,
|
||||
"category_groups": category_groups,
|
||||
"selected_category": selected_category,
|
||||
"query": query,
|
||||
"total_count": list.len(),
|
||||
"uncategorized_count": category_ids.iter().filter(|c| c.is_none()).count(),
|
||||
"error": params.get("error"),
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
//! Admin order list, detail, status updates, and manual carrier dispatch.
|
||||
|
||||
use std::collections::HashMap;
|
||||
|
||||
use axum::extract::Query;
|
||||
use axum_extra::extract::cookie::CookieJar;
|
||||
use loco_rs::prelude::*;
|
||||
use sea_orm::{ActiveModelTrait, ColumnTrait, EntityTrait, QueryFilter, QueryOrder, Set};
|
||||
@@ -30,18 +33,31 @@ async fn index(
|
||||
auth: auth::JWT,
|
||||
jar: CookieJar,
|
||||
ViewEngine(v): ViewEngine<TeraView>,
|
||||
Query(params): Query<HashMap<String, String>>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
guard::current_admin(auth, &ctx).await?;
|
||||
let list = orders::Entity::find()
|
||||
// Optional search over order number / customer / email / etc., otherwise the
|
||||
// full list newest first.
|
||||
let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
|
||||
let list = if query.is_empty() {
|
||||
orders::Entity::find()
|
||||
.order_by_desc(orders::Column::CreatedAt)
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
.await?
|
||||
} else {
|
||||
orders::Entity::search(&ctx.db, &query, 500).await?
|
||||
};
|
||||
let rows: Vec<serde_json::Value> = list.iter().map(view::summary).collect();
|
||||
format::view(
|
||||
&v,
|
||||
"admin/orders/index.html",
|
||||
json!({ "orders": rows, "lang": current_lang(&jar) }),
|
||||
json!({
|
||||
"orders": rows,
|
||||
"query": query,
|
||||
"total": list.len(),
|
||||
"lang": current_lang(&jar),
|
||||
}),
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -26,7 +26,7 @@ use crate::{
|
||||
},
|
||||
shared::{
|
||||
guard,
|
||||
money::{format_bp, format_price, parse_price_to_cents},
|
||||
money::{format_bp, format_price, parse_percent, parse_price_to_cents},
|
||||
pricing,
|
||||
slug::{slugify, unique_slug},
|
||||
},
|
||||
@@ -52,6 +52,7 @@ struct ProductFields {
|
||||
name: String,
|
||||
slug: String,
|
||||
description: Option<String>,
|
||||
short_description: Option<String>,
|
||||
currency: String,
|
||||
category_id: Option<i32>,
|
||||
published: bool,
|
||||
@@ -67,6 +68,7 @@ async fn parse_product_fields(
|
||||
.ok_or_else(|| Error::BadRequest("product name is required".to_string()))?;
|
||||
let currency = form.text("currency").unwrap_or_else(|| "EUR".to_string());
|
||||
let description = form.text("description");
|
||||
let short_description = form.text("short_description");
|
||||
let category_id = form.text("category_id").and_then(|s| s.parse::<i32>().ok());
|
||||
let published = form.checked("published");
|
||||
|
||||
@@ -91,6 +93,7 @@ async fn parse_product_fields(
|
||||
name,
|
||||
slug,
|
||||
description,
|
||||
short_description,
|
||||
currency,
|
||||
category_id,
|
||||
published,
|
||||
@@ -105,30 +108,9 @@ struct VariantInput {
|
||||
/// `None` = available but not inventory-tracked.
|
||||
stock: Option<i32>,
|
||||
price_cents: i64,
|
||||
business_sale_cents: Option<i64>,
|
||||
position: i32,
|
||||
}
|
||||
|
||||
/// The optional business-sale price field on a variant row: blank means "no
|
||||
/// business quick-sale", a value must parse and be below the regular price.
|
||||
fn parse_optional_sale(
|
||||
form: &MultipartForm,
|
||||
i: usize,
|
||||
key: &str,
|
||||
price_cents: i64,
|
||||
) -> Result<Option<i64>> {
|
||||
let Some(raw) = form.text(&format!("variants[{i}][{key}]")) else {
|
||||
return Ok(None);
|
||||
};
|
||||
let cents = parse_price_to_cents(&raw)?;
|
||||
if cents <= 0 || cents >= price_cents {
|
||||
return Err(Error::BadRequest(
|
||||
"a sale price must be positive and below the regular price".to_string(),
|
||||
));
|
||||
}
|
||||
Ok(Some(cents))
|
||||
}
|
||||
|
||||
/// Parse the repeated variant rows from the form, in submission order. Blank
|
||||
/// rows (no price and no label) are skipped; at least one valid row is required.
|
||||
fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
|
||||
@@ -168,7 +150,6 @@ fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
|
||||
.ok_or_else(|| Error::BadRequest("stock must be 0 or more".to_string()))?,
|
||||
),
|
||||
};
|
||||
let business_sale_cents = parse_optional_sale(form, i, "business_sale", price_cents)?;
|
||||
let id = form
|
||||
.text(&format!("variants[{i}][id]"))
|
||||
.and_then(|s| s.parse::<i32>().ok());
|
||||
@@ -179,7 +160,6 @@ fn parse_variants(form: &MultipartForm) -> Result<Vec<VariantInput>> {
|
||||
sku,
|
||||
stock,
|
||||
price_cents,
|
||||
business_sale_cents,
|
||||
position: out.len() as i32,
|
||||
});
|
||||
}
|
||||
@@ -197,9 +177,9 @@ fn apply_variant(active: &mut product_variants::ActiveModel, input: &VariantInpu
|
||||
active.sku = Set(input.sku.clone());
|
||||
active.stock = Set(input.stock);
|
||||
active.price_cents = Set(input.price_cents);
|
||||
// The per-variant public sale price was removed from the UI; keep it cleared.
|
||||
active.sale_price_cents = Set(None);
|
||||
active.business_sale_price_cents = Set(input.business_sale_cents);
|
||||
// Discounts (public + business sale) are owned by the discount page and keyed
|
||||
// per option/audience; the product form must leave those columns untouched so
|
||||
// it never clobbers a discount. New variants default them to NULL.
|
||||
active.position = Set(input.position);
|
||||
}
|
||||
|
||||
@@ -257,7 +237,6 @@ fn variant_form_json(variant: &product_variants::Model) -> serde_json::Value {
|
||||
"sku": variant.sku,
|
||||
"stock": variant.stock,
|
||||
"price": format_price(variant.price_cents),
|
||||
"business_sale": variant.business_sale_price_cents.map(format_price),
|
||||
})
|
||||
}
|
||||
|
||||
@@ -281,10 +260,17 @@ async fn index(
|
||||
.map(|c| (c.id, c.name.clone()))
|
||||
.collect();
|
||||
|
||||
let list = products::Entity::find()
|
||||
// Optional text search (drafts included), otherwise the full catalog newest
|
||||
// first. Reuses the storefront's hybrid full-text + fuzzy product search.
|
||||
let query = params.get("q").map(String::as_str).unwrap_or("").trim().to_string();
|
||||
let list = if query.is_empty() {
|
||||
products::Entity::find()
|
||||
.order_by_desc(products::Column::CreatedAt)
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
.await?
|
||||
} else {
|
||||
products::Entity::search(&ctx.db, &query, 1000, false).await?
|
||||
};
|
||||
let ids: Vec<i32> = list.iter().map(|p| p.id).collect();
|
||||
let grouped = product_variants::Entity::grouped_for_products(&ctx.db, &ids).await?;
|
||||
|
||||
@@ -333,9 +319,13 @@ async fn index(
|
||||
.sum::<i32>()
|
||||
.to_string()
|
||||
};
|
||||
// The product is "on sale" for this audience if any option carries a
|
||||
// discount; the per-option amounts live on the discount page.
|
||||
let on_sale = variants.iter().any(|v| current_value(v, audience).is_some());
|
||||
rows.push(product_row(
|
||||
product,
|
||||
priced,
|
||||
on_sale,
|
||||
variants.len(),
|
||||
stock_display,
|
||||
image,
|
||||
@@ -352,6 +342,7 @@ async fn index(
|
||||
"audience": audience,
|
||||
"category_groups": category_groups,
|
||||
"selected_category": selected_category,
|
||||
"query": query,
|
||||
"total_count": list.len(),
|
||||
"uncategorized_count": category_ids.iter().filter(|c| c.is_none()).count(),
|
||||
"lang": current_lang(&jar),
|
||||
@@ -365,6 +356,7 @@ async fn index(
|
||||
fn product_row(
|
||||
product: &products::Model,
|
||||
effective: &pricing::PricedProduct,
|
||||
on_sale: bool,
|
||||
variant_count: usize,
|
||||
stock_display: String,
|
||||
image: Option<String>,
|
||||
@@ -382,6 +374,7 @@ fn product_row(
|
||||
"image": image,
|
||||
"category_name": category_name,
|
||||
"regular_price": format_price(effective.regular_cents),
|
||||
"on_sale": on_sale,
|
||||
"effective_price": format_price(effective.price_cents),
|
||||
"effective_reduced": effective.is_reduced(),
|
||||
"effective_percent_off": percent_off(effective.regular_cents, effective.price_cents),
|
||||
@@ -448,6 +441,7 @@ async fn create(
|
||||
name: Set(fields.name),
|
||||
slug: Set(fields.slug),
|
||||
description: Set(fields.description),
|
||||
short_description: Set(fields.short_description),
|
||||
currency: Set(fields.currency),
|
||||
view_count: Set(0),
|
||||
published: Set(fields.published),
|
||||
@@ -562,6 +556,7 @@ async fn update(
|
||||
product.name = Set(fields.name);
|
||||
product.slug = Set(fields.slug);
|
||||
product.description = Set(fields.description);
|
||||
product.short_description = Set(fields.short_description);
|
||||
product.currency = Set(fields.currency);
|
||||
product.category_id = Set(fields.category_id);
|
||||
product.published = Set(fields.published);
|
||||
@@ -611,6 +606,30 @@ fn list_redirect(audience: &str) -> Result<Response> {
|
||||
format::redirect(&format!("/admin/catalog/products?audience={audience}"))
|
||||
}
|
||||
|
||||
/// Resolve a percentage off the regular price into a fixed sale price in cents.
|
||||
fn percent_to_sale_cents(regular_cents: i64, percent: f64) -> i64 {
|
||||
let off = (regular_cents as f64 * percent / 100.0).round() as i64;
|
||||
regular_cents - off
|
||||
}
|
||||
|
||||
/// Which discount value an audience tab sees on a variant.
|
||||
fn current_value(variant: &product_variants::Model, audience: &str) -> Option<i64> {
|
||||
if audience == BUSINESS {
|
||||
variant.business_sale_price_cents
|
||||
} else {
|
||||
variant.sale_price_cents
|
||||
}
|
||||
}
|
||||
|
||||
/// Set the discount column on a variant for a given audience.
|
||||
fn set_value(active: &mut product_variants::ActiveModel, audience: &str, value: Option<i64>) {
|
||||
if audience == BUSINESS {
|
||||
active.business_sale_price_cents = Set(value);
|
||||
} else {
|
||||
active.sale_price_cents = Set(value);
|
||||
}
|
||||
}
|
||||
|
||||
/// Percent off the regular price, rounded to a whole number.
|
||||
fn percent_off(regular_cents: i64, sale_cents: i64) -> i64 {
|
||||
if regular_cents <= 0 {
|
||||
@@ -734,6 +753,231 @@ async fn sync_profiles(
|
||||
list_redirect(audience)
|
||||
}
|
||||
|
||||
// --- Per-variant discounts ---------------------------------------------------
|
||||
//
|
||||
// Each product is sold as one or more options (variants). A discount can be set
|
||||
// on every option individually, for the active audience: personal writes the
|
||||
// public `sale_price_cents`, business writes `business_sale_price_cents`. Per
|
||||
// option the admin picks a fixed sale price or a percentage off the regular
|
||||
// price; an empty value clears that option's discount.
|
||||
|
||||
/// One option row in the discount form. Carries enough to pre-fill the editor
|
||||
/// and to survive a validation-error round-trip.
|
||||
struct DiscountRow {
|
||||
id: i32,
|
||||
label: String,
|
||||
regular_cents: i64,
|
||||
mode: String,
|
||||
fixed: String,
|
||||
percent: String,
|
||||
has_discount: bool,
|
||||
}
|
||||
|
||||
impl DiscountRow {
|
||||
/// Pre-fill from the discount stored for this audience.
|
||||
fn from_db(v: &product_variants::Model, audience: &str) -> Self {
|
||||
let sale = current_value(v, audience);
|
||||
DiscountRow {
|
||||
id: v.id,
|
||||
label: v.label.clone(),
|
||||
regular_cents: v.price_cents,
|
||||
mode: "fixed".to_string(),
|
||||
fixed: sale.map(format_price).unwrap_or_default(),
|
||||
percent: String::new(),
|
||||
has_discount: sale.is_some(),
|
||||
}
|
||||
}
|
||||
|
||||
/// Pre-fill from the submitted values, to repaint the form after an error.
|
||||
fn from_submitted(
|
||||
v: &product_variants::Model,
|
||||
audience: &str,
|
||||
pairs: &HashMap<String, String>,
|
||||
) -> Self {
|
||||
let get = |key: &str| {
|
||||
pairs
|
||||
.get(&format!("v[{}][{key}]", v.id))
|
||||
.map(|s| s.trim().to_string())
|
||||
.unwrap_or_default()
|
||||
};
|
||||
let mode = get("mode");
|
||||
DiscountRow {
|
||||
id: v.id,
|
||||
label: v.label.clone(),
|
||||
regular_cents: v.price_cents,
|
||||
mode: if mode == "percent" {
|
||||
mode
|
||||
} else {
|
||||
"fixed".to_string()
|
||||
},
|
||||
fixed: get("fixed"),
|
||||
percent: get("percent"),
|
||||
has_discount: current_value(v, audience).is_some(),
|
||||
}
|
||||
}
|
||||
|
||||
fn to_json(&self, currency: &str) -> serde_json::Value {
|
||||
json!({
|
||||
"id": self.id,
|
||||
"label": self.label,
|
||||
"regular_cents": self.regular_cents,
|
||||
"regular_price": format_price(self.regular_cents),
|
||||
"currency": currency,
|
||||
"mode": self.mode,
|
||||
"fixed": self.fixed,
|
||||
"percent": self.percent,
|
||||
"has_discount": self.has_discount,
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/// Resolve one submitted option into the sale price to store. `Ok(None)` clears
|
||||
/// the discount; `Err` is an i18n key for the validation message.
|
||||
fn resolve_row(
|
||||
regular_cents: i64,
|
||||
mode: &str,
|
||||
fixed: &str,
|
||||
percent: &str,
|
||||
) -> std::result::Result<Option<i64>, &'static str> {
|
||||
let sale_cents = if mode == "percent" {
|
||||
if percent.is_empty() {
|
||||
return Ok(None);
|
||||
}
|
||||
let pct = parse_percent(percent).ok_or("discount-invalid")?;
|
||||
if pct <= 0.0 || pct >= 100.0 {
|
||||
return Err("discount-percent-range");
|
||||
}
|
||||
percent_to_sale_cents(regular_cents, pct)
|
||||
} else {
|
||||
if fixed.is_empty() {
|
||||
return Ok(None);
|
||||
}
|
||||
parse_price_to_cents(fixed).map_err(|_| "discount-invalid")?
|
||||
};
|
||||
if sale_cents <= 0 {
|
||||
return Err("discount-must-be-positive");
|
||||
}
|
||||
if sale_cents >= regular_cents {
|
||||
return Err("discount-below-regular");
|
||||
}
|
||||
Ok(Some(sale_cents))
|
||||
}
|
||||
|
||||
async fn discount_view(
|
||||
v: &TeraView,
|
||||
jar: &CookieJar,
|
||||
product: &products::Model,
|
||||
rows: &[DiscountRow],
|
||||
audience: &str,
|
||||
error: Option<&str>,
|
||||
) -> Result<Response> {
|
||||
let rows_json: Vec<_> = rows.iter().map(|r| r.to_json(&product.currency)).collect();
|
||||
let has_discount = rows.iter().any(|r| r.has_discount);
|
||||
format::view(
|
||||
v,
|
||||
"admin/catalog/discount_form.html",
|
||||
json!({
|
||||
"product": {
|
||||
"id": product.id,
|
||||
"name": product.name,
|
||||
"currency": product.currency,
|
||||
},
|
||||
"rows": rows_json,
|
||||
"audience": audience,
|
||||
"has_discount": has_discount,
|
||||
"error": error.map(|e| e.to_string()),
|
||||
"lang": current_lang(jar),
|
||||
}),
|
||||
)
|
||||
}
|
||||
|
||||
#[debug_handler]
|
||||
async fn discount_show(
|
||||
auth: auth::JWT,
|
||||
jar: CookieJar,
|
||||
ViewEngine(v): ViewEngine<TeraView>,
|
||||
Path(id): Path<i32>,
|
||||
Query(params): Query<HashMap<String, String>>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
guard::current_admin(auth, &ctx).await?;
|
||||
let audience = read_audience(¶ms);
|
||||
let product = product_by_id(&ctx, id).await?;
|
||||
let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
|
||||
let rows: Vec<DiscountRow> = variants
|
||||
.iter()
|
||||
.map(|variant| DiscountRow::from_db(variant, audience))
|
||||
.collect();
|
||||
discount_view(&v, &jar, &product, &rows, audience, None).await
|
||||
}
|
||||
|
||||
#[debug_handler]
|
||||
async fn discount_update(
|
||||
auth: auth::JWT,
|
||||
jar: CookieJar,
|
||||
ViewEngine(v): ViewEngine<TeraView>,
|
||||
Path(id): Path<i32>,
|
||||
Query(params): Query<HashMap<String, String>>,
|
||||
State(ctx): State<AppContext>,
|
||||
body: String,
|
||||
) -> Result<Response> {
|
||||
guard::current_admin(auth, &ctx).await?;
|
||||
let audience = read_audience(¶ms);
|
||||
let product = product_by_id(&ctx, id).await?;
|
||||
let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
|
||||
|
||||
let pairs: HashMap<String, String> = form_urlencoded::parse(body.as_bytes())
|
||||
.into_owned()
|
||||
.collect();
|
||||
|
||||
// Resolve every option before persisting anything, so one bad row can't leave
|
||||
// the product half-discounted. On the first error, repaint with the inputs.
|
||||
let mut resolved: Vec<(product_variants::Model, Option<i64>)> = Vec::new();
|
||||
for variant in &variants {
|
||||
let row = DiscountRow::from_submitted(variant, audience, &pairs);
|
||||
match resolve_row(variant.price_cents, &row.mode, &row.fixed, &row.percent) {
|
||||
Ok(value) => resolved.push((variant.clone(), value)),
|
||||
Err(key) => {
|
||||
let rows: Vec<DiscountRow> = variants
|
||||
.iter()
|
||||
.map(|v| DiscountRow::from_submitted(v, audience, &pairs))
|
||||
.collect();
|
||||
return discount_view(&v, &jar, &product, &rows, audience, Some(key)).await;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let txn = ctx.db.begin().await?;
|
||||
for (variant, value) in &resolved {
|
||||
let mut active = variant.clone().into_active_model();
|
||||
set_value(&mut active, audience, *value);
|
||||
active.update(&txn).await?;
|
||||
}
|
||||
txn.commit().await?;
|
||||
list_redirect(audience)
|
||||
}
|
||||
|
||||
#[debug_handler]
|
||||
async fn discount_remove(
|
||||
auth: auth::JWT,
|
||||
Path(id): Path<i32>,
|
||||
Query(params): Query<HashMap<String, String>>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
guard::current_admin(auth, &ctx).await?;
|
||||
let audience = read_audience(¶ms);
|
||||
let _product = product_by_id(&ctx, id).await?;
|
||||
let variants = product_variants::Entity::for_product(&ctx.db, id).await?;
|
||||
let txn = ctx.db.begin().await?;
|
||||
for variant in &variants {
|
||||
let mut active = variant.clone().into_active_model();
|
||||
set_value(&mut active, audience, None);
|
||||
active.update(&txn).await?;
|
||||
}
|
||||
txn.commit().await?;
|
||||
list_redirect(audience)
|
||||
}
|
||||
|
||||
pub fn routes() -> Routes {
|
||||
// Several images may be uploaded in one submission; allow a generous total
|
||||
// (per-file size is still capped at IMAGE_MAX_BYTES while reading).
|
||||
@@ -756,4 +1000,16 @@ pub fn routes() -> Routes {
|
||||
post(update).layer(image_limit),
|
||||
)
|
||||
.add("/admin/catalog/products/{id}/delete", post(delete))
|
||||
.add(
|
||||
"/admin/catalog/products/{id}/discount/edit",
|
||||
get(discount_show),
|
||||
)
|
||||
.add(
|
||||
"/admin/catalog/products/{id}/discount",
|
||||
post(discount_update),
|
||||
)
|
||||
.add(
|
||||
"/admin/catalog/products/{id}/discount/remove",
|
||||
post(discount_remove),
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
//! Public storefront: product listings, product detail, category pages and the
|
||||
//! lazily-loaded category sidebar.
|
||||
|
||||
use std::collections::HashMap;
|
||||
|
||||
use axum::extract::Query;
|
||||
use axum::http::HeaderMap;
|
||||
use axum_extra::extract::cookie::CookieJar;
|
||||
@@ -10,15 +12,224 @@ use serde_json::json;
|
||||
|
||||
use crate::{
|
||||
controllers::i18n::current_lang,
|
||||
shared::{guard, pricing},
|
||||
shared::{
|
||||
guard,
|
||||
money::{format_price, parse_price_to_cents},
|
||||
pricing,
|
||||
},
|
||||
models::{categories, product_images, product_variants, products, users},
|
||||
views::shop as view,
|
||||
};
|
||||
|
||||
/// Query string for the storefront search box.
|
||||
#[derive(Debug, serde::Deserialize)]
|
||||
/// Results per page in the storefront listing/search.
|
||||
const PER_PAGE: usize = 24;
|
||||
/// Hard cap on candidates a single text search considers before faceting; well
|
||||
/// above any realistic page of results for this catalog.
|
||||
const SEARCH_CAP: u64 = 1000;
|
||||
|
||||
/// All storefront listing controls: free-text query, category, price band,
|
||||
/// stock, sort and page. Everything is optional so `/shop` and `/search` share
|
||||
/// one shape.
|
||||
#[derive(Debug, Default, serde::Deserialize)]
|
||||
struct SearchParams {
|
||||
q: Option<String>,
|
||||
category: Option<String>,
|
||||
min_price: Option<String>,
|
||||
max_price: Option<String>,
|
||||
in_stock: Option<String>,
|
||||
sort: Option<String>,
|
||||
page: Option<u32>,
|
||||
}
|
||||
|
||||
/// A candidate product with everything the listing needs to filter, sort and
|
||||
/// render it: its representative (first) variant, the resolved price for the
|
||||
/// viewer, stock, variant count and original search rank (for relevance order).
|
||||
struct Candidate {
|
||||
product: products::Model,
|
||||
rep: product_variants::Model,
|
||||
priced: pricing::PricedProduct,
|
||||
in_stock: bool,
|
||||
count: usize,
|
||||
rank: usize,
|
||||
}
|
||||
|
||||
/// Whether a checkbox-style param is on (present and not an explicit "off"/"0").
|
||||
fn is_on(v: &Option<String>) -> bool {
|
||||
matches!(v.as_deref(), Some(s) if !s.is_empty() && s != "0" && s != "false" && s != "off")
|
||||
}
|
||||
|
||||
/// Rebuild the query string from `params` minus `page`, so pagination links can
|
||||
/// preserve the active query + filters + sort.
|
||||
fn query_base(params: &SearchParams) -> String {
|
||||
let mut ser = form_urlencoded::Serializer::new(String::new());
|
||||
if let Some(q) = params.q.as_deref().filter(|s| !s.is_empty()) {
|
||||
ser.append_pair("q", q);
|
||||
}
|
||||
if let Some(c) = params.category.as_deref().filter(|s| !s.is_empty() && *s != "all") {
|
||||
ser.append_pair("category", c);
|
||||
}
|
||||
if let Some(p) = params.min_price.as_deref().filter(|s| !s.is_empty()) {
|
||||
ser.append_pair("min_price", p);
|
||||
}
|
||||
if let Some(p) = params.max_price.as_deref().filter(|s| !s.is_empty()) {
|
||||
ser.append_pair("max_price", p);
|
||||
}
|
||||
if is_on(¶ms.in_stock) {
|
||||
ser.append_pair("in_stock", "1");
|
||||
}
|
||||
if let Some(s) = params.sort.as_deref().filter(|s| !s.is_empty()) {
|
||||
ser.append_pair("sort", s);
|
||||
}
|
||||
ser.finish()
|
||||
}
|
||||
|
||||
/// Run the full faceted listing pipeline for `params` and shape the template
|
||||
/// context (results page + facet data + pagination). Reused by `/shop` and
|
||||
/// `/search`; the caller adds chrome and picks the template.
|
||||
async fn run_search(
|
||||
ctx: &AppContext,
|
||||
user: Option<&users::Model>,
|
||||
params: &SearchParams,
|
||||
) -> Result<serde_json::Value> {
|
||||
let q = params.q.clone().unwrap_or_default();
|
||||
let q_trim = q.trim().to_string();
|
||||
|
||||
// 1. Base candidates: ranked search hits, or the full published listing.
|
||||
let base: Vec<products::Model> = if q_trim.is_empty() {
|
||||
products::Entity::find()
|
||||
.filter(products::Column::Published.eq(true))
|
||||
.order_by_desc(products::Column::PublishedAt)
|
||||
.all(&ctx.db)
|
||||
.await?
|
||||
} else {
|
||||
products::Entity::search(&ctx.db, &q_trim, SEARCH_CAP, true).await?
|
||||
};
|
||||
|
||||
// 2. Attach representative variant + resolved price to each (drop products
|
||||
// with no purchasable variant).
|
||||
let ids: Vec<i32> = base.iter().map(|p| p.id).collect();
|
||||
let grouped = product_variants::Entity::grouped_for_products(&ctx.db, &ids).await?;
|
||||
let mut staged: Vec<(products::Model, product_variants::Model, usize, usize)> = Vec::new();
|
||||
for (rank, product) in base.into_iter().enumerate() {
|
||||
if let Some(vs) = grouped.get(&product.id) {
|
||||
if let Some(rep) = vs.first() {
|
||||
staged.push((product, rep.clone(), vs.len(), rank));
|
||||
}
|
||||
}
|
||||
}
|
||||
let reps: Vec<product_variants::Model> = staged.iter().map(|(_, r, _, _)| r.clone()).collect();
|
||||
let priced = pricing::price_variants(ctx, &reps, user).await?;
|
||||
let mut items: Vec<Candidate> = staged
|
||||
.into_iter()
|
||||
.zip(priced.iter())
|
||||
.map(|((product, rep, count, rank), p)| Candidate {
|
||||
in_stock: rep.in_stock(),
|
||||
product,
|
||||
rep,
|
||||
priced: *p,
|
||||
count,
|
||||
rank,
|
||||
})
|
||||
.collect();
|
||||
|
||||
// Price band bounds across all matches, to hint the filter UI.
|
||||
let price_floor = items.iter().map(|i| i.priced.price_cents).min().unwrap_or(0);
|
||||
let price_ceil = items.iter().map(|i| i.priced.price_cents).max().unwrap_or(0);
|
||||
|
||||
// 3. Non-category filters: price band + in-stock.
|
||||
let min_c = params.min_price.as_deref().and_then(|s| parse_price_to_cents(s).ok());
|
||||
let max_c = params.max_price.as_deref().and_then(|s| parse_price_to_cents(s).ok());
|
||||
let in_stock_only = is_on(¶ms.in_stock);
|
||||
items.retain(|i| {
|
||||
min_c.is_none_or(|m| i.priced.price_cents >= m)
|
||||
&& max_c.is_none_or(|m| i.priced.price_cents <= m)
|
||||
&& (!in_stock_only || i.in_stock)
|
||||
});
|
||||
|
||||
// 4. Category facets: counts computed over the price/stock-filtered set
|
||||
// (i.e. before applying the category choice itself).
|
||||
let all_categories = categories::published(ctx).await?;
|
||||
let cat_ids: Vec<Option<i32>> = items.iter().map(|i| i.product.category_id).collect();
|
||||
let category_groups = view::admin_category_groups(&all_categories, &cat_ids);
|
||||
let uncategorized_count = cat_ids.iter().filter(|c| c.is_none()).count();
|
||||
let category_name: HashMap<i32, String> =
|
||||
all_categories.iter().map(|c| (c.id, c.name.clone())).collect();
|
||||
|
||||
// 5. Apply the category filter.
|
||||
let selected_category = params
|
||||
.category
|
||||
.clone()
|
||||
.filter(|s| !s.is_empty())
|
||||
.unwrap_or_else(|| "all".to_string());
|
||||
let filter = view::category_filter_ids(&all_categories, &selected_category);
|
||||
items.retain(|i| view::category_filter_keep(&filter, i.product.category_id));
|
||||
|
||||
// 6. Sort. Newest-first is the default; relevance (the ranked search order)
|
||||
// is available explicitly via the sort control.
|
||||
let sort = params
|
||||
.sort
|
||||
.clone()
|
||||
.filter(|s| !s.is_empty())
|
||||
.unwrap_or_else(|| "newest".to_string());
|
||||
match sort.as_str() {
|
||||
"price_asc" => items.sort_by(|a, b| a.priced.price_cents.cmp(&b.priced.price_cents)),
|
||||
"price_desc" => items.sort_by(|a, b| b.priced.price_cents.cmp(&a.priced.price_cents)),
|
||||
"name_asc" => items.sort_by(|a, b| {
|
||||
a.product.name.to_lowercase().cmp(&b.product.name.to_lowercase())
|
||||
}),
|
||||
"name_desc" => items.sort_by(|a, b| {
|
||||
b.product.name.to_lowercase().cmp(&a.product.name.to_lowercase())
|
||||
}),
|
||||
"newest" => items.sort_by(|a, b| b.product.published_at.cmp(&a.product.published_at)),
|
||||
// "relevance" and anything unknown: original search rank.
|
||||
_ => items.sort_by_key(|i| i.rank),
|
||||
}
|
||||
|
||||
// 7. Paginate.
|
||||
let total = items.len();
|
||||
let pages = total.div_ceil(PER_PAGE).max(1);
|
||||
let page = params.page.unwrap_or(1).clamp(1, pages as u32);
|
||||
let start = (page as usize - 1) * PER_PAGE;
|
||||
|
||||
// 8. Render only the current page's cards (images fetched per row).
|
||||
let mut rows = Vec::new();
|
||||
for item in items.iter().skip(start).take(PER_PAGE) {
|
||||
let image = product_images::first_for(ctx, item.product.id).await?;
|
||||
let cat_name = item.product.category_id.and_then(|id| category_name.get(&id).cloned());
|
||||
rows.push(view::product_card(
|
||||
&item.product,
|
||||
&item.rep,
|
||||
&item.priced,
|
||||
item.count,
|
||||
image,
|
||||
cat_name,
|
||||
));
|
||||
}
|
||||
|
||||
Ok(json!({
|
||||
"products": rows,
|
||||
"query": q,
|
||||
"category_groups": category_groups,
|
||||
"selected_category": selected_category,
|
||||
// Numeric form so the <select> can mark the active option (Tera can't
|
||||
// compare a string param against a numeric category id).
|
||||
"selected_category_id": selected_category.parse::<i32>().unwrap_or(-1),
|
||||
"uncategorized_count": uncategorized_count,
|
||||
"sort": sort,
|
||||
"in_stock": in_stock_only,
|
||||
"min_price": params.min_price.clone().unwrap_or_default(),
|
||||
"max_price": params.max_price.clone().unwrap_or_default(),
|
||||
"price_floor": format_price(price_floor),
|
||||
"price_ceil": format_price(price_ceil),
|
||||
"total": total,
|
||||
"page": page,
|
||||
"pages": pages,
|
||||
"has_prev": page > 1,
|
||||
"has_next": (page as usize) < pages,
|
||||
"prev_page": page.saturating_sub(1).max(1),
|
||||
"next_page": page + 1,
|
||||
"query_base": query_base(params),
|
||||
}))
|
||||
}
|
||||
|
||||
/// Shape a list of products into card rows for `user` (None = public). Each card
|
||||
@@ -90,39 +301,36 @@ async fn category_sidebar(
|
||||
)
|
||||
}
|
||||
|
||||
/// Fold the page chrome (login state, names) and language into a `run_search`
|
||||
/// context so the full page can render the layout.
|
||||
fn add_chrome(ctx_value: &mut serde_json::Value, c: &guard::Chrome, lang: &str) {
|
||||
if let Some(map) = ctx_value.as_object_mut() {
|
||||
map.insert("logged_in_admin".into(), json!(c.logged_in_admin));
|
||||
map.insert("logged_in_customer".into(), json!(c.logged_in_customer));
|
||||
map.insert("customer_name".into(), json!(c.customer_name));
|
||||
map.insert("customer_account_type".into(), json!(c.customer_account_type));
|
||||
map.insert("lang".into(), json!(lang));
|
||||
}
|
||||
}
|
||||
|
||||
#[debug_handler]
|
||||
async fn index(
|
||||
jar: CookieJar,
|
||||
ViewEngine(v): ViewEngine<TeraView>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
let list = products::Entity::find()
|
||||
.filter(products::Column::Published.eq(true))
|
||||
.order_by_desc(products::Column::PublishedAt)
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
|
||||
let user = guard::current_user(&ctx, &jar).await;
|
||||
let mut context = run_search(&ctx, user.as_ref(), &SearchParams::default()).await?;
|
||||
let c = guard::chrome_from(&ctx, user.as_ref());
|
||||
format::view(
|
||||
&v,
|
||||
"shop/index.html",
|
||||
json!({
|
||||
"products": product_rows(&ctx, user.as_ref(), list).await?,
|
||||
"query": "",
|
||||
"logged_in_admin": c.logged_in_admin,
|
||||
"logged_in_customer": c.logged_in_customer,
|
||||
"customer_name": c.customer_name,
|
||||
"customer_account_type": c.customer_account_type,
|
||||
"lang": current_lang(&jar),
|
||||
}),
|
||||
)
|
||||
add_chrome(&mut context, &c, ¤t_lang(&jar));
|
||||
format::view(&v, "shop/index.html", context)
|
||||
}
|
||||
|
||||
/// Storefront search. Reuses the shop listing's card shaping, ranking results by
|
||||
/// the hybrid full-text + fuzzy query in [`products::Entity::search`]. A blank
|
||||
/// query falls back to the full published listing (so clearing the box restores
|
||||
/// the shop). htmx requests get just the results fragment for live updates;
|
||||
/// Storefront search + faceted browse. Combines the hybrid full-text/fuzzy query
|
||||
/// ([`products::Entity::search`]) with category, price-band, in-stock and sort
|
||||
/// filters, ranked and paginated by [`run_search`]. A blank query falls back to
|
||||
/// the full published listing, so the same endpoint powers both "browse" and
|
||||
/// "search". htmx requests get just the results fragment (for live updates);
|
||||
/// direct navigation (or no-JS) renders the whole page.
|
||||
#[debug_handler]
|
||||
async fn search(
|
||||
@@ -132,44 +340,20 @@ async fn search(
|
||||
Query(params): Query<SearchParams>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
let q = params.q.unwrap_or_default();
|
||||
let trimmed = q.trim();
|
||||
let list = if trimmed.is_empty() {
|
||||
products::Entity::find()
|
||||
.filter(products::Column::Published.eq(true))
|
||||
.order_by_desc(products::Column::PublishedAt)
|
||||
.all(&ctx.db)
|
||||
.await?
|
||||
} else {
|
||||
products::Entity::search(&ctx.db, trimmed).await?
|
||||
};
|
||||
|
||||
let user = guard::current_user(&ctx, &jar).await;
|
||||
let rows = product_rows(&ctx, user.as_ref(), list).await?;
|
||||
let mut context = run_search(&ctx, user.as_ref(), ¶ms).await?;
|
||||
let lang = current_lang(&jar);
|
||||
|
||||
if headers.contains_key("HX-Request") {
|
||||
return format::view(
|
||||
&v,
|
||||
"shop/_results.html",
|
||||
json!({ "products": rows, "query": q, "lang": lang }),
|
||||
);
|
||||
if let Some(map) = context.as_object_mut() {
|
||||
map.insert("lang".into(), json!(lang));
|
||||
}
|
||||
return format::view(&v, "shop/_results.html", context);
|
||||
}
|
||||
|
||||
let c = guard::chrome_from(&ctx, user.as_ref());
|
||||
format::view(
|
||||
&v,
|
||||
"shop/index.html",
|
||||
json!({
|
||||
"products": rows,
|
||||
"query": q,
|
||||
"logged_in_admin": c.logged_in_admin,
|
||||
"logged_in_customer": c.logged_in_customer,
|
||||
"customer_name": c.customer_name,
|
||||
"customer_account_type": c.customer_account_type,
|
||||
"lang": lang,
|
||||
}),
|
||||
)
|
||||
add_chrome(&mut context, &c, &lang);
|
||||
format::view(&v, "shop/index.html", context)
|
||||
}
|
||||
|
||||
#[debug_handler]
|
||||
@@ -250,11 +434,17 @@ async fn show(
|
||||
)
|
||||
}
|
||||
|
||||
/// Category page: the same faceted search as the shop, but with this category
|
||||
/// preselected as the default filter (plus breadcrumbs and subcategory chips).
|
||||
/// Any other filters/sort/query on the URL are honoured; the category itself is
|
||||
/// always forced to this page's category. Interacting with the toolbar navigates
|
||||
/// to `/search` (the category stays selected there too).
|
||||
#[debug_handler]
|
||||
async fn category(
|
||||
jar: CookieJar,
|
||||
ViewEngine(v): ViewEngine<TeraView>,
|
||||
Path(slug): Path<String>,
|
||||
Query(params): Query<SearchParams>,
|
||||
State(ctx): State<AppContext>,
|
||||
) -> Result<Response> {
|
||||
let published = categories::published(&ctx).await?;
|
||||
@@ -267,36 +457,22 @@ async fn category(
|
||||
let breadcrumbs = categories::ancestors(&published, category.parent_id);
|
||||
let children = categories::children_of(&published, category.id);
|
||||
|
||||
// Products listed here span this category and all of its descendants, so a
|
||||
// parent category is never empty just because its products live in leaves.
|
||||
let mut category_ids: Vec<i32> = categories::descendant_ids(&published, category.id)
|
||||
.into_iter()
|
||||
.collect();
|
||||
category_ids.push(category.id);
|
||||
let list = products::Entity::find()
|
||||
.filter(products::Column::CategoryId.is_in(category_ids))
|
||||
.filter(products::Column::Published.eq(true))
|
||||
.order_by_desc(products::Column::PublishedAt)
|
||||
.all(&ctx.db)
|
||||
.await?;
|
||||
// Force the category filter to this page's category, keeping any other params.
|
||||
let params = SearchParams {
|
||||
category: Some(category.id.to_string()),
|
||||
..params
|
||||
};
|
||||
|
||||
let user = guard::current_user(&ctx, &jar).await;
|
||||
let mut context = run_search(&ctx, user.as_ref(), ¶ms).await?;
|
||||
if let Some(map) = context.as_object_mut() {
|
||||
map.insert("category".into(), serde_json::to_value(&category)?);
|
||||
map.insert("breadcrumbs".into(), serde_json::to_value(&breadcrumbs)?);
|
||||
map.insert("children".into(), serde_json::to_value(&children)?);
|
||||
}
|
||||
let c = guard::chrome_from(&ctx, user.as_ref());
|
||||
format::view(
|
||||
&v,
|
||||
"shop/category.html",
|
||||
json!({
|
||||
"category": category,
|
||||
"breadcrumbs": breadcrumbs,
|
||||
"children": children,
|
||||
"products": product_rows(&ctx, user.as_ref(), list).await?,
|
||||
"logged_in_admin": c.logged_in_admin,
|
||||
"logged_in_customer": c.logged_in_customer,
|
||||
"customer_name": c.customer_name,
|
||||
"customer_account_type": c.customer_account_type,
|
||||
"lang": current_lang(&jar),
|
||||
}),
|
||||
)
|
||||
add_chrome(&mut context, &c, ¤t_lang(&jar));
|
||||
format::view(&v, "shop/category.html", context)
|
||||
}
|
||||
|
||||
pub fn routes() -> Routes {
|
||||
|
||||
@@ -15,6 +15,8 @@ pub struct Model {
|
||||
pub slug: String,
|
||||
#[sea_orm(column_type = "Text", nullable)]
|
||||
pub description: Option<String>,
|
||||
#[sea_orm(column_type = "Text", nullable)]
|
||||
pub short_description: Option<String>,
|
||||
pub currency: String,
|
||||
pub view_count: i32,
|
||||
pub published: bool,
|
||||
|
||||
@@ -163,4 +163,45 @@ impl Model {}
|
||||
impl ActiveModel {}
|
||||
|
||||
// implement your custom finders, selectors oriented logic here
|
||||
impl Entity {}
|
||||
impl Entity {
|
||||
/// Admin order search: a diacritic- and case-insensitive substring match over
|
||||
/// the free-text order fields an admin would actually type — order number,
|
||||
/// email, customer name, company name, phone and tracking number. Backed by
|
||||
/// the trigram indexes from the `order_search_indexes` migration. Newest
|
||||
/// first, capped at `limit`. A blank query returns nothing (callers fall back
|
||||
/// to the full list).
|
||||
pub async fn search<C: sea_orm::ConnectionTrait>(
|
||||
db: &C,
|
||||
query: &str,
|
||||
limit: u64,
|
||||
) -> Result<Vec<Model>, DbErr> {
|
||||
let q = query.trim();
|
||||
if q.is_empty() {
|
||||
return Ok(Vec::new());
|
||||
}
|
||||
// Treat the query literally: escape LIKE wildcards, then wrap in %…%.
|
||||
let escaped = q.replace('\\', "\\\\").replace('%', "\\%").replace('_', "\\_");
|
||||
let pattern = format!("%{escaped}%");
|
||||
|
||||
let sql = r#"
|
||||
SELECT * FROM orders o
|
||||
WHERE f_unaccent(o.order_number) ILIKE f_unaccent($1)
|
||||
OR f_unaccent(o.email) ILIKE f_unaccent($1)
|
||||
OR f_unaccent(COALESCE(o.customer_name,'')) ILIKE f_unaccent($1)
|
||||
OR f_unaccent(COALESCE(o.company_name,'')) ILIKE f_unaccent($1)
|
||||
OR f_unaccent(COALESCE(o.phone,'')) ILIKE f_unaccent($1)
|
||||
OR f_unaccent(COALESCE(o.tracking_number,'')) ILIKE f_unaccent($1)
|
||||
ORDER BY o.created_at DESC
|
||||
LIMIT $2
|
||||
"#;
|
||||
|
||||
Entity::find()
|
||||
.from_raw_sql(sea_orm::Statement::from_sql_and_values(
|
||||
db.get_database_backend(),
|
||||
sql,
|
||||
[pattern.into(), (limit as i64).into()],
|
||||
))
|
||||
.all(db)
|
||||
.await
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,7 +37,14 @@ impl Entity {
|
||||
/// `f_unaccent`, so diacritics never matter. Results are ranked by full-text
|
||||
/// rank, then trigram closeness of the name, then recency. An empty/blank
|
||||
/// query returns nothing — callers fall back to the plain listing.
|
||||
pub async fn search<C: ConnectionTrait>(db: &C, query: &str) -> Result<Vec<Model>, DbErr> {
|
||||
/// `published_only` filters to the storefront-visible set; pass `false` for
|
||||
/// admin tools that also need to find drafts.
|
||||
pub async fn search<C: ConnectionTrait>(
|
||||
db: &C,
|
||||
query: &str,
|
||||
limit: u64,
|
||||
published_only: bool,
|
||||
) -> Result<Vec<Model>, DbErr> {
|
||||
let q = query.trim();
|
||||
if q.is_empty() {
|
||||
return Ok(Vec::new());
|
||||
@@ -45,13 +52,14 @@ impl Entity {
|
||||
|
||||
// Only the model's own columns are selected; the generated `search_vector`
|
||||
// is left out so the row maps cleanly back onto `Model`. `$1` is reused
|
||||
// for every occurrence of the query term.
|
||||
let sql = r#"
|
||||
// for every occurrence of the query term; `$2` caps the result set.
|
||||
let published_clause = if published_only { "p.published = TRUE AND" } else { "" };
|
||||
let sql = format!(
|
||||
r#"
|
||||
SELECT p.created_at, p.updated_at, p.id, p.name, p.slug, p.description,
|
||||
p.currency, p.view_count, p.published, p.published_at, p.category_id
|
||||
FROM products p
|
||||
WHERE p.published = TRUE
|
||||
AND (
|
||||
WHERE {published_clause} (
|
||||
p.search_vector @@ websearch_to_tsquery('sk_unaccent', $1)
|
||||
OR word_similarity(f_unaccent($1), f_unaccent(p.name)) > 0.3
|
||||
OR word_similarity(f_unaccent($1), f_unaccent(COALESCE(p.description, ''))) > 0.3
|
||||
@@ -60,14 +68,15 @@ impl Entity {
|
||||
ts_rank(p.search_vector, websearch_to_tsquery('sk_unaccent', $1)) DESC,
|
||||
word_similarity(f_unaccent($1), f_unaccent(p.name)) DESC,
|
||||
p.published_at DESC NULLS LAST
|
||||
LIMIT 60
|
||||
"#;
|
||||
LIMIT $2
|
||||
"#
|
||||
);
|
||||
|
||||
Entity::find()
|
||||
.from_raw_sql(Statement::from_sql_and_values(
|
||||
db.get_database_backend(),
|
||||
sql,
|
||||
[q.into()],
|
||||
&sql,
|
||||
[q.into(), (limit as i64).into()],
|
||||
))
|
||||
.all(db)
|
||||
.await
|
||||
|
||||
@@ -27,6 +27,7 @@ pub fn product_card(
|
||||
"name": product.name,
|
||||
"slug": product.slug,
|
||||
"description": product.description,
|
||||
"short_description": product.short_description,
|
||||
"price": format_price(priced.price_cents),
|
||||
"on_sale": priced.is_reduced(),
|
||||
"is_business": priced.is_business,
|
||||
@@ -69,6 +70,7 @@ pub fn product_form(product: &products::Model, images: &[product_images::Model])
|
||||
"name": product.name,
|
||||
"slug": product.slug,
|
||||
"description": product.description,
|
||||
"short_description": product.short_description,
|
||||
"currency": product.currency,
|
||||
"published": product.published,
|
||||
"category_id": product.category_id,
|
||||
|
||||
Reference in New Issue
Block a user