SS-FCSC/fcsc_ipi_frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

establishment dashboard bug solved

Browse Source
This commit is contained in:
Senthamilselvi 2025-11-05 18:17:13 +05:30
parent 2eb18764f3
commit b444718d8b
1 changed files with 91 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

165
ipi-survey-platform/src/components/dashboard/SubmissionHistory.jsx
View File

@ -40,18 +40,32 @@ const getStatusClass = (status) => {
return 'inline-flex items-center rounded-md bg-[#F8FAFC] px-2 py-1 text-xs font-medium text-[#374151]'; return 'inline-flex items-center rounded-md bg-[#F8FAFC] px-2 py-1 text-xs font-medium text-[#374151]';
}; };
const downloadCsv = (rows) => { const downloadCsv = (data) => {
if (!rows.length) return; if (!data.length) return;
const headers = ['Survey Name', 'Year', 'Quarter', 'Status', 'Submission On', 'Products']; const headers = ['Survey Name', 'Year', 'Quarter', 'Status', 'Submission On', 'Products'];
const csvRows = [headers.join(',')]; const csvRows = [headers.join(',')];
rows.forEach((row) => {
csvRows.push( data.forEach((item) => {
row const surveyName = item.survey_name || '—';
.slice(0, 6) const year = item.year || '—';
.map((cell) => `"${String(cell).replace(/"/g, '""')}"`) const quarter = item.quarter || '—';
.join(',')
); const normalized = String(item.status || '').toLowerCase();
let status = '—';
if (normalized === 'pending') status = 'Under Review';
else if (normalized === 'rejected') status = 'Returned';
else if (['submitted', 'approved'].includes(normalized)) status = 'Approved';
const submissionOn = item.submission_on || '—';
const productCount = Number(item.products) || 0;
const products = `${productCount} ${productCount === 1 ? 'product' : 'products'}`;
const row = [surveyName, year, quarter, status, submissionOn, products];
csvRows.push(row.map(cell => `"${String(cell).replace(/"/g, '""')}"`).join(','));
}); });
const blob = new Blob([csvRows.join('\n')], { type: 'text/csv;charset=utf-8;' }); const blob = new Blob([csvRows.join('\n')], { type: 'text/csv;charset=utf-8;' });
const url = URL.createObjectURL(blob); const url = URL.createObjectURL(blob);
const link = document.createElement('a'); const link = document.createElement('a');
@ -131,25 +145,19 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
}); });
const toolbar = ( const toolbar = (
<div className="px-4 pt-6 pb-2 flex flex-col gap-3 md:flex-row md:items-center md:justify-between"> <div className="px-6 py-4 flex items-center justify-between border-b border-[#D9D9DC] bg-white">
<div className="flex flex-col gap-1"> <h3 className="text-[16px] font-medium text-[#232528]">
<h3 className="text-[18px] leading-[28px] ml-2 font-medium text-[#232528]"> Submission History
Submission History </h3>
</h3>
<div className="flex gap-3 text-sm text-gray-500">
{loading && <span>Loading…</span>}
{error && <span className="text-red-600">{error}</span>}
</div>
</div>
<div className="flex flex-col md:flex-row gap-3 md:items-center"> <div className="flex items-center gap-3">
<div className="relative w-full md:w-56"> <div className="relative w-56">
<input <input
type="text" type="text"
value={searchTerm} value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)} onChange={(e) => setSearchTerm(e.target.value)}
placeholder="Search Establishment" placeholder="Search Establishment"
className="w-full h-10 rounded-md border border-[#E5E7EB] pl-10 pr-3 text-sm focus:outline-none" className="w-full h-10 rounded-md border border-[#E5E7EB] pl-10 pr-3 text-sm focus:outline-none focus:ring-1 focus:ring-[#92722A]"
/> />
<img <img
src={searchIconSrc} src={searchIconSrc}
@ -159,15 +167,15 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
</div> </div>
<button <button
type="button" type="button"
onClick={() => downloadCsv(rowsData)} onClick={() => downloadCsv(filteredRows)}
disabled={!rowsData.length} disabled={!rowsData.length}
className={`inline-flex h-10 items-center gap-2 rounded-md border px-4 mr-2 text-sm font-medium ${ className={`inline-flex h-10 items-center gap-2 rounded-md border px-4 text-sm font-medium ${
rowsData.length rowsData.length
? 'border-[#92722A] text-[#92722A] hover:bg-[#F2ECCF]' ? 'border-[#92722A] text-[#92722A] hover:bg-[#F2ECCF]'
: 'border-gray-200 text-gray-400 cursor-not-allowed' : 'border-gray-200 text-gray-400 cursor-not-allowed'
}`} }`}
> >
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
className="h-4 w-4" className="h-4 w-4"
@ -204,50 +212,59 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
return ( return (
<> <>
<section className="max-w-[1280px] mx-auto px-0"> <section className="max-w-[1280px] mx-auto px-0">
<div className="overflow-x-auto rounded-lg border border-[#D9D9DC] shadow-sm bg-white"> <div className="overflow-x-auto border border-[#D9D9DC] shadow-sm bg-white">
<table className="min-w-full border-collapse text-sm text-[#232528]"> {toolbar}
<thead> <table className="min-w-full border-collapse text-sm text-[#232528]">
<tr className="bg-[#F2ECCF] text-left text-[13px] font-semibold text-[#232528]"> <thead>
{[ <tr className="bg-[#F2ECCF] text-left text-[13px] font-semibold text-[#232528]">
'Survey Name', {[
'Year', 'Survey Name',
'Quarter', 'Year',
'Status', 'Quarter',
'Submission on', 'Status',
'Products', 'Submission on',
'Actions', 'Products',
].map((header, index) => ( 'Actions',
<th ].map((header, index) => (
key={index} <th
className="px-4 py-3 border-b border-[#D9D9DC] whitespace-nowrap" key={index}
> className="px-4 py-3 border-b border-[#D9D9DC] whitespace-nowrap"
{header} >
</th> {header}
))} </th>
</tr> ))}
</thead> </tr>
</thead>
<tbody className="divide-y divide-[#D9D9DC] text-[13px] leading-[20px]"> <tbody className="divide-y divide-[#D9D9DC] text-[13px] leading-[20px]">
{rowsData.map((row, rowIndex) => ( {rowsData.length === 0 ? (
<tr <tr>
key={rowIndex} <td colSpan="7" className="px-4 py-8 text-center text-gray-500">
className="hover:bg-[#FAFAFA] transition-colors duration-150" {loading ? 'Loading...' : error ? error : 'No submissions found'}
> </td>
{row.map((cell, cellIndex) => ( </tr>
<td ) : (
key={cellIndex} rowsData.map((row, rowIndex) => (
className="px-4 py-3 align-middle whitespace-nowrap border-b border-[#D9D9DC]" <tr
> key={rowIndex}
{cell} className="hover:bg-[#FAFAFA] transition-colors duration-150"
</td> >
))} {row.map((cell, cellIndex) => (
</tr> <td
))} key={cellIndex}
</tbody> className="px-4 py-3 align-middle whitespace-nowrap border-b border-[#D9D9DC]"
</table> >
</div> {cell}
</section> </td>
))}
</tr>
))
)}
</tbody>
</table>
</div>
</section>
<Footer /> <Footer />
</> </>
); );