diff --git a/src/Pages/IO_Management/CreateIO/IODetails.jsx b/src/Pages/IO_Management/CreateIO/IODetails.jsx
index 06f528d..ee1bf09 100644
--- a/src/Pages/IO_Management/CreateIO/IODetails.jsx
+++ b/src/Pages/IO_Management/CreateIO/IODetails.jsx
@@ -12,11 +12,12 @@ import {
useUpdateIOMutation,
} from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
-import {
- useToast,
-} from "@chakra-ui/react";
+import { useToast } from "@chakra-ui/react";
import { formatDatee } from "../../../Components/FormField";
-import { formatDateToYYYYMMDD, removeTrailingZeros } from "../../../Constants/Constants";
+import {
+ formatDateToYYYYMMDD,
+ removeTrailingZeros,
+} from "../../../Constants/Constants";
const schema = yup.object().shape({
investmentNameEnglish: yup
@@ -25,7 +26,7 @@ const schema = yup.object().shape({
.min(3, "IO name in English must be at least 3 characters long")
.max(150, "IO name in English must be at most 150 characters long"),
- investmentNameArabic: yup
+ investmentNameArabic: yup
.string()
.required("IO name in Arabic is required")
.min(3, "IO name in Arabic must be at least 3 characters long")
@@ -42,15 +43,15 @@ const schema = yup.object().shape({
.required("Description in Arabic is required")
.min(10, "Description in Arabic must be at least 10 characters long")
.max(2000, "Description in Arabic must be at most 500 characters long"),
- expectedReturnArabic: yup
- .string()
- .required("Expected return in Arabic is required"),
+ expectedReturnArabic: yup
+ .string()
+ .required("Expected return in Arabic is required"),
- goalAmount: yup
- .number()
- .typeError("Goal Amount is must be number")
- .required('Goal amount is required')
- .positive('Goal amount must be a positive number'),
+ goalAmount: yup
+ .number()
+ .typeError("Goal Amount is must be number")
+ .required("Goal amount is required")
+ .positive("Goal amount must be a positive number"),
closingDate: yup
.date()
.notRequired("Closing date is required")
@@ -69,28 +70,25 @@ const schema = yup.object().shape({
InvestmentDetails: yup.string().notRequired(),
- comment: yup.string().notRequired()
- // .min(10, "Comment must be at least 10 characters long")
- .max(100, "Comment must be at most 100 characters long"),
-
- expectedReturn: yup
+ comment: yup
.string()
- .required("Expected return is required"),
+ .notRequired()
+ // .min(10, "Comment must be at least 10 characters long")
+ .max(100, "Comment must be at most 100 characters long"),
+
+ expectedReturn: yup.string().required("Expected return is required"),
});
const IODetails = ({ enableNextTab, index, data }) => {
-
const params = useParams();
const navigate = useNavigate();
const toast = useToast();
-
const handleInputChangeCreate = (index, newValue) => {
-
const updatedValues = [...values];
updatedValues[index].value = newValue;
setValues(updatedValues);
- console.log(values);
+ console.log(values);
};
const handleInputChangeEdit = (index, newValue) => {
@@ -143,9 +141,12 @@ const IODetails = ({ enableNextTab, index, data }) => {
});
const miniValue = data?.country?.map(
- ({ countryName, flagIcon, minInvestmentAmt, countryCode, id, currency }, index) => {
+ (
+ { countryName, flagIcon, minInvestmentAmt, countryCode, id, currency },
+ index
+ ) => {
return {
- id:id,
+ id: id,
country: countryName,
value: minInvestmentAmt,
logo: flagIcon,
@@ -154,18 +155,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
}
);
- const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(({minInvestmentAmt, country, currencyCode, country_xid,id })=>{
- console.log(currencyCode);
- return{
- _id:id,
- id:country_xid,
- country: country?.countryName,
- value: removeTrailingZeros(minInvestmentAmt),
- logo: country?.flagIcon,
- curr: currencyCode,
+ const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(
+ ({ minInvestmentAmt, country, currencyCode, country_xid, id }) => {
+ console.log(currencyCode);
+ return {
+ _id: id,
+ id: country_xid,
+ country: country?.countryName,
+ value: removeTrailingZeros(minInvestmentAmt),
+ logo: country?.flagIcon,
+ curr: currencyCode,
+ };
}
- })
-
+ );
const schemaEdit = yup.object().shape({
investmentNameEnglish: yup
@@ -173,73 +175,67 @@ const IODetails = ({ enableNextTab, index, data }) => {
.required("IO name in English is required")
.min(3, "IO name in English must be at least 3 characters long")
.max(150, "IO name in English must be at most 150 characters long"),
-
+
investmentNameArabic: yup
.string()
.required("IO name in Arabic is required")
.min(3, "IO name in Arabic must be at least 3 characters long")
.max(50, "IO name in Arabic must be at most 50 characters long"),
-
+
descriptionEnglish: yup
.string()
.required("Description in English is required")
.min(10, "Description in English must be at least 10 characters long")
.max(1000, "Description in English must be at most 1000 characters long"),
-
+
descriptionArabic: yup
.string()
.required("Description in Arabic is required")
.min(10, "Description in Arabic must be at least 10 characters long")
.max(2000, "Description in Arabic must be at most 500 characters long"),
- expectedReturnArabic: yup
- .string()
- .required("Expected return in Arabic is required"),
-
- goalAmount: yup
- .number()
- .typeError("Goal Amount is must be number")
- .required('Goal amount is required')
- .positive('Goal amount must be a positive number')
- .min(IObyID?.data?.totalAmtInvestmentInUSD, `Goal amount should not be lesser then amount raised ${IObyID?.data?.totalAmtInvestmentInUSD}`),
- closingDate: yup
- .date()
- .notRequired("Closing date is required")
- .min(new Date(), "Closing date cannot be in the past"),
-
+ expectedReturnArabic: yup
+ .string()
+ .required("Expected return in Arabic is required"),
+
+ goalAmount: yup
+ .number()
+ .typeError("Goal Amount is must be number")
+ .required("Goal amount is required")
+ .positive("Goal amount must be a positive number")
+ .min(
+ IObyID?.data?.totalAmtInvestmentInUSD,
+ `Goal amount should not be lesser then amount raised ${IObyID?.data?.totalAmtInvestmentInUSD}`
+ ),
+ closingDate: yup.date().notRequired("Closing date is required"),
+
holdingPeriod: yup.string().required("Holding period is required"),
holdingPeriodArabic: yup.string().required("Holding period is required"),
isShariah: yup.string().required("CheckBox is required"),
-
// minInvestmentAmount: yup
// .number()
// .required("Minimum investment is required")
// .positive("Minimum investment must be a positive number")
// .min(1, "Minimum investment must be at least 1"),
-
+
ISIN: yup.string().notRequired(),
-
+
InvestmentDetails: yup.string().notRequired(),
-
- comment: yup.string().notRequired()
- .min(10, "Comment must be at least 10 characters long")
- .max(100, "Comment must be at most 100 characters long"),
-
- expectedReturn: yup
+
+ comment: yup
.string()
- .required("Expected return is required"),
+ .notRequired()
+ .min(10, "Comment must be at least 10 characters long")
+ .max(100, "Comment must be at most 100 characters long"),
+
+ expectedReturn: yup.string().required("Expected return is required"),
});
-
-
-
- const [values, setValues] = useState(id?minInvestmentById:miniValue);
+ const [values, setValues] = useState(id ? minInvestmentById : miniValue);
-
const formatNumber = (num) => {
// Remove non-numeric characters and format with commas
- return num.replace(/\D/g, '')
- .replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+ return num.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
};
// console.log(values);
@@ -253,10 +249,11 @@ const IODetails = ({ enableNextTab, index, data }) => {
formState: { errors },
} = useForm({
resolver: yupResolver(id ? schemaEdit : schema),
+ mode: "all",
});
useEffect(() => {
- setIOloading(IObyIDisLoading)
+ setIOloading(IObyIDisLoading);
setIODetails({
...IObyID?.data,
});
@@ -277,10 +274,9 @@ const IODetails = ({ enableNextTab, index, data }) => {
minInvestmentAmount: IObyID?.data?.minInvestmentAmount,
holdingPeriodArabic: IObyID?.data?.minInvestmentAmount,
expectedReturnArabic: IObyID?.data?.minInvestmentAmount,
- isShariah: IObyID?.data?.isShariah
+ isShariah: IObyID?.data?.isShariah,
});
}
-
}, [id, IObyID]);
//=======================[ Creator ]
@@ -293,8 +289,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
isRequired: true,
section: " ",
width: "49%",
- maxLength:150,
- helperText:`Maximum length should be 150 characters. You have entered ${watch()?.investmentNameEnglish?.length || 0} characters.`
+ maxLength: 150,
+ helperText: `Maximum length should be 150 characters. You have entered ${
+ watch()?.investmentNameEnglish?.length || 0
+ } characters.`,
},
{
label: "IO Name (Arabic)",
@@ -305,8 +303,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
arabic: true,
section: " ",
width: "49%",
- maxLength:150,
- helperText:`Maximum length should be 150 characters. You have entered ${watch()?.investmentNameArabic?.length || 0} characters.`
+ maxLength: 150,
+ helperText: `Maximum length should be 150 characters. You have entered ${
+ watch()?.investmentNameArabic?.length || 0
+ } characters.`,
},
{
label: "Description",
@@ -316,8 +316,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
isRequired: true,
section: " ",
width: "49%",
- maxLength:1000,
- helperText:`Maximum length should be 1000 characters. You have entered ${watch()?.descriptionEnglish?.length || 0} characters.`
+ maxLength: 1000,
+ helperText: `Maximum length should be 1000 characters. You have entered ${
+ watch()?.descriptionEnglish?.length || 0
+ } characters.`,
},
{
label: "Description (Arabic)",
@@ -328,9 +330,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
arabic: true,
section: " ",
width: "49%",
- maxLength:1000,
- helperText:`Maximum length should be 1000 characters. You have entered ${watch()?.descriptionArabic?.length || 0} characters.`
-
+ maxLength: 1000,
+ helperText: `Maximum length should be 1000 characters. You have entered ${
+ watch()?.descriptionArabic?.length || 0
+ } characters.`,
},
{
label: "Holding Period",
@@ -341,8 +344,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
section: " ",
width: "49%",
value: IObyID?.data?.holdingPeriod,
- maxLength:20,
- helperText:`Maximum length should be 20 characters. You have entered ${watch()?.holdingPeriod?.length || 0} characters.`
+ maxLength: 20,
+ helperText: `Maximum length should be 20 characters. You have entered ${
+ watch()?.holdingPeriod?.length || 0
+ } characters.`,
},
{
label: "Holding Period (Arabic)",
@@ -354,11 +359,12 @@ const IODetails = ({ enableNextTab, index, data }) => {
section: " ",
width: "49%",
value: IObyID?.data?.holdingPeriodArabic,
- maxLength:20,
- helperText:`Maximum length should be 20 characters. You have entered ${watch()?.holdingPeriodArabic?.length || 0} characters.`
+ maxLength: 20,
+ helperText: `Maximum length should be 20 characters. You have entered ${
+ watch()?.holdingPeriodArabic?.length || 0
+ } characters.`,
},
-
{
label: "Expected Return",
name: "expectedReturn",
@@ -371,7 +377,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
{
label: "Expected Return (Arabic)",
- name: "expectedReturnArabic",
+ name: "expectedReturnArabic",
type: "text",
isRequired: true,
arabic: true,
@@ -381,16 +387,15 @@ const IODetails = ({ enableNextTab, index, data }) => {
},
{
label: "Shariah",
- name: "isShariah",
+ name: "isShariah",
type: "checkBox",
- value:IObyID?.data?.isShariah,
+ value: IObyID?.data?.isShariah,
// isRequired: true,
section: " ",
width: "32.3%",
value: IObyID?.data?.isShariah,
},
-
{
label: "Investment Type",
placeHolder: "Select option",
@@ -428,19 +433,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
name: "closingDate",
// value: "IObyID?.data?.closingDate",
type: "date",
- isRequired: true,
+ // isRequired: true,
section: " ",
width: "32.3%",
- dateValue:formatDatee(IObyID?.data?.closingDate),
+ dateValue: formatDatee(IObyID?.data?.closingDate),
// helperText: IObyID && `Current closing date is : ${formatDate(IObyID?.data?.closingDate)}`
- closingDate:true
+ // closingDate:true
},
{
label: "ISIN",
placeHolder: "",
name: "ISIN",
type: "text",
- align:"right",
+ align: "right",
section: " ",
width: "32.3%",
},
@@ -452,8 +457,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
section: " ",
width: "32.3%",
value: IObyID?.data?.InvestmentDetails,
- maxLength:20,
- helperText:`Maximum length should be 20 characters. You have entered ${watch()?.InvestmentDetails?.length || 0} characters.`
+ maxLength: 20,
+ helperText: `Maximum length should be 20 characters. You have entered ${
+ watch()?.InvestmentDetails?.length || 0
+ } characters.`,
},
{
@@ -462,10 +469,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
name: "table",
type: "table",
section: " ",
- width: "100%",
+ width: "100%",
isRequired: true,
options: investmentTypeOptions,
- handleInputChange:id ? handleInputChangeEdit : handleInputChangeCreate,
+ handleInputChange: id ? handleInputChangeEdit : handleInputChangeCreate,
value: values,
},
@@ -478,8 +485,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
width: "100%",
options: investmentTypeOptions,
value: IObyID?.data?.comment,
- maxLength:100,
- helperText:`Maximum length should be 100 characters. You have entered ${watch()?.comment?.length || 0} characters.`
+ maxLength: 100,
+ helperText: `Maximum length should be 100 characters. You have entered ${
+ watch()?.comment?.length || 0
+ } characters.`,
},
];
const groupedFields = formFields.reduce((groups, field) => {
@@ -492,30 +501,29 @@ const IODetails = ({ enableNextTab, index, data }) => {
}, {});
const onSubmit = async (data) => {
-
delete data.table;
setIsLoading(true);
- const updatedMinAmount = values?.map(({id, value, _id})=>{
+ const updatedMinAmount = values?.map(({ id, value, _id }) => {
return {
- id:_id,
- country_xid:id,
- minInvestmentAmt: Number(value)
- }
- })
+ id: _id,
+ country_xid: id,
+ minInvestmentAmt: Number(value),
+ };
+ });
// console.log(formatDateToYYYYMMDD(data.closingDate));
const formData = {
...data,
investmentType_xid: Number(data.investmentType),
sponsor_xid: Number(data.sponserName),
- minInvestmentAmt:updatedMinAmount,
- closingDate: formatDateToYYYYMMDD(data.closingDate)
+ minInvestmentAmt: updatedMinAmount,
+ closingDate: formatDateToYYYYMMDD(data.closingDate),
};
// console.log(formData);
if (id) {
- console.log("========================",formData);
+ console.log("========================", formData);
const res = await updateIO({ data: formData, id });
console.log(res);
if (res?.data?.statusCode === 200) {
@@ -525,20 +533,24 @@ const IODetails = ({ enableNextTab, index, data }) => {
});
navigate(`/view-io/${id}`);
enableNextTab(index);
- } else if(res?.error?.status === 400){
+ } else if (res?.error?.status === 400) {
setIsLoading(false);
toast({
- render: () => ,
- });
- } else if(res?.error?.status === 500){
+ render: () => (
+
+ ),
+ });
+ } else if (res?.error?.status === 500) {
setIsLoading(false);
toast({
- render: () => ,
+ render: () => (
+
+ ),
});
}
} else {
try {
- console.log("========================",formData);
+ console.log("========================", formData);
const res = await creatIO(formData);
console.log(res?.error?.status);
if (res?.data?.statusCode === 200) {
@@ -548,15 +560,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
});
navigate(`/view-io/${res?.data?.data}`);
enableNextTab(index);
- } else if(res?.error?.status === 400){
+ } else if (res?.error?.status === 400) {
setIsLoading(false);
toast({
- render: () => ,
+ render: () => (
+
+ ),
});
- }else if(res?.error?.status === 500){
+ } else if (res?.error?.status === 500) {
setIsLoading(false);
toast({
- render: () => ,
+ render: () => (
+
+ ),
});
}
} catch (error) {
@@ -565,7 +581,6 @@ const IODetails = ({ enableNextTab, index, data }) => {
}
}
-
// ==========================
// if (params?.id) {
// return enableNextTab(index);
@@ -583,9 +598,8 @@ const IODetails = ({ enableNextTab, index, data }) => {
};
return IObyIDisLoading ? (
-
+
) : (
-