Skip to content

Commit

Permalink
Merge pull request #38 from ungdev/maj2024
Browse files Browse the repository at this point in the history 
Update 2024
  • Loading branch information
@TeddyRoncin
TeddyRoncin authored Sep 11, 2024
2 parents a45736c + d5f3225 commit 4473d03
Show file tree
Hide file tree
Showing 8 changed files with 507 additions and 48 deletions.
58 changes: 41 additions & 17 deletions src/app/page.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,28 +42,52 @@ body {

#index {
display: flex;
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
align-items: stretch;
flex-direction: column;
justify-content: felx-start;
flex-wrap: nowrap;
align-items: flex-start;
height: calc(100% - 50px);
font-size: 3em;

div {
height: calc(33% - 20px - 4px);
width: calc(50% - 20px - 4px - 20px);
display: flex;
justify-content: center;
align-items: center;
background-color: var(--primary);
margin: 10px;
div.link_category {
display: grid;
grid-template-columns: 100%;
grid-template-rows: 3rem auto;
row-gap: 10px;
height: calc(33% - 20px);
width: calc(100% - 20px);
padding: 10px;

.fa {
margin-right: 15px;
p {
font-size: 1em;
margin: 0px;
width: max-content;
}

&:hover {
filter: brightness(0.9);
div.links_btns {
height: calc(100%);
width: 100%;
display: flex;
flex-direction: row;

div {
height: 100%;
width: calc(25% - 20px);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
row-gap: 5%;
background-color: var(--primary);
margin: 0px 10px;
border-radius: .2em;

&:hover {
filter: brightness(0.9);
}
}
}
}
}


}
87 changes: 69 additions & 18 deletions src/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,20 @@
import React from 'react';
import 'moment/locale/fr';
import moment from 'moment';
import { useDispatch } from 'react-redux';
import { useDispatch, useSelector } from 'react-redux';
import Navbar from '@/components/navbar';
import FontAwesome from 'react-fontawesome';
import { logout } from '@/reducers/login';
import { Action } from 'redux';
import { State } from "@/types";
import { useRouter } from 'next/navigation';

moment.locale('fr');

const App = () => {
const dispatch = useDispatch();
const router = useRouter();
const login = useSelector((state: State) => state.login);
return (
<>
<Navbar>
Expand All @@ -22,23 +24,72 @@ const App = () => {
</div>
</Navbar>
<div id="index">
<div onClick={() => router.push('/sell?except=goodies')}>
<FontAwesome name="hamburger" /> Vente de bouffe
</div>
<div onClick={() => router.push('/sell?only=goodies')}>
<FontAwesome name="tshirt" /> Vente de goodies
</div>
<div onClick={() => router.push('/preparation')}>
<FontAwesome name="check" /> Préparation générale
</div>
<div onClick={() => router.push('/preparation?only=pizzas')}>
<FontAwesome name="pizza-slice" /> Préparation des pizzas
</div>
<div onClick={() => router.push('/tv')}>
<FontAwesome name="tv" /> TV
</div>
<div onClick={() => router.push('/items')}>
<FontAwesome name="receipt" /> Gestion des items
{ ['admin','preparator'].includes(login.key) &&
<>
<div className='link_category'>
<p>Préparation par commande :</p>
<div className='links_btns'>
<div onClick={() => router.push('/preparation')}>
<FontAwesome name="check" /> Général
</div>
<div onClick={() => router.push('/preparation?only=pizzas')}>
<FontAwesome name="pizza-slice" /> Pizzas
</div>
<div onClick={() => router.push('/preparation?only=crepes,galettes')}>
<FontAwesome name="stroopwafel" /> Crêpes
</div>
<div onClick={() => router.push('/preparation?only=croques')}>
<FontAwesome name="bread-slice" /> Croques
</div>
</div>
</div>
<div className='link_category'>
<p>Préparation par item :</p>
<div className='links_btns'>
<div onClick={() => router.push('/preparation?by=item')}>
<FontAwesome name="check" /> Général
</div>
<div onClick={() => router.push('/preparation?only=pizzas&by=item')}>
<FontAwesome name="pizza-slice" /> Pizzas
</div>
<div onClick={() => router.push('/preparation?only=crepes,galettes&by=item')}>
<FontAwesome name="stroopwafel" /> Crêpes
</div>
<div onClick={() => router.push('/preparation?only=croques&by=item')}>
<FontAwesome name="bread-slice" /> Croques
</div>
</div>
</div>
</>
}
<div className='link_category'>
{ ['admin','seller','preparator','tv'].includes(login.key) &&
<>
<p>Autres controles :</p>
<div className='links_btns'>
{ ['admin','seller'].includes(login.key) &&
<div onClick={() => router.push('/sell')}>
<FontAwesome name="money-bill" /> Vente
</div>
}
{ login.key === 'admin' &&
<div onClick={() => router.push('/items')}>
<FontAwesome name="receipt" /> Gestion
</div>
}
{ ['admin','preparator'].includes(login.key) &&
<div onClick={() => router.push('/service')}>
<FontAwesome name="hamburger" /> Service
</div>
}
{ ['admin','tv'].includes(login.key) &&
<div onClick={() => router.push('/tv')}>
<FontAwesome name="tv" /> TV
</div>
}
</div>
</>
}
</div>
</div>
</>
Expand Down
39 changes: 33 additions & 6 deletions src/app/preparation/page.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,12 @@
.status {
margin: auto;
width: 100%;
height: 100%;
height: calc(100% - 20px);
padding: 10px 14px 0;

&::-webkit-scrollbar {
width: 0 !important;
}
overflow-x: hidden;
overflow-y: auto;
scrollbar-color: var(--primary-light) transparent;
scrollbar-width: auto;

.title {
font-size: 1.5em;
Expand All @@ -40,6 +40,7 @@
.status .orders .order {
background: var(--primary-light);
padding-left: 10px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
Expand All @@ -51,9 +52,13 @@
margin: 5px 0;
width: 20%;

.place,
.quantity {
font-size: 1.75em;
}

.place {
margin-bottom: 10px;
font-size: 1.75em;
}
}

Expand All @@ -66,6 +71,23 @@
}
}

&.timewarning:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 10px;
height: 100%;
}

&.orange:before {
background-color: var(--toastify-color-warning);
}

&.red:before {
background-color: var(--toastify-color-error);
}

.next {
background-color: var(--success);
width: 20%;
Expand All @@ -81,6 +103,11 @@
transition: transform 0.5s ease-in, opacity 0.5s ease-in;
}

&.disabled {
visibility: hidden;
background-color: var(--warning-dark);
}

&.downgrade {
background-color: var(--warning-dark);

Expand Down
57 changes: 53 additions & 4 deletions src/app/preparation/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,15 @@ const Page = () => {

// Renvoie les commandes contenant au moins un item dans la catégory du paramètre
if (searchParams.has("only")) {
const categoriesToDisplay = searchParams.get("only").split(",");
orders = orders.filter((order) =>
order.orderItems.some((orderItem) => orderItem.item.category.key == searchParams.get("only"))
order.orderItems.some((orderItem) => categoriesToDisplay.includes(orderItem.item.category.key))
);
if (searchParams.has("by") && searchParams.get("by") == "item") {
orders.forEach((order) => {
order.orderItems = order.orderItems.filter((orderItem) => categoriesToDisplay.includes(orderItem.item.category.key));
});
}
}

// used only to refresh the component every minute
Expand Down Expand Up @@ -65,11 +71,44 @@ const Page = () => {
}
};

const separate_by: string = searchParams.get('by') ?? 'order';

const displayOrders = (orders: Array<Order>) => {

const tenMinutesAgo: moment.Moment = moment().subtract(1, 'minutes');
const twentyMinutesAgo: moment.Moment = moment().subtract(20, 'minutes');

type itemQuantity = {
id: number,
name: string,
quantity: number,
}

const items: Array<itemQuantity> = [];

if (separate_by === 'item') {
orders.forEach((order) => {
order.orderItems.forEach(orderItem => {
const itemId: number = orderItem.item.id;
const itemName: string = orderItem.item.name
if (items.some(item => item.id === itemId)) {
items.find(item => item.id === itemId).quantity ++;
} else {
const item: itemQuantity = {
id: itemId,
name: itemName,
quantity: 1
};
items.push(item);
}
})
});
}

return (
<div className="orders">
{orders.map((order) => (
<div className="order" key={order.id}>
{separate_by === 'order' && orders.map((order) => (
<div className={`order ${moment(order.createdAt).isAfter(twentyMinutesAgo) ? (moment(order.createdAt).isAfter(tenMinutesAgo) ? "" : "timewarning orange") : "timewarning red"}`} key={order.id}>
<div className="titles">
<span className="place">{order.place}</span>
<span>{moment(order.createdAt).fromNow(true)}</span>
Expand All @@ -89,12 +128,22 @@ const Page = () => {
<Loader />
</div>
) : (
<div className={`next ${downgradeMode ? "downgrade" : ""}`} onClick={() => editOrder(order)}>
<div className={`next ${downgradeMode ? "downgrade" : (order.status === Status.READY ? "disabled" : "")}`} onClick={() => editOrder(order)}>
<FontAwesome name="arrow-right" />
</div>
)}
</div>
))}
{separate_by === 'item' && items.map((item) => (
<div className="order" key={item.id}>
<div className="titles">
<span className="quantity">x {item.quantity}</span>
</div>
<ul className="items">
{item.name}
</ul>
</div>
))}
</div>
);
};
Expand Down
Loading

0 comments on commit 4473d03

Please sign in to comment.