diff --git a/client/public/auth.mjs b/client/public/auth.mjs
index a81f562..67ab9f5 100644
--- a/client/public/auth.mjs
+++ b/client/public/auth.mjs
@@ -49,7 +49,6 @@ export async function InitAuth0() {
if (isAuthenticated) {
const user = await auth0.getUser();
localStorage.setItem('user', user.given_name || user.nickname);
- NotifyNavbar('login', user);
localStorage.setItem('loggedIn', true);
ready = true;
@@ -67,6 +66,7 @@ export async function InitAuth0() {
const res = await fetch('/api/auth/login', fetchOptions).then(res => res.json());
localStorage.setItem('admin', res.user.admin);
+ NotifyNavbar('login', user);
}
}
diff --git a/client/public/components/css/stock-audit.css b/client/public/components/css/stock-audit.css
new file mode 100644
index 0000000..eb51dca
--- /dev/null
+++ b/client/public/components/css/stock-audit.css
@@ -0,0 +1,70 @@
+.stock-editor {
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+}
+
+.stock-header {
+ display: flex;
+ width: 100%;
+ flex-direction: column;
+ margin-top: 20px;
+ font-size: 2em;
+ border-bottom: 1px solid #ccc;
+}
+
+.collapsible-menu {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ margin-top: 1em;
+}
+
+.menu-header {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-end;
+ font-size: 1.5em;
+ font-weight: bold;
+ cursor: pointer;
+ border-bottom: #1A1A1A solid 1px;
+ min-width: 0;
+}
+
+.menu-header-arrow {
+ transform: rotate(-180deg);
+ margin-left: 0.5em;
+ transition: transform 0.2s ease-in-out;
+}
+
+/* rotate the arrow down when the details are open */
+.menu-header-arrow-down {
+ margin-left: 0.5em;
+ transform: rotate(-90deg);
+}
+
+.menu-content {
+ max-width: fit-content;
+ display: none;
+ flex-direction: column;
+ align-items: flex-start;
+ min-width: 0;
+ margin-top: 1em;
+}
+
+.details-open {
+ display: flex;
+ position: static;
+ width: auto;
+}
+
+.product-details-content-item {
+ padding-top: 0.6em;
+}
+
+.menu-content-item {
+ width: 100%;
+ margin-bottom: 1em;
+}
\ No newline at end of file
diff --git a/client/public/components/navbar.mjs b/client/public/components/navbar.mjs
index 0dc5d91..8a2152c 100644
--- a/client/public/components/navbar.mjs
+++ b/client/public/components/navbar.mjs
@@ -54,8 +54,8 @@ class NavBar extends Component {
${localStorage.user}▾
+ ${this.state.orders.length === 0
+ ? /* html */`
+
+
+
+ `
+ : ''}
${this.state.orders.map(order => /* html */`
@@ -54,6 +78,69 @@ class OrderList extends Component {
}
OnRender() {
+ this.root.querySelectorAll('.order-list-item-shipped-checker').forEach(checkbox => {
+ checkbox.addEventListener('click', async (event) => {
+ const orderID = checkbox.parentElement.parentElement.parentElement.parentElement.parentElement.querySelector('.order-list-item-header-title').innerText.split('#')[1];
+ const options = {
+ method: 'PUT',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Authorization': `Bearer ${await Auth.GetToken()}`,
+ },
+ body: JSON.stringify({
+ status: {
+ shipped: true,
+ },
+ }),
+ };
+ const orderUpdate = await fetch(`/api/auth/staff/order/${orderID}`, options).then(res => res.json());
+
+ const getOptions = {
+ method: 'GET',
+ headers: { Authorization: `Bearer ${await Auth.GetToken()}` },
+ };
+ const res = await fetch('/api/auth/staff/orders', getOptions).then(res => res.json());
+
+ this.setState({
+ ...this.getState,
+ orders: res.data,
+ title: 'Orders left to fufill',
+ none: 'All done :)',
+ });
+ });
+ });
+
+ this.root.querySelectorAll('.order-list-item-done-checker').forEach(checkbox => {
+ checkbox.addEventListener('click', async (event) => {
+ const orderID = checkbox.parentElement.parentElement.parentElement.parentElement.parentElement.querySelector('.order-list-item-header-title').innerText.split('#')[1];
+ const options = {
+ method: 'PUT',
+ headers: {
+ 'Content-Type': 'application/json',
+ 'Authorization': `Bearer ${await Auth.GetToken()}`,
+ },
+ body: JSON.stringify({
+ status: {
+ completed: true,
+ },
+ }),
+ };
+ const orderUpdate = await fetch(`/api/auth/staff/order/${orderID}`, options).then(res => res.json());
+
+ const getOptions = {
+ method: 'GET',
+ headers: { Authorization: `Bearer ${await Auth.GetToken()}` },
+ };
+ const res = await fetch('/api/auth/staff/orders', getOptions).then(res => res.json());
+
+ this.setState({
+ ...this.getState,
+ orders: res.data,
+ title: 'Orders left to fufill',
+ none: 'All done :)',
+ });
+ });
+ });
}
}
diff --git a/client/public/components/order.mjs b/client/public/components/order.mjs
index ee82c4b..04dfb6c 100644
--- a/client/public/components/order.mjs
+++ b/client/public/components/order.mjs
@@ -8,7 +8,7 @@ class Order extends Component {
}
async OnMount() {
- // get order id from search param
+ // get order id from search param
const query = new URLSearchParams(window.location.search);
const id = query.get('id');
@@ -20,7 +20,6 @@ class Order extends Component {
...res,
}, false);
- console.log(this.state);
localStorage.setItem('viewing-order', JSON.stringify({ items: res.items }));
}
@@ -86,22 +85,22 @@ class Order extends Component {