diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/assigned.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/assigned.tsx index 983ccd5..4889ae3 100644 --- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/assigned.tsx +++ b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/assigned.tsx @@ -58,15 +58,23 @@ type Schema = z.infer type AssignedProps = { onSubmit: (value: any) => void | Promise courses: Promise<{ hits: Course[] }> + defaultValues?: { enrollments: object[] } } -export function Assigned({ courses, onSubmit }: AssignedProps) { +export function Assigned({ courses, onSubmit, defaultValues }: AssignedProps) { const wizard = useWizard() const { orgid } = useParams() const form = useForm({ resolver: zodResolver(formSchemaAssigned), - defaultValues: { enrollments: [emptyRow] } + defaultValues: { + enrollments: defaultValues?.enrollments?.map((e: any) => ({ + ...e, + scheduled_for: e.scheduled_for ? new Date(e.scheduled_for) : undefined + })) || [emptyRow] + } }) + + console.log(defaultValues) const { formState, control, handleSubmit, setValue } = form const { fields, remove, append } = useFieldArray({ control, diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/bulk.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/bulk.tsx index 8d54fe5..80ff803 100644 --- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/bulk.tsx +++ b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/bulk.tsx @@ -38,6 +38,7 @@ const emptyRow = { type BulkProps = { onSubmit: (value: any) => void | Promise courses: Promise<{ hits: Course[] }> + defaultValues?: { items: object[] } } const item = z.object({ @@ -68,11 +69,11 @@ const formSchema = z.object({ type Schema = z.infer -export function Bulk({ courses, onSubmit }: BulkProps) { +export function Bulk({ courses, onSubmit, defaultValues }: BulkProps) { const wizard = useWizard() const form = useForm({ resolver: zodResolver(formSchema), - defaultValues: { items: [emptyRow] } + defaultValues: { items: defaultValues?.items || [emptyRow] } }) const { formState, diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/payment.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/payment.tsx index 70a620e..7a594b0 100644 --- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/payment.tsx +++ b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/payment.tsx @@ -1,42 +1,99 @@ +import { useForm, Controller } from 'react-hook-form' +import { zodResolver } from '@hookform/resolvers/zod' +import { ErrorMessage } from '@hookform/error-message' +import z from 'zod' + import { Button } from '@repo/ui/components/ui/button' import { Label } from '@repo/ui/components/ui/label' import { RadioGroup, RadioGroupItem } from '@repo/ui/components/ui/radio-group' import { Separator } from '@repo/ui/components/ui/separator' -export function Payment() { +import { useWizard } from '@/components/wizard' + +const formSchema = z.object({ + payment_method: z.enum(['PIX', 'BANK_SLIP', 'CREDIT_CARD'], { + error: 'Escolha uma forma de pagamento' + }) +}) + +type Schema = z.infer + +type PaymentProps = { + onSubmit: (value: any) => void | Promise + defaultValues?: object +} + +export function Payment({ onSubmit, defaultValues }: PaymentProps) { + const wizard = useWizard() + const { control, handleSubmit } = useForm({ + defaultValues: { + payment_method: '' as any, + ...defaultValues + }, + resolver: zodResolver(formSchema) + }) + + const onSubmit_ = async (data: Schema) => { + await onSubmit(data) + wizard('review') + } + return ( - <> - - - - - +
+ ( +
+ + + + + + + + + ( +

{message}

+ )} + /> +
+ )} + /> -
+
+
- + ) } diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/review.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/review.tsx new file mode 100644 index 0000000..1b22de4 --- /dev/null +++ b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/review.tsx @@ -0,0 +1,87 @@ +import { useWizard } from '@/components/wizard' +import { Currency } from '@repo/ui/components/currency' +import { Button } from '@repo/ui/components/ui/button' +import { Separator } from '@repo/ui/components/ui/separator' +import { + Table, + TableBody, + TableCell, + TableFooter, + TableHead, + TableHeader, + TableRow +} from '@repo/ui/components/ui/table' + +type ReviewProps = { + state: any +} + +export function Review({ state }: ReviewProps) { + const wizard = useWizard() + // console.log(state) + + return ( + <> + + + + Curso + Quantidade + Valor unit. + Total + + + + {state?.cart?.items?.map(({ course, quantity }, index) => { + return ( + + {course.name} + {quantity} + + {course.unit_price} + + + {course.unit_price * quantity} + + + ) + })} + + + + + Subtotal + + .. + + + + Descontos + + .. + + + + Total + + .. + + +
+ + + +
+ + +
+ + ) +} diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx index 8595df4..6a1514b 100644 --- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx +++ b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.buy/route.tsx @@ -1,7 +1,8 @@ import type { Route } from './+types/route' +import { useState } from 'react' import { Link } from 'react-router' -import { useToggle } from 'ahooks' +import { useLocalStorageState, useMount, useToggle } from 'ahooks' import { BookSearchIcon, CircleCheckBigIcon, WalletIcon } from 'lucide-react' import { @@ -30,13 +31,28 @@ import type { Course } from '../_.$orgid.enrollments.add/data' import { Assigned } from './assigned' import { Bulk } from './bulk' import { Payment } from './payment' -import { useState } from 'react' +import { Review } from './review' +import { Skeleton } from '@repo/ui/components/skeleton' + +type WizardState = { + index: number + kind: 'bulk' | 'assigned' + cart: any + payment: any +} + +const emptyWizard: WizardState = { + index: 0, + kind: 'bulk', + cart: {}, + payment: {} +} export function meta({}: Route.MetaArgs) { return [{ title: 'Comprar matrículas' }] } -export async function loader({ params, context, request }: Route.LoaderArgs) { +export async function loader({ context }: Route.LoaderArgs) { const cloudflare = context.get(cloudflareContext) const courses = createSearch({ index: 'saladeaula_courses', @@ -57,15 +73,29 @@ export async function action({ request }: Route.ActionArgs) { export default function Route({ loaderData: { courses } }: Route.ComponentProps) { - const [index, setIndex] = useState(0) - const [state, { toggle }] = useToggle('bulk', 'assigned') - - const onSubmit = async (data: any) => { - // await new Promise((r) => setTimeout(r, 2000)) - console.log(data) + const [mounted, setMounted] = useState(false) + const [state, setState] = useLocalStorageState('wizard_cart', { + defaultValue: emptyWizard + }) + const index = state.index + const kind = state.kind + const props = { + courses, + defaultValues: state.cart, + onSubmit: async (data: any) => + setState((prev) => ({ + ...(prev ?? emptyWizard), + cart: data + })) } - const props = { courses, onSubmit } + useMount(() => { + setMounted(true) + }) + + if (!mounted) { + return + } return (
@@ -107,8 +137,17 @@ export default function Route({ - - + + setState((prev) => ({ + ...(prev ?? emptyWizard), + index: nextIndex + })) + } + > + {/* Cart */} + - {state == 'assigned' ? ( + {kind == 'assigned' ? ( ) : ( )} + {/* Payment */} - + { + setState((prev) => ({ + ...(prev ?? emptyWizard), + payment: data + })) + }} + /> + + + {/* Review */} + +