hamid zarghami
100 lines
3.7 KiB
TypeScript
100 lines
3.7 KiB
TypeScript
import { type FC } from 'react'
|
||
import { TickCircle } from 'iconsax-react'
|
||
import Button from '@/components/Button'
|
||
import { useCreateOrderForm } from './hooks/useCreateOrderForm'
|
||
import CreateOrderCustomerSection from './components/CreateOrderCustomerSection'
|
||
import CreateOrderItemsSection from './components/CreateOrderItemsSection'
|
||
import CreateOrderDeliverySection from './components/CreateOrderDeliverySection'
|
||
import CreateOrderSidebar from './components/CreateOrderSidebar'
|
||
|
||
const CreateOrder: FC = () => {
|
||
const {
|
||
formik,
|
||
foods,
|
||
deliveryMethods,
|
||
cashPaymentMethod,
|
||
selectedDeliveryMethod,
|
||
selectedPaymentMethod,
|
||
isCourierDelivery,
|
||
isCarDelivery,
|
||
isDineIn,
|
||
orderSummary,
|
||
addFoodToOrder,
|
||
updateItemQuantity,
|
||
removeItem,
|
||
isSubmitting,
|
||
customerAddresses,
|
||
selectedAddressId,
|
||
handleUserFound,
|
||
handleUserNotFound,
|
||
clearCustomerData,
|
||
applySavedAddress,
|
||
selectManualAddress,
|
||
handleAddressFieldChange,
|
||
handleLocationSelect,
|
||
} = useCreateOrderForm()
|
||
|
||
return (
|
||
<div className='mt-5'>
|
||
<div className='flex justify-between items-center'>
|
||
<h1 className='text-lg font-light'>ثبت سفارش جدید</h1>
|
||
<Button
|
||
className='w-fit px-6'
|
||
isloading={isSubmitting}
|
||
onClick={() => formik.handleSubmit()}
|
||
>
|
||
<div className='flex gap-2 items-center'>
|
||
<TickCircle size={20} color='#fff' />
|
||
<span>ثبت سفارش</span>
|
||
</div>
|
||
</Button>
|
||
</div>
|
||
|
||
<div className='flex flex-col xl:flex-row gap-7 mt-9'>
|
||
<div className='flex-1 min-w-0 flex flex-col gap-8'>
|
||
<CreateOrderCustomerSection
|
||
formik={formik}
|
||
onUserFound={handleUserFound}
|
||
onUserNotFound={handleUserNotFound}
|
||
onClearCustomerData={clearCustomerData}
|
||
/>
|
||
|
||
<CreateOrderItemsSection
|
||
formik={formik}
|
||
foods={foods}
|
||
onAddFood={addFoodToOrder}
|
||
onUpdateQuantity={updateItemQuantity}
|
||
onRemoveItem={removeItem}
|
||
/>
|
||
|
||
<CreateOrderDeliverySection
|
||
formik={formik}
|
||
deliveryMethods={deliveryMethods}
|
||
cashPaymentMethod={cashPaymentMethod}
|
||
isCourierDelivery={isCourierDelivery}
|
||
isCarDelivery={isCarDelivery}
|
||
isDineIn={isDineIn}
|
||
customerAddresses={customerAddresses}
|
||
selectedAddressId={selectedAddressId}
|
||
onSelectSavedAddress={applySavedAddress}
|
||
onSelectManualAddress={selectManualAddress}
|
||
onAddressFieldChange={handleAddressFieldChange}
|
||
onLocationSelect={handleLocationSelect}
|
||
/>
|
||
</div>
|
||
|
||
<div className='w-full xl:w-[330px] flex-shrink-0 xl:sticky xl:top-4 xl:self-start'>
|
||
<CreateOrderSidebar
|
||
formik={formik}
|
||
orderSummary={orderSummary}
|
||
selectedDeliveryMethod={selectedDeliveryMethod}
|
||
selectedPaymentMethod={selectedPaymentMethod}
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default CreateOrder
|