danak/dmenu-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create order

Browse Source
This commit is contained in:
hamid zarghami
2026-06-23 12:31:39 +03:30
parent f83d0743c6
commit 7130c304c5
12 changed files with 247 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/orders/components/CreateOrderAddressSelector.tsx
-4
View File
@@ -27,7 +27,6 @@ const CreateOrderAddressSelector: FC<CreateOrderAddressSelectorProps> = ({
<div className='grid grid-cols-1 sm:grid-cols-2 gap-3'>
{addresses.map((address) => {
const isSelected = selectedAddressId === address.id
const location = [address.province, address.city].filter(Boolean).join('، ')
return (
<button
@@ -48,9 +47,6 @@ const CreateOrderAddressSelector: FC<CreateOrderAddressSelectorProps> = ({
</span>
)}
</div>
{location && (
<div className='text-xs text-description mt-1'>{location}</div>
)}
<div className='text-xs mt-2 line-clamp-2'>{address.address}</div>
</button>
)
src/pages/orders/components/CreateOrderDeliverySection.tsx
+52 -36
View File
@@ -1,8 +1,11 @@
import { type FC } from 'react'
import { type FC, useState } from 'react'
import type { FormikProps } from 'formik'
import { useTranslation } from 'react-i18next'
import Input from '@/components/Input'
import Textarea from '@/components/Textarea'
import DefaulModal from '@/components/DefaulModal'
import LocationInput from '@/pages/settings/components/LocationInput'
import LocationPicker from '@/pages/settings/components/LocationPicker'
import { formatPrice } from '@/helpers/func'
import type { CreateOrderFormValues } from '../hooks/useCreateOrderForm'
import type { RestaurantPaymentMethod, RestaurantShipmentMethod } from '../hooks/useCreateOrderForm'
@@ -21,6 +24,7 @@ interface CreateOrderDeliverySectionProps {
onSelectSavedAddress: (address: UserSavedAddress) => void
onSelectManualAddress: () => void
onAddressFieldChange: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void
onLocationSelect: (lat: number, lng: number) => void
}
const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
@@ -35,8 +39,10 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
onSelectSavedAddress,
onSelectManualAddress,
onAddressFieldChange,
onLocationSelect,
}) => {
const { t } = useTranslation('global')
const [isLocationModalOpen, setIsLocationModalOpen] = useState(false)
const getDeliveryLabel = (method: string) => {
return t(`shipment.${method}`, {
@@ -47,6 +53,14 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
const isAddressReadOnly =
selectedAddressId !== null && customerAddresses.length > 0
const handleMapLocationSelect = (lat: number, lng: number) => {
onLocationSelect(lat, lng)
setIsLocationModalOpen(false)
}
const latitude = formik.values.userAddress.latitude
const longitude = formik.values.userAddress.longitude
return (
<div className='flex flex-col gap-8'>
<div className='w-full bg-white rounded-4xl p-8'>
@@ -109,7 +123,7 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
)}
</div>
{(isDineIn || isCarDelivery) && (
{isDineIn && (
<div className='mt-8'>
<Input
label='شماره میز'
@@ -135,57 +149,36 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
<div className='grid grid-cols-1 sm:grid-cols-2 gap-4 mt-6'>
<Input
label='نام گیرنده'
name='userAddress.fullName'
value={formik.values.userAddress.fullName}
label='عنوان آدرس'
name='userAddress.title'
placeholder='مثال: منزل'
value={formik.values.userAddress.title}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
/>
<Input
label='شماره تماس گیرنده'
label='شماره تماس'
name='userAddress.phone'
value={formik.values.userAddress.phone}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
/>
<Input
label='استان'
name='userAddress.province'
value={formik.values.userAddress.province}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
/>
<Input
label='شهر'
name='userAddress.city'
value={formik.values.userAddress.city}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
/>
<Input
label='کد پستی'
name='userAddress.postalCode'
value={formik.values.userAddress.postalCode}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
/>
<Input
label='عرض جغرافیایی'
type='number'
name='userAddress.latitude'
value={formik.values.userAddress.latitude || ''}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
isNotRequired
/>
<Input
label='طول جغرافیایی'
type='number'
name='userAddress.longitude'
value={formik.values.userAddress.longitude || ''}
onChange={onAddressFieldChange}
readOnly={isAddressReadOnly}
isNotRequired
</div>
<div className={isAddressReadOnly ? 'pointer-events-none opacity-60' : ''}>
<LocationInput
label='موقعیت روی نقشه'
latitude={latitude || undefined}
longitude={longitude || undefined}
onClick={() => setIsLocationModalOpen(true)}
/>
</div>
@@ -198,6 +191,28 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
readOnly={isAddressReadOnly}
/>
</div>
<DefaulModal
open={isLocationModalOpen}
close={() => setIsLocationModalOpen(false)}
isHeader={true}
title_header='انتخاب موقعیت روی نقشه'
width={800}
>
<div className='p-4'>
<LocationPicker
initialPosition={
latitude && longitude
? [latitude, longitude]
: undefined
}
onLocationSelect={handleMapLocationSelect}
/>
<div className='mt-4 text-xs text-gray-600 text-center'>
روی نقشه کلیک کنید تا موقعیت را انتخاب کنید
</div>
</div>
</DefaulModal>
</div>
)}
@@ -243,6 +258,7 @@ const CreateOrderDeliverySection: FC<CreateOrderDeliverySectionProps> = ({
placeholder='توضیحات اضافی برای سفارش...'
value={formik.values.description}
onChange={formik.handleChange}
isNotRequired
/>
</div>
</div>