import React, { useEffect, useState } from "react"; import Flatpickr from "react-flatpickr"; import moment from "moment"; import { Col, Container, Row, Card, CardBody, Button, Dropdown, Modal, Form, Accordion, } from "react-bootstrap"; import BreadCrumb from "../../../Components/Common/BreadCrumb"; import Select from "react-select"; import LeadDiscover from "./leadDiscover"; // Formik import * as Yup from "yup"; import { useFormik } from "formik"; // redux import { useSelector, useDispatch } from "react-redux"; import { createSelector } from "reselect"; import { Head } from "@inertiajs/react"; import Layout from "../../../Layouts"; import { onGetDeals } from "../../../slices/thunk"; const CrmDeals = () => { const dispatch: any = useDispatch(); const crmdealsData = createSelector( (state: any) => state.Crm, (deals: any) => deals.deals ); // Inside your component const deals : any= useSelector(crmdealsData); useEffect(() => { if (deals && !deals.length) { dispatch(onGetDeals()); } }, [dispatch, deals]); const [sortBy, setsortBy] = useState("Owner"); const [modal, setModal] = useState(false); const handlesortBy = (sortBy: any) => { setsortBy(sortBy); }; const sortbyname = [ { options: [ { label: "Owner", value: "Owner" }, { label: "Company", value: "Company" }, { label: "Location", value: "Location" }, ], }, ]; const toggle = () => { if (modal) { setModal(false); } else { setModal(true); validation.resetForm(); } }; const validation: any = useFormik({ // enableReinitialize : use this flag when initial values needs to be changed enableReinitialize: true, initialValues: { id: '', title: '', price: '', date: '', subTitle: '', email: '', contact: '', description: '', dealType: '' }, validationSchema: Yup.object({ title: Yup.string().required("Please Enter Your Title"), price: Yup.string().required("Please Enter Your Price"), date: Yup.string().required("Please Enter Your Date"), email: Yup.string().required("Please Enter Your email"), contact: Yup.string().required("Please Enter Your contact"), description: Yup.string().required("Please Enter Your description"), subTitle: Yup.string().required("Please Enter Your Title"), dealType: Yup.string().required("Please Enter Your Deal Type") }), onSubmit: (values) => { // console.log(values); toggle() } }); return (

Sort by:

Copy Move to pipline Add to exceptions Switch to common form view Reset form view to default

{deals.map((deals: any, key: any) => ( ))}

Create Deals

{ e.preventDefault(); validation.handleSubmit(); return false; }}>

Deals Type {validation.touched.dealType && validation.errors.dealType ? ( {validation.errors.dealType} ) : null}

Deal Title {validation.touched.title && validation.errors.title ? ( {validation.errors.title} ) : null}

Value (USD) {validation.touched.price && validation.errors.price ? ( {validation.errors.price} ) : null}

Deals Owner {validation.touched.subTitle && validation.errors.subTitle ? ( {validation.errors.subTitle} ) : null}

Due Date validation.setFieldValue("date", moment(date[0]).format("DD MMMM ,YYYY"))} value={validation.values.date || ''} /> {validation.errors.date && validation.touched.date ? ( {validation.errors.date} ) : null}

Email {validation.touched.email && validation.errors.email ? ( {validation.errors.email} ) : null}

Contact {validation.touched.contact && validation.errors.contact ? ( {validation.errors.contact} ) : null}

Description