mirror of
https://github.com/badlogic/heissepreise.git
synced 2024-06-30 20:35:50 +02:00
Remove old carts.html/.js
This commit is contained in:
parent
e35d30add7
commit
f6ef2acfe3
|
@ -1,17 +0,0 @@
|
||||||
%%_templates/_header.html%% %%_templates/_menu.html%%
|
|
||||||
|
|
||||||
<div class="w-full relative px-4">
|
|
||||||
<div class="max-w-3xl mx-auto">
|
|
||||||
<h1 class="text-2xl font-bold pb-2 pt-8 text-center">Warenkörbe</h1>
|
|
||||||
<div class="px-4 py-2 my-4 text-sm border rounded-xl md:mt-8 md:rounded-b-none md:mb-0 bg-gray-100 flex gap-4">
|
|
||||||
<input type="button" id="new" value="Neuer Warenkorb" class="text-primary font-medium hover:underline cursor-pointer" />
|
|
||||||
<input type="button" id="export" value="Exportieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
|
||||||
<input type="button" id="import" value="Importieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
|
||||||
</div>
|
|
||||||
<carts-list id="carts" class="carts-list w-full"></carts-list>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<input type="file" id="fileInput" class="hidden" />
|
|
||||||
<script src="carts-new.js"></script>
|
|
||||||
|
|
||||||
%%_templates/_footer.html%%
|
|
|
@ -1,53 +0,0 @@
|
||||||
const { downloadJSON } = require("./misc");
|
|
||||||
const model = require("./model");
|
|
||||||
require("./views");
|
|
||||||
|
|
||||||
function newCart() {
|
|
||||||
let name = prompt("Name für Warenkorb eingeben:");
|
|
||||||
if (!name || name.trim().length == 0) return;
|
|
||||||
name = name.trim();
|
|
||||||
if (model.carts.carts.some((cart) => cart.name === name)) {
|
|
||||||
alert("Warenkorb mit Namen '" + name + "' existiert bereits");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
model.carts.add(name);
|
|
||||||
location.href = `/cart.html?name=${encodeURIComponent(name)}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function importCarts(importedCarts) {
|
|
||||||
for (const importedCart of importedCarts) {
|
|
||||||
const items = [];
|
|
||||||
for (const cartItem of importedCart.items) {
|
|
||||||
const item = model.items.lookup[cartItem.store + cartItem.id];
|
|
||||||
if (!item) continue;
|
|
||||||
items.push(item);
|
|
||||||
}
|
|
||||||
importedCart.items = items;
|
|
||||||
|
|
||||||
const index = model.carts.carts.findIndex((cart) => cart.name === importedCart.name);
|
|
||||||
if (index != -1) {
|
|
||||||
if (confirm("Existierenden Warenkorb '" + importedCart.name + " überschreiben?")) {
|
|
||||||
model.carts.carts[index] = importedCart;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
model.carts.carts.push(importedCart);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
model.carts.save();
|
|
||||||
}
|
|
||||||
|
|
||||||
(async () => {
|
|
||||||
await model.load();
|
|
||||||
document.querySelector("#carts").model = model.carts;
|
|
||||||
document.querySelector("#new").addEventListener("click", () => newCart());
|
|
||||||
document.querySelector("#export").addEventListener("click", () => downloadJSON("carts.json", model.carts.carts));
|
|
||||||
document.querySelector("#import").addEventListener("click", () => document.querySelector("#fileInput").click());
|
|
||||||
document.querySelector("#fileInput").addEventListener("change", function (event) {
|
|
||||||
const reader = new FileReader();
|
|
||||||
reader.onload = (event) => {
|
|
||||||
const importedCarts = JSON.parse(event.target.result);
|
|
||||||
importCarts(importedCarts);
|
|
||||||
};
|
|
||||||
reader.readAsText(event.target.files[0]);
|
|
||||||
});
|
|
||||||
})();
|
|
|
@ -3,18 +3,15 @@
|
||||||
<div class="w-full relative px-4">
|
<div class="w-full relative px-4">
|
||||||
<div class="max-w-3xl mx-auto">
|
<div class="max-w-3xl mx-auto">
|
||||||
<h1 class="text-2xl font-bold pb-2 pt-8 text-center">Warenkörbe</h1>
|
<h1 class="text-2xl font-bold pb-2 pt-8 text-center">Warenkörbe</h1>
|
||||||
<div class="filters px-4 py-2 my-4 text-sm border rounded-xl md:mt-8 md:rounded-b-none md:mb-0 bg-gray-100 flex gap-4" id="numresults">
|
<div class="px-4 py-2 my-4 text-sm border rounded-xl md:mt-8 md:rounded-b-none md:mb-0 bg-gray-100 flex gap-4">
|
||||||
<input type="button" id="newcart" value="Neuer Warenkorb" class="text-primary font-medium hover:underline cursor-pointer" />
|
<input type="button" id="new" value="Neuer Warenkorb" class="text-primary font-medium hover:underline cursor-pointer" />
|
||||||
<input type="button" id="export" value="Exportieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
<input type="button" id="export" value="Exportieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
||||||
<input type="button" id="import" value="Importieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
<input type="button" id="import" value="Importieren" class="text-primary font-medium hover:underline cursor-pointer" />
|
||||||
</div>
|
</div>
|
||||||
<table id="carts" class="carts w-full"></table>
|
<carts-list id="carts" class="carts-list w-full"></carts-list>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<input type="file" id="fileInput" class="hidden" />
|
<input type="file" id="fileInput" class="hidden" />
|
||||||
</div>
|
<script src="carts-new.js"></script>
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="js/alasql.js"></script>
|
|
||||||
<script src="utils.js"></script>
|
|
||||||
<script src="carts.js"></script>
|
|
||||||
|
|
||||||
%%_templates/_footer.html%%
|
%%_templates/_footer.html%%
|
||||||
|
|
165
site/carts.js
165
site/carts.js
|
@ -1,162 +1,53 @@
|
||||||
const shoppingCarts = new ShoppingCarts();
|
const { downloadJSON } = require("./misc");
|
||||||
shoppingCarts.load();
|
const model = require("./model");
|
||||||
|
require("./views");
|
||||||
|
|
||||||
async function load() {
|
function newCart() {
|
||||||
const items = await loadItems();
|
|
||||||
const lookup = {};
|
|
||||||
for (const item of items) {
|
|
||||||
lookup[item.store + item.id] = item;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Update carts with latest price info
|
|
||||||
for (const cart of shoppingCarts.carts) {
|
|
||||||
const items = [];
|
|
||||||
for (const cartItem of cart.items) {
|
|
||||||
const item = lookup[cartItem.store + cartItem.id];
|
|
||||||
if (!item) continue;
|
|
||||||
items.push(item);
|
|
||||||
}
|
|
||||||
cart.items = items;
|
|
||||||
}
|
|
||||||
shoppingCarts.save();
|
|
||||||
|
|
||||||
if (shoppingCarts.carts.findIndex((cart) => cart.name === "Momentum Eigenmarken Vergleich") == -1) {
|
|
||||||
response = await fetch("data/momentum-cart.json");
|
|
||||||
momentumCart = await response.json();
|
|
||||||
shoppingCarts.carts.unshift(momentumCart);
|
|
||||||
shoppingCarts.save();
|
|
||||||
}
|
|
||||||
|
|
||||||
const newCartButton = document.querySelector("#newcart");
|
|
||||||
newCartButton.addEventListener("click", () => {
|
|
||||||
let name = prompt("Name für Warenkorb eingeben:");
|
let name = prompt("Name für Warenkorb eingeben:");
|
||||||
if (!name || name.trim().length == 0) return;
|
if (!name || name.trim().length == 0) return;
|
||||||
name = name.trim();
|
name = name.trim();
|
||||||
for (cart of shoppingCarts.carts) {
|
if (model.carts.carts.some((cart) => cart.name === name)) {
|
||||||
if (cart.name === name) {
|
|
||||||
alert("Warenkorb mit Namen '" + name + "' existiert bereits");
|
alert("Warenkorb mit Namen '" + name + "' existiert bereits");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
model.carts.add(name);
|
||||||
shoppingCarts.add(name);
|
|
||||||
location.href = `/cart.html?name=${encodeURIComponent(name)}`;
|
location.href = `/cart.html?name=${encodeURIComponent(name)}`;
|
||||||
});
|
}
|
||||||
|
|
||||||
const exportButton = document.querySelector("#export");
|
function importCarts(importedCarts) {
|
||||||
exportButton.addEventListener("click", () => {
|
|
||||||
downloadFile("carts.json", JSON.stringify(shoppingCarts.carts, null, 2));
|
|
||||||
});
|
|
||||||
|
|
||||||
const importButton = document.querySelector("#import");
|
|
||||||
importButton.addEventListener("click", () => {
|
|
||||||
document.getElementById("fileInput").value = null;
|
|
||||||
document.getElementById("fileInput").click();
|
|
||||||
});
|
|
||||||
|
|
||||||
document.querySelector("#fileInput").addEventListener("change", function (event) {
|
|
||||||
const file = event.target.files[0];
|
|
||||||
const reader = new FileReader();
|
|
||||||
reader.onload = function (event) {
|
|
||||||
const contents = event.target.result;
|
|
||||||
const importedCarts = JSON.parse(contents);
|
|
||||||
for (const importedCart of importedCarts) {
|
for (const importedCart of importedCarts) {
|
||||||
const items = [];
|
const items = [];
|
||||||
for (const cartItem of importedCart.items) {
|
for (const cartItem of importedCart.items) {
|
||||||
const item = lookup[cartItem.store + cartItem.id];
|
const item = model.items.lookup[cartItem.store + cartItem.id];
|
||||||
if (!item) continue;
|
if (!item) continue;
|
||||||
items.push(item);
|
items.push(item);
|
||||||
}
|
}
|
||||||
importedCart.items = items;
|
importedCart.items = items;
|
||||||
|
|
||||||
const index = shoppingCarts.carts.findIndex((cart) => cart.name === importedCart.name);
|
const index = model.carts.carts.findIndex((cart) => cart.name === importedCart.name);
|
||||||
if (index != -1) {
|
if (index != -1) {
|
||||||
if (confirm("Existierenden Warenkorb '" + importedCart.name + " überschreiben?")) {
|
if (confirm("Existierenden Warenkorb '" + importedCart.name + " überschreiben?")) {
|
||||||
console.log(shoppingCarts.carts[index]);
|
model.carts.carts[index] = importedCart;
|
||||||
shoppingCarts.carts[index] = importedCart;
|
|
||||||
console.log(shoppingCarts.carts[index]);
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
shoppingCarts.carts.push(importedCart);
|
model.carts.carts.push(importedCart);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
shoppingCarts.save();
|
model.carts.save();
|
||||||
showCarts(lookup);
|
}
|
||||||
|
|
||||||
|
(async () => {
|
||||||
|
await model.load();
|
||||||
|
document.querySelector("#carts").model = model.carts;
|
||||||
|
document.querySelector("#new").addEventListener("click", () => newCart());
|
||||||
|
document.querySelector("#export").addEventListener("click", () => downloadJSON("carts.json", model.carts.carts));
|
||||||
|
document.querySelector("#import").addEventListener("click", () => document.querySelector("#fileInput").click());
|
||||||
|
document.querySelector("#fileInput").addEventListener("change", function (event) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = (event) => {
|
||||||
|
const importedCarts = JSON.parse(event.target.result);
|
||||||
|
importCarts(importedCarts);
|
||||||
};
|
};
|
||||||
reader.readAsText(file);
|
reader.readAsText(event.target.files[0]);
|
||||||
});
|
});
|
||||||
|
})();
|
||||||
showCarts(lookup);
|
|
||||||
}
|
|
||||||
|
|
||||||
function showCarts(lookup) {
|
|
||||||
const cartsTable = document.querySelector("#carts");
|
|
||||||
cartsTable.innerHTML = "";
|
|
||||||
cartsTable.appendChild(
|
|
||||||
dom(
|
|
||||||
"thead",
|
|
||||||
`
|
|
||||||
<tr class="bg-primary text-left hidden md:table-row uppercase text-sm text-white">
|
|
||||||
<th class="px-2">Name</th>
|
|
||||||
<th class="px-2">Produkte</th>
|
|
||||||
<th class="px-2">Preis</th>
|
|
||||||
<th class="px-2">Aktionen</th>
|
|
||||||
</tr>
|
|
||||||
`
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
shoppingCarts.carts.forEach((cart) => {
|
|
||||||
let oldPrice = 0;
|
|
||||||
let currPrice = 0;
|
|
||||||
let link = encodeURIComponent(cart.name) + ";";
|
|
||||||
for (const cartItem of cart.items) {
|
|
||||||
const item = lookup[cartItem.store + cartItem.id];
|
|
||||||
if (!item) continue;
|
|
||||||
oldPrice += item.priceHistory[item.priceHistory.length - 1].price;
|
|
||||||
currPrice += item.priceHistory[0].price;
|
|
||||||
link += item.store + item.id + ";";
|
|
||||||
}
|
|
||||||
const increase = oldPrice != 0 ? Math.round(((currPrice - oldPrice) / oldPrice) * 100) : 0;
|
|
||||||
const cartUrl = `cart.html?name=${encodeURIComponent(cart.name)}`;
|
|
||||||
|
|
||||||
const row = dom(
|
|
||||||
"tr",
|
|
||||||
`
|
|
||||||
<td class="px-2 col-span-3" data-label="Name"><a class="hover:underline" href="${cartUrl}">${cart.name}</a></td>
|
|
||||||
<td class="px-2" data-label="Produkte"><span class="md:hidden text-sm">Produkte: </span>${cart.items.length}</td>
|
|
||||||
<td class="px-2 col-span-2" data-label="Preis">
|
|
||||||
<span class="md:hidden text-sm">Preisänderungen: </span>
|
|
||||||
<span style="color: ${currPrice > oldPrice ? "red" : "green"}">${currPrice.toFixed(2)} ${
|
|
||||||
(increase > 0 ? "+" : "") + increase + "%"
|
|
||||||
}</span>
|
|
||||||
</td>
|
|
||||||
<td class="px-2 col-span-3">
|
|
||||||
<div class="cartactions flex gap-4">
|
|
||||||
<a class="text-primary hover:underline text-sm font-medium" href="cart.html?cart=${link}">Teilen</a>
|
|
||||||
<a class="cartjson text-primary hover:underline text-sm font-medium" href="">JSON</a>
|
|
||||||
${
|
|
||||||
cart.name != "Momentum Eigenmarken Vergleich"
|
|
||||||
? `<input class="cartdelete ml-auto text-red-500 hover:underline text-sm font-medium" type="button" value="Löschen">`
|
|
||||||
: ""
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
`
|
|
||||||
);
|
|
||||||
row.classList.add("grid", "grid-cols-3", "hover:bg-gray-100", "border", "border-gray-200", "rounded-md", "p-2", "md:table-row");
|
|
||||||
row.querySelector("td").addEventListener("click", () => (location.href = cartUrl));
|
|
||||||
row.querySelector(".cartjson").addEventListener("click", (event) => {
|
|
||||||
event.preventDefault();
|
|
||||||
downloadFile(cart.name + ".json", JSON.stringify(cart, null, 2));
|
|
||||||
});
|
|
||||||
if (cart.name != "Momentum Eigenmarken Vergleich") {
|
|
||||||
row.querySelector(".cartdelete").addEventListener("click", () => {
|
|
||||||
shoppingCarts.remove(cart.name);
|
|
||||||
showCarts(lookup);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
cartsTable.appendChild(row);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
load();
|
|
||||||
|
|
|
@ -5,7 +5,7 @@ class CartsList extends View {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.innerHTML = /*html*/ `
|
this.innerHTML = /*html*/ `
|
||||||
<table>
|
<table class="w-full">
|
||||||
<thead>
|
<thead>
|
||||||
<tr class="bg-primary text-left hidden md:table-row uppercase text-sm text-white">
|
<tr class="bg-primary text-left hidden md:table-row uppercase text-sm text-white">
|
||||||
<th class="px-2">Name</th>
|
<th class="px-2">Name</th>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user