88 lines
2.4 KiB
TypeScript
88 lines
2.4 KiB
TypeScript
import React from "react";
|
|
import { Text, View } from "react-native";
|
|
import styles from "../../style/NetDetailModal.styles";
|
|
|
|
interface InfoSectionProps {
|
|
fishingLog?: Model.FishingLog;
|
|
stt?: number;
|
|
}
|
|
|
|
export const InfoSection: React.FC<InfoSectionProps> = ({
|
|
fishingLog,
|
|
stt,
|
|
}) => {
|
|
if (!fishingLog) {
|
|
return null;
|
|
}
|
|
const infoItems = [
|
|
{ label: "Số thứ tự", value: `Mẻ ${stt}` },
|
|
{
|
|
label: "Trạng thái",
|
|
value: fishingLog.status === 1 ? "Đã hoàn thành" : "Chưa hoàn thành",
|
|
isStatus: true,
|
|
},
|
|
{
|
|
label: "Thời gian bắt đầu",
|
|
value: fishingLog.start_at
|
|
? new Date(fishingLog.start_at).toLocaleString()
|
|
: "Chưa cập nhật",
|
|
},
|
|
{
|
|
label: "Thời gian kết thúc",
|
|
value:
|
|
fishingLog.end_at !== "0001-01-01T00:00:00Z"
|
|
? new Date(fishingLog.end_at).toLocaleString()
|
|
: "-",
|
|
},
|
|
// {
|
|
// label: "Vị trí hạ thu",
|
|
// value: fishingLog.viTriHaThu || "Chưa cập nhật",
|
|
// },
|
|
// {
|
|
// label: "Vị trí thu lưới",
|
|
// value: fishingLog.viTriThuLuoi || "Chưa cập nhật",
|
|
// },
|
|
// {
|
|
// label: "Độ sâu hạ thu",
|
|
// value: fishingLog.doSauHaThu || "Chưa cập nhật",
|
|
// },
|
|
// {
|
|
// label: "Độ sâu thu lưới",
|
|
// value: fishingLog.doSauThuLuoi || "Chưa cập nhật",
|
|
// },
|
|
];
|
|
|
|
return (
|
|
<View style={styles.infoCard}>
|
|
{infoItems.map((item, index) => (
|
|
<View key={index} style={styles.infoRow}>
|
|
<Text style={styles.infoLabel}>{item.label}</Text>
|
|
{item.isStatus ? (
|
|
<View
|
|
style={[
|
|
styles.statusBadge,
|
|
item.value === "Đã hoàn thành"
|
|
? styles.statusBadgeCompleted
|
|
: styles.statusBadgeInProgress,
|
|
]}
|
|
>
|
|
<Text
|
|
style={[
|
|
styles.statusBadgeText,
|
|
item.value === "Đã hoàn thành"
|
|
? styles.statusBadgeTextCompleted
|
|
: styles.statusBadgeTextInProgress,
|
|
]}
|
|
>
|
|
{item.value}
|
|
</Text>
|
|
</View>
|
|
) : (
|
|
<Text style={styles.infoValue}>{item.value}</Text>
|
|
)}
|
|
</View>
|
|
))}
|
|
</View>
|
|
);
|
|
};
|