From c47ea73fdbe746357e0f510e6b1deeda783e63ef Mon Sep 17 00:00:00 2001 From: KarimAldeen Date: Tue, 5 Mar 2024 11:35:35 +0300 Subject: [PATCH] Done --- src/Components/ValidationField/View/Date.tsx | 5 +- .../ValidationField/View/SearchField.tsx | 13 +- .../ValidationField/View/SelectField.tsx | 2 +- src/Components/ValidationField/types.ts | 4 +- src/Hooks/imageUrlToFile.tsx | 13 + src/Hooks/useFormatToSelect.tsx | 4 +- src/Layout/Dashboard/SearchField.tsx | 41 +- src/Layout/Dashboard/ViewPage.tsx | 2 +- .../View/Add/AttributeTab/AttributeTabs.tsx | 2 +- .../View/Add/AttributeTab/Field/File.tsx | 9 +- .../View/Add/AttributeTab/Field/FormItem.tsx | 2 +- .../View/Add/AttributeTab/Field/Select.tsx | 14 +- .../View/Add/AttributeTab/TabsContainer.tsx | 133 +++-- .../Add/AttributeValueTab/AttributeTabs.tsx | 88 ++-- .../View/Add/AttributeValueTab/Field/File.tsx | 6 +- .../View/Add/AttributeValueTab/Field/Hex.tsx | 18 + .../Add/AttributeValueTab/TabsContainer.tsx | 82 +-- src/Pages/Categories/View/AddPage.tsx | 216 ++++++-- .../View/Edit/AttributeTab/AttributeTabs.tsx | 3 +- .../View/Edit/AttributeTab/Field/FormItem.tsx | 6 +- .../View/Edit/AttributeTab/Field/Select.tsx | 12 +- .../View/Edit/AttributeTab/TabsContainer.tsx | 114 +++-- .../Edit/AttributeValueTab/AttributeTabs.tsx | 2 +- .../Edit/AttributeValueTab/Field/File.tsx | 6 +- .../Edit/AttributeValueTab/Field/FormItem.tsx | 6 +- .../Edit/AttributeValueTab/TabsContainer.tsx | 149 +++--- src/Pages/Categories/View/Edit/Form.tsx | 10 +- src/Pages/Categories/View/EditPage.tsx | 474 ++++++++++++++++-- src/Pages/Categories/formUtil.ts | 62 ++- src/Pages/Categories/useTableColumns.tsx | 4 +- src/Pages/Coupon/Page.tsx | 2 +- src/Pages/Coupon/View/AddForm.tsx | 5 +- src/Pages/Coupon/View/AddPage.tsx | 3 +- src/Pages/Coupon/View/EditForm.tsx | 6 +- src/Pages/Coupon/View/EditPage.tsx | 49 +- src/Pages/Coupon/formUtil.ts | 26 +- src/Pages/Coupon/useTableColumns.tsx | 2 + src/Pages/Products/ProductsPage.tsx | 2 +- src/Pages/Products/View/AddPage.tsx | 205 +++++--- src/Pages/Products/View/Atteibute.tsx | 37 -- src/Pages/Products/View/AttributeInfo.tsx | 34 -- src/Pages/Products/View/BasicInfo.tsx | 8 +- src/Pages/Products/View/Edit/BasicInfo.tsx | 45 -- .../View/Edit/FormikTab/Field/Atteibute.tsx | 36 -- .../View/Edit/FormikTab/Field/File.tsx | 64 --- .../View/Edit/FormikTab/Field/FileImage.tsx | 50 -- .../View/Edit/FormikTab/Field/Object.tsx | 116 ----- .../View/Edit/FormikTab/Field/SearchTabs.tsx | 60 --- .../View/Edit/FormikTab/Field/Select.tsx | 41 -- .../Products/View/Edit/FormikTab/FormItem.tsx | 20 - .../Products/View/Edit/FormikTab/TabItem.tsx | 13 - .../View/Edit/FormikTab/TabsContainer.tsx | 116 ----- .../View/Edit/FormikTab/VariableTabs.tsx | 71 --- src/Pages/Products/View/Edit/VarianInfo.tsx | 13 - src/Pages/Products/View/EditPage.tsx | 291 +++++++++-- .../View/FormikTab/Field/Atteibute.tsx | 57 ++- .../Products/View/FormikTab/Field/File.tsx | 12 +- .../View/FormikTab/Field/FileImage.tsx | 37 +- .../Products/View/FormikTab/Field/Object.tsx | 143 ++---- .../View/FormikTab/Field/SearchTabs.tsx | 60 --- .../Products/View/FormikTab/Field/Select.tsx | 41 -- src/Pages/Products/View/FormikTab/TabItem.tsx | 13 - .../Products/View/FormikTab/TabsContainer.tsx | 151 +++--- .../Products/View/FormikTab/VariableTabs.tsx | 2 + src/Pages/Products/View/VarianInfo.tsx | 13 - src/Pages/Products/formUtil.ts | 81 +-- src/Pages/Products/useTableColumns.tsx | 5 +- src/Pages/Slider/Page.tsx | 3 +- src/Pages/order/Edit/EditForm.tsx | 2 + src/Pages/order/Edit/EditPage.tsx | 24 +- src/Pages/order/Edit/formUtil.ts | 6 +- src/Pages/order/OrderPage.tsx | 2 +- src/Pages/order/useTableColumns.tsx | 4 +- src/Pages/order/view-one/useTableColumns.js | 4 +- src/Styles/Layout/Layout.scss | 41 +- src/Styles/Layout/Table.scss | 8 + src/api/Categories.ts | 2 +- src/api/Coupon.ts | 2 +- src/api/attribute.ts | 6 +- src/api/attributeValue.ts | 3 +- src/api/dist/Account.js | 55 -- src/api/dist/Categories.js | 20 - src/api/dist/Coupon.js | 20 - src/api/dist/Slider.js | 20 - src/api/dist/appSetting.js | 18 - src/api/dist/attribute.js | 23 - src/api/dist/auth.js | 10 - src/api/dist/config.js | 12 - src/api/dist/order.js | 24 - src/api/dist/product.js | 26 - src/api/dist/users.js | 20 - src/api/helper/dist/AxiosBuilder.js | 40 -- src/api/helper/dist/Get.js | 61 --- src/api/helper/dist/buildFormData.js | 17 - src/api/helper/dist/ueGetPagination.js | 84 ---- src/api/helper/dist/useAddMutation.js | 74 --- src/api/helper/dist/useAxios.js | 18 - src/api/helper/dist/useDeleteMutation.js | 79 --- src/api/helper/dist/useGetOneQuery.js | 81 --- src/api/helper/dist/useGetQuery.js | 81 --- src/api/helper/dist/useGetSingleQuery.js | 81 --- src/api/helper/dist/useToggleStatus.js | 89 ---- src/api/helper/dist/useUpdateMutation.js | 79 --- src/api/helper/dist/useUpdateMutationPut.js | 79 --- src/api/helper/dist/useUploadWithProgress.js | 93 ---- src/api/helper/useDeleteMutation.ts | 7 +- src/api/helper/useUpdateMutation.ts | 20 +- src/api/helper/useUpdateMutationById.ts | 57 +++ src/api/order.ts | 2 +- src/api/product.ts | 10 +- src/translate/ar.json | 27 +- src/translate/de.json | 30 +- src/translate/en.json | 28 +- src/translate/text | 3 + 114 files changed, 2067 insertions(+), 2860 deletions(-) create mode 100644 src/Hooks/imageUrlToFile.tsx create mode 100644 src/Pages/Categories/View/Add/AttributeValueTab/Field/Hex.tsx delete mode 100644 src/Pages/Products/View/Atteibute.tsx delete mode 100644 src/Pages/Products/View/AttributeInfo.tsx delete mode 100644 src/Pages/Products/View/Edit/BasicInfo.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/Atteibute.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/File.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/FileImage.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/Object.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/SearchTabs.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/Field/Select.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/FormItem.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/TabItem.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/TabsContainer.tsx delete mode 100644 src/Pages/Products/View/Edit/FormikTab/VariableTabs.tsx delete mode 100644 src/Pages/Products/View/Edit/VarianInfo.tsx delete mode 100644 src/Pages/Products/View/FormikTab/Field/SearchTabs.tsx delete mode 100644 src/Pages/Products/View/FormikTab/Field/Select.tsx delete mode 100644 src/Pages/Products/View/FormikTab/TabItem.tsx delete mode 100644 src/Pages/Products/View/VarianInfo.tsx delete mode 100644 src/api/dist/Account.js delete mode 100644 src/api/dist/Categories.js delete mode 100644 src/api/dist/Coupon.js delete mode 100644 src/api/dist/Slider.js delete mode 100644 src/api/dist/appSetting.js delete mode 100644 src/api/dist/attribute.js delete mode 100644 src/api/dist/auth.js delete mode 100644 src/api/dist/config.js delete mode 100644 src/api/dist/order.js delete mode 100644 src/api/dist/product.js delete mode 100644 src/api/dist/users.js delete mode 100644 src/api/helper/dist/AxiosBuilder.js delete mode 100644 src/api/helper/dist/Get.js delete mode 100644 src/api/helper/dist/buildFormData.js delete mode 100644 src/api/helper/dist/ueGetPagination.js delete mode 100644 src/api/helper/dist/useAddMutation.js delete mode 100644 src/api/helper/dist/useAxios.js delete mode 100644 src/api/helper/dist/useDeleteMutation.js delete mode 100644 src/api/helper/dist/useGetOneQuery.js delete mode 100644 src/api/helper/dist/useGetQuery.js delete mode 100644 src/api/helper/dist/useGetSingleQuery.js delete mode 100644 src/api/helper/dist/useToggleStatus.js delete mode 100644 src/api/helper/dist/useUpdateMutation.js delete mode 100644 src/api/helper/dist/useUpdateMutationPut.js delete mode 100644 src/api/helper/dist/useUploadWithProgress.js create mode 100644 src/api/helper/useUpdateMutationById.ts diff --git a/src/Components/ValidationField/View/Date.tsx b/src/Components/ValidationField/View/Date.tsx index dfb5757..1732085 100644 --- a/src/Components/ValidationField/View/Date.tsx +++ b/src/Components/ValidationField/View/Date.tsx @@ -3,7 +3,7 @@ import React from 'react' import useFormField from '../../../Hooks/useFormField'; import dayjs from 'dayjs'; -const Date = ({ name, label,picker="date" ,isDisabled,props,onChange,placeholder ,className}: any) => { +const Date = ({ name, label,picker="date" ,isDisabled,props,onChange,placeholder ,className,Format}: any) => { const { errorMsg, isError, t, formik } = useFormField(name, props) const onCalendarChange = (value: any) => { @@ -15,7 +15,7 @@ const Date = ({ name, label,picker="date" ,isDisabled,props,onChange,placeholder
diff --git a/src/Components/ValidationField/View/SearchField.tsx b/src/Components/ValidationField/View/SearchField.tsx index 51f954d..498a783 100644 --- a/src/Components/ValidationField/View/SearchField.tsx +++ b/src/Components/ValidationField/View/SearchField.tsx @@ -1,11 +1,13 @@ import { Form, Select } from 'antd'; import React, { useEffect, useState } from 'react'; import useFormField from '../../../Hooks/useFormField'; -import { useNavigate } from 'react-router-dom'; +import { useLocation, useNavigate } from 'react-router-dom'; const SearchField = ({ name, label, placeholder, isDisabled, searchBy, option, isMulti, onChange, className, props }: any) => { const { errorMsg, isError, t, formik } = useFormField(name, props); const [searchQuery, setSearchQuery] = useState(''); + const location = useLocation() + const navigate = useNavigate() useEffect(() => { const searchParams = new URLSearchParams(window?.location?.search); @@ -17,9 +19,16 @@ const SearchField = ({ name, label, placeholder, isDisabled, searchBy, option, i const SelecthandleChange = (value: { value: string; label: React.ReactNode }) => { formik?.setFieldValue(name, value); + console.log(value); }; const SearchHandleChange = (value:any) => { - navigate(`${window?.location?.pathname}?${searchBy}=${value}`, { replace: true }); + if (value || value !== "") { + navigate(`${window?.location?.pathname}?${searchBy}=${value}`, { replace: true }); + } else { + const params = new URLSearchParams(location.search); + params.delete(searchBy ?? "search"); + navigate(`${window?.location.pathname}?${params.toString()}`, { replace: true }); + } }; diff --git a/src/Components/ValidationField/View/SelectField.tsx b/src/Components/ValidationField/View/SelectField.tsx index b208b48..77a0450 100644 --- a/src/Components/ValidationField/View/SelectField.tsx +++ b/src/Components/ValidationField/View/SelectField.tsx @@ -25,7 +25,7 @@ const SelectField = ({ name, label, placeholder, isDisabled,option,isMulti,onCha options={option} size="large" className={`${className} w-100`} - defaultValue={formik.values[name]} + defaultValue={formik.values?.name} allowClear {...(isMulti && { mode: "multiple" })} onChange={onChange || SelecthandleChange} diff --git a/src/Components/ValidationField/types.ts b/src/Components/ValidationField/types.ts index 17fe1b0..cda23c1 100644 --- a/src/Components/ValidationField/types.ts +++ b/src/Components/ValidationField/types.ts @@ -33,7 +33,7 @@ label?: string; className?: string; isDisabled?: boolean; - onChange?: (value: any) => void; + onChange?:any; dir?:'ltr' | "rtl"; option: any[]; isMulti?: boolean; @@ -75,6 +75,8 @@ onChange?: (value: any) => void; dir?:'ltr' | "rtl" picker?: "data" | "week" | "month" | "quarter" | "year"; + Format?: "YYYY/MM/DD" | "MM/DD" | "YYYY/MM" | "YYYY-MM-DD HH:mm:ss.SSS" | "YYYY-MM-DD HH:MM:SS"; + } diff --git a/src/Hooks/imageUrlToFile.tsx b/src/Hooks/imageUrlToFile.tsx new file mode 100644 index 0000000..255055b --- /dev/null +++ b/src/Hooks/imageUrlToFile.tsx @@ -0,0 +1,13 @@ +export async function fetchImage(imageUrl:any) { + try { + const response = await fetch(imageUrl); + if (!response.ok) { + throw new Error(`Failed to fetch image: ${response.status} ${response.statusText}`); + } + const blob = await response.blob(); + return new File([blob], 'image.png', { type: 'image/png' }); + } catch (error) { + console.error('Error fetching image:', error); + return null; + } + } diff --git a/src/Hooks/useFormatToSelect.tsx b/src/Hooks/useFormatToSelect.tsx index 74fe0f2..2c9980d 100644 --- a/src/Hooks/useFormatToSelect.tsx +++ b/src/Hooks/useFormatToSelect.tsx @@ -1,9 +1,11 @@ const useFormatToSelect = (Data : any) => { const format = (data :any) => { if (!data) return []; + const language = localStorage.getItem("language") ?? "en"; + return data.map((item :any) => ({ value: item?.id, - label: item?.name, + label: item?.name[language], })); }; diff --git a/src/Layout/Dashboard/SearchField.tsx b/src/Layout/Dashboard/SearchField.tsx index 333146d..8137d71 100644 --- a/src/Layout/Dashboard/SearchField.tsx +++ b/src/Layout/Dashboard/SearchField.tsx @@ -5,25 +5,34 @@ import { useTranslation } from 'react-i18next'; import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'; const { Search } = Input; -const SearchField = ({searchBy } : any) => { +const SearchField = ({ searchBy }: any) => { const navigate = useNavigate() const [searchParams,] = useSearchParams(); - const location =useLocation() - const {t} = useTranslation(); - console.log(searchBy,"searchBy"); - - - const [searchValue, setSearchValue] = useState(searchParams.get('search')|| ""); + const location = useLocation() + const { t } = useTranslation(); + + + const [searchValue, setSearchValue] = useState(searchParams.get(searchBy ?? "search") || ""); const onSearch: SearchProps['onSearch'] = (value, _e, info) => { - // console.log(value); - - navigate(`${location?.pathname}?${searchBy ?? "search"}=${value}`, { replace: true }); + if (value || value !== "") { + navigate(`${location?.pathname}?${searchBy ?? "search"}=${value}`, { replace: true }); + } else { + const params = new URLSearchParams(location.search); + params.delete(searchBy ?? "search"); + navigate(`${location.pathname}?${params.toString()}`, { replace: true }); + } } - const onChange = (e :any) => { - setSearchValue(e.target.value); - } + const onChange = (e: any) => { + const value = e.target.value + setSearchValue(e.target.value); + if (value === "") { + const params = new URLSearchParams(location.search); + params.delete(searchBy ?? "search"); + navigate(`${location.pathname}?${params.toString()}`, { replace: true }); + } + } return ( @@ -33,12 +42,12 @@ const SearchField = ({searchBy } : any) => { allowClear enterButton={t("search")} size="middle" - placeholder={t("search")} + placeholder={t(searchBy ?? "search")} onSearch={onSearch} - style={{ width: 250 }} + style={{ width: 250 }} value={searchValue} onChange={onChange} - /> + />
) diff --git a/src/Layout/Dashboard/ViewPage.tsx b/src/Layout/Dashboard/ViewPage.tsx index 0eaf775..f52b257 100644 --- a/src/Layout/Dashboard/ViewPage.tsx +++ b/src/Layout/Dashboard/ViewPage.tsx @@ -30,7 +30,7 @@ const ViewPage: React.FC= ({children,getInitialValues, getValidation {t("View_information")} - + { diff --git a/src/Pages/Categories/View/Add/AttributeTab/AttributeTabs.tsx b/src/Pages/Categories/View/Add/AttributeTab/AttributeTabs.tsx index 4e9d8e8..64729d4 100644 --- a/src/Pages/Categories/View/Add/AttributeTab/AttributeTabs.tsx +++ b/src/Pages/Categories/View/Add/AttributeTab/AttributeTabs.tsx @@ -28,7 +28,7 @@ export const AttributeTabs: React.FC = ({ tabKey }) => { return ( <> -
{t("Attributes")} {tabKey}
+
{t("Attribute")} {tabKey}
{ }; return (
- + + diff --git a/src/Pages/Categories/View/Add/AttributeTab/Field/FormItem.tsx b/src/Pages/Categories/View/Add/AttributeTab/Field/FormItem.tsx index 91b4c0b..cc9b2d1 100644 --- a/src/Pages/Categories/View/Add/AttributeTab/Field/FormItem.tsx +++ b/src/Pages/Categories/View/Add/AttributeTab/Field/FormItem.tsx @@ -13,7 +13,7 @@ export const FormItem: React.FC = ({ label, value, onChange ,type return ( <> - + ); }; diff --git a/src/Pages/Categories/View/Add/AttributeTab/Field/Select.tsx b/src/Pages/Categories/View/Add/AttributeTab/Field/Select.tsx index 06cc975..cc2aecf 100644 --- a/src/Pages/Categories/View/Add/AttributeTab/Field/Select.tsx +++ b/src/Pages/Categories/View/Add/AttributeTab/Field/Select.tsx @@ -13,16 +13,16 @@ const SelectField = ({tabKey}: any) => { const onChange = (value:any) => { formik.setFieldValue(Formikname,value) console.log(value); + console.log(formik?.errors,"errors"); + } const Data = [{label: "color",value :"color"},{label: "text",value :"text"},{label: "image",value :"image"}] return (
-