Files
progeco_app/components/QualityControlCard.tsx
T
2026-08-31 16:50:53 +02:00

56 lines
2.1 KiB
TypeScript

import React from 'react';
import { View, Text } from 'react-native';
import { CheckCircle2, AlertTriangle, Briefcase, Calendar, MapPin } from 'lucide-react-native';
import { QualityControlItem } from '@/types/types';
interface QualityControlCardProps {
item: QualityControlItem;
}
export default function QualityControlCard({ item }: QualityControlCardProps) {
const isSuccess = item.result === 1;
return (
<View className="bg-white rounded-3xl p-5 mb-4 shadow-sm border border-gray-100 flex-row items-center gap-4">
{/* Icon Status */}
<View className={`w-14 h-14 rounded-full items-center justify-center shadow-sm ${isSuccess ? 'bg-green-100 shadow-green-200' : 'bg-red-100 shadow-red-200'}`}>
{isSuccess ? (
<CheckCircle2 size={32} color="#16a34a" pointerEvents="none" />
) : (
<AlertTriangle size={32} color="#dc2626" pointerEvents="none" />
)}
</View>
{/* Content */}
<View className="flex-1 justify-center">
<Text
className="text-lg font-bold text-gray-800 uppercase leading-tight mb-1"
numberOfLines={2}
ellipsizeMode="tail"
>
{item.constructionSite}
</Text>
<View className="flex-row items-center gap-1 mb-1.5 mt-0.5">
<MapPin size={14} color="#6b7280" />
<Text
className="text-sm font-medium text-gray-500 leading-snug flex-1"
numberOfLines={1}
ellipsizeMode="tail"
>
{item.subactivity}
</Text>
</View>
<View className="flex-row items-center gap-1">
<Calendar size={14} color="#9ca3af" />
<Text className="text-sm font-semibold text-gray-400">
{item.date}
</Text>
</View>
</View>
</View>
);
}