refactor: upload section design fix
This commit is contained in:
@@ -11,7 +11,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
import { Loader2, Check } from 'lucide-react';
|
||||
import { Loader2, Check, ArrowUp, ArrowDown } from 'lucide-react';
|
||||
import { projectService, packageService, chainageService } from '@/services/api';
|
||||
import { Project, Package as PackageType, Chainage, SessionContext } from '@/types';
|
||||
import { cn } from '@/lib/utils';
|
||||
@@ -133,6 +133,7 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
|
||||
packageName: selectedPackage.name,
|
||||
chainageId: selectedChainage.id,
|
||||
chainageName: selectedChainage.segment_name,
|
||||
chainageDirection: selectedChainage.direction,
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -298,11 +299,20 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
|
||||
<SelectContent>
|
||||
{chainages.map((chn) => (
|
||||
<SelectItem key={chn.id} value={chn.id}>
|
||||
<div className="flex flex-col">
|
||||
<span>{chn.segment_name}</span>
|
||||
<span className="text-[10px] text-muted-foreground">
|
||||
{chn.chainage_start_km}-{chn.chainage_end_km} km | {chn.direction}
|
||||
</span>
|
||||
<div className="flex flex-col gap-0.5 py-0.5">
|
||||
<span className="font-semibold text-sm">{chn.segment_name}</span>
|
||||
<div className="flex items-center gap-2 text-[10px] text-muted-foreground font-medium">
|
||||
<span>{chn.chainage_start_km}-{chn.chainage_end_km} km</span>
|
||||
<span className="h-2.5 w-px bg-border" />
|
||||
<span className="flex items-center gap-1 uppercase">
|
||||
{chn.direction === 'UP' ? (
|
||||
<ArrowUp className="h-2.5 w-2.5" />
|
||||
) : (
|
||||
<ArrowDown className="h-2.5 w-2.5" />
|
||||
)}
|
||||
{chn.direction}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</SelectItem>
|
||||
))}
|
||||
@@ -320,7 +330,17 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
|
||||
<span>/</span>
|
||||
<span className="text-foreground">{selectedPackage?.name}</span>
|
||||
<span>/</span>
|
||||
<span className="text-foreground">{selectedChainage?.segment_name}</span>
|
||||
<span className="text-foreground flex items-center gap-1.5">
|
||||
{selectedChainage?.segment_name}
|
||||
<span className="inline-flex items-center gap-1 px-1.5 py-0.5 rounded bg-muted text-[10px] font-bold uppercase border">
|
||||
{selectedChainage?.direction === 'UP' ? (
|
||||
<ArrowUp className="h-2.5 w-2.5" />
|
||||
) : (
|
||||
<ArrowDown className="h-2.5 w-2.5" />
|
||||
)}
|
||||
{selectedChainage?.direction}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user