submit order base
This commit is contained in:
@@ -1,3 +1,3 @@
|
||||
VITE_TOKEN_NAME = 'negareh_t'
|
||||
VITE_REFRESH_TOKEN_NAME = 'negareh_rt'
|
||||
VITE_API_BASE_URL = 'http://192.168.99.226:4000'
|
||||
VITE_API_BASE_URL = 'http://10.24.161.1:4000'
|
||||
|
||||
@@ -26,7 +26,7 @@ const Button: FC<Props> = memo((props: Props) => {
|
||||
<div className='flex gap-2 items-center'>
|
||||
{
|
||||
!props.percentage ?
|
||||
<MoonLoader size={20} color='#fff' />
|
||||
<MoonLoader size={20} color='#000' />
|
||||
:
|
||||
<span>{props.percentage}%</span>
|
||||
}
|
||||
|
||||
+3
-1
@@ -8,7 +8,9 @@ const instance = axios.create({
|
||||
|
||||
instance.interceptors.request.use(
|
||||
(config) => {
|
||||
const token = getToken();
|
||||
const token =
|
||||
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiIwMUtGWjREWDhTNVJNOFMzMDc1NVZTWUNQUSIsImlhdCI6MTc2OTQ5NzYyMSwiZXhwIjoxNzY5NDk4ODIxfQ.YK6hQh3y-msWITy2sdLMsmwBvwXC5iHa3OxtWphyWQI" ||
|
||||
getToken();
|
||||
if (token) {
|
||||
config.headers.Authorization = `Bearer ${token}`;
|
||||
}
|
||||
|
||||
@@ -1,14 +1,50 @@
|
||||
import { type FC } from 'react'
|
||||
import { useState, type FC } from 'react'
|
||||
import Order from './components/Order'
|
||||
import Button from '@/components/Button'
|
||||
import { TickSquare } from 'iconsax-react'
|
||||
import { useOrderStore } from './store/OrderStore'
|
||||
import { useSubmitOrder } from './hooks/useOrderData'
|
||||
import { toast } from '@/shared/toast'
|
||||
|
||||
const NewOrder: FC = () => {
|
||||
|
||||
const { mutate: submitOrder, isPending } = useSubmitOrder()
|
||||
const [showOrders, setShowOrders] = useState([0])
|
||||
const { items } = useOrderStore()
|
||||
|
||||
const onSubmit = () => {
|
||||
if (items.length > 0) {
|
||||
submitOrder(items)
|
||||
} else {
|
||||
toast('حداقل یک سفارش باید اضافه کنید.', 'error')
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className='mt-5'>
|
||||
<h1 className='text-lg font-light'>
|
||||
سفارش جدید
|
||||
</h1>
|
||||
<div className='justify-between items-center flex'>
|
||||
<h1 className='text-lg font-light'>
|
||||
سفارش جدید
|
||||
</h1>
|
||||
<Button
|
||||
className='w-fit px-5'
|
||||
onClick={onSubmit}
|
||||
isLoading={isPending}
|
||||
>
|
||||
<div className='flex gap-2 items-center'>
|
||||
<TickSquare size={20} color='black' />
|
||||
<div>ثبت نهایی سفارش</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{showOrders.map((item) => {
|
||||
return (
|
||||
<Order addNewItem={() => setShowOrders([...showOrders, showOrders.length])} key={item} />
|
||||
)
|
||||
})}
|
||||
|
||||
<Order />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@ import Select from '@/components/Select'
|
||||
import UploadBox from '@/components/UploadBox'
|
||||
import VoiceRecorder from '@/components/VoiceRecorder'
|
||||
import { COLORS } from '@/constants/colors'
|
||||
import { AddSquare } from 'iconsax-react'
|
||||
import { AddSquare, Edit } from 'iconsax-react'
|
||||
import ProductsSelect from './ProductsSelect'
|
||||
import { useFormik } from 'formik'
|
||||
import * as Yup from 'yup'
|
||||
@@ -13,12 +13,19 @@ import type { AttachmentsType, OrderType, ProductType } from '../type/Types'
|
||||
import { useGetProducts } from '../hooks/useOrderData'
|
||||
import ManageAttribute from './ManageAttribute'
|
||||
import { useMultiUpload, useSingleUpload } from '@/pages/uploader/hooks/useUploader'
|
||||
import { useAuthStore } from '../store/OrderStore'
|
||||
import { useOrderStore } from '../store/OrderStore'
|
||||
import { clx } from '@/helpers/utils'
|
||||
|
||||
const Order: FC = () => {
|
||||
type Props = {
|
||||
addNewItem: () => void,
|
||||
}
|
||||
|
||||
const Order: FC<Props> = ({ addNewItem }) => {
|
||||
|
||||
const { data } = useGetProducts()
|
||||
const { setItems, items } = useAuthStore()
|
||||
const { setItems, items } = useOrderStore()
|
||||
const [indexOrder, setIndexOrder] = useState<number>(-1)
|
||||
const [isEditMode, setIsEditMode] = useState<boolean>(false)
|
||||
const [productSelected, setProductSelected] = useState<ProductType>()
|
||||
const [voiceFile, setVoiceFile] = useState<File>()
|
||||
const [files, setFiles] = useState<File[]>([])
|
||||
@@ -27,14 +34,15 @@ const Order: FC = () => {
|
||||
|
||||
const formik = useFormik<OrderType>({
|
||||
initialValues: {
|
||||
productId: 0,
|
||||
productId: undefined,
|
||||
attachments: [],
|
||||
quantity: undefined,
|
||||
description: '',
|
||||
attributes: []
|
||||
},
|
||||
validationSchema: Yup.object({
|
||||
|
||||
productId: Yup.number().required('این فیلد اجباری می باشد'),
|
||||
quantity: Yup.number().required('این فیلد اجباری می باشد'),
|
||||
}),
|
||||
onSubmit: async (values) => {
|
||||
const attachments: AttachmentsType[] = []
|
||||
@@ -60,8 +68,21 @@ const Order: FC = () => {
|
||||
}
|
||||
})
|
||||
}
|
||||
values.attachments = attachments
|
||||
setItems([...items, values])
|
||||
if (indexOrder === -1) {
|
||||
values.attachments = attachments
|
||||
setIndexOrder(items.length)
|
||||
setItems([...items, values])
|
||||
addNewItem()
|
||||
setIsEditMode(true)
|
||||
} else {
|
||||
if (values.attachments.length) {
|
||||
values.attachments = [...values.attachments, ...attachments]
|
||||
|
||||
}
|
||||
const items_edit = [...items]
|
||||
items_edit[indexOrder] = values
|
||||
setItems(items_edit)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -85,19 +106,8 @@ const Order: FC = () => {
|
||||
<div className='mt-6 rowTwoInput'>
|
||||
<ProductsSelect
|
||||
onChange={handleChange}
|
||||
error_text={formik.touched.productId && formik.errors.productId ? formik.errors.productId : ''}
|
||||
/>
|
||||
|
||||
{/* <Select
|
||||
label='ویژگی'
|
||||
placeholder='انتخاب'
|
||||
items={productSelected?.attributes?.map((item) => {
|
||||
return {
|
||||
label: item.name,
|
||||
value: item.id + ''
|
||||
}
|
||||
}) || []}
|
||||
onChange={handleChangeAttribute}
|
||||
/> */}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@@ -118,6 +128,7 @@ const Order: FC = () => {
|
||||
label='تعداد'
|
||||
placeholder='انتخاب'
|
||||
{...formik.getFieldProps('quantity')}
|
||||
error_text={formik.touched.quantity && formik.errors.quantity ? formik.errors.quantity : ''}
|
||||
/>
|
||||
|
||||
<Input
|
||||
@@ -125,6 +136,8 @@ const Order: FC = () => {
|
||||
readOnly={Number(formik.values.quantity) !== 0}
|
||||
{...formik.getFieldProps('quantity')}
|
||||
type='number'
|
||||
error_text={formik.touched.quantity && formik.errors.quantity ? formik.errors.quantity : ''}
|
||||
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -149,13 +162,22 @@ const Order: FC = () => {
|
||||
|
||||
<div className='mt-6 flex justify-end'>
|
||||
<Button
|
||||
className='bg-transparent border border-primary text-primary w-fit px-6'
|
||||
className={clx(
|
||||
'bg-transparent border border-primary text-primary w-fit px-6',
|
||||
isEditMode && 'bg-transparent border-[#3B82F6] text-[#3B82F6] '
|
||||
)}
|
||||
onClick={() => formik.handleSubmit()}
|
||||
isLoading={singleUpload.isPending || multiUpload.isPending}
|
||||
>
|
||||
<div className='flex gap-1'>
|
||||
<AddSquare color={COLORS.primary} size={20} />
|
||||
{
|
||||
isEditMode ?
|
||||
<Edit color='#3B82F6' size={20} />
|
||||
:
|
||||
<AddSquare color={COLORS.primary} size={20} />
|
||||
}
|
||||
<div>
|
||||
اضافه کردن
|
||||
{isEditMode ? 'ویرایش کردن' : 'اضافه کردن'}
|
||||
</div>
|
||||
</div>
|
||||
</Button>
|
||||
|
||||
@@ -7,6 +7,6 @@ export const getProducts = async () => {
|
||||
};
|
||||
|
||||
export const submitOrder = async (params: OrderType[]) => {
|
||||
const { data } = await axios.post(`/public/order`, params);
|
||||
const { data } = await axios.post(`/public/order`, { items: params });
|
||||
return data;
|
||||
};
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { create } from "zustand";
|
||||
import type { StoreType } from "../type/Types";
|
||||
|
||||
export const useAuthStore = create<StoreType>((set) => ({
|
||||
export const useOrderStore = create<StoreType>((set) => ({
|
||||
items: [],
|
||||
setItems(value) {
|
||||
set({ items: value });
|
||||
|
||||
@@ -17,7 +17,7 @@ export type AttachmentsType = {
|
||||
};
|
||||
|
||||
export type OrderType = {
|
||||
productId: number;
|
||||
productId?: number;
|
||||
quantity?: number;
|
||||
attributes: {
|
||||
attributeId: number;
|
||||
|
||||
Reference in New Issue
Block a user