fill data API NetDetail

2025-11-06 23:38:53 +07:00
parent 04ca091f49
commit b97e4e1097
6 changed files with 66 additions and 273 deletions
--- a/components/tripInfo/modal/NetDetailModal/NetDetailModal.tsx
+++ b/components/tripInfo/modal/NetDetailModal/NetDetailModal.tsx
@@ -14,38 +14,11 @@ import { FishCardList } from "./components/FishCardList";
 import { InfoSection } from "./components/InfoSection";
 import { NotesSection } from "./components/NotesSection";

-// ---------------------------
-// 🧩 Interface
-// ---------------------------
-interface FishCatch {
-  fish_species_id: number;
-  fish_name: string;
-  catch_number: number;
-  catch_unit: string;
-  fish_size: number;
-  fish_rarity: number;
-  fish_condition: string;
-  gear_usage: string;
-}
-
-interface NetDetail {
-  id: string;
-  stt: string;
-  trangThai: string;
-  thoiGianBatDau?: string;
-  thoiGianKetThuc?: string;
-  viTriHaThu?: string;
-  viTriThuLuoi?: string;
-  doSauHaThu?: string;
-  doSauThuLuoi?: string;
-  catchList?: FishCatch[];
-  ghiChu?: string;
-}
-
 interface NetDetailModalProps {
  visible: boolean;
  onClose: () => void;
-  netData: NetDetail | null;
+  netData: Model.FishingLog | null;
+  stt?: number;
 }

 // ---------------------------
