admin/src/views/Campaigns/AddCampaign.js
2023-09-22 19:15:45 +05:30

325 lines
10 KiB
JavaScript

import React, { useState, useEffect } from "react";
// import { Button } from '@mui/material'
import axios from "axios";
import { Link, useNavigate } from "react-router-dom";
import {
CCard,
CCardBody,
CCardGroup,
CCol,
CContainer,
CRow,
} from "@coreui/react";
// import SelectPurpose from "../Business/multiform/SelectPurpose.js";
// import SelectBusiness from "../Business/multiform/SelectBusiness.js";
// import Contacts from "../Business/multiform/Contacts.js";
// import BAddress from "../Business/multiform/BAddress.js";
import Button from "@material-ui/core/Button";
import { isAutheticated } from "src/auth";
// import DoctorInfo from "../Business/multiform/DoctorInfo.js";
import BasicDetaiils from "./BasicDetaiils.js";
import ContactDetails from "./ContactDetails.js";
import Preview from "./Preview.js";
const AddCampaign = () => {
const token = isAutheticated();
const [productId, setProductId] = useState("");
const [viewState, setViewState] = useState(1);
// const [WebsiteURL, setWebsiteURL] = useState('https://bolo.ai.in/')
const [loading, setLoading] = useState(false);
const [data, setData] = useState({
WebsiteURL: "https://bolo.ai.in/",
campaignName: "",
language: "",
campaignType: "",
video: null,
spreadSheet: null,
recipients: [{ name: "", phoneNumber: "" }],
});
// console.log(data)
const handleView = (n) => {
if (viewState === n) return;
setViewState(n);
};
// const handleSubmit = () => {
// if (
// data.address_Line_1.trim() === "" ||
// data.address_Line_2.trim() === "" ||
// data.userType === "" ||
// data.language === "" ||
// data.country === "" ||
// data.state === "" ||
// data.city === "" ||
// data.pincode.trim() === "" ||
// //Contacts
// // data.image === '' ||
// // data.imageURL.trim() === '' ||
// (data.userName.trim() === ""
// // &&
// // (data.contact_Person_Name.trim() === "" ||
// // data.specialization === "")
// ) ||
// data.email.trim() === "" ||
// // data.short_url.trim() === "" ||
// data.contact_Number === ""
// // || data.contact_Person_Name.trim() === ""
// ) {
// swal({
// title: "Warning",
// text: "Fill all mandatory fields",
// icon: "error",
// button: "Close",
// dangerMode: true,
// });
// return;
// }
// setLoading(true);
// const formData = new FormData();
// formData.set("address_Line_1", data.address_Line_1);
// formData.set("address_Line_2", data.address_Line_2);
// formData.set("purpose", data.purpose);
// formData.set("userType", data.userType);
// // formData.set("language", data.language);
// formData.set("country", data.country);
// formData.set("city", data.city);
// formData.set("state", data.state);
// formData.set("pincode", data.pincode);
// //contacts
// formData.set("userName", data.userName);
// formData.set("email", data.email);
// formData.set("contact_Number", data.contact_Number);
// formData.set("contact_Person_Name", data.contact_Person_Name);
// formData.set("specialization", data.specialization);
// formData.set("url", data.WebsiteURL);
// formData.set("short_url", data.short_url);
// axios
// .post(`/api/businesses/add`, formData, {
// headers: {
// Authorization: `Bearer ${token}`,
// "Content-Type": "multipart/formdata",
// "Access-Control-Allow-Origin": "*",
// },
// })
// .then((res) => {
// swal({
// title: "Added",
// text: res?.data?.message
// ? res?.data?.message
// : "Business added successfully!",
// icon: "success",
// button: "Return",
// });
// setLoading(false);
// navigate("/users", { replace: true });
// })
// .catch((err) => {
// setLoading(false);
// const message = err.response?.data?.message || "Something went wrong!";
// swal({
// title: "Warning",
// text: message,
// icon: "error",
// button: "Retry",
// dangerMode: true,
// });
// });
// };
console.log(data);
return (
<CContainer>
<CRow className="mt-3">
<CCol md={12}>
<div
className="
page-title-box
d-flex
align-items-center
justify-content-between
"
>
<div style={{ fontSize: "22px" }} className="fw-bold">
Add Campaign
</div>
<div className="page-title-right">
<div className="page-title-right">
{/* <Button
variant="contained"
color="primary"
style={{
fontWeight: "bold",
marginBottom: "1rem",
textTransform: "capitalize",
}}
onClick={() => {
handleSubmit();
}}
disabled={
data.address_Line_1.trim() === "" ||
data.address_Line_2.trim() === "" ||
data.userType === "" ||
data.language === "" ||
data.country === "" ||
data.state === "" ||
data.city === "" ||
data.pincode.trim() === "" ||
data.userName.trim() === "" ||
// &&
// (data.contact_Person_Name.trim() === "" ||
// data.specialization === "")
data.email.trim() === "" ||
// data.short_url.trim() === "" ||
data.contact_Number === ""
// ||
// data.contact_Person_Name.trim() === ""
}
>
{loading ? "Loading" : "Add Now"}
</Button> */}
</div>
</div>
</div>
</CCol>
</CRow>
<CRow>
<CCol md={9} className="mt-1">
<CCardGroup>
<CCard className="p-4 mb-3">
<CCardBody>
{viewState === 1 && (
<BasicDetaiils
props={{ data, setData, handleView }}
setData={setData}
handleView={handleView}
/>
)}
{viewState === 2 && (
<ContactDetails props={{ data, setData, handleView }} />
)}
{viewState === 3 && (
<Preview props={{ data, setData, handleView }} />
)}
{viewState === 4 && (
<BAddress
data={{ data, setData }}
handleView={handleView}
// productId={productId}
// data={{ images, setImages }}
loading={{ loading, setLoading }}
/>
)}
</CCardBody>
</CCard>
</CCardGroup>
</CCol>
<CCol md={3} className="mt-1">
<CCardGroup>
<CCard>
<CCardBody>
<div className="d-grid gap-2">
<button
className={
viewState === 1
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(1)}
>
Basic Details
</button>
{/*<button
className={
viewState === 2
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(2)}
>
Select Purpose
</button>*/}
<button
className={
viewState === 2
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(3)}
>
Contact Details
</button>
<button
className={
viewState === 3
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(5)}
>
Preview
</button>
<button
className={
viewState === 4
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(5)}
>
Videos
</button>
<button
className={
viewState === 5
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(5)}
>
Test & Launch
</button>
<button
className={
viewState === 6
? "btn btn-light"
: "btn btn-info text-white"
}
type="button"
onClick={() => handleView(5)}
>
Status
</button>
</div>
</CCardBody>
</CCard>
</CCardGroup>
</CCol>
</CRow>
</CContainer>
);
};
export default AddCampaign;