Api integrated IO, SPONSOR, INVESTMENT TYPE

This commit is contained in:
2024-07-26 12:10:47 +05:30
parent 9176f2078f
commit ab36560498
28 changed files with 1991 additions and 902 deletions

View File

@@ -9,7 +9,7 @@ const EmptySearchList = ({message}) => {
justifyContent={'center'}
alignItems={'center'}
flexDirection={'column'}
w={"100%"} h={"80vh"}
w={"100%"} h={"40vh"}
>
<Image w={200} mb={8} src={EmptySearchListImage} alt='empty list' />
<Text className=" fw-bold fs-5" >{message}</Text>

View File

@@ -65,6 +65,8 @@ const FormField = ({
width,
value,
handleInputChange,
align,
maxLength,
...props
}) => (
<FormControl
@@ -119,7 +121,7 @@ const FormField = ({
resize={"none"}
rows={2}
bg={"#F5F8F6"}
maxLength={150} // Set the maximum character limit
maxLength={maxLength} // Set the maximum character limit
/>
);
} else if (type === "checkbox") {
@@ -471,7 +473,7 @@ const FormField = ({
{...field}
{...props}
placeholder={placeHolder ? placeHolder : label}
textAlign={arabic || type === "number" ? "right" : "left"}
textAlign={arabic || type === "number" ? "right" : align ? align : "left"}
_placeholder={{ fontSize: "sm" }}
min={type === "date" ? today : undefined}
defaultValue={type === "date" ? new Date(value) : undefined}

View File

@@ -17,6 +17,7 @@ const FormInputMain = ({
w,
btnLoading,
btnhidden,
}) => {
return (
<Box mt={0} as="form" onSubmit={onSubmit}>
@@ -57,6 +58,8 @@ const FormInputMain = ({
width,
value,
handleInputChange,
align,
maxLength
},
key
) => (
@@ -82,6 +85,8 @@ const FormInputMain = ({
width={width}
value={value}
handleInputChange={handleInputChange}
align={align}
maxLength={maxLength}
/>
)
)}

View File

@@ -20,7 +20,7 @@ const FormInputView = ({
{/* <Box display={"flex"} gap={0}> */}
<Box width={"100%"} display={"flex"} flexWrap={"wrap"} gap={4}>
{fields.map(
({ value, label, id, width, btn, arabic, type }, key) =>
({ value, label, id, width, btn, arabic, type, align }, key) =>
type === "table" ? (
<Table w={"100%"} variant="simple">
<Thead>
@@ -109,13 +109,13 @@ const FormInputView = ({
{label}
</FormLabel>
<FormLabel
border={"1px solid #E4EAF1"}
border={"1px solid transparent"}
bg={"#ccc3"}
p={2}
pt={1.5}
pb={1.5}
rounded={"xs"}
textAlign={arabic ? "right" : "left"}
textAlign={arabic ? "right" : align? align : "left"}
fontSize={"sm"}
>
{type === "number" ? value : value}

View File

@@ -1,6 +1,6 @@
export const getFileNameFromPath = (filePath) => {
const parts = filePath.split("/");
return parts[parts.length - 1];
const parts = filePath?.split("/");
return parts?.[parts?.length - 1];
};
export function debounce(func, delay) {

View File

@@ -20,12 +20,11 @@ const getRandomDate = (start, end) => {
const startDate = new Date(2020, 0, 1); // January 1, 2020
const endDate = new Date(); // Current date
export const generateUniqueId = () => {
const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
const digits = '0123456789';
const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
const digits = "0123456789";
let id = '';
let id = "";
// Generate three random uppercase letters
for (let i = 0; i < 3; i++) {
@@ -38,7 +37,7 @@ export const generateUniqueId = () => {
}
return id;
}
};
const GlobalStateProvider = ({ children }) => {
const [isAuthenticate, setIsAuthenticate] = useState(false);
@@ -47,7 +46,8 @@ const GlobalStateProvider = ({ children }) => {
const [slideFromRight, setSlideFormRight] = useState(false);
const { colorMode, toggleColorMode } = useColorMode();
const [sponser, setSponser] = useState([]);
const [ioStatus, setIoStatus] = useState([]);
const [investors, setInvestors] = useState([
{
id: 1,
@@ -337,6 +337,30 @@ const GlobalStateProvider = ({ children }) => {
status: true,
},
]);
const [iOArtifactsTwo, setIOArtifactsTwo] = useState([
{
id: 1,
videoFileName: "Property preview",
status: true,
},
{
id: 2,
videoFileName: "Property preview",
status: true,
},
{
id: 3,
videoFileName: "Property preview",
status: true,
},
{
id: 4,
videoFileName: "Property preview",
status: true,
},
]);
const [investmentType, setInvestmentType] = useState([
{
id: 1,
@@ -503,216 +527,216 @@ const GlobalStateProvider = ({ children }) => {
const [InvestorDetails, setInvestorDetails] = useState([
{
id: 1,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
{
id: 2,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Incompleted",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Incompleted",
status: "Unban",
},
{
id: 3,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
{
id: 4,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Incompleted",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Incompleted",
status: "Unban",
},
{
id: 5,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
{
id: 6,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
{
id: 7,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Incompleted",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Incompleted",
status: "Unban",
},
{
id: 8,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Incompleted",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Incompleted",
status: "Unban",
},
{
id: 9,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
{
id: 10,
clientId:"SA00000001",
fullName:"John David",
firstName:"John",
clientId: "SA00000001",
fullName: "John David",
firstName: "John",
lastName: "David",
country: "Saudi Arabia",
phoneNumber: "8940035906",
address:"Saudi Arabia",
address: "Saudi Arabia",
emailID: "john@gmail.com",
bankName:"Lorem Text",
branchAddress:"Hohenzollernring 58, 95444",
iban:"DE 1234 5678 9012 3456",
swiftCode:"BC12345",
referenceID:"FRYU FHDU 1234",
kycStatus:"Completed",
status:"Unban",
bankName: "Lorem Text",
branchAddress: "Hohenzollernring 58, 95444",
iban: "DE 1234 5678 9012 3456",
swiftCode: "BC12345",
referenceID: "FRYU FHDU 1234",
kycStatus: "Completed",
status: "Unban",
},
]);
const [viewInvestor, setViewInvestor] = useState([
{
id: 1,
dealId:"UWE3424992",
dealId: "UWE3424992",
dealName: "KKR Private Equity Fund",
sponsorName: "KKR",
investAmount: "$100,000",
holdingPeriod: "4-5 years",
estimatedReturn:"50-60%",
kycStatus:"Open",
estimatedReturn: "50-60%",
kycStatus: "Open",
},
{
id: 2,
dealId:"UWE3424992",
dealId: "UWE3424992",
dealName: "Blackstone Real Estate Income Trust",
sponsorName: "Blackstone",
investAmount: "$100,000",
holdingPeriod: "4-5 years",
estimatedReturn:"50-60%",
kycStatus:"Pending",
estimatedReturn: "50-60%",
kycStatus: "Pending",
},
{
id: 3,
dealId:"UWE3424992",
dealId: "UWE3424992",
dealName: "J.P. Morgan",
sponsorName: "J.P. Morgan",
investAmount: "$100,000",
holdingPeriod: "4-5 years",
estimatedReturn:"50-60%",
kycStatus:"Closed",
estimatedReturn: "50-60%",
kycStatus: "Closed",
},
]);
@@ -750,7 +774,7 @@ const GlobalStateProvider = ({ children }) => {
const [pendingRequest, setPendingRequest] = useState([
{
id: 1,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -758,11 +782,11 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "SAR",
withDrawalAmount: "$100,000",
amountcurrency:"382574.17",
amountcurrency: "382574.17",
},
{
id: 2,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "KU00000001",
firstName: "Faisal",
lastName: "Aljalahma",
@@ -770,11 +794,11 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "KWD",
withDrawalAmount: "$200,000",
amountcurrency:"62438.98",
amountcurrency: "62438.98",
},
{
id: 3,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "BH00000001",
firstName: "Nawaf",
lastName: "Almaskati",
@@ -782,11 +806,11 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "BHD",
withDrawalAmount: "$300,000",
amountcurrency:"115328.04",
amountcurrency: "115328.04",
},
{
id: 4,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000002",
firstName: "Sulaiman",
lastName: "AlBassam",
@@ -794,13 +818,13 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "SAR",
withDrawalAmount: "$400,000",
amountcurrency:"1530296.67",
amountcurrency: "1530296.67",
},
]);
const [viewHistory, setViewHistory] = useState([
{
id: 1,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -808,12 +832,12 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "SAR",
withDrawalAmount: "$100,000",
amountcurrency:"382574.17",
status:"Approved",
amountcurrency: "382574.17",
status: "Approved",
},
{
id: 2,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "KU00000001",
firstName: "Faisal",
lastName: "Aljalahma",
@@ -821,12 +845,12 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "KWD",
withDrawalAmount: "$200,000",
amountcurrency:"62438.98",
status:"Rejected",
amountcurrency: "62438.98",
status: "Rejected",
},
{
id: 3,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "BH00000001",
firstName: "Nawaf",
lastName: "Almaskati",
@@ -834,12 +858,12 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "BHD",
withDrawalAmount: "$300,000",
amountcurrency:"115328.04",
status:"Approved",
amountcurrency: "115328.04",
status: "Approved",
},
{
id: 4,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000002",
firstName: "Sulaiman",
lastName: "AlBassam",
@@ -847,8 +871,8 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "SAR",
withDrawalAmount: "$400,000",
amountcurrency:"1530296.67",
status:"Rejected",
amountcurrency: "1530296.67",
status: "Rejected",
},
]);
const [upgradeHistory, setUpgradeHistory] = useState([
@@ -1322,12 +1346,12 @@ const GlobalStateProvider = ({ children }) => {
},
]);
const [ IODetails, setIODetails ] = useState({})
const [IODetails, setIODetails] = useState({});
const [depositRequest, setDepositRequest] = useState([
{
id: 1,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1335,13 +1359,13 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "SAR",
depositAmount: "$100,000",
fees:"$2,000",
totalAmount:"$102,000",
amountcurrency:"382574.17",
fees: "$2,000",
totalAmount: "$102,000",
amountcurrency: "382574.17",
},
{
id: 2,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "KU00000001",
firstName: "Faisal",
lastName: "Aljalahma",
@@ -1349,13 +1373,13 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "KWD",
depositAmount: "$200,000",
fees:"$4,000",
totalAmount:"$204,000",
amountcurrency:"62438.98",
fees: "$4,000",
totalAmount: "$204,000",
amountcurrency: "62438.98",
},
{
id: 3,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "BH00000001",
firstName: "Nawaf",
lastName: "Almaskati",
@@ -1363,13 +1387,13 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "BHD",
depositAmount: "$300,000",
fees:"$6,000",
totalAmount:"$306,000",
amountcurrency:"115328.04",
fees: "$6,000",
totalAmount: "$306,000",
amountcurrency: "115328.04",
},
{
id: 4,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000002",
firstName: "Sulaiman",
lastName: "AlBassam",
@@ -1377,16 +1401,16 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "SAR",
depositAmount: "$400,000",
fees:"$8,000",
totalAmount:"$408,000",
amountcurrency:"1530296.67",
fees: "$8,000",
totalAmount: "$408,000",
amountcurrency: "1530296.67",
},
]);
const [depositHistory, setDepositHistory] = useState([
{
id: 1,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1394,14 +1418,14 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "SAR",
depositAmount: "$100,000",
fees:"$2,000",
totalAmount:"$102,000",
amountcurrency:"382574.17",
status:"Approved",
fees: "$2,000",
totalAmount: "$102,000",
amountcurrency: "382574.17",
status: "Approved",
},
{
id: 2,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "KU00000001",
firstName: "Faisal",
lastName: "Aljalahma",
@@ -1409,14 +1433,14 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "KWD",
depositAmount: "$200,000",
fees:"$4,000",
totalAmount:"$204,000",
amountcurrency:"62438.98",
status:"Rejected"
fees: "$4,000",
totalAmount: "$204,000",
amountcurrency: "62438.98",
status: "Rejected",
},
{
id: 3,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "BH00000001",
firstName: "Nawaf",
lastName: "Almaskati",
@@ -1424,14 +1448,14 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8940035906",
currency: "BHD",
depositAmount: "$300,000",
fees:"$6,000",
totalAmount:"$306,000",
amountcurrency:"115328.04",
status:"Approved"
fees: "$6,000",
totalAmount: "$306,000",
amountcurrency: "115328.04",
status: "Approved",
},
{
id: 4,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000002",
firstName: "Sulaiman",
lastName: "AlBassam",
@@ -1439,17 +1463,17 @@ const GlobalStateProvider = ({ children }) => {
phoneNumber: "8226278945",
currency: "SAR",
depositAmount: "$400,000",
fees:"$8,000",
totalAmount:"$408,000",
amountcurrency:"1530296.67",
status:"Rejected"
fees: "$8,000",
totalAmount: "$408,000",
amountcurrency: "1530296.67",
status: "Rejected",
},
]);
const [bankInvestor, setBankInvestor] = useState([
{
id: 1,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1460,7 +1484,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 2,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1471,7 +1495,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 3,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1482,7 +1506,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 4,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1493,7 +1517,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 5,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1504,7 +1528,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 6,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1515,7 +1539,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 7,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1526,7 +1550,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 8,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1537,7 +1561,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 9,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1548,7 +1572,7 @@ const GlobalStateProvider = ({ children }) => {
},
{
id: 10,
date:"02-Jan-2024",
date: "02-Jan-2024",
clientId: "SA00000001",
firstName: "John",
lastName: "David",
@@ -1559,42 +1583,42 @@ const GlobalStateProvider = ({ children }) => {
},
]);
const [manageAcademy , setManageAcademy] = useState([
const [manageAcademy, setManageAcademy] = useState([
{
id: 1,
header:"Investing in Private Equity",
header: "Investing in Private Equity",
content: "Private equity investing involve...",
bannerImage: "John",
},
{
id: 2,
header:"Investing in Private Equity",
header: "Investing in Private Equity",
content: "Private equity investing involve...",
bannerImage: "John",
},
{
id: 3,
header:"Investing in Private Equity",
header: "Investing in Private Equity",
content: "Private equity investing involve...",
bannerImage: "John",
},
])
]);
const [manageVideo , setManageVideo] = useState([
const [manageVideo, setManageVideo] = useState([
{
id: 1,
name:"Investing in Private Equity",
name: "Investing in Private Equity",
videoUploaded: "Video.mp4",
},
])
]);
const [academicDocuments , setAcademicDocuments] = useState([
const [academicDocuments, setAcademicDocuments] = useState([
{
id: 1,
fullName:"Investing in Private Equity",
fullName: "Investing in Private Equity",
document: "Video.mp4",
},
])
]);
return (
<GlobalStateContext.Provider
@@ -1641,9 +1665,11 @@ const GlobalStateProvider = ({ children }) => {
setKeyMerits,
iOArtifacts,
setIOArtifacts,
investors,
setInvestors,IODetails, setIODetails,
navDetails,
investors,
setInvestors,
IODetails,
setIODetails,
navDetails,
setNavDetails,
caseDetails,
setCaseDetails,
@@ -1661,6 +1687,10 @@ const GlobalStateProvider = ({ children }) => {
setManageVideo,
academicDocuments,
setAcademicDocuments,
iOArtifactsTwo,
setIOArtifactsTwo,
ioStatus,
setIoStatus,
}}
>
{children}

View File

@@ -19,6 +19,7 @@ import { useGetIOprepopulateDataQuery } from "../../../Services/io.service";
const CreateIO = () => {
const id = useParams()?.id;
const { data, error, isLoading } = useGetIOprepopulateDataQuery();
// console.log(data?.data);

View File

@@ -1,8 +1,10 @@
import {
Badge,
Box,
Button,
HStack,
Input,
Link,
Text,
Tooltip,
useDisclosure,
@@ -12,27 +14,58 @@ import DataTable from "../../../Components/DataTable/DataTable";
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
import { debounce } from "../../Master/Sponser/AddSponser";
import { formatDate } from "../../../Components/Functions/UTCConvertor";
import {
AddIcon,
DeleteIcon,
DownloadIcon,
EditIcon,
ExternalLinkIcon,
ViewIcon,
} from "@chakra-ui/icons";
import IOArtifactsAdd from "../IOArtifactsAdd";
import IOArtifactsVideo from "./IOArtifactsVideo";
import SetDisplayOrder from "./SetDisplayOrder";
import { useParams } from "react-router-dom";
import {
useDeleteVideoArtifactsMutation,
useGetIOByIdQuery,
} from "../../../Services/io.service";
import { getFileNameFromPath } from "../../../Constants/Constants";
const IOArtifacts = ({ enableNextTab, index, data }) => {
const params = useParams();
const id = params?.id;
const {
data: IObyID,
isLoading: IObyIDisLoading,
error: IObyIDerror,
} = useGetIOByIdQuery(id, { skip: !id });
console.log(IObyID?.data?.artifactsImage);
console.log(IObyID?.data?.artifactsVideo);
const IOArtifacts = ({enableNextTab, index}) => {
const { iOArtifacts, setIOArtifacts, slideFromRight } =
useContext(GlobalStateContext);
const { iOArtifactsTwo, setIOArtifactsTwo } = useContext(GlobalStateContext);
const firstField = useRef();
const secondField = useRef();
const [searchTerm, setSearchTerm] = useState("");
const [searchTermTwo, setSearchTermTwo] = useState("");
const [isLoading, setIsLoading] = useState(true);
const [isLoadingBtn, setIsLoadingBtn] = useState(false);
const [deleteAlert, setDeleteAlert] = useState(false);
const [actionId, setActionId] = useState(false);
const [mouseEntered, setMouseEntered] = useState(false);
const [mouseEnteredId, setMouseEnteredId] = useState("");
const { isOpen, onOpen, onClose } = useDisclosure();
const [deleteVideoArtifacts] = useDeleteVideoArtifactsMutation();
const {
isOpen: isOpenVideo,
onOpen: onOpenVideo,
onClose: onCloseVideo,
} = useDisclosure();
useEffect(() => {
// Simulate loading
@@ -44,14 +77,6 @@ const IOArtifacts = ({enableNextTab, index}) => {
return () => clearTimeout(timer);
}, []);
const tableHeadRow = [
"Sr.no",
"Type",
"File Name",
"Document",
"Action"
];
const handleUpdateStatus = debounce((id) => {
setIOArtifacts((prevIOArtifacts) =>
prevIOArtifacts.map((iOArtifacts) =>
@@ -60,34 +85,62 @@ const IOArtifacts = ({enableNextTab, index}) => {
: iOArtifacts
)
);
setIOArtifactsTwo((prevIOArtifactsTwo) =>
prevIOArtifactsTwo.map((iOArtifactsTwo) =>
iOArtifactsTwo.id === id
? { ...iOArtifactsTwo, status: !iOArtifactsTwo.status }
: iOArtifactsTwo
)
);
toast({
render: () => <ToastBox message={"Status changed succesfully.!"} />,
});
}, 300);
const filteredData = iOArtifacts?.filter((item) => {
// Filter by name (case insensitive)
const name = item.type;
const searchLower = searchTerm.toLowerCase();
const nameMatches = name.toLowerCase().includes(searchLower);
return nameMatches;
});
const handleDelete = () => {
const updatedIOArtifacts = iOArtifacts.filter(
(iOArtifacts) => iOArtifacts.id !== actionId
);
setTimeout(() => {
setSponser(updatedIOArtifacts);
setDeleteAlert(false);
setIsLoading(false);
}, 100);
setIsLoading(true);
const handleDeleteVideo = async (id) => {
setIsLoadingBtn(true);
try {
const res = await deleteVideoArtifacts(id);
console.log(res?.data?.statusCode);
if (res?.data?.statusCode === 200) {
setDeleteAlert(false);
onCloseVideo();
setIsLoadingBtn(false);
}
} catch (error) {
console.log(error);
}
};
const extractedArray = filteredData?.map((item, index) => ({
const handleDeleteImage = async (id) => {
setIsLoadingBtn(true);
try {
const res = await deleteVideoArtifacts(id);
console.log(res?.data?.statusCode);
if (res?.data?.statusCode === 200) {
setDeleteAlert(false);
onCloseVideo();
setIsLoadingBtn(false);
}
} catch (error) {
console.log(error);
}
};
const tableHeadRow = [
"Sr.no",
"File Name",
// "Document",
"View image",
"Action",
];
const extractedArray = IObyID?.data?.artifactsImage?.map((item, index) => ({
"Sr.no": (
<Text
justifyContent={slideFromRight ? "right" : "left"}
@@ -99,25 +152,14 @@ const IOArtifacts = ({enableNextTab, index}) => {
{index + 1}
</Text>
),
Type: (
<Text
justifyContent={slideFromRight ? "right" : "left"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
{item.type}
</Text>
),
"File Name": (
<Box isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{item.fileName}
{item.artifactName}
</Text>
</Box>
),
"Document": (
Document: (
<Text
color={"green.500"}
justifyContent={slideFromRight ? "right" : "left"}
@@ -125,12 +167,40 @@ const IOArtifacts = ({enableNextTab, index}) => {
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
{item.document}
{getFileNameFromPath(item.artifactPathName)}
</Text>
),
"View image": (
<Text
color={"green.500"}
justifyContent={slideFromRight ? "right" : "left"}
as={"span"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
<Badge
px={2}
py={0.5}
display={"flex"}
alignItems={"center"}
textTransform={"inherit"}
fontWeight={500}
colorScheme={"forestGreen"}
>
<Link
href={
"https://admin.tanami.betadelivery.com/" + item?.artifactPathName
}
isExternal
>
<Box as="span">View</Box> <ExternalLinkIcon />
</Link>
</Badge>
</Text>
),
Action: (
<Box display={"flex"} justifyContent={"center"} gap={3}>
<Tooltip
{/* <Tooltip
rounded={"sm"}
fontSize={"xs"}
label="View"
@@ -150,7 +220,7 @@ const IOArtifacts = ({enableNextTab, index}) => {
>
<ViewIcon />
</Button>
</Tooltip>
</Tooltip> */}
<Tooltip
rounded={"sm"}
fontSize={"xs"}
@@ -195,29 +265,146 @@ const IOArtifacts = ({enableNextTab, index}) => {
),
}));
const tableHeadRowTwo = [
"Sr.no",
"File Name",
"Video streaming uRL",
"Action",
];
const extractedArrayTwo = IObyID?.data?.artifactsVideo?.map(
(item, index) => ({
"Sr.no": (
<Text
justifyContent={slideFromRight ? "right" : "left"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
{index + 1}
</Text>
),
"File Name": (
<Box isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{item.artifactName}
</Text>
</Box>
),
"Video streaming uRL": (
<Text
color={"green.500"}
justifyContent={slideFromRight ? "right" : "left"}
as={"span"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
<Badge
px={2}
py={0.5}
display={"flex"}
alignItems={"center"}
textTransform={"inherit"}
fontWeight={500}
colorScheme={"forestGreen"}
>
<Link href={item?.artifactStreamingURL} isExternal>
<Box as="span">View</Box> <ExternalLinkIcon />
</Link>
</Badge>
</Text>
),
Action: (
<Box display={"flex"} justifyContent={"center"} gap={3}>
{/* <Tooltip
rounded={"sm"}
fontSize={"xs"}
label="View"
bg="#fff"
color={"green.500"}
placement="top"
>
<Button
_hover={{ color: "green.500" }}
// transition={"0.5s all"}
onClick={() => {
navigate(`view-investment/${item.id}`);
}}
color="green.300"
rounded={"sm"}
size={"xs"}
>
<ViewIcon />
</Button>
</Tooltip> */}
<Tooltip
rounded={"sm"}
fontSize={"xs"}
label="Edit"
bg="#fff"
color={"blue.500"}
placement="top"
>
<Button
_hover={{ color: "blue.500" }}
// transition={"0.5s all"}
color="blue.400"
rounded={"sm"}
size={"xs"}
>
<EditIcon />
</Button>
</Tooltip>
<Tooltip
rounded={"sm"}
fontSize={"xs"}
label="Delete"
bg="#fff"
color={"red.500"}
placement="top"
>
<Button
onClick={() => {
setActionId(item?.id);
setDeleteAlert(true);
}}
_hover={{ color: "red.500" }}
// transition={"0.5s all"}
color="red.300"
rounded={"sm"}
size={"xs"}
>
<DeleteIcon />
</Button>
</Tooltip>
</Box>
),
})
);
return (
<Box>
<Box display={"flex"} justifyContent={"space-between"} mb={4}>
<Input
type="search"
width={300}
placeholder="Search..."
size="sm"
rounded="sm"
focusBorderColor="green.500"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
color={'green'}
>
Add artifacts
</Button>
<Box fontSize={"sm"} fontWeight={500}>
Manage iO images
</Box>
{/* <Box display="flex" justifyContent="end" mb={4} gap={2}> */}
<HStack>
<SetDisplayOrder data={IObyID?.data?.artifactsImage} />
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
colorScheme={"forestGreen"}
>
Add Images
</Button>
</HStack>
<IOArtifactsAdd
isOpen={isOpen}
onClose={onClose}
@@ -231,21 +418,53 @@ const IOArtifacts = ({enableNextTab, index}) => {
isLoading={isLoading}
viewActionId={actionId}
setViewActionId={setActionId}
// totalPages={10}
setMouseEnteredId={setMouseEnteredId}
setMouseEntered={setMouseEntered}
/>
<HStack justifyContent={'flex-end'}>
<Box display={"flex"} justifyContent={"space-between"} mb={4}>
<Box fontSize={"sm"} fontWeight={500}>
Manage IO videos
</Box>
<HStack>
<SetDisplayOrder data={IObyID?.data?.artifactsImage} />
<Button
leftIcon={<AddIcon />}
onClick={onOpenVideo}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
colorScheme={"forestGreen"}
>
Add Videos
</Button>
</HStack>
<IOArtifactsVideo
isOpen={isOpenVideo}
onClose={onCloseVideo}
secondField={secondField}
/>
</Box>
<DataTable
emptyMessage={`We don't have any Sponers `}
tableHeadRow={tableHeadRowTwo}
data={extractedArrayTwo}
isLoading={isLoading}
viewActionId={actionId}
setViewActionId={setActionId}
setMouseEnteredId={setMouseEnteredId}
setMouseEntered={setMouseEntered}
/>
{/* <HStack justifyContent={'flex-end'}>
<Button ps={8} pe={8} colorScheme="forestGreen" size={'sm'} rounded={'sm'} onClick={()=> enableNextTab(index)}>Next</Button>
</HStack>
</HStack> */}
<CustomAlertDialog
onClose={() => setDeleteAlert(false)}
isOpen={deleteAlert}
message={"Are you sure you want to delete sponers?"}
alertHandler={handleDelete}
isLoading={isLoading}
alertHandler={() => handleDeleteVideo(actionId)}
isLoading={isLoadingBtn}
/>
</Box>
);

View File

@@ -0,0 +1,174 @@
import {
Box,
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
DrawerOverlay,
FormControl,
FormErrorMessage,
FormLabel,
Input,
Stack,
useToast,
} from "@chakra-ui/react";
import * as yup from "yup";
import React, { useState } from "react";
import { useForm, Controller } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
import { v4 as uuidv4 } from "uuid";
import { useCreateVideoArtifactsMutation, useDeleteVideoArtifactsMutation } from "../../../Services/io.service";
import { useParams } from "react-router-dom";
import ToastBox from "../../../Components/ToastBox";
const investmentVideoSchema = yup.object().shape({
artifactName: yup.string().required("Artifact name is required"),
artifactStreamingURL: yup.string().required("Artifact streaming URL is required").url("Invalid URL format"),
});
const IOArtifactsAdd = ({ isOpen, onClose, firstField }) => {
const params = useParams()
const id = params?.id
const [file, setFile] = useState("");
const [fileName, setFileName] = useState("");
const [ isLoading, setIsLoading] = useState(false)
const [alert, setAlert] = useState(false);
const toast = useToast();
const [ createArtifactsVideo ] = useCreateVideoArtifactsMutation()
// const {
// data
// } = useGetArtifactsQuery(id)
const {
control,
handleSubmit,
reset,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentVideoSchema),
});
const onSubmit = async (data) => {
setIsLoading(true)
try {
const res = await createArtifactsVideo({data, id})
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
reset()
setAlert(false);
setIsLoading(false)
onClose();
}
} catch (error) {
console.log(error);
}
};
const handleConfirm = () => {
handleSubmit(onSubmit)();
};
const handleSave = () => {
handleSubmit(onSubmit)();
};
const handleClose = () => {
onClose()
reset()
}
return (
<>
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
onClose={handleClose}
>
<DrawerOverlay />
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"sm"}>IO Artifacts Image</DrawerHeader>
<DrawerBody>
<Stack spacing={4}>
<FormControl isInvalid={errors.artifactName}>
<FormLabel fontSize={"sm"}>Artifact Name</FormLabel>
<Controller
name="artifactName"
control={control}
render={({ field }) => (
<Input {...field} fontSize={"sm"} type="text" size={"sm"} />
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.artifactName?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={errors.artifactStreamingURL}>
<FormLabel fontSize={"sm"}>Artifact Streaming URL</FormLabel>
<Controller
name="artifactStreamingURL"
control={control}
render={({ field }) => (
<Input {...field} fontSize={"sm"} type="url" size={"sm"} />
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.artifactStreamingURL?.message}
</FormErrorMessage>
</FormControl>
</Stack>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme={"green"}
rounded={"sm"}
size={"sm"}
mr={3}
onClick={handleClose}
>
Cancel
</Button>
<Button
colorScheme={"green"}
rounded={"sm"}
size={"sm"}
onClick={() => setAlert(true)}
>
Save
</Button>
</DrawerFooter>
</DrawerContent>
</Drawer>
<CustomAlertDialog
isOpen={alert}
onClose={() => setAlert(false)}
alertHandler={handleSave}
message={"Are you sure you want to add this artifact?"}
isLoading={isLoading}
/>
</>
);
};
export default IOArtifactsAdd;

View File

@@ -51,13 +51,13 @@ const schema = yup.object().shape({
.string()
.required("Description in English is required")
.min(10, "Description in English must be at least 10 characters long")
.max(500, "Description in English must be at most 500 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(500, "Description in Arabic must be at most 500 characters long"),
.max(2000, "Description in Arabic must be at most 500 characters long"),
goalAmount: yup
.number()
@@ -82,7 +82,9 @@ const schema = yup.object().shape({
InvestmentDetails: yup.string(),
comment: yup.string(),
comment: yup.string()
.min(10, "Comment must be at least 10 characters long")
.max(150, "Comment must be at most 150 characters long"),
expectedReturn: yup
.number()
@@ -123,6 +125,9 @@ const IODetails = ({ enableNextTab, index, data }) => {
isLoading: IObyIDisLoading,
error: IObyIDerror,
} = useGetIOByIdQuery(id, { skip: !id });
const [creatIO] = useCreateIOMutation();
const [updateIO] = useUpdateIOMutation();
@@ -237,6 +242,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
isRequired: true,
section: " ",
width: "49%",
maxLength:1000
},
{
label: "Description (Arabic)",
@@ -247,6 +253,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
arabic: true,
section: " ",
width: "49%",
},
{
label: "Investment Type",
@@ -300,7 +307,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
value: IObyID?.data?.holdingPeriod,
},
{
label: "Expected Return Estimated",
label: "Expected Return",
placeHolder: "$00.00",
name: "expectedReturn",
type: "number",
@@ -313,7 +320,8 @@ const IODetails = ({ enableNextTab, index, data }) => {
label: "ISIN",
placeHolder: "",
name: "ISIN",
type: "number",
type: "text",
align:"right",
section: " ",
width: "32.3%",
},
@@ -350,6 +358,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
width: "100%",
options: investmentTypeOptions,
value: IObyID?.data?.comment,
maxLength:150
},
];
//=======================[ Editor ]
@@ -530,24 +539,23 @@ const IODetails = ({ enableNextTab, index, data }) => {
if (id) {
const res = await updateIO({ data: formData, id });
console.log(res);
if (res?.error?.status === 400 || res?.error?.status === 500) {
if (res?.data?.statusCode === 200) {
setIsLoading(false);
toast({
render: () => (
<ToastBox message={res?.error?.data?.message} status={"error"} />
),
render: () => <ToastBox message={res?.data?.message} />,
});
navigate(`/view-io/${id}`);
enableNextTab(index);
} else if(res?.error?.status === 400){
setIsLoading(false);
toast({
render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
});
}
navigate(`/view-io/${id}`);
setIsLoading(false);
} else {
try {
const res = await creatIO(formData);
console.log(res);
console.log(res?.error?.status);
if (res?.data?.statusCode === 200) {
setIsLoading(false);
toast({
@@ -555,6 +563,11 @@ const IODetails = ({ enableNextTab, index, data }) => {
});
navigate(`/view-io/${res?.data?.data}`);
enableNextTab(index);
} else if(res?.error?.status === 400){
setIsLoading(false);
toast({
render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
});
}
} catch (error) {
setIsLoading(false);

View File

@@ -33,6 +33,7 @@ import {
import ToastBox from "../../../Components/ToastBox";
import { getFileNameFromPath } from "../../../Constants/Constants";
import { TbFileTypeDocx } from "react-icons/tb";
import SetDisplayOrder from "./SetDisplayOrder";
const downloadFile = (filePath, fileName) => {
console.log("https://admin.tanami.betadelivery.com/" + filePath);
@@ -206,7 +207,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
fontWeight="500"
className="d-flex align-items-center web-text-small"
>
{getFileNameFromPath(item?.documentType)}
{getFileNameFromPath(item?.documentPath)}
</Text>
),
Action: (
@@ -292,17 +293,10 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
return (
<Box>
<Box display="flex" justifyContent="space-between" mb={4}>
<Input
type="search"
width={300}
placeholder="Search..."
size="sm"
rounded="sm"
focusBorderColor="green.500"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
<Box display="flex" justifyContent="end" mb={4} gap={2}>
<SetDisplayOrder data={filteredData} />
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
@@ -314,7 +308,6 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
Add Document
</Button>
<InvestmentDocuments
data={data?.data}
create={create}
setCreate={setCreate}
isOpen={isOpen}
@@ -328,6 +321,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index }) => {
secondField={secondField}
/>
<InvestmentEdit
data={data?.data}
id={actionId}
isOpen={isEditOpen}
onClose={onEditClose}

View File

@@ -25,22 +25,27 @@ import {
} from "@chakra-ui/icons";
import KeyMeritsAdd from "../KeyMeritsAdd";
import { useParams } from "react-router-dom";
import { useDeleteKeyMeritsMutation, useGetKeyMeritsQuery } from "../../../Services/io.service";
import {
useDeleteKeyMeritsMutation,
useGetKeyMeritsQuery,
} from "../../../Services/io.service";
import FullscreenLoaders from "../../../Components/Loaders/FullscreenLoaders";
import ToastBox from "../../../Components/ToastBox";
import KeyMeritsEdit from "../KeyMeritsEdit";
import SetDisplayOrder from "./SetDisplayOrder";
const KeyMerits = ({ enableNextTab, index }) => {
const toast = useToast()
const KeyMerits = ({ enableNextTab, index, data:prepopData }) => {
const toast = useToast();
const params = useParams();
// =====================[ variables ]
const id = params?.id;
const { data, isLoading, error } = useGetKeyMeritsQuery(id, {
skip: !id,
});
console.log(data?.data);
const { keyMerits, setKeyMerits, slideFromRight } =
useContext(GlobalStateContext);
@@ -52,8 +57,12 @@ const KeyMerits = ({ enableNextTab, index }) => {
const [isBtnLoading, setIsBtnLoading] = useState(false);
const [mouseEnteredId, setMouseEnteredId] = useState("");
const { isOpen, onOpen, onClose } = useDisclosure();
const { isOpen: isEditOpen, onOpen: onEditOpen, onClose: onEditCloseOpen } = useDisclosure();
const [ deleteKeyMerits ] = useDeleteKeyMeritsMutation()
const {
isOpen: isEditOpen,
onOpen: onEditOpen,
onClose: onEditCloseOpen,
} = useDisclosure();
const [deleteKeyMerits] = useDeleteKeyMeritsMutation();
const tableHeadRow = ["Sr.no", "Title", "Sub title", "Icon", "Action"];
@@ -80,19 +89,17 @@ const KeyMerits = ({ enableNextTab, index }) => {
});
const handleDelete = async () => {
setIsBtnLoading(true)
setIsBtnLoading(true);
try {
const res = await deleteKeyMerits(actionId)
if(res?.data?.statusCode === 200){
const res = await deleteKeyMerits(actionId);
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
setIsBtnLoading(false)
setDeleteAlert(false)
setIsBtnLoading(false);
setDeleteAlert(false);
}
} catch (error) {
}
} catch (error) {}
};
const extractedArray = filteredData?.map((item, index) => ({
@@ -126,23 +133,21 @@ const KeyMerits = ({ enableNextTab, index }) => {
</Text>
</Box>
),
Icon: (
item.iconFilePath && <Image
rounded={'md'}
bg={"#003B14"}
display={'flex'}
p={1}
justifyContent={'center'}
alignItems={'center'}
src={" https://admin.tanami.betadelivery.com/"+item.iconFilePath}
Icon: item?.icon?.iconFilePath && (
<Image
rounded={"md"}
// bg={"#003B14"}
display={"flex"}
p={1}
justifyContent={"center"}
alignItems={"center"}
src={" https://admin.tanami.betadelivery.com/" + item?.icon?.iconFilePath}
w={8}
h={8}
/>
// https://admin.tanami.betadelivery.com/public/icons/linkedin.png
),
// https://admin.tanami.betadelivery.com/public/icons/linkedin.png
Action: (
<Box display={"flex"} justifyContent={"center"} gap={2}>
{/* <Tooltip
@@ -218,8 +223,8 @@ const KeyMerits = ({ enableNextTab, index }) => {
<FullscreenLoaders />
) : (
<Box>
<Box display={"flex"} justifyContent={"space-between"} mb={4}>
<Input
<Box display={"flex"} justifyContent={"end"} mb={4}>
{/* <Input
type="search"
width={300}
placeholder="Search..."
@@ -228,35 +233,34 @@ const KeyMerits = ({ enableNextTab, index }) => {
focusBorderColor="green.500"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
/> */}
<Box display={'flex'} gap={2} as="span">
<SetDisplayOrder data={filteredData} />
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
size={"sm"}
// width={"44.5%"}
fontSize={"xs"}
rounded={"sm"}
colorScheme="forestGreen"
>
Add key merits
</Button>
<Box display={"flex"} gap={2} as="span">
<SetDisplayOrder data={filteredData} />
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
size={"sm"}
// width={"44.5%"}
fontSize={"xs"}
rounded={"sm"}
colorScheme="forestGreen"
>
Add key merits
</Button>
</Box>
<KeyMeritsAdd
id={id}
icons={prepopData?.icons}
id={id}
isOpen={isOpen}
onClose={onClose}
firstField={firstField}
/>
<KeyMeritsEdit
id={id}
actionId={actionId}
<KeyMeritsEdit
icons={prepopData?.icons}
id={id}
actionId={actionId}
isOpen={isEditOpen}
onClose={onEditCloseOpen}
firstField={firstField}

View File

@@ -44,14 +44,14 @@ const SetDisplayOrder = ({data,}) => {
</Text></Box>
),
Icon: (
item.iconFilePath && <Image
item?.icon?.iconFilePath && <Image
rounded={'md'}
bg={"#003B14"}
// bg={"#003B14"}
display={'flex'}
p={1}
justifyContent={'center'}
alignItems={'center'}
src={" https://admin.tanami.betadelivery.com/"+item.iconFilePath}
src={" https://admin.tanami.betadelivery.com/" + item?.icon?.iconFilePath}
w={8}
h={8}
/>

View File

@@ -1,153 +1,284 @@
import {
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
FormControl,
FormLabel,
Input,
Box,
Text,
} from "@chakra-ui/react";
import React, { useContext, useEffect, useState } from "react";
import { bytesToMB, getFileIcon, investmentDocSchema } from "../InvestmentDocuments";
import { yupResolver } from "@hookform/resolvers/yup";
import { useForm } from "react-hook-form";
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
const InvestmentEdit = ({ isOpen, onClose, thirdField, id }) => {
const { create, setCreate } = useContext(GlobalStateContext);
const [file, setFile] = useState(null);
const filteredObject = create?.find((item) => item?.id === id)
const {
control,
watch,
setValue,
handleSubmit,
reset,
register,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentDocSchema),
});
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
FormControl,
FormLabel,
Input,
Box,
Text,
useToast,
} from "@chakra-ui/react";
import React, { useContext, useEffect, useState } from "react";
import {
bytesToMB,
getFileIcon,
investmentDocSchema,
} from "../InvestmentDocuments";
import { yupResolver } from "@hookform/resolvers/yup";
import { useForm } from "react-hook-form";
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
import { getFileNameFromPath } from "../../../Constants/Constants";
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
import { useUpdateInvestmentDocumentsMutation } from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
useEffect(() => {
if (filteredObject) {
reset({
fileName:filteredObject?.fileName,
document: filteredObject?.document,
Type: filteredObject?.Type
const InvestmentEdit = ({ isOpen, onClose, thirdField, id, data }) => {
const toast = useToast();
const { create, setCreate } = useContext(GlobalStateContext);
const [formData, setFormData] = useState(null);
const [alert, setAlert] = useState(false);
const [file, setFile] = useState(null);
const [isLoading, setIsLoading] = useState(false);
const filteredObject = create?.find((item) => item?.id === id);
const [updateInvestmentDocuments] = useUpdateInvestmentDocumentsMutation();
// =====================[ variables ]
// const id = params?.id;
console.log(id);
console.log(data);
const filterObject = data?.find((item) => item?.id === id);
console.log(filterObject);
const getFileTitle = (type) => {
switch (type) {
case "application/pdf":
return "PDF";
case "application/vnd.openxmlformats-officedocument.wordprocessingml.document":
case "application/msword":
return "DOCX";
case "image/jpeg":
case "image/png":
case "image/gif":
return "JPG";
default:
return "HH";
}
};
const {
control,
watch,
setValue,
handleSubmit,
reset,
register,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentDocSchema),
});
// useEffect to reset the form when `found` changes
useEffect(() => {
if (filterObject) {
reset({
document: filterObject?.documentPath,
fileName: filterObject?.documentName,
});
}
}, [filterObject, reset]);
useEffect(() => {
if (filteredObject) {
reset({
fileName: filteredObject?.fileName,
document: filteredObject?.document,
Type: filteredObject?.Type,
});
}
}, [id, create, reset]);
const handleConfirm = async () => {
setIsLoading(true);
try {
const res = await updateInvestmentDocuments({ data: formData, id });
console.log(res);
if (res?.error) {
toast({
render: () => (
<ToastBox
message={
res?.error?.data?.message
? res?.error?.data?.message
: "File size is too large"
}
status={"error"}
/>
),
});
setIsLoading(false);
} else if (res?.data?.statusCode === 201) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
onClose();
setIsLoading(false);
setFile(null);
reset();
}
}, [id, create, reset]);
} catch (error) {
console.log(error);
if (error) {
toast({
render: () => (
<ToastBox
message={"Something went wrong please try again!"}
status={"error"}
/>
),
});
onClose();
setIsLoading(false);
setFile(null);
reset();
}
}
const onSubmit = (data) => {
// setValue('Type',data.Type[0]?.type)
const updatedCreate = create.map((item) =>
item.id === id ? { ...item, ...data } : item
);
setCreate(updatedCreate);
onClose();
};
setAlert(false);
};
const onSubmit = (data) => {
console.log(data);
// setValue('Type',data.Type[0]?.type)
// const updatedCreate = create.map((item) =>
// item.id === id ? { ...item, ...data } : item
// );
// setCreate(updatedCreate);
// onClose();
console.log("sibmited");
console.log(errors);
if (Object.keys(errors).length === 0) {
const formData = new FormData();
formData.append("documentName", data.fileName);
typeof data?.document !== "string"
? formData.append("document", data?.document[0])
: null;
setFormData(formData);
setAlert(true);
}
};
const handleFileChange = (event) => {
const selectedFile = event.target.files[0];
setFile(selectedFile);
};
return (
<Drawer isOpen={isOpen} placement="right" onClose={onClose} initialFocusRef={thirdField}>
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"md"}>Edit Document</DrawerHeader>
<Box as="form" onSubmit={handleSubmit(onSubmit)}>
<DrawerBody>
<FormControl mb={4} isInvalid={errors.fileName}>
<FormLabel fontSize="sm">File Name</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
{...register("fileName")}
/>
{errors.fileName && (
<Text color="red.500" fontSize="sm">
{errors.fileName.message}
</Text>
)}
</FormControl>
<FormControl mb={4} isInvalid={errors.document}>
<FormLabel fontSize="sm">Document</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
{...register("document")}
/>
{errors.document && (
<Text color="red.500" fontSize="sm">
{errors.document.message}
</Text>
)}
</FormControl>
<FormControl mb={4} isInvalid={errors.Type}>
<FormLabel fontSize="sm">Type</FormLabel>
<Input
name="Type"
{...register("Type")}
fontSize="sm"
className="form-control"
type="file"
size="sm"
onChange={handleFileChange}
/>
{errors.type && (
<Text color="red.500" fontSize="sm">
{errors.type.message}
</Text>
)}
</FormControl>
{file === null ?
<Text>{filteredObject?.Type}</Text>: (
<Box mt={4}>
<Box display="flex" mb={2}>
<Text>{getFileIcon(file.type)}</Text>
<Text fontSize="sm" ml={2} mb={0 }>
{file.name}
</Text>
</Box>
<Text fontSize="sm">{bytesToMB(file.size)}</Text>
</Box>
)}
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme="forestGreen"
rounded="sm"
console.log(filteredObject);
return (
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
onClose={onClose}
initialFocusRef={thirdField}
>
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"md"}>Edit Document</DrawerHeader>
<Box as="form" onSubmit={handleSubmit(onSubmit)}>
<DrawerBody>
<FormControl isRequired mb={4} isInvalid={errors.fileName}>
<FormLabel fontSize="sm">File Name</FormLabel>
<Input
fontSize="sm"
type="text"
size="sm"
mr={3}
onClick={onClose}
>
Cancel
</Button>
<Button colorScheme="forestGreen" rounded="sm" size="sm" type="submit">
Save
</Button>
</DrawerFooter>
</Box>
</DrawerContent>
</Drawer>
);
};
export default InvestmentEdit;
{...register("fileName")}
/>
{errors.fileName && (
<Text color="red.500" fontSize="sm">
{errors.fileName.message}
</Text>
)}
</FormControl>
<FormControl mb={4} isInvalid={errors.Type}>
<FormLabel fontSize="sm">Document</FormLabel>
<Input
name="document"
{...register("document")}
fontSize="sm"
className="form-control"
type="file"
size="sm"
onChange={handleFileChange}
/>
{errors.document && (
<Text color="red.500" fontSize="sm">
{errors.document.message}
</Text>
)}
</FormControl>
{filterObject !== null && file === null ? (
<Box mt={4}>
<Box display="flex" alignItems={"center"} mb={2}>
<Text as={"span"}>
{getFileIcon(filterObject?.documentType)}
</Text>
<Text
as={"span"}
fontSize="sm"
fontWeight={400}
ml={2}
mb={0}
>
{getFileNameFromPath(filterObject?.documentPath)}
</Text>
</Box>
{/* <Text fontSize="sm">{bytesToMB(file.size)}</Text> */}
</Box>
) : (
<Box mt={4}>
<Box display="flex" mb={2}>
<Text>{getFileIcon(file.type)}</Text>
<Text fontSize="sm" ml={2} mb={0}>
{file.name}
</Text>
</Box>
<Text fontSize="sm">{bytesToMB(file.size)}</Text>
</Box>
)}
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme="forestGreen"
rounded="sm"
size="sm"
mr={3}
onClick={onClose}
>
Cancel
</Button>
<Button
colorScheme="forestGreen"
rounded="sm"
size="sm"
type="submit"
>
Save
</Button>
</DrawerFooter>
</Box>
</DrawerContent>
<CustomAlertDialog
isOpen={alert}
onClose={() => setAlert(false)}
alertHandler={handleConfirm}
isLoading={isLoading}
message="Are you sure you want to add this document?"
/>
</Drawer>
);
};
export default InvestmentEdit;

View File

@@ -1,135 +1,192 @@
import {
Box,
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
DrawerOverlay,
FormControl,
FormLabel,
Input,
InputGroup,
Stack,
} from "@chakra-ui/react";
import * as yup from "yup";
import React, { useContext, useEffect, useRef, useState } from "react";
import FormInputMain from "../../Components/FormInputMain";
import { useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import CustomAlertDialog from "../../Components/CustomAlertDialog";
export const investmentDoct = yup.object().shape({
type: yup.string().required("Sponser name is required"),
document: yup.string().required("Sponser name is required"),
fileName: yup.string().required("Mobile no is required"),
Box,
Button,
Drawer,
DrawerBody,
DrawerCloseButton,
DrawerContent,
DrawerFooter,
DrawerHeader,
DrawerOverlay,
FormControl,
FormErrorMessage,
FormLabel,
Image,
Input,
Stack,
useToast,
} from "@chakra-ui/react";
import * as yup from "yup";
import React, { useState } from "react";
import { useForm, Controller } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
import CustomAlertDialog from "../../Components/CustomAlertDialog";
import { useCreateImageArtifactsMutation } from "../../Services/io.service";
import { useParams } from "react-router-dom";
import ToastBox from "../../Components/ToastBox";
const investmentImageSchema = yup.object().shape({
artifactName: yup.string().required("Artifact image name is required"),
artifactPathName: yup.mixed().required("Artifact image is required"),
});
const IOArtifactsAdd = ({ isOpen, onClose, firstField }) => {
const params = useParams()
const id = params?.id
const [file, setFile] = useState(null);
const [preview, setPreview] = useState(null);
const [alert, setAlert] = useState(false);
const [loading, setIsLoading] = useState(false);
const toast = useToast();
const [ createImageArtifacts ] = useCreateImageArtifactsMutation()
const {
control,
handleSubmit,
reset,
setValue,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentImageSchema),
});
console.log(errors);
const onSubmit = async (data) => {
setIsLoading(true)
const formData = new FormData();
formData.append('artifactName', data.artifactName);
formData.append('artifactPathName', file); // Assuming artifactPathName is an array of files
const IOArtifactsAdd = ({ id, isOpen, onClose, firstField }) => {
const [file, setFile] = useState("");
const [fileName, setFileName] = useState("");
const [alert, setAlert] = useState(false);
const {
control,
handleSubmit,
formState: { errors },
} = useForm({
resolver: yupResolver(investmentDoct),
});
const onSubmit = (data) => {
setSponser([
{
...data,
status: true,
id: uuidv4(),
createdAt: new Date().toISOString(),
},
...investmentDoct,
]);
};
const handleSave = () => {
setAlert(false)
onClose()
console.log('FormData:', formData);
for (let [key, value] of formData.entries()) {
console.log(`${key}:`, value);
}
try {
const res = await createImageArtifacts({data: formData, id})
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
reset()
setIsLoading(false)
setAlert(false);
onClose();
}
} catch (error) {
console.log(error);
}
return (
<>
<Drawer
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
onClose={onClose}
>
<DrawerOverlay />
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"sm"}>IO Artifacts</DrawerHeader>
<DrawerBody>
<FormControl mb={4}>
<FormLabel fontSize={"sm"}>File Name</FormLabel>
<Input
value={fileName}
onChange={(e) => setFileName(e.target.value)}
fontSize={"sm"}
type="text"
size={"sm"}
/>
</FormControl>
<FormControl mb={4}>
<FormLabel fontSize={"sm"}>Document</FormLabel>
<Input
value={file}
onChange={(e) => setFile(e.target.value)}
fontSize={"sm"}
type="file"
className="form-control"
size={"sm"}
/>
</FormControl>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme={"green"}
rounded={"sm"}
size={"sm"}
mr={3}
onClick={onClose}
>
Cancel
</Button>
<Button
colorScheme={"green"}
rounded={"sm"}
size={"sm"}
onClick={() => setAlert(true)}
>
Save
</Button>
</DrawerFooter>
</DrawerContent>
</Drawer>
<CustomAlertDialog
isOpen={alert}
onClose={() => setAlert(false)}
alertHandler={handleSave}
message={"Are you sure you want to add this document?"}
/>
</>
);
// Close the form/modal
// onClose();
};
export default IOArtifactsAdd;
const handleFileChange = (e) => {
const file = e.target.files[0];
setFile(file);
setValue("artifactPathName", file)
const reader = new FileReader();
reader.onloadend = () => {
setPreview(reader.result);
};
reader.readAsDataURL(file);
};
const handleSave = () => {
handleSubmit(onSubmit)();
};
const handleClose = () => {
}
return (
<>
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
onClose={onClose}
>
<DrawerOverlay />
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"sm"}>IO Artifacts Image</DrawerHeader>
<DrawerBody>
<Stack spacing={4}>
<FormControl isInvalid={errors.artifactName}>
<FormLabel fontSize={"sm"}>Artifact Name</FormLabel>
<Controller
name="artifactName"
control={control}
render={({ field }) => (
<Input {...field} fontSize={"sm"} type="text" size={"sm"} />
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.artifactName?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={!preview && errors.artifactPathName?.message && errors.artifactPathName}>
<FormLabel fontSize={"sm"}>Artifact Image</FormLabel>
<Input
type="file"
accept="image/*"
onChange={handleFileChange}
fontSize={"sm"}
size={"sm"}
className="form-control"
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{!preview && errors.artifactPathName?.message && errors.artifactPathName?.message}
</FormErrorMessage>
{preview && <Image src={preview} alt="Image Preview" mt={2} />}
</FormControl>
</Stack>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
colorScheme={"forestGreen"}
rounded={"sm"}
size={"sm"}
mr={3}
onClick={onClose}
>
Cancel
</Button>
<Button
colorScheme={"forestGreen"}
rounded={"sm"}
size={"sm"}
onClick={() => setAlert(true)}
>
Save
</Button>
</DrawerFooter>
</DrawerContent>
</Drawer>
<CustomAlertDialog
isOpen={alert}
onClose={() => setAlert(false)}
alertHandler={handleSave}
message={"Are you sure you want to add this artifact?"}
isLoading={loading}
/>
</>
);
};
export default IOArtifactsAdd;

View File

@@ -42,7 +42,7 @@ export const getFileIcon = (type) => {
return <GrDocumentPdf />;
case "application/vnd.openxmlformats-officedocument.wordprocessingml.document":
case "application/msword":
return <TbFileTypeDocx fontSize={"16px"} />;
return <TbFileTypeDocx fontSize={"20px"} />;
case "image/jpeg":
case "image/png":
case "image/gif":
@@ -67,7 +67,6 @@ const InvestmentDocuments = ({
firstField,
create,
setCreate,
data
}) => {
const toast = useToast();
const params = useParams();
@@ -79,17 +78,12 @@ const InvestmentDocuments = ({
// =====================[ variables ]
const id = params?.id;
const filterObject = data?.find((item)=> item?.id === id)
console.log(filterObject);
// =====================[ RTK Api calls ]
const [createInvestmentDocument] = useCreateInvestmentDocumentsMutation();
const navigate = useNavigate();
console.log(data);
const {
register,
handleSubmit,
@@ -99,7 +93,6 @@ const InvestmentDocuments = ({
resolver: yupResolver(investmentDocSchema),
});
const onSubmit = async (data) => {
console.log("sibmited");
console.log(errors);
@@ -194,6 +187,7 @@ const InvestmentDocuments = ({
return (
<>
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
@@ -261,7 +255,12 @@ const InvestmentDocuments = ({
>
Cancel
</Button>
<Button colorScheme="forestGreen" rounded="sm" size="sm" type="submit">
<Button
colorScheme="forestGreen"
rounded="sm"
size="sm"
type="submit"
>
Save
</Button>
</DrawerFooter>
@@ -270,7 +269,7 @@ const InvestmentDocuments = ({
</Drawer>
<CustomAlertDialog
isOpen={alert}
onClose={()=>setAlert(false)}
onClose={() => setAlert(false)}
alertHandler={handleConfirm}
isLoading={isLoading}
message="Are you sure you want to add this document?"

View File

@@ -11,9 +11,16 @@ import {
FormControl,
FormErrorMessage,
FormLabel,
HStack,
Image,
Input,
Menu,
MenuButton,
MenuItem,
MenuList,
Stack,
Text,
Textarea,
useToast,
} from "@chakra-ui/react";
import React, { useRef, useState } from "react";
@@ -23,44 +30,56 @@ import CustomAlertDialog from "../../Components/CustomAlertDialog";
import { useCreateKeyMeritsMutation } from "../../Services/io.service";
import * as yup from "yup";
import ToastBox from "../../Components/ToastBox";
import { ChevronDownIcon } from "@chakra-ui/icons"; // Import ChevronDownIcon for the dropdown button
const keyMeritsSchema = yup.object().shape({
meritsHeader: yup.string().required("Title is required"),
meritsDescription: yup.string().required("Sub title is required"),
iconImage: yup.mixed().required("Icon is required"), // Adjust based on file or string
meritsDescription: yup.string().required("Description is required"),
meritsHeaderArabic: yup.string().required("Arabic title is required"),
meritsDescriptionArabic: yup
.string()
.required("Arabic Description is required"),
icon_xid: yup.string().required("Icon is required"), // Adjust based on file or string
});
const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
const toast = useToast()
const KeyMeritsAdd = ({ isOpen, onClose, firstField, id, icons }) => {
const toast = useToast();
const [formData, setFormData] = useState(null);
const [alert, setAlert] = useState(false);
const [createKeyMerits] = useCreateKeyMeritsMutation();
const [isLoading, setIsLoading] = useState(false);
const [file, setFile] = useState(null);
const [selectedIcon, setSelectedIcon] = useState("Select Icon");
const [selectedImageIcon, setSelectedImageIcon] = useState(null);
const {
control,
reset,
handleSubmit,
setValue, // Add setValue to programmatically set the selected icon
formState: { errors },
} = useForm({
resolver: yupResolver(keyMeritsSchema),
defaultValues: {
meritsHeader: "",
meritsDescription: "",
iconImage: null,
meritsHeaderArabic: "",
meritsDescriptionArabic: "",
icon_xid: "",
},
});
const onSubmit = async (data) => {
const onSubmit = (data) => {
if (Object.keys(errors).length === 0) {
console.log("hit");
setFormData(data);
setAlert(true);
}
};
const handleConfirm = async () => {
setIsLoading(true);
try {
const formData = new FormData();
formData.append("meritsHeader", data.meritsHeader);
formData.append("meritsDescription", data.meritsDescription);
if (data.iconImage && data.iconImage instanceof File) {
formData.append("iconImage", data.iconImage);
console.log(data.iconImage);
}
const res = await createKeyMerits({ data: formData, id });
if (res?.data?.statusCode === 201) {
toast({
@@ -69,38 +88,51 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
setAlert(false);
onClose();
setIsLoading(false);
reset()
return
}
if(res?.error?.data?.code === 400){
reset();
return;
}
if (res?.error?.data?.code === 400) {
toast({
render: () => <ToastBox message={res?.error?.data?.message} status={'error'} />,
render: () => (
<ToastBox message={res?.error?.data?.message} status={"error"} />
),
});
setAlert(false);
onClose();
setIsLoading(false);
reset()
return
onClose();
setAlert(false);
reset();
setFile(null);
setSelectedImageIcon(null);
setSelectedIcon("Select Icon");
return;
}
} catch (error) {
if (error) {
toast({
render: () => <ToastBox message={"Something went wrong, please try again!"} status={'error'} />,
render: () => (
<ToastBox
message={"Something went wrong, please try again!"}
status={"error"}
/>
),
});
}
setIsLoading(false);
setAlert(false);
onClose();
reset()
setAlert(false);
reset();
setFile(null);
setSelectedImageIcon(null);
setSelectedIcon("Select Icon");
}
reset()
reset();
};
const handleSave = () => {
handleSubmit(onSubmit)();
};
const handleFileChange = (e) => {
const file = e.target.files[0];
console.log(file);
@@ -109,46 +141,91 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
}
};
const handleIconSelect = (id, iconName, iconFilePath) => {
setValue("icon_xid", id);
setSelectedIcon(iconName); // Update selected icon name
setSelectedImageIcon(iconFilePath);
};
const handleClose = () => {
onClose();
setAlert(false);
reset();
setFile(null);
setSelectedImageIcon(null);
setSelectedIcon("Select Icon");
};
return (
<>
<Drawer
size={"xl"}
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
onClose={onClose}
initialFocusRef={firstField}
onClose={handleClose}
>
<DrawerOverlay />
<DrawerContent>
<DrawerCloseButton />
<DrawerHeader fontSize={"sm"}>Key Merits</DrawerHeader>
<DrawerHeader fontSize={"sm"}>Key Merits </DrawerHeader>
<DrawerBody>
<Stack spacing={2}>
<FormControl isInvalid={!!errors.meritsHeader} isRequired={true}>
<FormLabel fontSize={"sm"}>Title</FormLabel>
<HStack spacing={2} w={'100%'} flexWrap={'wrap'}>
<FormControl w={'49%'} mb={2} isInvalid={!!errors.meritsHeader} isRequired={true}>
<FormLabel fontSize={"sm"}>Title (English)</FormLabel>
<Controller
name="meritsHeader"
control={control}
render={({ field }) => (
<Input {...field} fontSize={"sm"} type="text" size={"sm"} />
)}
/>
)}/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsHeader?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={!!errors.meritsDescription} isRequired={true}>
<FormLabel fontSize={"sm"}>Sub Title</FormLabel>
<FormControl w={'49%'} mb={2}
isInvalid={!!errors.meritsHeaderArabic}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Title (Arabic)</FormLabel>
<Controller
name="meritsHeaderArabic"
control={control}
render={({ field }) => (
<Input
textAlign={"right"}
{...field}
fontSize={"sm"}
type="text"
size={"sm"}
/>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsHeaderArabic?.message}
</FormErrorMessage>
</FormControl>
<FormControl w={'49%'} mb={2}
isInvalid={!!errors.meritsDescription}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Description (English)</FormLabel>
<Controller
name="meritsDescription"
control={control}
render={({ field }) => (
<Input
<Textarea
{...field}
fontSize={"sm"}
type="textarea"
size={"sm"}
rows={2}
/>
)}
/>
@@ -156,33 +233,107 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
{errors.meritsDescription?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={!!errors.iconImage} isRequired={true}>
<FormLabel fontSize={"sm"}>Icon</FormLabel>
<FormControl w={'49%'} mb={2}
isInvalid={!!errors.meritsDescriptionArabic}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Description (Arabic)</FormLabel>
<Controller
name="iconImage"
name="meritsDescriptionArabic"
control={control}
render={({ field: { onChange, onBlur, value } }) => (
<Input
type="file"
className="form-control"
onChange={(e) => {
onChange(e.target.files[0]);
handleFileChange(e);
}}
onBlur={onBlur}
render={({ field }) => (
<Textarea
{...field}
fontSize={"sm"}
type="textarea"
size={"sm"}
textAlign={"right"}
rows={2}
/>
)}
/>
{file && <Image w={8} h={8} p={1} bg={'#004118'} rounded={'md'} src={file} alt="Preview" mt={2} />}
<FormErrorMessage fontSize={"xs"} fontWeight={500} >
{errors.iconImage?.message}
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsDescriptionArabic?.message}
</FormErrorMessage>
</FormControl>
</Stack>
<FormControl w={'49%'} mb={2} isInvalid={!!errors.icon_xid} isRequired={true}>
<FormLabel fontSize={"sm"}>Select Icon</FormLabel>
<Controller
name="icon_xid"
control={control}
render={({ field }) => (
<Menu>
<MenuButton
h={34}
bg={'transparent'}
className="border"
size={"sm"}
fontWeight={500}
rounded={"sm"}
w={"100%"}
textAlign={"left"}
as={Button}
rightIcon={<ChevronDownIcon />}
border={
!errors.icon_xid?.message ||
(!selectedImageIcon && "2px solid #e53e3e")
}
>
<Box display="flex" alignItems="center">
<Image
src={`https://admin.tanami.betadelivery.com/${selectedImageIcon}`}
alt={selectedImageIcon}
boxSize="1rem"
mr="12px"
/>{" "}
<Text as={"span"} fontSize={"sm"} fontWeight={500}>
{selectedIcon}
</Text>
</Box>
</MenuButton>
<MenuList minW='415px' size={"sm"} fontWeight={500}>
{icons?.map(({ iconName, id, iconFilePath }) => (
<MenuItem
key={id}
onClick={() =>
handleIconSelect(id, iconName, iconFilePath)
}
>
<Box display="flex" alignItems="center">
<Image
src={`https://admin.tanami.betadelivery.com/${iconFilePath}`}
alt={iconName}
boxSize="1rem"
mr="12px"
/>
<Text
as={"span"}
fontSize={"sm"}
fontWeight={500}
>
{iconName}
</Text>
</Box>
</MenuItem>
))}
</MenuList>
</Menu>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{!errors.icon_xid?.message ||
(!selectedImageIcon && errors.icon_xid?.message)}
</FormErrorMessage>
</FormControl>
</HStack>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"
@@ -199,7 +350,7 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
colorScheme={"forestGreen"}
rounded={"sm"}
size={"sm"}
onClick={() => setAlert(true)}
onClick={handleSave}
>
Save
</Button>
@@ -208,8 +359,9 @@ const KeyMeritsAdd = ({ isOpen, onClose, firstField, id }) => {
</Drawer>
<CustomAlertDialog
isOpen={alert}
onClose={() => setAlert(false)}
alertHandler={handleSave}
onClose={handleClose}
// alertHandler={handleSave}
alertHandler={handleConfirm}
message={"Are you sure you want to add this key merit?"}
isLoading={isLoading}
/>

View File

@@ -11,8 +11,16 @@ import {
FormControl,
FormErrorMessage,
FormLabel,
HStack,
Image,
Input,
Menu,
MenuButton,
MenuItem,
MenuList,
Stack,
Text,
Textarea,
useToast,
} from "@chakra-ui/react";
import React, { useEffect, useRef, useState } from "react";
@@ -22,54 +30,54 @@ import CustomAlertDialog from "../../Components/CustomAlertDialog";
import * as yup from "yup";
import ToastBox from "../../Components/ToastBox";
import { useUpdateKeyMeritsMutation } from "../../Services/io.service";
import { ChevronDownIcon } from "@chakra-ui/icons";
const keyMeritsSchema = yup.object().shape({
meritsHeader: yup.string().required("Title is required"),
meritsDescription: yup.string().required("Sub title is required"),
iconImage: yup.mixed().required("Icon is required"), // Adjust based on file or string
meritsHeaderArabic: yup.string().required("Arabic title is required"),
meritsDescriptionArabic: yup
.string()
.required("Arabic Description is required"),
icon_xid: yup.mixed().required("Icon is required"), // Adjust based on file or string
});
const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data }) => {
const toast = useToast()
const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data, icons }) => {
const toast = useToast();
const [alert, setAlert] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [ editKeyMerits ] = useUpdateKeyMeritsMutation()
const [editKeyMerits] = useUpdateKeyMeritsMutation();
const [selectedIcon, setSelectedIcon] = useState("Select Icon");
const [selectedImageIcon, setSelectedImageIcon] = useState(null);
const found = data?.find((item)=> item?.id === actionId)
const found = data?.find((item) => item?.id === actionId);
const {
control,
reset,
reset,setValue,
handleSubmit,
formState: { errors },
} = useForm({
resolver: yupResolver(keyMeritsSchema),
});
// useEffect to reset the form when `found` changes
useEffect(() => {
if (found) {
reset({
meritsHeader: found?.meritsHeader,
meritsDescription: found?.meritsDescription,
iconImage: null,
});
}
}, [found, reset]);
// useEffect to reset the form when `found` changes
useEffect(() => {
if (found) {
reset({
meritsHeader: found?.meritsHeader,
meritsDescription: found?.meritsDescription,
meritsHeaderArabic:found?.meritsHeaderArabic,
meritsDescriptionArabic:found?.meritsDescriptionArabic,
iconImage: null,
});
}
}, [found, reset]);
const onSubmit = async (data) => {
setIsLoading(true);
try {
const formData = new FormData();
formData.append("meritsHeader", data.meritsHeader);
formData.append("meritsDescription", data.meritsDescription);
if (data.iconImage && data.iconImage instanceof File) {
formData.append("iconImage", data.iconImage);
}
const id = actionId
const res = await editKeyMerits({ data: formData, id });
const id = actionId;
const res = await editKeyMerits({ data, id });
if (res?.data?.statusCode === 201) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
@@ -77,40 +85,61 @@ const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data }) => {
setAlert(false);
onClose();
setIsLoading(false);
reset()
return
}
if(res?.error?.data?.code === 400){
reset();
return;
}
if (res?.error?.data?.code === 400) {
toast({
render: () => <ToastBox message={res?.error?.data?.message} status={'error'} />,
render: () => (
<ToastBox message={res?.error?.data?.message} status={"error"} />
),
});
setAlert(false);
onClose();
setIsLoading(false);
reset()
return
reset();
return;
}
} catch (error) {
if (error) {
console.log(error);
toast({
render: () => <ToastBox message={"Something went wrong, please try again!"} status={'error'} />,
render: () => (
<ToastBox
message={"Something went wrong, please try again!"}
status={"error"}
/>
),
});
}
setIsLoading(false);
setAlert(false);
onClose();
reset()
reset();
}
reset()
reset();
};
const handleSave = () => {
handleSubmit(onSubmit)();
};
console.log(errors);
const handleIconSelect = (id, iconName, iconFilePath) => {
setValue("icon_xid", id);
setSelectedIcon(iconName); // Update selected icon name
setSelectedImageIcon(iconFilePath);
};
return (
<>
<Drawer
size={"xl"}
isOpen={isOpen}
placement="right"
initialFocusRef={firstField}
@@ -122,9 +151,9 @@ const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data }) => {
<DrawerHeader fontSize={"sm"}>Edit Key Merits</DrawerHeader>
<DrawerBody>
<Stack spacing={2}>
<FormControl isInvalid={!!errors.meritsHeader} isRequired={true}>
<FormLabel fontSize={"sm"}>Title</FormLabel>
<HStack spacing={2} w={'100%'} flexWrap={'wrap'} >
<FormControl mb={2} w={"49%"} isInvalid={!!errors.meritsHeader} isRequired={true}>
<FormLabel fontSize={"sm"}>Title (English)</FormLabel>
<Controller
name="meritsHeader"
control={control}
@@ -136,13 +165,21 @@ const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data }) => {
{errors.meritsHeader?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={!!errors.meritsDescription} isRequired={true}>
<FormLabel fontSize={"sm"}>Sub Title</FormLabel>
<FormControl mb={2} w={"49%"}
isInvalid={!!errors.meritsHeaderArabic}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Title (Arabic)</FormLabel>
<Controller
name="meritsDescription"
name="meritsHeaderArabic"
control={control}
render={({ field }) => (
<Input
textAlign={'right'}
{...field}
fontSize={"sm"}
type="textarea"
@@ -150,34 +187,180 @@ const KeyMeritsEdit = ({ isOpen, onClose, firstField, id, actionId, data }) => {
/>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsHeaderArabic?.message}
</FormErrorMessage>
</FormControl>
<FormControl mb={2} w={"49%"}
isInvalid={!!errors.meritsDescription}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Description (English)</FormLabel>
<Controller
name="meritsDescription"
control={control}
render={({ field }) => (
<Textarea
{...field}
fontSize={"sm"}
type="textarea"
size={"sm"}
rows={2}
/>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsDescription?.message}
</FormErrorMessage>
</FormControl>
<FormControl isInvalid={!!errors.iconImage} isRequired={true}>
<FormLabel fontSize={"sm"}>Icon</FormLabel>
<FormControl mb={2} w={"49%"}
isInvalid={!!errors.meritsDescriptionArabic}
isRequired={true}
>
<FormLabel fontSize={"sm"}>Description (Arabic)</FormLabel>
<Controller
name="iconImage"
name="meritsDescriptionArabic"
control={control}
render={({ field: { onChange, onBlur, value } }) => (
<Input
type="file"
className="form-control"
onChange={(e) => {
onChange(e.target.files[0]);
}}
onBlur={onBlur}
render={({ field }) => (
<Textarea
rows={2}
textAlign={'right'}
{...field}
fontSize={"sm"}
type="textarea"
size={"sm"}
/>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500} >
{errors.iconImage?.message}
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{errors.meritsDescriptionArabic?.message}
</FormErrorMessage>
</FormControl>
</Stack>
<FormControl w={"49%"} isInvalid={!!errors.icon_xid} isRequired={true}>
<FormLabel fontSize={"sm"}>Select Icon</FormLabel>
<Controller
name="icon_xid"
control={control}
render={({ field }) => (
<Menu>
<MenuButton
h={34}
className="border"
bg="transparent"
size={"sm"}
fontWeight={500}
rounded={"sm"}
w={"100%"}
textAlign={"left"}
as={Button}
rightIcon={<ChevronDownIcon />}
border={!errors.icon_xid?.message || !selectedImageIcon && "2px solid #e53e3e"}
>
<Box display="flex" alignItems="center">
<Image
src={`https://admin.tanami.betadelivery.com/${selectedImageIcon}`}
alt={selectedImageIcon}
boxSize="1rem"
mr="12px"
/>{" "}
<Text as={"span"} fontSize={"sm"} fontWeight={500}>
{selectedIcon}
</Text>
</Box>
</MenuButton>
<MenuList minW='415px' size={"sm"} fontWeight={500}>
{icons?.map(({ iconName, id, iconFilePath }) => (
<MenuItem
key={id}
onClick={() =>
handleIconSelect(id, iconName, iconFilePath)
}
>
<Box display="flex" alignItems="center">
<Image
src={`https://admin.tanami.betadelivery.com/${iconFilePath}`}
alt={iconName}
boxSize="1rem"
mr="12px"
/>
<Text
as={"span"}
fontSize={"sm"}
fontWeight={500}
>
{iconName}
</Text>
</Box>
</MenuItem>
))}
</MenuList>
</Menu>
)}
/>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
{!errors.icon_xid?.message || !selectedImageIcon && errors.icon_xid?.message}
{errors.icon_xid?.message && errors.icon_xid?.message}
</FormErrorMessage>
</FormControl>
</HStack>
</DrawerBody>
<DrawerFooter>
<Button
variant="outline"

View File

@@ -1,9 +1,13 @@
import { ChevronDownIcon } from "@chakra-ui/icons";
import React, { useState } from "react";
import {
Box,
Badge,
Button,
FormControl,
FormLabel,
Input,
Menu,
MenuButton,
MenuItem,
MenuList,
Modal,
ModalBody,
ModalCloseButton,
@@ -11,52 +15,81 @@ import {
ModalFooter,
ModalHeader,
ModalOverlay,
Text,
Textarea,
} from "@chakra-ui/react";
import {
useGetIOprepopulateDataQuery,
useUpdateStatusIoMutation,
} from "../../../../Services/io.service";
import { useParams } from "react-router-dom";
const UpdateIOStatus = ({ isOpen, onClose }) => {
const params = useParams();
const id = params?.id;
const [selectedItem, setSelectedItem] = useState("Open");
const [isLoadingg, setIsLoading] = useState(false);
const { data, error, isLoading } = useGetIOprepopulateDataQuery();
const [selectedStatusId, setSelectedStatusId] = useState(data?.data?.ioStatus[0]?.id);
const [updateStatusIo] = useUpdateStatusIoMutation();
console.log(data?.data?.ioStatus);
console.log(data?.data?.ioStatus);
const handleMenuItemClick = (item, id) => {
setSelectedItem(item);
setSelectedStatusId(id);
};
const handleSubmit = async () => {
setIsLoading(true)
try {
const res = await updateStatusIo({
data: {
ioStatus_xid: selectedStatusId,
},
id,
});
console.log(res);
setIsLoading(false)
onClose()
} catch (error) {}
};
return (
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Update IO Status</ModalHeader>
<ModalHeader fontSize={"md"}>Update IO Status Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"}>
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>
Date
</FormLabel>
<Input
placeholder="Select Date"
size="sm"
rounded={'sm'}
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>
Status
</FormLabel>
<Menu>
<MenuButton
as={Button}
rightIcon={<ChevronDownIcon />}
fontSize={"sm"}
type="date"
focusBorderColor="forestGreen.300"
/>
</FormControl>
<FormControl mb={"15px"} >
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>Amount</FormLabel>
<Input
size="sm"
rounded={'sm'}
textAlign={'end'}
focusBorderColor="forestGreen.300"
fontSize={"sm"} placeholder="$00.00" />
</FormControl>
<FormControl mb={"15px"}>
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>
Comments
</FormLabel>
<Textarea
size="sm"
rounded={'sm'}
focusBorderColor="forestGreen.300"
fontSize={"sm"} placeholder="Write Comments" />
</FormControl>
fontWeight={500}
w={"100%"}
textAlign={"left"}
>
{selectedItem}
</MenuButton>
<MenuList w={"400px"}>
{data?.data?.ioStatus?.map(({ id, statusAdmin }) => (
<MenuItem
key={id}
fontSize={"sm"}
onClick={() => handleMenuItemClick(statusAdmin, id)}
>
<Badge py={"1px"} px={"8px"}>
{statusAdmin}
</Badge>
</MenuItem>
))}
</MenuList>
</Menu>
</ModalBody>
<ModalFooter>
<Button
@@ -66,14 +99,14 @@ const UpdateIOStatus = ({ isOpen, onClose }) => {
_hover={{
bg: "hsl(139deg 98.99% 26.59%)",
}}
size={'sm'}
size={"sm"}
rounded={"sm"}
onClick={handleSubmit}
isLoading={isLoadingg}
>
Save
</Button>
<Button
size={'sm'}
rounded={"sm"} mr={3} onClick={onClose}>
<Button size={"sm"} rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter>

View File

@@ -20,6 +20,7 @@ const InvestmentView = ({ isOpen, onClose, secondField, id }) => {
const filteredObject = create?.find((item) => item?.id === id)
return (
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
onClose={onClose}

View File

@@ -34,23 +34,26 @@ import EditIO from "../EditIO/EditIO";
import IOArtifacts from "../CreateIO/IOArtifacts";
import IOCashDetails from "../CreateIO/IOCashDetails";
import IONAVDetails from "../CreateIO/IONAVDetails";
import { useGetIOprepopulateDataQuery } from "../../../Services/io.service";
const ViewIOdata = () => {
const params = useParams()
const id = params?.id
const { data, error, isLoading } = useGetIOprepopulateDataQuery();
const { isOpen, onOpen, onClose } = useDisclosure();
const navigate = useNavigate();
const [isEditing, setIsEditing] = useState(false);
const tabs = [
{ label: "IO Details", content: <ViewIOdetails /> },
{ label: "Investment documents", content: <InvestmentDocument /> },
{ label: "Key merits", content: <KeyMerits /> },
{ label: "IO artifacts", content: <IOArtifacts /> },
{ label: "Investors", content: <Investors /> },
{ label: "IO Cash Details", content: <IOCashDetails /> },
{ label: "IO NAV Details", content: <IONAVDetails /> },
{ label: "IO Details", content: <ViewIOdetails data={data?.data} /> },
{ label: "Investment documents", content: <InvestmentDocument data={data?.data} /> },
{ label: "Key merits", content: <KeyMerits data={data?.data} /> },
{ label: "IO artifacts", content: <IOArtifacts data={data?.data} /> },
{ label: "Investors", content: <Investors data={data?.data} /> },
{ label: "IO Cash Details", content: <IOCashDetails data={data?.data} /> },
{ label: "IO NAV Details", content: <IONAVDetails data={data?.data} /> },
// { label: "Distribution", content: <ViewDistribution /> },
];

View File

@@ -46,6 +46,10 @@ const ViewIOdataHeader = () => {
const { isOpen, onOpen, onClose } = useDisclosure();
const btnRef = useRef();
const { IODetails } = useContext(GlobalStateContext);
console.log(
"=================>>>>>",
IODetails?.artifactsImage?.[0]?.artifactPathName
);
const {
isOpen: isInvestmentOpen,
@@ -88,12 +92,6 @@ const ViewIOdataHeader = () => {
onClose: onCancleClose,
} = useDisclosure();
const bg = {
bg: "#fff",
};
@@ -126,11 +124,30 @@ const ViewIOdataHeader = () => {
borderRadius={"10px"}
position={"relative"}
>
<Box h={100} w={200} p={1.5} >
{/* <Image rounded={'md'} h={"100%"} src={IODetails?.ioName} alt={IODetails?.ioName}/> */}
<Box w={'100%'} h={'100%'} display={'flex'} justifyContent={'center'} alignItems={'center'} bg={"#fff"} rounded={'md'}>
<Icon color={'gray.700'} as={GrGallery} />
</Box>
<Box h={100} w={200} p={1.5}>
{/* <Image rounded={'md'} h={"100%"} src={ " https://admin.tanami.betadelivery.com/" + IODetails?.ioName} alt={IODetails?.ioName}/> */}
{IODetails?.artifactsImage?.[0]?.artifactPathName ? (
<Image
rounded={"md"}
h={"100%"}
w={"100%"}
objectFit={'cover'}
src={" https://admin.tanami.betadelivery.com/" + IODetails?.artifactsImage?.[0]?.artifactPathName}
alt={IODetails?.ioName}
/>
) : (
<Box
w={"100%"}
h={"100%"}
display={"flex"}
justifyContent={"center"}
alignItems={"center"}
bg={"#fff"}
rounded={"md"}
>
<Icon color={"gray.700"} as={GrGallery} />
</Box>
)}
</Box>
{/* <Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
@@ -141,7 +158,7 @@ const ViewIOdataHeader = () => {
</Text>
</Box> */}
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO ID
</Text>
@@ -155,7 +172,9 @@ const ViewIOdataHeader = () => {
IO Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.investmentNameEnglish ? IODetails?.investmentNameEnglish : "---"}
{IODetails?.investmentNameEnglish
? IODetails?.investmentNameEnglish
: "---"}
</Text>
</Box>
@@ -164,7 +183,9 @@ const ViewIOdataHeader = () => {
Sponsorer Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.sponsor?.sponsorName ? IODetails?.sponsor?.sponsorName : "---"}
{IODetails?.sponsor?.sponsorName
? IODetails?.sponsor?.sponsorName
: "---"}
</Text>
</Box>
@@ -179,9 +200,8 @@ const ViewIOdataHeader = () => {
ps={4}
pe={4}
textTransform={"none"}
variant={'solid'}
variant={"solid"}
color={"#fff"}
colorScheme={
IODetails?.ioStatus?.statusAdmin === "Draft"
? "blue"
@@ -190,7 +210,9 @@ const ViewIOdataHeader = () => {
: "forestGreen"
}
>
{IODetails?.ioStatus?.statusAdmin ? IODetails?.ioStatus?.statusAdmin : "---"}
{IODetails?.ioStatus?.statusAdmin
? IODetails?.ioStatus?.statusAdmin
: "---"}
</Badge>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
@@ -198,7 +220,7 @@ const ViewIOdataHeader = () => {
IO NAV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.currentValuation ? IODetails?.currentValuation : "---"}
{IODetails?.currentValuation ? IODetails?.currentValuation : "00.00"}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
@@ -206,7 +228,7 @@ const ViewIOdataHeader = () => {
IO cash
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.ioCash ? IODetails?.ioCash : "---"}
{IODetails?.ioCash ? IODetails?.ioCash : "00.00"}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
@@ -214,7 +236,7 @@ const ViewIOdataHeader = () => {
IO MV NAV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.marketValue ? IODetails?.marketValue: "---"}
{IODetails?.marketValue ? IODetails?.marketValue : "00.00"}
</Text>
</Box>
@@ -262,8 +284,12 @@ const ViewIOdataHeader = () => {
<MenuItem onClick={onUpdateNavOpen} className="border-bottom">
Update iO NAV
</MenuItem>
<MenuItem onClick={onExitOpen} className="border-bottom">Exit</MenuItem>
<MenuItem onClick={onCancleOpen} className="border-bottom">Cancel</MenuItem>
<MenuItem onClick={onExitOpen} className="border-bottom">
Exit
</MenuItem>
<MenuItem onClick={onCancleOpen} className="border-bottom">
Cancel
</MenuItem>
<MenuItem onClick={onUpdateStatusOpen}>Update iO status</MenuItem>
</MenuList>
</Menu>

View File

@@ -233,7 +233,7 @@ const ViewIOdetails = () => {
width: "32.3%",
},
{
label: "Expected Return Estimated",
label: "Expected Return",
placeHolder: "$00.00",
name: "expectedReturn",
type: "number",
@@ -252,6 +252,7 @@ const ViewIOdetails = () => {
type: "number",
section: " ",
width: "32.3%",
align:"right"
},
{
label: "Investment Details",

View File

@@ -102,6 +102,7 @@ const EditExchangeRate = ({ id, setIsLoading, updateHistory }) => {
</Button>
</Tooltip>
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
onClose={onClose}

View File

@@ -106,6 +106,7 @@ const ExchangeHistory = ({ id, setIsLoading, history }) => {
</Button>
</Tooltip>
<Drawer
size={"md"}
isOpen={isOpen}
placement="right"
onClose={onClose}

View File

@@ -18,9 +18,9 @@ import CustomAlertDialog from "../../../Components/CustomAlertDialog";
export const addInvestmentType = yup.object().shape({
investmentTypeName: yup.string().required("Investment name is required"),
note: yup.string().required("Description is required"),
note: yup.string(),
investmentTypeNameArabic: yup.string().required("Investment name is required"),
noteArabic: yup.string().required("Description is required"),
noteArabic: yup.string(),
});
// ==================== [debounce] ========================
@@ -46,7 +46,7 @@ const AddInvestmentType = () => {
// =====================[useState]=======================
const [isSwitchOn, setIsSwitchOn] = useState(false);
const [isSwitchOn, setIsSwitchOn] = useState(true);
const [isLoadingBtn, setIsLoadingBtn] = useState(false);
const [alert, setAlert] = useState(false);
const [form, setForm] = useState();
@@ -183,7 +183,7 @@ const AddInvestmentType = () => {
placeHolder: " ",
name: "note",
type: "textarea",
isRequired: true,
// isRequired: true,
section: "Add Details",
},
{
@@ -191,7 +191,7 @@ const AddInvestmentType = () => {
placeHolder: " ",
name: "noteArabic",
type: "textarea",
isRequired: true,
// isRequired: true,
arabic: true,
section: "Add Details",
},
@@ -201,7 +201,7 @@ const AddInvestmentType = () => {
const formEditFields = [
{
label: "Investment Type (English) *",
label: "Investment Type (English)",
placeHolder: " ",
name: "investmentTypeName",
type: "text",
@@ -209,7 +209,7 @@ const AddInvestmentType = () => {
section: "Add Details",
},
{
label: "Investment Type (Arabic) *",
label: "Investment Type (Arabic)",
name: "investmentTypeNameArabic",
placeHolder: " ",
type: "text",
@@ -222,7 +222,7 @@ const AddInvestmentType = () => {
placeHolder: " ",
name: "note",
type: "text",
isRequired: true,
// isRequired: true,
section: "Add Details",
},
{
@@ -230,7 +230,7 @@ const AddInvestmentType = () => {
placeHolder: " ",
name: "noteArabic",
type: "text",
isRequired: true,
// isRequired: true,
arabic: true,
section: "Add Details",
},

View File

@@ -17,7 +17,7 @@ import CustomAlertDialog from "../../../Components/CustomAlertDialog";
export const addSponser = yup.object().shape({
sponsorName: yup.string().required("Sponser name is required"),
sponsorNameArabic: yup.string().required("Sponser name is required"),
email: yup.string().email("Must be a valid email").required("Email is required"),
// email: yup.string().email("Must be a valid email").required("Email is required"),
});
// ==================== [debounce] ========================
@@ -58,6 +58,7 @@ const AddSponser = () => {
reset,
} = useForm({
resolver: yupResolver(addSponser),
});
// ========================== [useEffect] ================================
@@ -87,6 +88,10 @@ const AddSponser = () => {
...form,
// isActive: isSwitchOn,
};
// Remove email field if it's an empty string
if (formData.email === '') {
delete formData.email;
}
await updateSponser({ data: formData, id }).then((response) => {
if (response?.data?.statusCode) {
toast({
@@ -119,6 +124,7 @@ const AddSponser = () => {
// isActive: isSwitchOn,
};
await createSponser(formData).then((response) => {
console.log(response);
if (response?.data?.statusCode) {
toast({
render: () => <ToastBox message={response?.data?.message} />,
@@ -126,10 +132,10 @@ const AddSponser = () => {
setIsLoadingBtn(false);
navigate("/sponser");
} else {
} else if(response?.error?.status === 400) {
toast({
render: () => (
<ToastBox message={"Something Went Wrong"} status={"error"} />
<ToastBox message={response?.error?.data?.message} status={"error"} />
),
});
@@ -172,7 +178,7 @@ const AddSponser = () => {
name: "email",
placeHolder: " ",
type: "email",
isRequired: true,
// isRequired: true,
section: "Add Details",
},
];
@@ -202,7 +208,7 @@ const AddSponser = () => {
name: "email",
placeHolder: " ",
type: "email",
isRequired: true,
// isRequired: true,
section: "Add Details",
},
];

View File

@@ -7,35 +7,32 @@ const baseUrl = api?.defaults.baseURL;
export const ioService = createApi({
reducerPath: "ioService",
baseQuery: fetchBaseQuery({ baseUrl }),
tagTypes: ["prePopulate","getIO", "getKeyMerits", "getArtifacts", "getInvestmentDocuments"],
tagTypes: [
"prePopulate",
"getIO",
"getKeyMerits",
"getArtifactsVideo",
"getInvestmentDocuments",
"getIOById",
],
endpoints: (builder) => ({
// =====[get prepopulate data]
getIOprepopulateData: builder.query({
query: () => `/io/admin/pre-populate`,
providesTags: ["prePopulate"],
}),
// =====[get]
getIOs: builder.query({
query: ({ page, size }) => `/io/admin?page=${page}&size=${size}`,
providesTags: ["getIO"],
}),
getIOById: builder.query({
query: (id) => ({ url: `/io/admin/${id}` }),
providesTags: ["getIO"],
providesTags: ["getIOById"],
}),
// =====[create]
createIO: builder.mutation({
query: (data) => ({
@@ -46,36 +43,30 @@ export const ioService = createApi({
invalidatesTags: ["getIO"],
}),
updateIO: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/${id}`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIO"],
invalidatesTags: ["getIOById"],
}),
// =====[Key Merits]
getKeyMerits: builder.query({
query: (id) => `/io/admin/key-merits/${id}`,
providesTags: ["getKeyMerits"],
// =====[Key Merits]
getKeyMerits: builder.query({
query: (id) => `/io/admin/key-merits/${id}`,
providesTags: ["getKeyMerits"],
}),
createKeyMerits: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/key-merits/${id}`,
method: "POST",
body: data,
// No need to manually set 'Content-Type'
}),
createKeyMerits: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/key-merits/${id}`,
method: "POST",
body: data,
// No need to manually set 'Content-Type'
}),
invalidatesTags: ["getKeyMerits"],
}),
invalidatesTags: ["getKeyMerits"],
}),
deleteKeyMerits: builder.mutation({
query: (id) => ({
url: `/io/admin/key-merits/hard-delete/${id}`,
@@ -84,18 +75,17 @@ export const ioService = createApi({
invalidatesTags: ["getKeyMerits"],
}),
updateKeyMerits: builder.mutation({
query: ({ data, id }) => ({ url: `/io/admin/key-merits/byId/${id}` ,
query: ({ data, id }) => ({
url: `/io/admin/key-merits/byId/${id}`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getKeyMerits"],
}),
// =====[getIODocument]
createInvestmentDocuments: builder.mutation({
query: ({data, id}) => ({
createInvestmentDocuments: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/document/${id}`,
method: "POST",
body: data,
@@ -104,6 +94,15 @@ export const ioService = createApi({
invalidatesTags: ["getInvestmentDocuments"],
}),
updateInvestmentDocuments: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/document/byId/${id}`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getInvestmentDocuments"],
}),
getInvestmentDocuments: builder.query({
query: (id) => `/io/admin/document/${id}`,
providesTags: ["getInvestmentDocuments"],
@@ -117,19 +116,70 @@ export const ioService = createApi({
invalidatesTags: ["getInvestmentDocuments"],
}),
// =====[Artifacts]
getArtifactsVideo: builder.query({
query: (id) => `/io/artifact/artifactVideo/${id}`,
providesTags: ["getArtifactsVideo"],
}),
// =====[createImageArtifacts]
createImageArtifacts: builder.mutation({
query: ({ data, id }) => ({
url: `/io/artifact/artifactImage/${id}`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
// =====[Artifacts]
getArtifacts: builder.query({
query: (id) => `/io/admin/artifact/${id}`,
providesTags: ["getArtifacts"],
// =====[createVideoArtifacts]
createVideoArtifacts: builder.mutation({
query: ({ data, id }) => ({
url: `/io/artifact/artifactVideo/${id}`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
deleteVideoArtifacts: builder.mutation({
query: (id) => ({
url: `/io/artifact/video/${id}`,
method: "DELETE",
}),
invalidatesTags: ["getIOById"],
}),
updateStatusIo: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/update-status/${id}`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
@@ -137,18 +187,14 @@ export const ioService = createApi({
});
// Export hooks for usage in functional components
export const {
export const {
useGetIOprepopulateDataQuery,
useGetIOsQuery,
useGetIOByIdQuery,
useCreateIOMutation ,
useGetIOsQuery,
useGetIOByIdQuery,
useCreateIOMutation,
useUpdateIOMutation,
useGetKeyMeritsQuery,
useCreateKeyMeritsMutation,
useDeleteKeyMeritsMutation,
@@ -157,8 +203,15 @@ export const {
useGetInvestmentDocumentsQuery,
useCreateInvestmentDocumentsMutation,
useDeleteIODocsMutation,
useUpdateInvestmentDocumentsMutation,
useCreateImageArtifactsMutation,
useGetArtifactsVideoQuery,
useCreateVideoArtifactsMutation,
useDeleteVideoArtifactsMutation,
useGetArtifactsQuery,
} =
ioService;
useUpdateStatusIoMutation
} = ioService;