ikan Uploader :
Directory : /var/www/html/shardahospital.org/shardalms/lms/lms/react/src/pages/multisource/
Upload File : |
| Current File : /var/www/html/shardahospital.org/shardalms/lms/lms/react/src/pages/multisource/Leads.jsx |
/* eslint-disable react-hooks/exhaustive-deps */
import { useEffect, useState, useRef } from "react";
import Service from "../../services/Service";
import LeadsFilterForm from "./LeadsFilterForm";
import util from "../../util";
import FileSaver from "file-saver";
import { Button, message, Table, Card } from "antd";
export default function Leads({ masters }) {
const [loading, setLoading] = useState(false);
const [filterFd, setFilterFd] = useState({});
const [result, setResult] = useState([]);
const paging = useRef({ p: 1, ps: 10, total: 0 });
const cols = [
{
title: "Lead Info",
render: (row) => (
<div>
<div>{row.name}</div>
<div className="pt5 pb5 bold600" style={{ color: "purple" }}>
{row.application_no}
</div>
<div
className="text-secondary fs11 d-flex"
style={{ flexDirection: "column", gap: "3px" }}
>
<div className="bold600">{row.email}</div>
<div>
Mob: <span className="bold600">{row.mob}</span>
</div>
<div>
State: <span className="bold600">{row.state}</span>
</div>
</div>
</div>
),
},
{
title: "UTM Source",
render: (row) => (
<div>
<div>{row.utm_source}</div>
<div className="text-secondary mt5">{row.utm_group}</div>
</div>
),
},
{
title: "Program/Plan/Followup",
render: (row) => (
<div>
<div>{row.program}</div>
<div className="text-secondary mt5">{row.plan}</div>
<div
className="fs11 bold600"
style={{
color: row.followup_count_all > 0 ? "purple" : "#ccc",
marginTop: "10px",
}}
>
{row.followup_count_all} Followup
</div>
{row.followup_count_all > 0 && (
<div className="mt5 fs11">
<div className="text-secondary">Last Followup:</div>
<div>{row.followup_title}</div>
<div>{row.subremarks}</div>
<div>{row.feedback}</div>
</div>
)}
</div>
),
},
{
title: "Login Url",
dataIndex: "login_url",
render: (url) => (
<a href={url} target="blank">
View
</a>
),
},
{
title: "Step",
dataIndex: "step_completed",
width: 80,
render: (n) => `Step ${n}`,
},
{
title: "Reg. Try Count",
dataIndex: "no_of_times_tried",
render: (n) => <div>{n}</div>,
},
{
title: "Lead Created",
width: 100,
render: (row) => (
<div>
<div>{util.getDate(row.created, "DD MMM YYYY hh:mm A")}</div>
</div>
),
},
];
const getList = () => {
setLoading(true);
Service.multisourceLeads({ ...filterFd, ...paging.current })
.then(({ data }) => {
data.result.data.forEach((v) => {
v.key = v.id;
});
paging.current.total = data.result.page.total_records;
setResult(data.result.data);
})
.catch((e) => {
message.error(e.message);
})
.finally(() => {
setLoading(false);
});
};
const applyFilter = () => {
paging.current.p = 1;
getList();
};
const downloadCsv = () => {
let header = {
application_no: "SYSTEM ID",
name: "NAME",
utm_source: "UTM SOURCE",
utm_group: "UTM GROUP",
email: "EMAIL",
mob: "MOBILE",
state: "STATE",
program: "PROGRAM",
plan: "PLAN",
followup_count_all: "FOLLOWUP COUNT",
followup_title: "REMARKS",
subremarks: "SUB-REMARKS",
feedback: "FEEDBACK",
login_url: "LOGIN URL",
no_of_times_tried: "REG TRY COUNT",
step_completed: "STEP COMPLETED",
created: "LEAD CREATED",
};
setLoading(true);
Service.allMultisourceLeads(filterFd)
.then(({ data }) => {
let blob = util.convertToCSVBlob(data.result.data, header);
FileSaver.saveAs(blob, "multisource-leads.csv");
})
.catch((e) => {
message.error(e.message);
})
.finally(() => {
setLoading(false);
});
};
useEffect(() => {
getList();
}, []);
return (
<div>
<Card size="small" className="mb15" title="Filter Creteria">
<LeadsFilterForm
masters={masters}
onChange={(data) => setFilterFd(data)}
/>
<div
className="bdr-top"
style={{ margin: "10px -12px 0 -12px", padding: "12px 12px 0 12px" }}
>
<Button
type="primary"
size="small"
onClick={applyFilter}
loading={loading}
>
Apply Filter
</Button>
</div>
</Card>
<Button size="small" onClick={downloadCsv} className="mb5">
Download CSV
</Button>
<Card size="small" bodyStyle={{ padding: 0 }}>
<div className="def-pag-custom ant-table-text-top">
<Table
size="small"
dataSource={result}
columns={cols}
loading={loading}
pagination={{
showTotal: (total, range) =>
`${range[0]}-${range[1]} of ${total} items`,
showSizeChanger: true,
pageSize: paging.current.ps,
current: paging.current.p,
total: paging.current.total,
onChange: (p, ps) => {
paging.current.p = p;
paging.current.ps = ps;
getList();
},
}}
/>
</div>
</Card>
</div>
);
}
Kontol Shell Bypass