@@ -55,9 +28,12 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({
  visible,
  onClose,
  netData,
+  stt,
 }) => {
  const [isEditing, setIsEditing] = useState(false);
-  const [editableCatchList, setEditableCatchList] = useState<FishCatch[]>([]);
+  const [editableCatchList, setEditableCatchList] = useState<
+    Model.FishingLogInfo[]
+  >([]);
  const [selectedFishIndex, setSelectedFishIndex] = useState<number | null>(
    null
  );
@@ -74,8 +50,8 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({

  // Khởi tạo dữ liệu khi netData thay đổi
  React.useEffect(() => {
-    if (netData?.catchList) {
-      setEditableCatchList(netData.catchList);
+    if (netData?.info) {
+      setEditableCatchList(netData.info);
    }
  }, [netData]);

@@ -93,7 +69,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({

  // if (!netData) return null;

-  const isCompleted = netData?.trangThai === "Đã hoàn thành";
+  const isCompleted = netData?.status === 2; // ví dụ: status=2 là hoàn thành

  // Danh sách tên cá có sẵn
  const fishNameOptions = [
@@ -210,7 +186,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({

  const handleCancel = () => {
    setIsEditing(false);
-    setEditableCatchList(netData?.catchList || []);
+    setEditableCatchList(netData?.info || []);
  };

  const handleToggleExpanded = (index: number) => {
@@ -221,7 +197,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({

  const updateCatchItem = (
    index: number,
-    field: keyof FishCatch,
+    field: keyof Model.FishingLogInfo,
    value: string | number
  ) => {
    setEditableCatchList((prev) =>
@@ -245,7 +221,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({
  };

  const handleAddNewFish = () => {
-    const newFish: FishCatch = {
+    const newFish: Model.FishingLogInfo = {
      fish_species_id: 0,
      fish_name: "",
      catch_number: 0,
@@ -289,7 +265,8 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({

  // Chỉ tính tổng số lượng cá có đơn vị là 'kg'
  const totalCatch = editableCatchList.reduce(
-    (sum, item) => (item.catch_unit === "kg" ? sum + item.catch_number : sum),
+    (sum, item) =>
+      item.catch_unit === "kg" ? sum + (item.catch_number ?? 0) : sum,
    0
  );

@@ -346,6 +323,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({
          <InfoSection
            netData={netData ?? undefined}
            isCompleted={isCompleted}
+            stt={stt}
          />

          {/* Danh sách cá bắt được */}
@@ -375,7 +353,7 @@ const NetDetailModal: React.FC<NetDetailModalProps> = ({
          />

          {/* Ghi chú */}
-          <NotesSection ghiChu={netData?.ghiChu} />
+          <NotesSection ghiChu={netData?.weather_description} />
        </ScrollView>
      </View>
    </Modal>
--- a/components/tripInfo/modal/NetDetailModal/components/FishCardForm.tsx
+++ b/components/tripInfo/modal/NetDetailModal/components/FishCardForm.tsx
@@ -3,19 +3,8 @@ import { Text, TextInput, View } from "react-native";
 import styles from "../../style/NetDetailModal.styles";
 import { FishSelectDropdown } from "./FishSelectDropdown";

-interface FishCatch {
-  fish_species_id: number;
-  fish_name: string;
-  catch_number: number;
-  catch_unit: string;
-  fish_size: number;
-  fish_rarity: number;
-  fish_condition: string;
-  gear_usage: string;
-}
-
 interface FishCardFormProps {
-  fish: FishCatch;
+  fish: Model.FishingLogInfo;
  index: number;
  isEditing: boolean;
  fishNameOptions: string[];
@@ -32,7 +21,7 @@ interface FishCardFormProps {
  // setSelectedGearIndex: (index: number | null) => void;
  onUpdateCatchItem: (
    index: number,
-    field: keyof FishCatch,
+    field: keyof Model.FishingLogInfo,
    value: string | number
  ) => void;
 }
@@ -65,7 +54,7 @@ export const FishCardForm: React.FC<FishCardFormProps> = ({
        {isEditing ? (
          <FishSelectDropdown
            options={fishNameOptions}
-            selectedValue={fish.fish_name}
+            selectedValue={fish.fish_name ?? ""}
            isOpen={selectedFishIndex === index}
            onToggle={() =>
              setSelectedFishIndex(selectedFishIndex === index ? null : index)
@@ -110,7 +99,7 @@ export const FishCardForm: React.FC<FishCardFormProps> = ({
          {isEditing ? (
            <FishSelectDropdown
              options={unitOptions}
-              selectedValue={fish.catch_unit}
+              selectedValue={fish.catch_unit ?? ""}
              isOpen={selectedUnitIndex === index}
              onToggle={() =>
                setSelectedUnitIndex(selectedUnitIndex === index ? null : index)
--- a/components/tripInfo/modal/NetDetailModal/components/FishCardHeader.tsx
+++ b/components/tripInfo/modal/NetDetailModal/components/FishCardHeader.tsx
@@ -2,19 +2,8 @@ import React from "react";
 import { Text, View } from "react-native";
 import styles from "../../style/NetDetailModal.styles";

-interface FishCatch {
-  fish_species_id: number;
-  fish_name: string;
-  catch_number: number;
-  catch_unit: string;
-  fish_size: number;
-  fish_rarity: number;
-  fish_condition: string;
-  gear_usage: string;
-}
-
 interface FishCardHeaderProps {
-  fish: FishCatch;
+  fish: Model.FishingLogInfo;
 }

 export const FishCardHeader: React.FC<FishCardHeaderProps> = ({ fish }) => {
--- a/components/tripInfo/modal/NetDetailModal/components/FishCardList.tsx
+++ b/components/tripInfo/modal/NetDetailModal/components/FishCardList.tsx
@@ -5,19 +5,8 @@ import styles from "../../style/NetDetailModal.styles";
 import { FishCardForm } from "./FishCardForm";
 import { FishCardHeader } from "./FishCardHeader";

-interface FishCatch {
-  fish_species_id: number;
-  fish_name: string;
-  catch_number: number;
-  catch_unit: string;
-  fish_size: number;
-  fish_rarity: number;
-  fish_condition: string;
-  gear_usage: string;
-}
-
 interface FishCardListProps {
-  catchList: FishCatch[];
+  catchList: Model.FishingLogInfo[];
  isEditing: boolean;
  expandedFishIndex: number[];
  selectedFishIndex: number | null;
@@ -31,7 +20,7 @@ interface FishCardListProps {
  onToggleExpanded: (index: number) => void;
  onUpdateCatchItem: (
    index: number,
-    field: keyof FishCatch,
+    field: keyof Model.FishingLogInfo,
    value: string | number
  ) => void;
  setSelectedFishIndex: (index: number | null) => void;
--- a/components/tripInfo/modal/NetDetailModal/components/InfoSection.tsx
+++ b/components/tripInfo/modal/NetDetailModal/components/InfoSection.tsx
@@ -17,31 +17,37 @@ interface NetDetail {
 }

 interface InfoSectionProps {
-  netData?: NetDetail;
+  netData?: Model.FishingLog;
  isCompleted: boolean;
+  stt?: number;
 }

 export const InfoSection: React.FC<InfoSectionProps> = ({
  netData,
  isCompleted,
+  stt,
 }) => {
  if (!netData) {
    return null;
  }
  const infoItems = [
-    { label: "Số thứ tự", value: netData.stt },
+    { label: "Số thứ tự", value: `Mẻ ${stt}` },
    {
      label: "Trạng thái",
-      value: netData.trangThai,
+      value: netData.status === 1 ? "Đã hoàn thành" : "Chưa hoàn thành",
      isStatus: true,
    },
    {
      label: "Thời gian bắt đầu",
-      value: netData.thoiGianBatDau || "Chưa cập nhật",
+      value: netData.start_at
+        ? new Date(netData.start_at).toLocaleString()
+        : "Chưa cập nhật",
    },
    {
      label: "Thời gian kết thúc",
-      value: netData.thoiGianKetThuc || "Chưa cập nhật",
+      value: netData.start_at
+        ? new Date(netData.end_at).toLocaleString()
+        : "Chưa cập nhật",
    },
    {
      label: "Vị trí hạ thu",
@@ -70,7 +76,7 @@ export const InfoSection: React.FC<InfoSectionProps> = ({
            <View
              style={[
                styles.statusBadge,
-                isCompleted
+                item.value === "Đã hoàn thành"
                  ? styles.statusBadgeCompleted
                  : styles.statusBadgeInProgress,
              ]}
@@ -78,7 +84,7 @@ export const InfoSection: React.FC<InfoSectionProps> = ({
              <Text
                style={[
                  styles.statusBadgeText,
-                  isCompleted
+                  item.value === "Đã hoàn thành"
                    ? styles.statusBadgeTextCompleted
                    : styles.statusBadgeTextInProgress,
                ]}