ikan Uploader :
Directory : /var/www/html/shardahospital.org/shardalms/lms/lms/react/src/pages/
Upload File : |
| Current File : /var/www/html/shardahospital.org/shardalms/lms/lms/react/src/pages/AdmCounsellorReport.js |
/* eslint-disable react-hooks/exhaustive-deps */
import React, { useState, useEffect, useRef } from "react";
import AdmCounsellorReportService from "../services/AdmCounsellorReportService";
import BudgetService from "../services/BudgetService";
import AuthService from "../services/AuthService";
import { AntdSelect, AntdDatepicker } from "../components";
import FileSaver from 'file-saver';
import util from "../util";
import {
Button,
message,
Card,
Row,
Col,
Spin,
Table,
List,
Result
} from 'antd';
const $ = window.$;
export default function AdmCounsellorReport() {
const [result, setResult] = useState([]);
const [loading, setLoading] = useState(false);
const sdataRef = useRef({ type: 'OVERALL' });
const modules = AuthService.getModules();
const list = () => {
if (!modules.adm_counsellor_report) {
return;
}
setLoading(true);
AdmCounsellorReportService.admCounsellorReport(sdataRef.current).then(({ data }) => {
data.result.forEach((v, i) => { v.key = i; });
setResult(data.result);
}).catch(e => {
message.error(e.message);
}).finally(() => {
setLoading(false);
})
}
const downloadCsv = () => {
let header = {
user: 'USER',
period: 'PERIOD',
total: 'LEAD',
paid: 'PAID APPLICANT',
adm_offered: 'OFFERED ADMISSION',
adm_confirmed: 'CONFIRMED ADMISSION',
adm_withdraw: 'WITHDRAW ADMISSION',
adm_final: 'FINAL ADMISSION',
followup_leads_count: 'FOLLOWUP TAKEN ON LEADS',
followup_count: 'TOTAL FOLLOWUP TAKEN',
emails_count: 'TOTAL EMAILS SENT',
sms_count: 'TOTAL SMS SENT',
dead_count: 'DEAD LEADS',
untouched_count: 'UNTOUCHED',
};
let blob = util.convertToCSVBlob(result, header);
FileSaver.saveAs(blob, 'adm_counsellor_report.csv');
}
const cols = [
{
title: "User",
dataIndex: "user",
},
{
title: "Period",
dataIndex: "period",
},
{
title: "Lead",
dataIndex: "total",
align: 'right'
},
{
title: "Paid Applicant",
dataIndex: "paid",
align: 'right'
},
{
title: "Admission Offered",
dataIndex: "adm_offered",
align: 'right'
},
{
title: "Confirmed Admissions",
dataIndex: "adm_confirmed",
align: 'right'
},
{
title: "Withdraw Admissions",
dataIndex: "adm_withdraw",
align: 'right'
},
{
title: "Final Admissions",
dataIndex: "adm_final",
align: 'right'
}
];
useEffect(() => {
list();
}, []);
const followupDataKeys = {
followup_leads_count: 'Followup Taken on Leads',
followup_count: 'Total Followup Taken',
emails_count: 'Total Emails Sent',
sms_count: 'Total SMS Sent',
dead_count: 'Dead Leads',
untouched_count: 'Untouched',
};
const wh = $(window).height();
if (!modules.adm_counsellor_report) {
return (
<Result
status="403"
title="403"
subTitle="Sorry, you are not authorized to access this page."
// extra={<Button type="primary">Back Home</Button>}
/>
)
}
return (
<div>
<div className="page-heading d-flex align-items-center justify-content-between mb15">
<div>Admission Counsellor Report</div>
</div>
<Card size="small">
<SearchForm dataRef={sdataRef} onSearch={list} downloadCsv={downloadCsv} />
</Card>
<div className="pt10">
<Spin spinning={loading}>
<Row gutter={[16, 16]}>
<Col span="18">
<Card size="small" bodyStyle={{ padding: 0 }}>
<Table
size="small"
bordered={false}
dataSource={result}
columns={cols}
//scroll={{y:wh-270}}
pagination={false}
className="stripped"
/>
</Card>
</Col>
<Col span="6">
<Card size="small" title="FOLLOWUP REPORT" bodyStyle={{ padding: 8, height: wh - 200, overflowY: 'auto', overflowX: 'hidden' }}>
<Row gutter={[16, 16]}>
{result.map((rw, i) => (
<Col key={i} span="24">
<Card size="small" type="inner" title={`${rw.user} - ${rw.period}`} bodyStyle={{ padding: 0 }}>
<List
size="small"
dataSource={Object.keys(followupDataKeys).map(k => ({ key: k, label: followupDataKeys[k], value: rw[k] }))}
renderItem={item => (
<List.Item style={{ padding: '6px 8px' }}>
<div className="d-flex justify-content-between wper100 fs11 uc bold600">
<div>{item.label}</div>
<div>{item.value}</div>
</div>
</List.Item>
)}
/>
</Card>
</Col>
))}
</Row>
</Card>
</Col>
</Row>
</Spin>
</div>
</div>
)
}
const SearchForm = (props) => {
const { dataRef, onSearch, downloadCsv } = props;
const [data, setData] = useState({ ...dataRef.current });
const [users, setUsers] = useState([]);
const type = data.type.replace('_USER_WISE', '');
const handleChange = (v, k) => {
setData({ ...data, [k]: v });
}
useEffect(() => {
dataRef.current = { ...data };
if (data.user_id) {
dataRef.current.user_ids = [data.user_id];
} else {
dataRef.current.user_ids = users.filter(v => v.type === type).map(v => v.id);
}
if (!dataRef.current.user_ids || dataRef.current.user_ids.length === 0) {
dataRef.current.user_ids = [0];
}
}, [data]);
useEffect(() => {
BudgetService.allUsers({ status: 1, types: 'CAMPUS,RO' }).then(({ data }) => {
data.result.data.forEach((v) => { v.key = v.id; });
setUsers(data.result.data);
})
}, []);
return (
<div className="d-flex">
<div style={{ width: `calc(100% - 220px)` }}>
<Row gutter={[16, 16]}>
<Col span="4">
<div className="fs11 text-secondary mb3 uc">Type</div>
<AntdSelect
placeholder="Select"
options={['OVERALL', 'CAMPUS', 'RO', 'CAMPUS_USER_WISE', 'RO_USER_WISE']}
value={data.type}
onChange={v => {
data.user_id = null;
handleChange(v, 'type');
}}
/>
</Col>
<Col span="12">
<div className="fs11 text-secondary mb3 uc">{type !== 'OVERALL' ? type : ''} Users</div>
<AntdSelect
allowClear
showSearch
placeholder="All"
options={users.filter(v => v.type === type)}
value={data.user_id}
disabled={type === 'OVERALL'}
onChange={v => {
handleChange(v, 'user_id');
}}
/>
</Col>
<Col span="4">
<div className="fs11 text-secondary mb3 uc">From Date</div>
<AntdDatepicker
placeholder="From"
onChange={dt => handleChange(dt, 'from_date')}
value={data.from_date}
/>
</Col>
<Col span="4">
<div className="fs11 text-secondary mb3 uc">To Date</div>
<AntdDatepicker
placeholder="To"
onChange={dt => handleChange(dt, 'to_date')}
value={data.to_date}
/>
</Col>
</Row>
</div>
<div className="mt-auto pl10" style={{ width: '220px' }}>
<div className="d-flex justify-content-between">
<Button type="primary" onClick={onSearch}>Search</Button>
<Button type="dashed" onClick={downloadCsv}>Download</Button>
</div>
</div>
</div>
)
}
Kontol Shell Bypass