Skip to content

Commit

Permalink
Merge branch 'main' of https://github.com/naumanch969/crm
Browse files Browse the repository at this point in the history
  • Loading branch information
@RHamzaZulfiqarJ
RHamzaZulfiqarJ committed Sep 29, 2023
2 parents 12971cf + c1e7370 commit 048b28f
Show file tree
Hide file tree
Showing 9 changed files with 134 additions and 135 deletions.
2 changes: 2 additions & 0 deletions client/src/Components/Sidebar/Sidebar.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -263,6 +263,7 @@ const Sidebar = ({ showSidebar, setShowSidebar }) => {
{!showSidebar ? "" : <img className="h-[45px]" src="/favicon/GrowLOGO.png" />}
</div>
</a>

<div
style={{ height: "calc(100vh - 4rem)" }}
className="py-[5px] gap-1 flex flex-col h-fit overflow-y-scroll">
Expand All @@ -276,6 +277,7 @@ const Sidebar = ({ showSidebar, setShowSidebar }) => {
/>
))}
</div>

{/* </div> */}
</Box>

Expand Down
1 change: 0 additions & 1 deletion client/src/Pages/Leads/Kanban/Board.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import { Droppable } from "react-beautiful-dnd";

const Board = ({ leads, title, _id }) => {

console.log(title, ' ', leads, ' ', _id)

return (
<div
Expand Down
1 change: 0 additions & 1 deletion client/src/Pages/Leads/Leads.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -270,7 +270,6 @@ function Leads({ type, showSidebar }) {
showEmployeeLeads: false,
showArchivedLeads: false,
});
console.log(leads)
////////////////////////////////////// USE EFFECTS //////////////////////////////
useEffect(() => {
// dispatch(getLeads());
Expand Down
3 changes: 1 addition & 2 deletions client/src/Pages/Tasks/Topbar.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Add, Close } from "@mui/icons-material";
import { useLocation, useNavigate } from "react-router-dom";
import { Path } from "../../utils";
import { useDispatch } from "react-redux";
import { getArchivedTasks, getTasks } from "../../redux/action/task";
import { getTasks } from "../../redux/action/task";
import CreateTask from "./CreateTask";
import Navbar from "../../Components/Navbar/Navbar";
import { searchTaskReducer } from "../../redux/reducer/task";
Expand Down Expand Up @@ -39,7 +39,6 @@ const Topbar = ({ options, setOptions, openFilters, setOpenFilters, isFiltered,

////////////////////////////////////////// USE EFFECTS //////////////////////////////////
useEffect(() => {
options?.showArchivedTasks && dispatch(getArchivedTasks());
options?.showEmployeeTasks && dispatch(getTasks());
!options?.showArchivedTasks && !options?.showEmployeeTasks && dispatch(getTasks());
}, [options]);
Expand Down
21 changes: 15 additions & 6 deletions client/src/Pages/Vouchers/CreateVoucher.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,15 +63,21 @@ const CreateVoucher = ({ open, setOpen, scroll, downloadPdf, loader }) => {
}, [open]);

////////////////////////////////////// FUNCTIONS ////////////////////////////////////////

const handleChange = (field, value) => {
setVoucherData((prevData) => ({ ...prevData, [field]: value }));
};

const handleDownloadPDF = (e) => {
e.preventDefault();
const { branch, issuingDate, dueDate, clientName, CNIC, phone, project, propertyType, area, type, total, paid } = voucherData
if (!branch || !issuingDate || !dueDate || !clientName || !CNIC || !phone || !project || !propertyType || !area || !type || !total || !paid)
return alert("Make sure to provide all the fields")

const findedProject = projects.find(p => p._id == project)

navigate('/download/voucher', { state: { voucher: { ...voucherData, remained: total - paid, projectTitle: findedProject?.title } } })
dispatch(createVoucher(voucherData, setOpen));

// setIsVoucherCreated(false);

// const documentDefinition = {
Expand Down Expand Up @@ -254,6 +260,8 @@ const CreateVoucher = ({ open, setOpen, scroll, downloadPdf, loader }) => {

return (
<div>


<Dialog
open={open}
scroll={scroll}
Expand Down Expand Up @@ -359,7 +367,7 @@ const CreateVoucher = ({ open, setOpen, scroll, downloadPdf, loader }) => {
<td className="pb-4">
<CFormSelect
value={voucherData.project}
onChange={(e) => handleChange("project", e.target.value)}
onChange={(e) => { handleChange("project", e.target.value) }}
className="border-[1px] p-2 rounded-md w-full border-[#c1c1c1] cursor-pointer text-black"
>
<option value={""}>None</option>
Expand Down Expand Up @@ -470,12 +478,13 @@ const CreateVoucher = ({ open, setOpen, scroll, downloadPdf, loader }) => {
Cancel
</button>
<button
onClick={downloadPdf}
// onClick={downloadPdf}
onClick={handleDownloadPDF}
variant="contained"
className="bg-primary-red px-4 py-2 rounded-lg text-white mt-4 hover:bg-red-400 font-thin">
{loader? (
{loader ? (
<span>Downloading</span>
): (
) : (
<span>Download</span>
)}
</button>
Expand Down
220 changes: 111 additions & 109 deletions client/src/Pages/Vouchers/VoucherPage.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,18 @@
import JsBarcode from "jsbarcode";
import React, { useState } from "react";
import html2canvas from "html2canvas";
import React, { useEffect, useRef, useState } from "react";
import CreateVoucher from "./CreateVoucher";
import html2canvas from "html2canvas";
import jsPDF from "jspdf";
import { useLocation, useNavigate } from "react-router-dom";

const VoucherPage = () => {
const VoucherPage = ({ }) => {

////////////////////////////////////// VARIABLES ///////////////////////////////////
const barcodeValue = "AD157491594D5";
const navigate = useNavigate()
const { state } = useLocation()
const voucher = state?.voucher
const pdfRef = useRef()

// Create a barcode canvas using JsBarcode
const canvas = document.createElement("canvas");
Expand All @@ -18,142 +25,137 @@ const VoucherPage = () => {
// Convert the canvas to an image
const barcodeImage = canvas.toDataURL("image/png");

const [loader, setLoader] = useState(false);

const downloadPdf = () => {
const capture = document.querySelector(".completePdfPage");
setLoader(true);
html2canvas(capture)
.then((canvas) => {
const imgData = canvas.toDataURL("img/png");
const pdf = new jsPDF("p", "mm", "a4");
const compenentWidth = pdf.internal.pageSize.getWidth();
const compenentHeight = pdf.internal.pageSize.getHeight();
pdf.addImage(imgData, "PNG", 0, 0, compenentWidth, compenentHeight);
pdf.save("download.pdf");
setLoader(false);
})
.catch((err) => {
console.log(err);
});
};


useEffect(() => {
const downloadPdf = () => {
const capture = document.querySelector(".completePdfPage");
html2canvas(capture)
.then((canvas) => {
const imgData = canvas.toDataURL("img/png");
const pdf = new jsPDF("p", "mm", "a4", true);
const pdfWidth = pdf.internal.pageSize.getWidth();
const pdfHeight = pdf.internal.pageSize.getHeight();
const imgWidth = canvas.width
const imgHeight = canvas.height
const ratio = Math.min(pdfWidth / imgWidth, pdfHeight / imgHeight);
const imgX = (pdfWidth - imgWidth * ratio) / 2;
const imgY = 100;
pdf.addImage(imgData, "PNG", imgX, imgY, imgWidth * ratio, imgHeight * ratio);
pdf.save("download.pdf");
navigate('/voucher')
})
.catch((err) => {
console.log(err);
});
};
downloadPdf()
})

return (
<div className="completePdfPage">
<div className="w-full h-screen px-40 pt-10 bg-white">
<div className="">
<div className="flex justify-start"></div>
<div className="flex justify-center text-3xl font-primary font-medium">
Payments Reciept
</div>
<div className="flex justify-end">
<table className="border-[2px] border-black">
<tr className="border-b-2 border-black">
<th className="border-r-2 border-black px-6 bg-[#dddddd]">Branch</th>
<td className="px-12 ">demo</td>
<div ref={pdfRef} className="completePdfPage w-full flex justify-center ">
<div className="w-[51rem] h-screen pt-10 bg-white">


<div className="w-full flex justify-center relative ">
<h2 className="text-3xl font-primary font-medium">Payments Reciept</h2>
</div>

<div className="flex justify-end items w-full relative py-[1rem] ">
<div className=" ">
<table className="border-[1px] border-black w-full " >
<tr className="text-center border-[1px] border-black">
<th className="border-r-[1px] border-b-[1px] border-black px-6 bg-[#dddddd]">Branch</th>
<td className="px-12 border-b-[1px] border-black capitalize ">{voucher?.branch}</td>
</tr>
<tr>
<th className="border-r-2 border-black bg-[#dddddd]">Dated</th>
<td className="px-12">demo</td>
<tr className='w-full' >
<th className="border-r-[1px] border-black bg-[#dddddd]">Dated</th>
<td className="px-12">{voucher?.issuingDate}</td>
</tr>
</table>
</div>
</div>
<div className="pt-10 flex justify-center">
<table className="border-2 border-black">
<tr>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd]">Name</th>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd]">CNIC</th>
<th className="border-b-2 border-black bg-[#dddddd]">Phone</th>

{/* name, cnic, phone */}
<div className="w-full flex justify-center">
<table className="text-center border-[1px] border-black w-full ">
<tr className='w-full' >
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Name</th>
<th className="text-center border-y-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">CNIC</th>
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Phone</th>
</tr>
<tr>
<td className="border-b-2 border-black">demo</td>
<td className="border-b-2 border-l-2 border-black">demo</td>
<td className="border-b-2 border-l-2 border-black">demo</td>
<tr className='w-full' >
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] capitalize ">{voucher?.clientName}</td>
<td className="text-center border-b-[1px] border-black h-[2rem] w-[13rem] ">{voucher?.CNIC}</td>
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] ">{voucher?.phone}</td>
</tr>
<tr>
<td className="px-2" colSpan={3}>
<tr className='w-full' >
<td className="px-[1px] h-[4rem] " colSpan={5}>
* If for some reason, the deal fails through, there is no penalty and the same
amount will be returned to the buyer by the company.
</td>
</tr>
</table>
</div>
<div className="pt-4 flex justify-center">
<table className="border-2 border-black">
<tr>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-24">
Type of Payment
</th>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-28">Amount</th>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-28">
Payment Date
</th>

{/* TOP Amount PaymentDate */}
<div className="w-full pt-4 flex justify-center">
<table className="text-center border-[1px] border-black w-full ">
<tr className='w-full' >
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Type of Payment</th>
<th className="text-center border-y-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Amount</th>
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Payment Date</th>
</tr>
<tr>
<td className="border-b-2 border-black px-32">demo</td>
<td className="border-b-2 border-l-2 border-black px-[120px]">demo</td>
<td className="border-b-2 border-l-2 border-black px-[140px]">demo</td>
<tr className='w-full' >
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] capitalize">{voucher?.top}</td>
<td className="text-center border-b-[1px] border-black h-[2rem] w-[13rem] ">{voucher?.total}</td>
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] ">{voucher?.dueDate}</td>
</tr>
</table>
</div>
<div className="pt-4 flex justify-center">
<table className="border-2 border-black">
<tr>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-32">Project</th>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-32">
Property Type
</th>
<th className="border-b-2 border-r-2 border-black bg-[#dddddd] px-28">Area</th>

{/* Project PropertyType Area */}
<div className="w-full pt-4 flex justify-center">
<table className="text-center border-[1px] border-black w-full ">
<tr className='w-full' >
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Project</th>
<th className="text-center border-y-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Property Type</th>
<th className="text-center border-y-[1px] border-x-[1px] border-black bg-[#dddddd] h-[2rem] w-[13rem] ">Area</th>
</tr>
<tr>
<td className="border-b-2 border-black px-32">demo</td>
<td className="border-b-2 border-l-2 border-black px-36">demo</td>
<td className="border-b-2 border-l-2 border-black px-28">demo</td>
<tr className='w-full' >
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] capitalize ">{voucher?.projectTitle}</td>
<td className="text-center border-b-[1px] border-black h-[2rem] w-[13rem] capitalize ">{voucher?.propertyType}</td>
<td className="text-center border-b-[1px] border-x-[1px] border-black h-[2rem] w-[13rem] ">{voucher?.area}</td>
</tr>
</table>
</div>
<div className="flex justify-center pt-4 gap-[66px]">
<div>
<table>
<tr>
<th className="font-primary">Total Amount</th>
</tr>
<tr>
<td className="border-2 border-black px-28">demo</td>
</tr>
</table>
</div>
<div>
<table>
<tr>
<th className="font-primary">Amount Paying</th>
</tr>
<tr>
<td className="border-2 border-black px-28">demo</td>
</tr>
</table>
</div>
<div>
<table>
<tr>
<th className="font-primary">Remaining Amount</th>
</tr>
<tr>
<td className="border-2 border-black px-28">demo</td>
</tr>
</table>
</div>

{/* Project PropertyType Area */}
<div className="w-full pt-4 flex justify-center">
<table className="w-full ">
<tr className='w-full flex justify-around ' >
<th className="h-[2rem] w-[13rem] ">Total</th>
<th className="h-[2rem] w-[13rem] ">Paying</th>
<th className="h-[2rem] w-[13rem] ">Remaining</th>
</tr>
<tr className='w-full flex justify-around mt-[8px] ' >
<td className="text-center border-[1px] border-black h-[2rem] min-w-[30%] max-w-[30%] ">{voucher?.total}</td>
<td className="text-center border-[1px] border-black h-[2rem] min-w-[30%] max-w-[30%] ">{voucher?.paid}</td>
<td className="text-center border-[1px] border-black h-[2rem] min-w-[30%] max-w-[30%] ">{voucher?.total - voucher?.paid}</td>
</tr>
</table>
</div>


<div className="flex justify-center pt-10">
<img src={barcodeImage} />
</div>
</div>
<button
{/* <btton
onClick={downloadPdf}
className="bg-primary-red px-4 py-2 rounded-lg text-white mt-4 hover:bg-red-400 font-thin">
className="bg-primary-red px-4 py-[1px] rounded-lg text-white mt-4 hover:bg-red-400 font-thin">
{loader ? <span>Downloading</span> : <span>Download</span>}
</button>
</btton>u */}
</div>
);
};
Expand Down
8 changes: 4 additions & 4 deletions client/src/constant.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
export const baseURL = 'http://localhost:4000/api/v1'
// export const baseURL = 'https://growcrm.glitch.me/api/v1'
export const rootURL = 'http://localhost:4000'
// export const rootURL = 'https://growcrm.glitch.me'
// export const baseURL = 'http://localhost:4000/api/v1'
export const baseURL = 'https://growcrm.glitch.me/api/v1'
// export const rootURL = 'http://localhost:4000'
export const rootURL = 'https://growcrm.glitch.me'
export const pakistanCities = [
"Abbottabad",
"Adilpur",
Expand Down
Loading

0 comments on commit 048b28f

Please sign in to comment.