47 lines
2.3 KiB
React
47 lines
2.3 KiB
React
import { useDeadlineClock } from '../hooks/useDeadlineClock';
|
||
import React, { useMemo } from 'react';
|
||
import { CalendarClock } from 'lucide-react';
|
||
import { useApp } from '../context/AppContext';
|
||
import { deadlineInfo } from '../services/tenderCalendar';
|
||
|
||
/**
|
||
* Sağ panel: takipteki / panodaki ihalelerden 14 gün içinde yapılacaklar.
|
||
* Sunucuya gitmez — liste zaten bellekte. ≤3 gün kırmızı, ≤7 turuncu.
|
||
*/
|
||
export const YaklasanSonTarihler = ({ gun = 14 }) => {
|
||
const now = useDeadlineClock();
|
||
const { tenders, setActiveTenderDetail } = useApp();
|
||
const liste = useMemo(() => {
|
||
return tenders
|
||
.filter(t => t.takipte || t.gorev)
|
||
.map(t => ({t,info:deadlineInfo(t,now)}))
|
||
.filter(({info}) => info.days !== null && info.days >= 0 && info.days <= gun && info.expired !== true)
|
||
.sort((a,b) => a.info.days - b.info.days || (a.info.deadline?.getTime() || Infinity) - (b.info.deadline?.getTime() || Infinity))
|
||
.map(({t,info}) => ({t,kalan:info.days,label:info.label}))
|
||
.slice(0, 8);
|
||
}, [tenders, gun, now]);
|
||
|
||
const renk = (g) => (g <= 3 ? 'bg-red-600 text-white' : g <= 7 ? 'bg-amber-500 text-white' : 'bg-slate-200 text-slate-800');
|
||
|
||
return (
|
||
<div className="bg-white rounded-xl border border-slate-200 shadow-xs overflow-hidden">
|
||
<div className="bg-slate-50 border-b border-slate-100 px-4 py-3">
|
||
<span className="flex items-center gap-2 font-bold text-xs uppercase tracking-wider text-slate-800">
|
||
<CalendarClock className="w-4 h-4 text-amber-500" /> Yaklaşan İhale Tarihleri
|
||
</span>
|
||
</div>
|
||
<div className="p-2 space-y-1">
|
||
{liste.length === 0 ? (
|
||
<p className="px-2 py-3 text-xs text-slate-500">{gun} gün içinde yapılacak takipli ihale yok. Yıldızla takibe alın; burada geri sayım başlar.</p>
|
||
) : liste.map(({ t, kalan, label }) => (
|
||
<button key={t.id} type="button" onClick={() => setActiveTenderDetail?.(t)}
|
||
className="w-full flex items-center justify-between gap-2 rounded-lg p-2 text-xs hover:bg-slate-50 text-left">
|
||
<span className="min-w-0 truncate font-medium text-slate-800" title={t.baslik}>{t.baslik}</span>
|
||
<span className={`shrink-0 rounded-md px-1.5 py-0.5 text-[10px] font-extrabold ${renk(kalan)}`}>{label}</span>
|
||
</button>
|
||
))}
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|