no more session.shs requests, less requests to use
This commit is contained in:
parent
0d7e172494
commit
ce97de9adb
|
@ -201,149 +201,150 @@ const openLocker = (lat: string, lon: string, openCode: string, id: string) => {
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const refreshPackages = () =>
|
const refreshPackages = async (response?: Package[]) => {
|
||||||
request("packages", {}).then((res: Package[]) => {
|
const res: Package[] = response || (await request("packages", {}));
|
||||||
const table = document.querySelector("tbody")!;
|
const table = document.querySelector("tbody")!;
|
||||||
res.reverse().forEach((shipment) => {
|
res.reverse().forEach((shipment) => {
|
||||||
const row = table.insertRow();
|
const row = table.insertRow();
|
||||||
const id = row.insertCell(0);
|
const id = row.insertCell(0);
|
||||||
const sender = row.insertCell(1);
|
const sender = row.insertCell(1);
|
||||||
const status = row.insertCell(2);
|
const status = row.insertCell(2);
|
||||||
const locker = row.insertCell(3);
|
const locker = row.insertCell(3);
|
||||||
const details = row.insertCell(4);
|
const details = row.insertCell(4);
|
||||||
const opener = row.insertCell(5);
|
const opener = row.insertCell(5);
|
||||||
|
|
||||||
row.dataset.pickupPointLat = shipment.pickupPoint.location.latitude.toString();
|
row.dataset.pickupPointLat = shipment.pickupPoint.location.latitude.toString();
|
||||||
row.dataset.pickupPointLon = shipment.pickupPoint.location.longitude.toString();
|
row.dataset.pickupPointLon = shipment.pickupPoint.location.longitude.toString();
|
||||||
row.dataset.pickupPointDescription = shipment.pickupPoint.description;
|
row.dataset.pickupPointDescription = shipment.pickupPoint.description;
|
||||||
row.dataset.pickupPointName = shipment.pickupPoint.name;
|
row.dataset.pickupPointName = shipment.pickupPoint.name;
|
||||||
row.dataset.pickupPointStatus = shipment.pickupPoint.status;
|
row.dataset.pickupPointStatus = shipment.pickupPoint.status;
|
||||||
row.dataset.pickupPointStreet = shipment.pickupPoint.address.street;
|
row.dataset.pickupPointStreet = shipment.pickupPoint.address.street;
|
||||||
row.dataset.pickupPointStreetNumber = shipment.pickupPoint.address.buildingNumber;
|
row.dataset.pickupPointStreetNumber = shipment.pickupPoint.address.buildingNumber;
|
||||||
row.dataset.pickupPointCity = shipment.pickupPoint.address.city;
|
row.dataset.pickupPointCity = shipment.pickupPoint.address.city;
|
||||||
row.dataset.pickupPointProvince = shipment.pickupPoint.address.province;
|
row.dataset.pickupPointProvince = shipment.pickupPoint.address.province;
|
||||||
row.dataset.pickupPointPostCode = shipment.pickupPoint.address.postCode;
|
row.dataset.pickupPointPostCode = shipment.pickupPoint.address.postCode;
|
||||||
row.dataset.openCode = shipment.openCode;
|
row.dataset.openCode = shipment.openCode;
|
||||||
row.dataset.id = shipment.shipmentNumber;
|
row.dataset.id = shipment.shipmentNumber;
|
||||||
row.dataset.sender = shipment.senderName;
|
row.dataset.sender = shipment.senderName;
|
||||||
row.dataset.status = shipment.status;
|
row.dataset.status = shipment.status;
|
||||||
|
|
||||||
id.innerText = shipment.shipmentNumber;
|
id.innerText = shipment.shipmentNumber;
|
||||||
sender.innerText = shipment.senderName;
|
sender.innerText = shipment.senderName;
|
||||||
status.innerText = shipment.status;
|
status.innerText = shipment.status;
|
||||||
locker.innerText = `${shipment.pickupPoint.name} - ${shipment.pickupPoint.description}`;
|
locker.innerText = `${shipment.pickupPoint.name} - ${shipment.pickupPoint.description}`;
|
||||||
|
|
||||||
const showDetailsAction = document.createElement("a");
|
const showDetailsAction = document.createElement("a");
|
||||||
showDetailsAction.classList.add("button", "is-light", "is-small");
|
showDetailsAction.classList.add("button", "is-light", "is-small");
|
||||||
showDetailsAction.innerHTML = "Info";
|
showDetailsAction.innerHTML = "Info";
|
||||||
|
|
||||||
showDetailsAction.addEventListener("click", async (event) => {
|
showDetailsAction.addEventListener("click", async (event) => {
|
||||||
const detailsBox = document.querySelector(".details-box")! as HTMLDivElement;
|
const detailsBox = document.querySelector(".details-box")! as HTMLDivElement;
|
||||||
detailsBox.style.display = "block";
|
detailsBox.style.display = "block";
|
||||||
const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
|
const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
|
||||||
// maybe this looks like shit, but it works
|
// maybe this looks like shit, but it works
|
||||||
let leafletLoaded = false;
|
let leafletLoaded = false;
|
||||||
try {
|
try {
|
||||||
leafletLoaded = !!L;
|
leafletLoaded = !!L;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (!(e instanceof ReferenceError)) {
|
if (!(e instanceof ReferenceError)) {
|
||||||
throw e;
|
throw e;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
if (!leafletLoaded) {
|
}
|
||||||
document.querySelector("head")!.appendChild(leafletLoaderCSS);
|
if (!leafletLoaded) {
|
||||||
document.querySelector("head")!.appendChild(leafletLoaderJS);
|
document.querySelector("head")!.appendChild(leafletLoaderCSS);
|
||||||
await new Promise((resolve, reject) => {
|
document.querySelector("head")!.appendChild(leafletLoaderJS);
|
||||||
leafletLoaderJS.addEventListener("load", () => {
|
await new Promise((resolve, reject) => {
|
||||||
resolve();
|
leafletLoaderJS.addEventListener("load", () => {
|
||||||
});
|
resolve();
|
||||||
leafletLoaderJS.addEventListener("error", () => {
|
|
||||||
reject();
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
map = L.map("map");
|
leafletLoaderJS.addEventListener("error", () => {
|
||||||
}
|
reject();
|
||||||
map!.setView([parseFloat(data.pickupPointLat!), parseFloat(data.pickupPointLon!)], 17);
|
});
|
||||||
L.tileLayer("https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png", {
|
});
|
||||||
attribution:
|
map = L.map("map");
|
||||||
'Map data © <a href="https://openstreetmap.org/copyright">OpenStreetMap contributors</a>',
|
}
|
||||||
maxZoom: 19,
|
map!.setView([parseFloat(data.pickupPointLat!), parseFloat(data.pickupPointLon!)], 17);
|
||||||
}).addTo(map!);
|
L.tileLayer("https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png", {
|
||||||
// delete previous markers
|
attribution:
|
||||||
while (markers.length > 0) {
|
'Map data © <a href="https://openstreetmap.org/copyright">OpenStreetMap contributors</a>',
|
||||||
// @ts-ignore it's always marker, while loop checks length
|
maxZoom: 19,
|
||||||
map.removeLayer(markers.pop());
|
}).addTo(map!);
|
||||||
}
|
// delete previous markers
|
||||||
const marker = L.marker([
|
while (markers.length > 0) {
|
||||||
parseFloat(data.pickupPointLat!),
|
// @ts-ignore it's always marker, while loop checks length
|
||||||
parseFloat(data.pickupPointLon!),
|
map.removeLayer(markers.pop());
|
||||||
]).addTo(map!);
|
}
|
||||||
markers.push(marker);
|
const marker = L.marker([
|
||||||
const openButton = detailsBox.querySelector(
|
parseFloat(data.pickupPointLat!),
|
||||||
".modal-card-foot button.is-primary",
|
parseFloat(data.pickupPointLon!),
|
||||||
)! as HTMLButtonElement;
|
]).addTo(map!);
|
||||||
if (data.status === PackageStatus.READY_TO_PICKUP) {
|
markers.push(marker);
|
||||||
openButton.removeAttribute("disabled");
|
const openButton = detailsBox.querySelector(
|
||||||
openButton.onclick = (e: Event) => {
|
".modal-card-foot button.is-primary",
|
||||||
e.preventDefault();
|
)! as HTMLButtonElement;
|
||||||
(document.querySelector(".details-box")! as HTMLElement).style.display = "none";
|
if (data.status === PackageStatus.READY_TO_PICKUP) {
|
||||||
const { dataset } = (event.target as Element).parentNode!.parentNode as HTMLElement;
|
openButton.removeAttribute("disabled");
|
||||||
openLocker(
|
openButton.onclick = (e: Event) => {
|
||||||
dataset.pickupPointLat!,
|
e.preventDefault();
|
||||||
dataset.pickupPointLon!,
|
(document.querySelector(".details-box")! as HTMLElement).style.display = "none";
|
||||||
dataset.openCode!,
|
const { dataset } = (event.target as Element).parentNode!.parentNode as HTMLElement;
|
||||||
dataset.id!,
|
openLocker(
|
||||||
);
|
dataset.pickupPointLat!,
|
||||||
};
|
dataset.pickupPointLon!,
|
||||||
} else {
|
dataset.openCode!,
|
||||||
openButton.setAttribute("disabled", "true");
|
dataset.id!,
|
||||||
openButton.onclick = null;
|
);
|
||||||
}
|
};
|
||||||
const infoTable = detailsBox.querySelector(".details-text")! as HTMLTableElement;
|
} else {
|
||||||
// remove previous data from table
|
openButton.setAttribute("disabled", "true");
|
||||||
Array.from(infoTable.tBodies).forEach((tbody) => tbody.remove());
|
openButton.onclick = null;
|
||||||
([
|
}
|
||||||
["Status", "status"],
|
const infoTable = detailsBox.querySelector(".details-text")! as HTMLTableElement;
|
||||||
[
|
// remove previous data from table
|
||||||
"Pickup point",
|
Array.from(infoTable.tBodies).forEach((tbody) => tbody.remove());
|
||||||
(d) => `${d.pickupPointName} (${d.pickupPointStatus})
|
([
|
||||||
|
["Status", "status"],
|
||||||
|
[
|
||||||
|
"Pickup point",
|
||||||
|
(d) => `${d.pickupPointName} (${d.pickupPointStatus})
|
||||||
${d.pickupPointDescription}
|
${d.pickupPointDescription}
|
||||||
${d.pickupPointStreet} ${d.pickupPointStreetNumber}
|
${d.pickupPointStreet} ${d.pickupPointStreetNumber}
|
||||||
${d.pickupPointProvince}
|
${d.pickupPointProvince}
|
||||||
${d.pickupPointPostCode} ${d.pickupPointCity}`,
|
${d.pickupPointPostCode} ${d.pickupPointCity}`,
|
||||||
],
|
],
|
||||||
["Sender", "sender"],
|
["Sender", "sender"],
|
||||||
["Open code", "openCode"],
|
["Open code", "openCode"],
|
||||||
["Package number", "id"],
|
["Package number", "id"],
|
||||||
] as [string, string | ((d: typeof data) => string)][]).forEach(([key, value]) => {
|
] as [string, string | ((d: typeof data) => string)][]).forEach(([key, value]) => {
|
||||||
const infoRow = infoTable.insertRow();
|
const infoRow = infoTable.insertRow();
|
||||||
const keyCell = infoRow.insertCell();
|
const keyCell = infoRow.insertCell();
|
||||||
keyCell.innerText = key;
|
keyCell.innerText = key;
|
||||||
const valueCell = infoRow.insertCell();
|
const valueCell = infoRow.insertCell();
|
||||||
if (typeof value === "string") {
|
if (typeof value === "string") {
|
||||||
valueCell.innerText = `${data[value]}`;
|
valueCell.innerText = `${data[value]}`;
|
||||||
} else {
|
} else {
|
||||||
valueCell.innerText = value(data);
|
valueCell.innerText = value(data);
|
||||||
}
|
}
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const openAction = document.createElement("a");
|
|
||||||
openAction.classList.add("button", "is-light", "is-small");
|
|
||||||
openAction.innerHTML = "Open";
|
|
||||||
if (shipment.status === PackageStatus.READY_TO_PICKUP) {
|
|
||||||
openAction.addEventListener("click", (event) => {
|
|
||||||
const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
|
|
||||||
openLocker(data.pickupPointLat!, data.pickupPointLon!, data.openCode!, data.id!);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
openAction.setAttribute("disabled", "");
|
|
||||||
}
|
|
||||||
|
|
||||||
opener.appendChild(openAction);
|
|
||||||
details.appendChild(showDetailsAction);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const openAction = document.createElement("a");
|
||||||
|
openAction.classList.add("button", "is-light", "is-small");
|
||||||
|
openAction.innerHTML = "Open";
|
||||||
|
if (shipment.status === PackageStatus.READY_TO_PICKUP) {
|
||||||
|
openAction.addEventListener("click", (event) => {
|
||||||
|
const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
|
||||||
|
openLocker(data.pickupPointLat!, data.pickupPointLon!, data.openCode!, data.id!);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
openAction.setAttribute("disabled", "");
|
||||||
|
}
|
||||||
|
|
||||||
|
opener.appendChild(openAction);
|
||||||
|
details.appendChild(showDetailsAction);
|
||||||
});
|
});
|
||||||
|
};
|
||||||
|
|
||||||
window.addEventListener("load", () => {
|
window.addEventListener("load", () => {
|
||||||
const login = document.querySelector(".login-form")!;
|
const login = document.querySelector(".login-form")!;
|
||||||
login.addEventListener("submit", (event) => {
|
login.addEventListener("submit", (event) => {
|
||||||
|
@ -453,29 +454,30 @@ window.addEventListener("load", () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
request("session", {}).then((res) => {
|
request("packages", {}).then((res) => {
|
||||||
switch (parseInt(res.status, 10)) {
|
if (Array.isArray(res)) {
|
||||||
case 200:
|
// logged in, verified e-mail and phone, res is the package list
|
||||||
// logged in, verified e-mail and phone
|
refreshPackages(res);
|
||||||
refreshPackages().then(() => {
|
(document.querySelector(".package-list")! as HTMLDivElement).style.display = "block";
|
||||||
(document.querySelector(".package-list")! as HTMLDivElement).style.display = "block";
|
// just to be sure
|
||||||
});
|
localStorage.removeItem("phone");
|
||||||
localStorage.removeItem("phone");
|
} else {
|
||||||
break;
|
switch (parseInt(res.status, 10)) {
|
||||||
case -1:
|
case -1:
|
||||||
// not logged in
|
// not logged in
|
||||||
[".login-box", ".register-box"].forEach((elementName) => {
|
[".login-box", ".register-box"].forEach((elementName) => {
|
||||||
(document.querySelector(elementName)! as HTMLDivElement).style.display = "block";
|
(document.querySelector(elementName)! as HTMLDivElement).style.display = "block";
|
||||||
});
|
});
|
||||||
break;
|
break;
|
||||||
case -2:
|
case -2:
|
||||||
(document.querySelector(".mail-box")! as HTMLDivElement).style.display = "block";
|
(document.querySelector(".mail-box")! as HTMLDivElement).style.display = "block";
|
||||||
break;
|
break;
|
||||||
case -3:
|
case -3:
|
||||||
(document.querySelector(".sms-box")! as HTMLDivElement).style.display = "block";
|
(document.querySelector(".sms-box")! as HTMLDivElement).style.display = "block";
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
openError(res.description || res.msg || `Session error: ${res.status}`);
|
openError(res.description || res.msg || `Session error: ${res.status}`);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue