import Form from '@/components/form/Form'; import FormField from '@/components/form/FormField'; import { Button } from '@/components/ui/button'; import { Card } from '@/components/ui/card'; import AppLayout from '@/layouts/app-layout'; import { yupResolver } from '@hookform/resolvers/yup'; import { Head, router, usePage } from '@inertiajs/react'; import { ArrowLeft, Calendar, Plus } from 'lucide-react'; import { useMemo } from 'react'; import { useFormContext, useWatch } from 'react-hook-form'; import * as yup from 'yup'; declare const route: (...args: any[]) => string; interface StatusOption { label: string; value: number; } interface PageProps extends Record { statuses: StatusOption[]; } const schema = yup.object({ name: yup.string().required('Plan name is required').max(255, 'Plan name must not exceed 255 characters'), customer_group: yup.array().of(yup.string().max(100)).nullable(), discount_type: yup.string().required('Discount type is required').oneOf(['percentage', 'fixed'], 'Invalid discount type'), discount_value: yup.number().typeError('Discount value is required').required('Discount value is required').min(0), priority: yup.number().typeError('Priority must be a number').required('Priority is required').min(0), start_date: yup.string().nullable(), end_date: yup .string() .nullable() .test('after-start', 'End Date / Time must be after Start Date / Time', function (value) { if (!value) return true; const start = this.parent.start_date; if (!start) return true; return new Date(value) >= new Date(start); }), status: yup.number().required('Status is required'), }); const customerGroupOptions = [ { label: 'VIP', value: 'VIP' }, { label: 'Loyalty', value: 'Loyalty' }, { label: 'Wholesale', value: 'Wholesale' }, { label: 'Retail', value: 'Retail' }, ]; export default function Create() { const { statuses } = usePage().props; const defaultValues = useMemo( () => ({ name: '', customer_group: [] as string[], discount_type: 'percentage', discount_value: 0, priority: 0, start_date: '', end_date: '', status: 1, }), [], ); const handleSubmit = (formData: any) => { router.post(route('discount.store'), formData); }; return ( <>

Create Discount Plan

Define the scope of your promotion to target the right audience.

Discount Plan Information

Discount setup

Define when the offer activates.

Overview

({ label: status.label, value: status.value }))} />

Scheduling

); } Create.layout = (page: React.ReactNode) => ( {page} );