Add authentification
This commit is contained in:
@@ -250,8 +250,8 @@ export function Contract() {
|
||||
) : null}
|
||||
{shipments.some((shipment) => shipment.products.length > 0) ? (
|
||||
<>
|
||||
<Title order={3}>{t("occasional products")}</Title>
|
||||
<Text>{t("select products per shipment")}</Text>
|
||||
<Title order={3}>{t("occasional products", { capfirst: true })}</Title>
|
||||
<Text>{t("select products per shipment", { capfirst: true })}</Text>
|
||||
<Accordion defaultValue={"0"}>
|
||||
{shipments.map((shipment, index) => (
|
||||
<ShipmentForm
|
||||
|
||||
@@ -1,37 +1,26 @@
|
||||
import { ActionIcon, Group, Loader, ScrollArea, Stack, Table, Title, Tooltip } from "@mantine/core";
|
||||
import { t } from "@/config/i18n";
|
||||
import { useCreateContract, useGetContract, useGetContracts } from "@/services/api";
|
||||
import { IconPlus } from "@tabler/icons-react";
|
||||
import { useGetAllContractFile, useGetContracts } from "@/services/api";
|
||||
import { IconDownload } from "@tabler/icons-react";
|
||||
import ContractRow from "@/components/Contracts/Row";
|
||||
import { useLocation, useNavigate, useSearchParams } from "react-router";
|
||||
import { ContractModal } from "@/components/Contracts/Modal";
|
||||
import { useCallback, useMemo } from "react";
|
||||
import { type Contract, type ContractInputs } from "@/services/resources/contracts";
|
||||
import { type Contract } from "@/services/resources/contracts";
|
||||
import ContractsFilters from "@/components/Contracts/Filter";
|
||||
|
||||
export default function Contracts() {
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
// const location = useLocation();
|
||||
// const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const navigate = useNavigate();
|
||||
const getAllContractFilesMutation = useGetAllContractFile();
|
||||
const isdownload = location.pathname.includes("/download");
|
||||
|
||||
// const isCreate = location.pathname === "/dashboard/contracts/create";
|
||||
// const isEdit = location.pathname.includes("/edit");
|
||||
|
||||
// const editId = useMemo(() => {
|
||||
// if (isEdit) {
|
||||
// return location.pathname.split("/")[3];
|
||||
// }
|
||||
// return null;
|
||||
// }, [location, isEdit]);
|
||||
|
||||
// const closeModal = useCallback(() => {
|
||||
// navigate(`/dashboard/contracts${searchParams ? `?${searchParams.toString()}` : ""}`);
|
||||
// }, [navigate, searchParams]);
|
||||
const closeModal = useCallback(() => {
|
||||
navigate(`/dashboard/contracts${searchParams ? `?${searchParams.toString()}` : ""}`);
|
||||
}, [navigate, searchParams]);
|
||||
|
||||
const { data: contracts, isPending } = useGetContracts(searchParams);
|
||||
// const { data: currentContract } = useGetContract(Number(editId), {
|
||||
// enabled: !!editId,
|
||||
// });
|
||||
|
||||
const { data: allContracts } = useGetContracts();
|
||||
|
||||
@@ -56,6 +45,13 @@ export default function Contracts() {
|
||||
[setSearchParams],
|
||||
);
|
||||
|
||||
const handleDownloadContracts = useCallback(
|
||||
async (id: number) => {
|
||||
await getAllContractFilesMutation.mutateAsync(id);
|
||||
},
|
||||
[getAllContractFilesMutation],
|
||||
);
|
||||
|
||||
if (!contracts || isPending)
|
||||
return (
|
||||
<Group align="center" justify="center" h="80vh" w="100%">
|
||||
@@ -66,32 +62,24 @@ export default function Contracts() {
|
||||
return (
|
||||
<Stack>
|
||||
<Group justify="space-between">
|
||||
<Title order={2}>{t("all referers", { capfirst: true })}</Title>
|
||||
{/* <Tooltip label={t("create contract", { capfirst: true })}>
|
||||
<Title order={2}>{t("all contracts", { capfirst: true })}</Title>
|
||||
<Tooltip label={t("download contracts", { capfirst: true })}>
|
||||
<ActionIcon
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
navigate(
|
||||
`/dashboard/contracts/create${searchParams ? `?${searchParams.toString()}` : ""}`,
|
||||
`/dashboard/contracts/download${searchParams ? `?${searchParams.toString()}` : ""}`,
|
||||
);
|
||||
}}
|
||||
>
|
||||
<IconPlus />
|
||||
<IconDownload />
|
||||
</ActionIcon>
|
||||
</Tooltip>
|
||||
<ContractModal
|
||||
key={`${currentContract?.id}_create`}
|
||||
opened={isCreate}
|
||||
opened={isdownload}
|
||||
onClose={closeModal}
|
||||
handleSubmit={handleCreateContract}
|
||||
handleSubmit={handleDownloadContracts}
|
||||
/>
|
||||
<ContractModal
|
||||
key={`${currentContract?.id}_edit`}
|
||||
opened={isEdit}
|
||||
onClose={closeModal}
|
||||
currentContract={currentContract}
|
||||
handleSubmit={handleEditContract}
|
||||
/> */}
|
||||
</Group>
|
||||
<ContractsFilters
|
||||
forms={forms || []}
|
||||
@@ -102,6 +90,7 @@ export default function Contracts() {
|
||||
<Table striped>
|
||||
<Table.Thead>
|
||||
<Table.Tr>
|
||||
<Table.Th>{t("form", { capfirst: true })}</Table.Th>
|
||||
<Table.Th>{t("name", { capfirst: true })}</Table.Th>
|
||||
<Table.Th>{t("email", { capfirst: true })}</Table.Th>
|
||||
<Table.Th>{t("payment method", { capfirst: true })}</Table.Th>
|
||||
|
||||
@@ -1,14 +1,37 @@
|
||||
import { t } from "@/config/i18n";
|
||||
import { Accordion, ActionIcon, Blockquote, Group, NumberInput, Paper, Select, Stack, TableOfContents, Text, TextInput, Title } from "@mantine/core";
|
||||
import { IconEdit, IconInfoCircle, IconLink, IconPlus, IconTestPipe, IconX } from "@tabler/icons-react";
|
||||
import {
|
||||
Accordion,
|
||||
ActionIcon,
|
||||
Blockquote,
|
||||
Group,
|
||||
NumberInput,
|
||||
Paper,
|
||||
Select,
|
||||
Stack,
|
||||
TableOfContents,
|
||||
Text,
|
||||
TextInput,
|
||||
Title,
|
||||
} from "@mantine/core";
|
||||
import {
|
||||
IconEdit,
|
||||
IconInfoCircle,
|
||||
IconLink,
|
||||
IconPlus,
|
||||
IconTestPipe,
|
||||
IconX,
|
||||
} from "@tabler/icons-react";
|
||||
import { Link } from "react-router";
|
||||
|
||||
export function Help() {
|
||||
return (
|
||||
<Stack>
|
||||
<Title order={2}>{t("how to use dashboard", {capfirst: true})}</Title>
|
||||
<Title order={2}>{t("how to use dashboard", { capfirst: true })}</Title>
|
||||
<Text>
|
||||
{t("dashboard is for referers only, with this dashboard you can create productors, products, forms and shipments", {capfirst: true})}
|
||||
{t(
|
||||
"dashboard is for referers only, with this dashboard you can create productors, products, forms and shipments",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<TableOfContents
|
||||
variant="filled"
|
||||
@@ -16,144 +39,255 @@ export function Help() {
|
||||
size="sm"
|
||||
radius="sm"
|
||||
scrollSpyOptions={{
|
||||
selector: 'h3, h4',
|
||||
selector: "h3, h4",
|
||||
}}
|
||||
getControlProps={({ data }) => ({
|
||||
onClick: () => data.getNode().scrollIntoView(),
|
||||
children: data.value,
|
||||
})}
|
||||
/>
|
||||
<Title order={3}>{t("creation order", {capfirst: true})}</Title>
|
||||
<Title order={3}>{t("creation order", { capfirst: true })}</Title>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("a productor", {capfirst: true})}</Title>
|
||||
<Title order={4}>{t("a productor", { capfirst: true })}</Title>
|
||||
<Text>
|
||||
{t("start to create a productor in the productors section", {capfirst: true})}
|
||||
{t("start to create a productor in the productors section", { capfirst: true })}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/productors"
|
||||
aria-label={t("link to the section", {capfirst: true, section: t("productors")})}
|
||||
style={{cursor: "pointer", alignSelf: "center"}}
|
||||
><IconLink/></ActionIcon>
|
||||
</Text>
|
||||
<Text>{t("a productor can be edited if its informations change, it should not be recreated for each contracts", {capfirst: true})}</Text>
|
||||
<Blockquote
|
||||
mt="md"
|
||||
icon={<IconInfoCircle/>}
|
||||
>
|
||||
<Text>{t("to add a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm"><IconPlus/></ActionIcon> {t("button in top left of the page", {section: t("productors")})}</Text>
|
||||
<Text>{t("to edit a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm"><IconEdit/></ActionIcon> {t("button in front of the line you want to edit")}</Text>
|
||||
<Text>{t("to delete a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm" color="red"><IconX/></ActionIcon> {t("button in front of the line you want to delete")}</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("the products", {capfirst: true})}</Title>
|
||||
<Text>
|
||||
{t("add all products linked to this productor in the products section", {capfirst: true})}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {capfirst: true, section: t("products")})}
|
||||
style={{cursor: "pointer", alignSelf: "center"}}
|
||||
><IconLink/></ActionIcon>
|
||||
</Text>
|
||||
<Text>{t("a product can be edited if its informations change, it should not be recreated for each contracts", {capfirst: true})}</Text>
|
||||
<Blockquote
|
||||
mt="md"
|
||||
icon={<IconInfoCircle/>}
|
||||
>
|
||||
<Text>{t("to add a use the", {capfirst: true, section: t("a product")})} <ActionIcon size="sm"><IconPlus/></ActionIcon> {t("button in top left of the page", {section: t("products")})}</Text>
|
||||
<Text>{t("to edit a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm"><IconEdit/></ActionIcon> {t("button in front of the line you want to edit")}</Text>
|
||||
<Text>{t("to delete a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm" color="red"><IconX/></ActionIcon> {t("button in front of the line you want to delete")}</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("a form", {capfirst: true})}</Title>
|
||||
<Text>
|
||||
{t("create your contract form, it will create a form in the home page (accessible to users)", {capfirst: true})}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {capfirst: true, section: t("forms")})}
|
||||
style={{cursor: "pointer", alignSelf: "center"}}
|
||||
><IconLink/></ActionIcon>
|
||||
</Text>
|
||||
<Text>{t("a new contract form should be created for each new season, do not edit a previous contract and change it's values (for history purpose)", {capfirst: true})}</Text>
|
||||
<Blockquote
|
||||
mt="md"
|
||||
icon={<IconInfoCircle/>}
|
||||
>
|
||||
<Text>{t("to add a use the", {capfirst: true, section: t("a form")})} <ActionIcon size="sm"><IconPlus/></ActionIcon> {t("button in top left of the page", {section: t("forms")})}</Text>
|
||||
<Text>{t("to edit a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm"><IconEdit/></ActionIcon> {t("button in front of the line you want to edit")}</Text>
|
||||
<Text>{t("to delete a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm" color="red"><IconX/></ActionIcon> {t("button in front of the line you want to delete")}</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("the shipments", {capfirst: true})}</Title>
|
||||
<Text>
|
||||
{t("create shipments for your contract form", {capfirst: true})}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {capfirst: true, section: t("shipments")})}
|
||||
style={{cursor: "pointer", alignSelf: "center"}}
|
||||
><IconLink/></ActionIcon>
|
||||
</Text>
|
||||
<Text>
|
||||
{t("all shipments should be recreated for each form creation", {capfirst: true})}
|
||||
</Text>
|
||||
<Blockquote
|
||||
mt="md"
|
||||
icon={<IconInfoCircle/>}
|
||||
>
|
||||
<Text>{t("to add a use the", {capfirst: true, section: t("a shipment")})} <ActionIcon size="sm"><IconPlus/></ActionIcon> {t("button in top left of the page", {section: t("shipments")})}</Text>
|
||||
<Text>{t("to edit a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm"><IconEdit/></ActionIcon> {t("button in front of the line you want to edit")}</Text>
|
||||
<Text>{t("to delete a use the", {capfirst: true, section: t("a productor")})} <ActionIcon size="sm" color="red"><IconX/></ActionIcon> {t("button in front of the line you want to delete")}</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Title order={3}>{t("glossary", {capfirst: true})}</Title>
|
||||
<Stack>
|
||||
<Title order={4} fw={700}>{t("product type", {capfirst: true})}</Title>
|
||||
<Text>{t("a product type define the way it will be organized on the final contract form (showed to users) it can be reccurent or occassional. Recurrent products will be set for all shipments if selected by user, Occasional products can be choosen for each shipments", {capfirst: true})}</Text>
|
||||
<Stack>
|
||||
<Text>{t("example in user forms", {capfirst: true})} ({t("recurrent product")}) :</Text>
|
||||
<Blockquote
|
||||
color="black"
|
||||
icon={<IconTestPipe/>}
|
||||
aria-label={t("link to the section", {
|
||||
capfirst: true,
|
||||
section: t("productors"),
|
||||
})}
|
||||
style={{ cursor: "pointer", alignSelf: "center" }}
|
||||
>
|
||||
<Title order={5}>{t('recurrent products')}</Title>
|
||||
<IconLink />
|
||||
</ActionIcon>
|
||||
</Text>
|
||||
<Text>
|
||||
{t(
|
||||
"a productor can be edited if its informations change, it should not be recreated for each contracts",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Blockquote mt="md" icon={<IconInfoCircle />}>
|
||||
<Text>
|
||||
{t("to add a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconPlus />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in top left of the page", { section: t("productors") })}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to edit a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconEdit />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to edit")}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to delete a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm" color="red">
|
||||
<IconX />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to delete")}
|
||||
</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("the products", { capfirst: true })}</Title>
|
||||
<Text>
|
||||
{t("add all products linked to this productor in the products section", {
|
||||
capfirst: true,
|
||||
})}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {
|
||||
capfirst: true,
|
||||
section: t("products"),
|
||||
})}
|
||||
style={{ cursor: "pointer", alignSelf: "center" }}
|
||||
>
|
||||
<IconLink />
|
||||
</ActionIcon>
|
||||
</Text>
|
||||
<Text>
|
||||
{t(
|
||||
"a product can be edited if its informations change, it should not be recreated for each contracts",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Blockquote mt="md" icon={<IconInfoCircle />}>
|
||||
<Text>
|
||||
{t("to add a use the", { capfirst: true, section: t("a product") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconPlus />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in top left of the page", { section: t("products") })}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to edit a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconEdit />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to edit")}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to delete a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm" color="red">
|
||||
<IconX />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to delete")}
|
||||
</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("a form", { capfirst: true })}</Title>
|
||||
<Text>
|
||||
{t(
|
||||
"create your contract form, it will create a form in the home page (accessible to users)",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {
|
||||
capfirst: true,
|
||||
section: t("forms"),
|
||||
})}
|
||||
style={{ cursor: "pointer", alignSelf: "center" }}
|
||||
>
|
||||
<IconLink />
|
||||
</ActionIcon>
|
||||
</Text>
|
||||
<Text>
|
||||
{t(
|
||||
"a new contract form should be created for each new season, do not edit a previous contract and change it's values (for history purpose)",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Blockquote mt="md" icon={<IconInfoCircle />}>
|
||||
<Text>
|
||||
{t("to add a use the", { capfirst: true, section: t("a form") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconPlus />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in top left of the page", { section: t("forms") })}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to edit a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconEdit />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to edit")}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to delete a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm" color="red">
|
||||
<IconX />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to delete")}
|
||||
</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Stack gap="1">
|
||||
<Title order={4}>{t("the shipments", { capfirst: true })}</Title>
|
||||
<Text>
|
||||
{t("create shipments for your contract form", { capfirst: true })}
|
||||
<ActionIcon
|
||||
ml="4"
|
||||
size="xs"
|
||||
component={Link}
|
||||
to="/dashboard/products"
|
||||
aria-label={t("link to the section", {
|
||||
capfirst: true,
|
||||
section: t("shipments"),
|
||||
})}
|
||||
style={{ cursor: "pointer", alignSelf: "center" }}
|
||||
>
|
||||
<IconLink />
|
||||
</ActionIcon>
|
||||
</Text>
|
||||
<Text>
|
||||
{t("all shipments should be recreated for each form creation", {
|
||||
capfirst: true,
|
||||
})}
|
||||
</Text>
|
||||
<Blockquote mt="md" icon={<IconInfoCircle />}>
|
||||
<Text>
|
||||
{t("to add a use the", { capfirst: true, section: t("a shipment") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconPlus />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in top left of the page", { section: t("shipments") })}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to edit a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm">
|
||||
<IconEdit />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to edit")}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("to delete a use the", { capfirst: true, section: t("a productor") })}{" "}
|
||||
<ActionIcon size="sm" color="red">
|
||||
<IconX />
|
||||
</ActionIcon>{" "}
|
||||
{t("button in front of the line you want to delete")}
|
||||
</Text>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Title order={3}>{t("glossary", { capfirst: true })}</Title>
|
||||
<Stack>
|
||||
<Title order={4} fw={700}>
|
||||
{t("product type", { capfirst: true })}
|
||||
</Title>
|
||||
<Text>
|
||||
{t(
|
||||
"a product type define the way it will be organized on the final contract form (showed to users) it can be reccurent or occassional. Recurrent products will be set for all shipments if selected by user, Occasional products can be choosen for each shipments",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Stack>
|
||||
<Text>
|
||||
{t("example in user forms", { capfirst: true })} ({t("recurrent product")})
|
||||
:
|
||||
</Text>
|
||||
<Blockquote color="black" icon={<IconTestPipe />}>
|
||||
<Title order={5}>{t("recurrent products", { capfirst: true })}</Title>
|
||||
<Text size="sm">
|
||||
{t("your selection in this category will apply for all shipments", {
|
||||
capfirst: true,
|
||||
})}
|
||||
</Text>
|
||||
<NumberInput
|
||||
label={t("product example", {capfirst: true})}
|
||||
label={t("product example", { capfirst: true })}
|
||||
description={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
aria-label={t("enter quantity")}
|
||||
placeholder={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
/>
|
||||
</Blockquote>
|
||||
<Text>{t("example in user forms", {capfirst: true})} ({t("occasional product")}) :</Text>
|
||||
<Blockquote
|
||||
color="black"
|
||||
icon={<IconTestPipe/>}
|
||||
>
|
||||
<Title order={5}>{t('occasional products')}</Title>
|
||||
<Text>{t("select products per shipment")}</Text>
|
||||
<Text>
|
||||
{t("example in user forms", { capfirst: true })} ({t("occasional product")})
|
||||
:
|
||||
</Text>
|
||||
<Blockquote color="black" icon={<IconTestPipe />}>
|
||||
<Title order={5}>{t("occasional products", { capfirst: true })}</Title>
|
||||
<Text>{t("select products per shipment", { capfirst: true })}</Text>
|
||||
<Accordion defaultValue={"0"}>
|
||||
<Accordion.Item value={"example1"}>
|
||||
<Accordion.Control>{t("shipment", {capfirst: true})} 1</Accordion.Control>
|
||||
<Accordion.Control>
|
||||
{t("shipment", { capfirst: true })} 1
|
||||
</Accordion.Control>
|
||||
<Accordion.Panel>
|
||||
<NumberInput
|
||||
label={t("product example", {capfirst: true})}
|
||||
label={t("product example", { capfirst: true })}
|
||||
description={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
aria-label={t("enter quantity")}
|
||||
placeholder={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
@@ -161,10 +295,12 @@ export function Help() {
|
||||
</Accordion.Panel>
|
||||
</Accordion.Item>
|
||||
<Accordion.Item value={"example2"}>
|
||||
<Accordion.Control>{t("shipment", {capfirst: true})} 2</Accordion.Control>
|
||||
<Accordion.Control>
|
||||
{t("shipment", { capfirst: true })} 2
|
||||
</Accordion.Control>
|
||||
<Accordion.Panel>
|
||||
<NumberInput
|
||||
label={t("product example", {capfirst: true})}
|
||||
label={t("product example", { capfirst: true })}
|
||||
description={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
aria-label={t("enter quantity")}
|
||||
placeholder={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("piece")}`}
|
||||
@@ -174,58 +310,84 @@ export function Help() {
|
||||
</Accordion>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Title order={4} fw={700}>{t("sell unit", {capfirst: true})}</Title>
|
||||
<Text>{t("the product unit will be assigned to the quantity requested in the form")}</Text>
|
||||
<Title order={4} fw={700}>
|
||||
{t("sell unit", { capfirst: true })}
|
||||
</Title>
|
||||
<Text>
|
||||
{t("the product unit will be assigned to the quantity requested in the form")}
|
||||
</Text>
|
||||
<Stack w={"100%"}>
|
||||
<Text>{t("example in user forms", {capfirst: true})} ({t("with grams as product unit selected")}) :</Text>
|
||||
<Blockquote
|
||||
color="black"
|
||||
icon={<IconTestPipe/>}
|
||||
>
|
||||
<Text>
|
||||
{t("example in user forms", { capfirst: true })} (
|
||||
{t("with grams as product unit selected")}) :
|
||||
</Text>
|
||||
<Blockquote color="black" icon={<IconTestPipe />}>
|
||||
<NumberInput
|
||||
label={t("product example", {capfirst: true})}
|
||||
label={t("product example", { capfirst: true })}
|
||||
description={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("grams")}`}
|
||||
aria-label={t("enter quantity")}
|
||||
placeholder={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("grams")}`}
|
||||
/>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Title order={4} fw={700}>{t("payment methods", {capfirst: true})}</Title>
|
||||
<Text>{t("payment methods are defined for a productor. At the end of a form a section payment method let the user select his prefered payment method", {capfirst: true})}</Text>
|
||||
<Title order={4} fw={700}>
|
||||
{t("payment methods", { capfirst: true })}
|
||||
</Title>
|
||||
<Text>
|
||||
{t(
|
||||
"payment methods are defined for a productor. At the end of a form a section payment method let the user select his prefered payment method",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Stack>
|
||||
<Text>{t("example in user forms", {capfirst: true})} ({t("with cheque and transfer")}) :</Text>
|
||||
<Blockquote
|
||||
color="black"
|
||||
icon={<IconTestPipe/>}
|
||||
>
|
||||
<Text>
|
||||
{t("example in user forms", { capfirst: true })} (
|
||||
{t("with cheque and transfer")}) :
|
||||
</Text>
|
||||
<Blockquote color="black" icon={<IconTestPipe />}>
|
||||
<Title order={5}>{t("payment method", { capfirst: true })}</Title>
|
||||
<Select
|
||||
label={t("payment method", { capfirst: true })}
|
||||
placeholder={t("enter payment method", { capfirst: true })}
|
||||
description={t("choose payment method", { capfirst: true })}
|
||||
data={[t("cheque", {capfirst: true}), t("transfer", {capfirst: true})]}
|
||||
data={[
|
||||
t("cheque", { capfirst: true }),
|
||||
t("transfer", { capfirst: true }),
|
||||
]}
|
||||
/>
|
||||
</Blockquote>
|
||||
</Stack>
|
||||
<Title order={4} fw={700}>{t("product quantity", {capfirst: true})}</Title>
|
||||
<Text>{t("this field is optionnal a product can have a quantity if configured inside the product it will be shown inside the form", {capfirst: true})}</Text>
|
||||
<Title order={4} fw={700}>{t("product quantity unit", {capfirst: true})}</Title>
|
||||
<Text>{t("this field is also optionnal if a product have a quantity you can select the correct unit (metric system). It will be shown next to product quantity inside the form", {capfirst: true})}</Text>
|
||||
<Text>{t("example in user forms", {capfirst: true})} ({t("with 150 set as quantity and g as quantity unit in product")}):</Text>
|
||||
<Blockquote
|
||||
color="black"
|
||||
icon={<IconTestPipe/>}
|
||||
>
|
||||
<Title order={4} fw={700}>
|
||||
{t("product quantity", { capfirst: true })}
|
||||
</Title>
|
||||
<Text>
|
||||
{t(
|
||||
"this field is optionnal a product can have a quantity if configured inside the product it will be shown inside the form",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Title order={4} fw={700}>
|
||||
{t("product quantity unit", { capfirst: true })}
|
||||
</Title>
|
||||
<Text>
|
||||
{t(
|
||||
"this field is also optionnal if a product have a quantity you can select the correct unit (metric system). It will be shown next to product quantity inside the form",
|
||||
{ capfirst: true },
|
||||
)}
|
||||
</Text>
|
||||
<Text>
|
||||
{t("example in user forms", { capfirst: true })} (
|
||||
{t("with 150 set as quantity and g as quantity unit in product")}):
|
||||
</Text>
|
||||
<Blockquote color="black" icon={<IconTestPipe />}>
|
||||
<NumberInput
|
||||
label={`${t("product example", {capfirst: true})} 150g`}
|
||||
label={`${t("product example", { capfirst: true })} 150g`}
|
||||
description={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("pieces")}`}
|
||||
aria-label={t("enter quantity")}
|
||||
placeholder={`${t("enter quantity", { capfirst: true })} ${t("in")} ${t("pieces")}`}
|
||||
/>
|
||||
</Blockquote>
|
||||
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
22
frontend/src/pages/Login/index.tsx
Normal file
22
frontend/src/pages/Login/index.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import { Loader } from "@mantine/core";
|
||||
import { useEffect } from "react";
|
||||
import { useSearchParams } from "react-router";
|
||||
|
||||
export function Login() {
|
||||
const [searchParams] = useSearchParams();
|
||||
|
||||
useEffect(() => {
|
||||
const accessToken = searchParams.get("access_token");
|
||||
const idToken = searchParams.get("id_token");
|
||||
const refreshToken = searchParams.get("refresh_token");
|
||||
|
||||
if (accessToken && idToken) {
|
||||
localStorage.setItem("access_token", accessToken);
|
||||
localStorage.setItem("id_token", idToken);
|
||||
localStorage.setItem("refresh_token", refreshToken || "");
|
||||
window.location.href = "/";
|
||||
}
|
||||
}, [searchParams]);
|
||||
|
||||
return <Loader />;
|
||||
}
|
||||
Reference in New Issue
Block a user