t/tetratto
1
0
Fork 0
Code Issues Pull requests Projects Releases 8 Packages Wiki Activity Actions

add: product thumbnails ui

Browse source
This commit is contained in:
trisua 2025-08-10 00:17:21 -04:00
parent 815e730fc0
commit 7a31dcbd9b
6 changed files with 111 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

100
crates/app/src/public/html/economy/edit.lisp
View file

@ -4,6 +4,23 @@
(text "{% endblock %} {% block body %} {{ macros::nav(selected=\"\") }}")
(main
("class" "flex flex_col gap_2")
(div
("class" "card_nest")
(div
("class" "card small flex items_center gap_2")
(icon (text "images"))
(b
(str (text "economy:label.thumbnails"))))
(div
("class" "card flex flex_col gap_2")
(text "{{ components::post_media(upload_ids=product.uploads.thumbnails, custom_click=\"remove_thumbnail(event.target)\") }}")
(text "{% if product.uploads.thumbnails|length < 4 -%}")
(button
("onclick" "add_thumbnail()")
(icon (text "plus"))
(str (text "communities:label.upload")))
(text "{%- endif %}")))
(div
("class" "card_nest")
(div
@ -220,7 +237,88 @@
(str (text "general:action.delete")))))
(script
(text "async function update_title_from_form(e) {
(text "async function add_thumbnail() {
await trigger(\"atto::debounce\", [\"products::update\"]);
const picker = document.createElement(\"input\");
picker.type = \"file\";
picker.accept = \"image/*\";
document.body.appendChild(picker);
picker.click();
picker.addEventListener(\"change\", () => {
// create body
const body = new FormData();
for (const file of picker.files) {
body.append(file.name, file);
}
body.append(
\"body\",
JSON.stringify({
target: \"Thumbnails\"
}),
);
// ...
picker.remove();
fetch(\"/api/v1/products/{{ product.id }}/uploads\", {
method: \"POST\",
body,
})
.then((res) => res.json())
.then(async (res) => {
trigger(\"atto::toast\", [
res.ok ? \"success\" : \"error\",
res.message,
]);
if (res.ok) {
setTimeout(() => {
window.location.reload();
}, 100);
}
});
});
}
async function remove_thumbnail(target) {
await trigger(\"atto::debounce\", [\"products::update\"]);
if (
!(await trigger(\"atto::confirm\", [
\"Are you sure you would like to do this?\",
]))
) {
return;
}
fetch(\"/api/v1/products/{{ product.id }}/uploads/thumbnails\", {
method: \"DELETE\",
headers: {
\"Content-Type\": \"application/json\",
},
body: JSON.stringify({
idx: Array.from(target.parentElement.children).findIndex((x) => x.getAttribute(\"data-upload-id\") === target.getAttribute(\"data-upload-id\")),
}),
})
.then((res) => res.json())
.then(async (res) => {
trigger(\"atto::toast\", [
res.ok ? \"success\" : \"error\",
res.message,
]);
if (res.ok) {
setTimeout(() => {
window.location.reload();
}, 100);
}
});
}
async function update_title_from_form(e) {
e.preventDefault();
await trigger(\"atto::debounce\", [\"products::update\"]);