56 lines
2.1 KiB
TypeScript
56 lines
2.1 KiB
TypeScript
import React from 'react';
|
|
import { View, Text } from 'react-native';
|
|
import { CheckCircle2, AlertTriangle, 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>
|
|
);
|
|
}
|