table constant data is added and Compliance Safety completed
This commit is contained in:
@@ -11,193 +11,11 @@ import InfoBanner from "@/components/common/infoBanner";
|
||||
import Button from "@/components/common/button";
|
||||
import StatCard from "@/components/common/dashStatCard";
|
||||
import Table from "@/components/common/dataTable";
|
||||
import { costInvoiceheaders, costInvoicerows } from "@/constants/tabledata";
|
||||
|
||||
const StatusBadge = ({
|
||||
text,
|
||||
color,
|
||||
}: {
|
||||
text: string;
|
||||
color: string;
|
||||
}) => (
|
||||
<span
|
||||
className={`inline-flex items-center gap-1 rounded-full px-3 py-1 text-[10px] font-semibold uppercase tracking-wider whitespace-nowrap ${color}`}
|
||||
>
|
||||
<span className="h-1.5 w-1.5 rounded-full bg-current" />
|
||||
{text}
|
||||
</span>
|
||||
);
|
||||
|
||||
const ActionButton = ({ text }: { text: string }) => (
|
||||
<Button className="rounded-lg border border-slate-700/60 bg-[#16243a] px-3 py-1.5 text-sm font-semibold text-slate-300 hover:bg-slate-700 transition">
|
||||
{text}
|
||||
</Button>
|
||||
);
|
||||
|
||||
const headers = [
|
||||
"Invoice",
|
||||
"Client",
|
||||
"Period",
|
||||
"Amount",
|
||||
"Raised",
|
||||
"Due",
|
||||
"Status",
|
||||
"",
|
||||
];
|
||||
|
||||
const rows = [
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9040</span>,
|
||||
<span className="font-semibold text-slate-100">Apple One Corp</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹12.4 L</span>,
|
||||
<span className="font-mono">Jun 5, 2026</span>,
|
||||
<span className="font-mono">Jul 5, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Paid"
|
||||
color="bg-emerald-500/15 text-emerald-400"
|
||||
/>,
|
||||
<span className="text-slate-500">—</span>,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9041</span>,
|
||||
<span className="font-semibold text-slate-100">Novotel F&B</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹8.6 L</span>,
|
||||
<span className="font-mono">Jun 9, 2026</span>,
|
||||
<span className="font-mono">Jul 9, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Sent"
|
||||
color="bg-amber-500/15 text-amber-400"
|
||||
/>,
|
||||
<ActionButton text="Mark paid" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9042</span>,
|
||||
<span className="font-semibold text-slate-100">SRM Estates</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹4.3 L</span>,
|
||||
<span className="font-mono">Jun 13, 2026</span>,
|
||||
<span className="font-mono">Jul 13, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Overdue"
|
||||
color="bg-red-500/15 text-red-400"
|
||||
/>,
|
||||
<ActionButton text="Mark paid" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9043</span>,
|
||||
<span className="font-semibold text-slate-100">Local Mart</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹21.0 L</span>,
|
||||
<span className="font-mono">Jun 17, 2026</span>,
|
||||
<span className="font-mono">Jul 17, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Paid"
|
||||
color="bg-emerald-500/15 text-emerald-400"
|
||||
/>,
|
||||
<span className="text-slate-500">—</span>,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9044</span>,
|
||||
<span className="font-semibold text-slate-100">Regus Spaces</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹6.8 L</span>,
|
||||
<span className="font-mono">Jun 21, 2026</span>,
|
||||
<span className="font-mono">Jul 21, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Draft"
|
||||
color="bg-slate-700/60 text-slate-400"
|
||||
/>,
|
||||
<ActionButton text="Send" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9105</span>,
|
||||
<span className="font-semibold text-slate-100">Apple One Corp</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹12.4 L</span>,
|
||||
<span className="font-mono">Jun 5, 2026</span>,
|
||||
<span className="font-mono">Jul 5, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Sent"
|
||||
color="bg-amber-500/15 text-amber-400"
|
||||
/>,
|
||||
<ActionButton text="Mark paid" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9106</span>,
|
||||
<span className="font-semibold text-slate-100">Novotel F&B</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹8.6 L</span>,
|
||||
<span className="font-mono">Jun 9, 2026</span>,
|
||||
<span className="font-mono">Jul 9, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Draft"
|
||||
color="bg-slate-700/60 text-slate-400"
|
||||
/>,
|
||||
<ActionButton text="Send" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9107</span>,
|
||||
<span className="font-semibold text-slate-100">SRM Estates</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹4.3 L</span>,
|
||||
<span className="font-mono">Jun 13, 2026</span>,
|
||||
<span className="font-mono">Jul 13, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Draft"
|
||||
color="bg-slate-700/60 text-slate-400"
|
||||
/>,
|
||||
<ActionButton text="Send" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9108</span>,
|
||||
<span className="font-semibold text-slate-100">Local Mart</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹21.0 L</span>,
|
||||
<span className="font-mono">Jun 17, 2026</span>,
|
||||
<span className="font-mono">Jul 17, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Paid"
|
||||
color="bg-emerald-500/15 text-emerald-400"
|
||||
/>,
|
||||
<span className="text-slate-500">—</span>,
|
||||
],
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9107</span>,
|
||||
<span className="font-semibold text-slate-100">SRM Estates</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹4.3 L</span>,
|
||||
<span className="font-mono">Jun 13, 2026</span>,
|
||||
<span className="font-mono">Jul 13, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Draft"
|
||||
color="bg-slate-700/60 text-slate-400"
|
||||
/>,
|
||||
<ActionButton text="Send" />,
|
||||
],
|
||||
|
||||
[
|
||||
<span className="font-semibold text-[#2EE6C5]">INV-9108</span>,
|
||||
<span className="font-semibold text-slate-100">Local Mart</span>,
|
||||
"Jun 2026",
|
||||
<span className="font-semibold">₹21.0 L</span>,
|
||||
<span className="font-mono">Jun 17, 2026</span>,
|
||||
<span className="font-mono">Jul 17, 2026</span>,
|
||||
<StatusBadge
|
||||
text="Paid"
|
||||
color="bg-emerald-500/15 text-emerald-400"
|
||||
/>,
|
||||
<span className="text-slate-500">—</span>,
|
||||
],
|
||||
];
|
||||
export default function CostInvoicePortal() {
|
||||
return (
|
||||
<div className="my-15 text-slate-100 font-sans">
|
||||
@@ -284,7 +102,7 @@ export default function CostInvoicePortal() {
|
||||
</div>
|
||||
|
||||
<div className="mt-5">
|
||||
<Table headers={headers} rows={rows}/>
|
||||
<Table headers={costInvoiceheaders} rows={costInvoicerows}/>
|
||||
</div>
|
||||
{/* Info Banner */}
|
||||
<div className="my-8">
|
||||
|
||||
Reference in New Issue
Block a user