Skip to content
Extraits de code Groupes Projets
Valider 0cd351fa rédigé par aya zouity's avatar aya zouity
Parcourir les fichiers

some update files

parent 266a4801
Branches
1 requête de fusion!89MYD-101/Some updated files
Pipeline #693 réussi avec l'étape
in 4 minutes et 26 secondes
"use client";
import React, { useState } from "react";
import React, { useEffect, useRef, useState } from "react";
import {
Grid,
Card,
CardHeader,
Stack,
InputAdornment,
FormControlLabel,
Switch,
Chip,
Divider,
Typography,
TextField,
Select,
MenuItem,
Autocomplete,
IconButton,
TableContainer,
......@@ -24,22 +17,14 @@ import {
TableBody,
Paper,
Button,
styled,
Dialog,
DialogTitle,
DialogContent,
DialogContentText,
Tooltip,
Alert,
AlertTitle,
Box,
} from "@mui/material";
import LoadingButton from "@mui/lab/LoadingButton";
import CustomBreadcrumbs from "@/components/custom-breadcrumbs/custom-breadcrumbs";
import { paths } from "@/routes/paths";
import { LocalizationProvider } from "@mui/x-date-pickers";
import DialogActions from "@mui/material/DialogActions";
import ProductForm from "../productForm";
import { useForm, SubmitHandler, Controller } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import * as Yup from "yup";
......@@ -62,6 +47,7 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
"Supprimée",
];
const note = ["privée", "au client"];
const motif = ["En rupture du stock", "Retour client"];
const clients = ["client 1"];
const isOrderCompleted = OrderStatus.some(
......@@ -76,15 +62,6 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
) {
return { Article, Coût, Qte, Total };
}
const [open, setOpen] = React.useState(false);
const handleClickOpen = () => {
setOpen(true);
};
const handleClose = () => {
setOpen(false);
};
const validationSchema = Yup.object().shape({
etat: Yup.string().required("État est requis"),
client: Yup.string().required("Client est requis"),
......@@ -101,24 +78,41 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
createData("Article 1", 19, 2, 38),
createData("Article 2", 15, 1, 15),
]);
const handleRefundClick = () => {
setIsRefundClicked(true);
setIsCancelClicked(false);
};
const handleRefund = () => {
console.log("Remboursement effectué avec succès !");
setRefundAmount("");
setRefundReason("");
setIsRefundClicked(false);
};
const [isRefundClicked, setIsRefundClicked] = useState(false);
const [isCancelClicked, setIsCancelClicked] = useState(false);
const [refundAmount, setRefundAmount] = useState("");
const [refundReason, setRefundReason] = useState("");
const [subtotal, setSubtotal] = useState(0);
const [total, setTotal] = useState(0);
const [vat, setVat] = useState(0);
useEffect(() => {
const calculateTotals = () => {
const subtotal = orderItems.reduce((acc, item) => acc + item.Total, 0);
const vat = subtotal * 0.2;
const total = subtotal + vat;
setSubtotal(subtotal);
setVat(vat);
setTotal(total);
};
calculateTotals();
}, [orderItems]);
const handleCancelClick = () => {
setIsCancelClicked(true);
......@@ -126,14 +120,30 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
setRefundAmount("");
setRefundReason("");
};
const formRef = useRef<HTMLFormElement>(null);
const [prevQuantities, setPrevQuantities] = useState(
orderItems.map((item) => item.Qte)
);
const handleQuantityChange = (index: number, value: string) => {
const newOrderItems = [...orderItems];
newOrderItems[index].Qte = Number(value);
setOrderItems(newOrderItems);
const newValue = Number(value);
if (newValue <= prevQuantities[index]) {
newOrderItems[index].Qte = newValue;
newOrderItems[index].Total = newOrderItems[index].Coût * newValue;
setOrderItems(newOrderItems);
}
};
//the following code will be processed after
// const [anchorEl, setAnchorEl] = React.useState(null);
// const handleClick = (event: any) => {
// setAnchorEl(event.currentTarget);
// };
// const handleCloseMenu = () => {
// setAnchorEl(null);
// };
return (
<>
......@@ -163,11 +173,15 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
justifyContent="flex-end"
style={{ marginBottom: "16px" }}
>
<LoadingButton type="submit" variant="contained">
<LoadingButton
type="button"
variant="contained"
onClick={() => formRef.current?.submit()}
>
Modifier la commande
</LoadingButton>
</Grid>
<form onSubmit={handleSubmit(onSubmit)}>
<form ref={formRef} onSubmit={handleSubmit(onSubmit)}>
<Grid container spacing={3}>
<Grid item xs={12} md={8}>
<Card>
......@@ -388,10 +402,13 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
</TableContainer>
<Typography variant="subtitle2" align="right">
Sous-total des articles: 0,00€
Sous-total des articles: {subtotal.toFixed(2)}
</Typography>
<Typography variant="subtitle2" align="right">
TVA 20%: {vat.toFixed(2)}
</Typography>
<Typography variant="subtitle2" align="right">
Total de la commande : 0,00
Total de la commande : {total.toFixed(2)}
</Typography>
{isRefundClicked && !isCancelClicked && (
<Box>
......@@ -418,13 +435,27 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
margin="normal"
/>
</Grid>
<Grid item xs={12}>
<TextField
label="Motif du remboursement (facultatif)"
value={refundReason}
onChange={(e) => setRefundReason(e.target.value)}
fullWidth={true}
margin="normal"
<Grid
item
xs={12}
sx={{
justifyContent: "flex-end",
alignItems: "flex-end",
width: "25%",
}}
>
<Autocomplete
id="combo-box-demo"
options={motif}
sx={{ marginBottom: 2 }}
renderInput={(params) => (
<TextField
{...params}
label="Motif du remboursement"
variant="outlined"
/>
)}
/>
</Grid>
</Grid>
......@@ -439,10 +470,25 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
<Button variant="contained" onClick={handleCancelClick}>
Annuler
</Button>
<Button variant="contained" onClick={handleRefund}>
Rembourser {refundAmount} € manuellement
</Button>
<Grid
container
spacing={2}
sx={{
display: "flex",
justifyContent: "flex-end",
}}
>
<Grid item>
<Button variant="contained" onClick={handleRefund}>
Rembourser par paypal
</Button>
</Grid>
<Grid item>
<Button variant="contained" onClick={handleRefund}>
Rembourser {refundAmount} € manuellement
</Button>
</Grid>
</Grid>
</Grid>
</Box>
)}
......@@ -518,6 +564,154 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
</Grid>
</Stack>
</Card>
{/* the following code will be processed after */}
{/* <Card sx={{ marginBottom: 2 }}>
<CardHeader title="Expedition" />
<Stack spacing={3} sx={{ p: 3 }}>
<Grid container spacing={2} alignItems="center">
<Grid item xs={6}>
<Button
variant="contained"
aria-controls="simple-menu"
aria-haspopup="true"
onClick={handleClick}
>
Etiquette d'aller
</Button>
<Menu
id="simple-menu"
anchorEl={anchorEl}
keepMounted
open={Boolean(anchorEl)}
onClose={handleCloseMenu}
>
<MenuItem onClick={handleCloseMenu}>
Etiquette A4
</MenuItem>
<MenuItem onClick={handleCloseMenu}>
Etiquette 10*10
</MenuItem>
<MenuItem onClick={handleCloseMenu}>
Etiquette 10*15
</MenuItem>
</Menu>
</Grid>
<Grid item xs={6}>
<Button variant="contained">Etiquette de retour</Button>
</Grid>
</Grid>
</Stack>
</Card> */}
<Card
sx={{
marginBottom: 2,
}}
>
<CardHeader
title="Mondial Relay - InPost"
titleTypographyProps={{
fontSize: "16px",
fontWeight: "bold",
}}
/>
<Stack spacing={0} sx={{ p: 2 }}>
<Grid container spacing={2} alignItems="center">
<Grid item xs={12}>
<Box
sx={{
display: "flex",
justifyContent: "space-between",
padding: "8px 16px",
borderBottom: "1px solid #e0e0e0",
backgroundColor: "rgba(245, 245, 245, 0.8)",
}}
>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
Expédition
</Typography>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
96850225
</Typography>
</Box>
<Box
sx={{
display: "flex",
justifyContent: "space-between",
padding: "8px 16px",
borderBottom: "1px solid #e0e0e0",
backgroundColor: "#f9f9f9",
}}
>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
Point Relais ou Locker
</Typography>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
FR-000363
</Typography>
</Box>
<Box
sx={{
display: "flex",
justifyContent: "space-between",
padding: "8px 16px",
backgroundColor: "rgba(245, 245, 245, 0.8)",
}}
>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
Statut
</Typography>
<Typography
variant="body2"
sx={{ fontWeight: "bold", color: "#6b7280" }}
>
Colis enregistré
</Typography>
</Box>
</Grid>
<Grid item xs={12} container justifyContent="center">
<Grid item xs={10}>
<Button
fullWidth
variant="contained"
sx={{ marginBottom: 1, backgroundColor: "#00C853" }}
>
ÉTIQUETTE A4
</Button>
<Button
fullWidth
variant="contained"
sx={{ marginBottom: 1, backgroundColor: "#00C853" }}
>
ÉTIQUETTE A5
</Button>
<Button
fullWidth
variant="contained"
sx={{ marginBottom: 1, backgroundColor: "#00C853" }}
>
ÉTIQUETTE 10X15
</Button>
</Grid>
</Grid>
</Grid>
</Stack>
</Card>
<Card sx={{ marginBottom: 2 }}>
<CardHeader title="Historique du client" />
<Stack spacing={3} sx={{ p: 3 }}>
......@@ -573,6 +767,7 @@ export default function OrderEditView({ id }: OrderEditViewProps) {
</Card>
</Grid>
</Grid>
s
</form>
</LocalizationProvider>
</>
......
......@@ -230,11 +230,11 @@ export default function OrderDeletedTableRow({
<ConfirmDialog
open={confirm.value}
onClose={confirm.onFalse}
title="Mettre à la corbeille"
content="Etes-vous sûr de vouloir le mettre à la corbeille?"
title="supprimer définitivement la commande"
content="Etes-vous sûr de vouloir supprimer définitivement la commande?"
action={
<Button variant="contained" color="error" onClick={onDeleteRow}>
Mettre à la corbeille
supprimer définitivement la commande
</Button>
}
/>
......
......@@ -21,7 +21,7 @@ import { useBoolean } from "../../../hooks/use-boolean";
import { isAfter, isBetween } from "../../../utils/format-time";
import { _orders, ORDER_STATUS_OPTIONS, OrderStatus } from "../../_mock";
import { _orders, OrderStatus } from "../../_mock";
import Label from "../../components/label";
import Iconify from "../../../components/iconify";
......@@ -49,7 +49,6 @@ import {
} from "../../types/order";
import OrderTableFiltersResult from "./all-orders/order-table-filters-result";
import { Grid } from "@mui/material";
import OrderDeletedTableRow from "./order-deleted-row";
import OrderDeletedToolbar from "./order-deleted-toolbar";
import { Recycling } from "@mui/icons-material";
......@@ -284,7 +283,7 @@ export default function OrderListDeleted() {
}
action={
<>
<Tooltip title="Mettre à la corbeille">
<Tooltip title="supprimer">
<IconButton color="primary" onClick={confirm.onTrue}>
<Iconify icon="solar:trash-bin-trash-bold" />
</IconButton>
......@@ -367,10 +366,10 @@ export default function OrderListDeleted() {
<ConfirmDialog
open={confirm.value}
onClose={confirm.onFalse}
title="Mettre à la corbeille"
title="supprimer définitivement la commande"
content={
<>
Are you sure want to put <strong> {table.selected.length} </strong>{" "}
Are you sure want to delete<strong> {table.selected.length} </strong>{" "}
items to the wastepaper basket?
</>
}
......@@ -383,7 +382,7 @@ export default function OrderListDeleted() {
confirm.onFalse();
}}
>
Mettre à la corbeille
supprimer définitivement la commande
</Button>
}
/>
......
......@@ -35,12 +35,21 @@ export default function OrderFilters({
}: Props) {
const [isDateRangeOpen, setIsDateRangeOpen] = useState(false);
const [selectAll, setSelectAll] = useState(true);
const OrderSource = _orders.map((order) => order.origine);
const [filterByRefund, setFilterByRefund] = useState("");
const [compareOptions, setCompareOptions] = useState({
previousPeriod: false,
previousYear: false,
});
const OrderSource = _orders.map((order) => order.origine);
const [filterByRefund, setFilterByRefund] = useState(false);
const handleChange = (event:any) => {
const { value } = event.target;
setFilterByRefund(value);
setCompareOptions({
previousPeriod: value === "period",
previousYear: value === "date",
});
};
useEffect(() => {
setSelectAll(selectedOrders.length === OrderSource.length);
......@@ -139,15 +148,8 @@ export default function OrderFilters({
<FormControl sx={{ m: 1, width: 300 }}>
<InputLabel>Remboursement</InputLabel>
<Select
value={filterByRefund ? "period" : ""}
onChange={(event) => {
const { value } = event.target;
setFilterByRefund(value === "period");
setCompareOptions({
previousPeriod: value === "period",
previousYear: value === "date",
});
}}
value={filterByRefund}
onChange={handleChange}
input={<OutlinedInput sx={{ height: 50 }} label="Remboursement" />}
>
<MenuItem value="period">selon la période en cours</MenuItem>
......
import React, { useState } from "react";
import Button from "@mui/material/Button";
import Tooltip from "@mui/material/Tooltip";
import MenuItem from "@mui/material/MenuItem";
......@@ -6,6 +7,7 @@ import Checkbox from "@mui/material/Checkbox";
import TableCell from "@mui/material/TableCell";
import IconButton from "@mui/material/IconButton";
import ListItemText from "@mui/material/ListItemText";
import Avatar from "@mui/material/Avatar";
import { useBoolean } from "@/hooks/use-boolean";
......@@ -19,7 +21,6 @@ import ExitToAppIcon from "@mui/icons-material/ExitToApp";
import UserQuickEditForm from "./user-quick-edit-form";
import { _roles } from "@/shared/_mock";
import { Avatar } from "@mui/material";
// ----------------------------------------------------------------------
......@@ -41,11 +42,16 @@ export default function UserTableRow({
const { name, avatarUrl, loginActivity, status, email, pseudo, role } = row;
const confirm = useBoolean();
const quickEdit = useBoolean();
const popover = usePopover();
const [userLoginActivity, setUserLoginActivity] = useState(loginActivity);
const handleLogout = () => {
setUserLoginActivity("offline");
popover.onClose();
};
return (
<>
<TableRow hover selected={selected}>
......@@ -56,9 +62,9 @@ export default function UserTableRow({
<TableCell sx={{ whiteSpace: "nowrap" }}>
<Label
variant="soft"
color={(loginActivity === "online" && "success") || "default"}
color={(userLoginActivity === "online" && "success") || "default"}
>
{loginActivity}
{userLoginActivity}
</Label>
</TableCell>
......@@ -145,8 +151,8 @@ export default function UserTableRow({
<Iconify icon="solar:pen-bold" />
Edit
</MenuItem>
{loginActivity === "online" && (
<MenuItem>
{userLoginActivity === "online" && (
<MenuItem onClick={handleLogout}>
<ExitToAppIcon />
Logout
</MenuItem>
......
0% ou .
You are about to add 0 people to the discussion. Proceed with caution.
Terminez d'abord l'édition de ce message.
Veuillez vous inscrire ou vous pour commenter