57 lines
2.5 KiB
TypeScript
57 lines
2.5 KiB
TypeScript
'use client';
|
||
|
||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
|
||
import type { CrmDashboardHotProjectRow } from '../api/types';
|
||
|
||
function formatNumber(value: number) {
|
||
return new Intl.NumberFormat('en-US', { maximumFractionDigits: 2 }).format(value);
|
||
}
|
||
|
||
export function DashboardHotProjects({ rows }: { rows: CrmDashboardHotProjectRow[] }) {
|
||
return (
|
||
<Card>
|
||
<CardHeader>
|
||
<CardTitle>โอกาสขายเด่นที่กำลังดำเนินการ</CardTitle>
|
||
<CardDescription>จัดอันดับโอกาสขายสำคัญตามมูลค่าที่ประเมินไว้</CardDescription>
|
||
</CardHeader>
|
||
<CardContent>
|
||
<Table>
|
||
<TableHeader>
|
||
<TableRow>
|
||
<TableHead>โครงการ</TableHead>
|
||
<TableHead>ลูกค้า</TableHead>
|
||
<TableHead className='text-right'>เธกเธนเธฅเธเนเธฒ</TableHead>
|
||
<TableHead>ผู้ดูแลโอกาสขาย</TableHead>
|
||
<TableHead className='text-right'>ความน่าจะเป็น</TableHead>
|
||
</TableRow>
|
||
</TableHeader>
|
||
<TableBody>
|
||
{rows.length === 0 ? (
|
||
<TableRow>
|
||
<TableCell colSpan={5} className='text-muted-foreground text-center'>
|
||
ไม่พบโอกาสขายเด่นที่ตรงกับตัวกรองปัจจุบัน
|
||
</TableCell>
|
||
</TableRow>
|
||
) : (
|
||
rows.map((row) => (
|
||
<TableRow key={row.opportunityId}>
|
||
<TableCell>
|
||
<div className='font-medium'>{row.projectName}</div>
|
||
<div className='text-muted-foreground text-xs'>{row.opportunityCode}</div>
|
||
</TableCell>
|
||
<TableCell>{row.customerName}</TableCell>
|
||
<TableCell className='text-right'>{formatNumber(row.value)}</TableCell>
|
||
<TableCell>{row.assignedSalesName ?? '-'}</TableCell>
|
||
<TableCell className='text-right'>{row.probability ?? 0}%</TableCell>
|
||
</TableRow>
|
||
))
|
||
)}
|
||
</TableBody>
|
||
</Table>
|
||
</CardContent>
|
||
</Card>
|
||
);
|
||
}
|
||
|