gitea_admin/krishnasales_mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

made call details kpi less gap

Browse Source
This commit is contained in:
suryacp23 2026-07-30 16:36:00 +05:30
parent cee2f5d94f
commit eb4b25f327
1 changed files with 18 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/dv/CallDetail.tsx
View File

@ -405,22 +405,18 @@ export function CallDetail({
</div>
{/* Top Right KPI Grid */}
<div className="flex flex-nowrap items-center gap-3 w-full lg:w-auto overflow-x-auto pb-2 min-w-0">
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-3 text-center min-w-[100px] flex-1">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5">TOTAL BAGS</div>
<div className="text-[20px] font-extrabold text-primary">{totalBags.toLocaleString()}</div>
<div className="flex flex-nowrap items-center gap-2 w-full min-w-0 mt-2">
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-2.5 text-center flex-1 min-w-0">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5 whitespace-nowrap overflow-hidden text-ellipsis">TOTAL BAGS</div>
<div className="text-lg font-extrabold text-primary leading-tight">{totalBags.toLocaleString()}</div>
</div>
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-3 text-center min-w-[100px] flex-1">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5">TOTAL KGS</div>
<div className="text-[20px] font-extrabold text-primary">{totalKgs.toLocaleString()}</div>
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-2.5 text-center flex-1 min-w-0">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5 whitespace-nowrap overflow-hidden text-ellipsis">TOTAL KGS</div>
<div className="text-lg font-extrabold text-primary leading-tight">{totalKgs.toLocaleString()}</div>
</div>
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-3 text-center min-w-[100px] flex-1">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5">LINE ITEMS</div>
<div className="text-[20px] font-extrabold text-primary">{lineItemsCount}</div>
</div>
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-3 text-center min-w-[110px] flex-1">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5">SALES OFFICER</div>
<div className="text-sm font-bold text-primary mt-1 whitespace-nowrap overflow-hidden text-ellipsis">{salesOfficer}</div>
<div className="bg-primary-light-bg border border-primary-light-border rounded-2xl p-2.5 text-center flex-1 min-w-0">
<div className="text-[10px] font-bold text-primary uppercase tracking-wider mb-0.5 whitespace-nowrap overflow-hidden text-ellipsis">ORDER ITEMS</div>
<div className="text-lg font-extrabold text-primary leading-tight">{lineItemsCount}</div>
</div>
</div>
</div>
@ -593,7 +589,7 @@ export function CallDetail({
{/* Call Potential Card (Below Orders) */}
{callPotentialList.length > 0 && (
<div className="bg-[var(--tiles-card-bg)] rounded-2xl border border-slate-200/80 p-6 shadow-sm space-y-4">
<div className="bg-[var(--tiles-card-bg)] rounded-2xl border border-slate-200/80 p-5 shadow-sm flex flex-col gap-3">
<div className="flex items-center justify-between border-b border-slate-100 pb-3">
<div className="flex items-center gap-2">
<div className="bg-primary-light-bg p-1.5 rounded-full border border-primary-light-border flex items-center justify-center">
@ -609,16 +605,14 @@ export function CallDetail({
const extraOrdered = callPotentialList.filter(item => item.actualPotential === 0);
const renderTable = (items: any[]) => (
<div className="flex flex-col gap-3">
<div className="flex flex-col gap-2.5">
{items.map((item, idx) => (
<div key={idx} className="bg-primary-light-bg border border-primary-light-border rounded-3xl px-5 py-4 flex flex-col gap-3">
<div className="flex justify-between items-start gap-4">
<div className="flex flex-col gap-1.5">
<span className="text-primary font-semibold text-[15px]">{item.name}</span>
</div>
<div key={idx} className="bg-primary-light-bg border border-primary-light-border rounded-xl px-3 py-2.5 flex flex-col gap-1">
<div className="flex justify-between items-center">
<span className="text-primary font-bold text-[13px] uppercase tracking-wide">{item.name}</span>
</div>
<div className="flex justify-between items-center bg-white rounded-2xl py-3 px-4 border border-primary-light-border">
<div className="flex justify-between items-center bg-white rounded-lg py-1.5 px-3 border border-primary-light-border mt-0.5">
<div className="flex flex-col gap-0.5">
<span className="text-[10px] font-bold text-primary uppercase tracking-wider">Potential</span>
<span className="text-sm font-semibold text-primary">{item.actualPotential}</span>
@ -647,11 +641,11 @@ export function CallDetail({
);
return (
<div className="space-y-6">
<div className="flex flex-col gap-4">
{regularPotential.length > 0 && renderTable(regularPotential)}
{extraOrdered.length > 0 && (
<div className="space-y-4 pt-2 border-t border-slate-100 mt-4">
<div className="flex flex-col gap-3 pt-2 border-t border-slate-100 mt-2">
<div className="flex items-center gap-2">
<ShoppingCart className="text-slate-800" size={14} />
<h3 className="text-[11px] font-bold text-slate-800 uppercase tracking-wider">Ordered Outside Potential</h3>