cập nhật modal add/edit fishingLog và sửa lỗi event ở map

This commit is contained in:
Tran Anh Tuan
2025-11-07 18:54:44 +07:00
parent c02b61163d
commit 4d821646cf
10 changed files with 300 additions and 213 deletions

View File

@@ -1,12 +1,32 @@
import { Tabs } from "expo-router";
import { Tabs, useSegments } from "expo-router";
import { HapticTab } from "@/components/haptic-tab";
import { IconSymbol } from "@/components/ui/icon-symbol";
import { Colors } from "@/constants/theme";
import { useColorScheme } from "@/hooks/use-color-scheme";
import { startEvents, stopEvents } from "@/services/device_events";
import { useEffect, useRef } from "react";
export default function TabLayout() {
const colorScheme = useColorScheme();
const segments = useSegments();
const prev = useRef<string | null>(null);
const currentSegment = segments[1] ?? segments[segments.length - 1] ?? null; // tuỳ cấu trúc của bạn
useEffect(() => {
if (prev.current !== currentSegment) {
// console.log("Tab changed ->", { from: prev.current, to: currentSegment });
// TODO: xử lý khi chuyển tab ở đây
if (prev.current === "(tabs)" && currentSegment !== "(tabs)") {
stopEvents();
// console.log("Stop events");
} else if (prev.current !== "(tabs)" && currentSegment === "(tabs)") {
// we came back into the tabs group — restart polling
startEvents();
// console.log("start events");
}
prev.current = currentSegment;
}
}, [currentSegment]);
return (
<Tabs

View File

@@ -9,7 +9,7 @@ export default function Warning() {
<SafeAreaView style={{ flex: 1 }}>
<View style={styles.container}>
<CreateOrUpdateHaulModal
haulData={null}
fishingLog={fishingLogData}
isVisible={isShowModal}
onClose={function (): void {
setIsShowModal(false);
@@ -54,105 +54,118 @@ const styles = StyleSheet.create({
},
});
const fishingInfoDatas: Model.FishingLogInfo[] = [
{
fish_species_id: 10,
fish_name: "Cá quỷ biển (Barracuda)",
catch_number: 820,
catch_unit: "kg",
fish_size: 29,
fish_rarity: 1,
fish_condition: "Bị thương",
gear_usage: "",
},
{
fish_species_id: 1,
fish_name: "Cá thu",
catch_number: 1293,
catch_unit: "kg",
fish_size: 37,
fish_rarity: 1,
fish_condition: "Bị thương",
gear_usage: "",
},
{
fish_species_id: 13,
fish_name: "Cá song đỏ",
catch_number: 1738,
catch_unit: "kg",
fish_size: 28,
fish_rarity: 2,
fish_condition: "Còn sống",
gear_usage: "",
},
{
fish_species_id: 17,
fish_name: "Cá nược",
catch_number: 690,
catch_unit: "kg",
fish_size: 63,
fish_rarity: 1,
fish_condition: "Chết",
gear_usage: "",
},
{
fish_species_id: 19,
fish_name: "Cá hổ Thái Lan",
catch_number: 825,
catch_unit: "kg",
fish_size: 55,
fish_rarity: 4,
fish_condition: "Chết",
gear_usage: "Câu tay",
},
{
fish_species_id: 8,
fish_name: "Cá hồng phớn",
catch_number: 1409,
catch_unit: "kg",
fish_size: 172,
fish_rarity: 3,
fish_condition: "Chết",
gear_usage: "Bẫy lưới",
},
{
fish_species_id: 16,
fish_name: "Cá rồng biển",
catch_number: 1426,
catch_unit: "kg",
fish_size: 105,
fish_rarity: 3,
fish_condition: "Chết",
gear_usage: "Lưới rê",
},
{
fish_species_id: 3,
fish_name: "Cá chim trắng",
catch_number: 176,
catch_unit: "kg",
fish_size: 83,
fish_rarity: 2,
fish_condition: "Chết",
gear_usage: "",
},
{
fish_species_id: 14,
fish_name: "Cá mú cườm",
catch_number: 724,
catch_unit: "kg",
fish_size: 36,
fish_rarity: 2,
fish_condition: "Chết",
gear_usage: "",
},
{
fish_species_id: 18,
fish_name: "Cá đuối quạt",
catch_number: 1712,
catch_unit: "kg",
fish_size: 105,
fish_rarity: 4,
fish_condition: "Còn sống",
gear_usage: "Câu vàng",
},
];
const fishingLogData:Model.FishingLog = {
fishing_log_id: "124b2701-a5d6-4eb0-ba3b-6789473c14a9",
trip_id: "d84caab6-ebb0-4cf7-abf9-31e5617d23b9",
start_at: "2025-11-07T10:50:01.693193764Z",
end_at: "2025-11-07T10:50:31.693027729Z",
start_lat: 11.59141,
start_lon: 109.0489,
haul_lat: 11.590274,
haul_lon: 109.049284,
status: 1,
weather_description: "Stormy",
info: [
{
fish_species_id: 8,
fish_name: "Cá hồng phớn",
catch_number: 1309,
catch_unit: "kg",
fish_size: 173,
fish_rarity: 3,
fish_condition: "Còn sống",
gear_usage: "Câu vàng",
},
{
fish_species_id: 18,
fish_name: "Cá đuối quạt",
catch_number: 731,
catch_unit: "kg",
fish_size: 16,
fish_rarity: 4,
fish_condition: "Chết",
gear_usage: "Bẫy lưới",
},
{
fish_species_id: 7,
fish_name: "Cá bơn vàng",
catch_number: 1224,
catch_unit: "kg",
fish_size: 12,
fish_rarity: 1,
fish_condition: "Chết",
gear_usage: "",
},
{
fish_species_id: 16,
fish_name: "Cá rồng biển",
catch_number: 838,
catch_unit: "kg",
fish_size: 164,
fish_rarity: 3,
fish_condition: "Chết",
gear_usage: "Lưới rê",
},
{
fish_species_id: 9,
fish_name: "Cá hổ Napoleon",
catch_number: 1410,
catch_unit: "kg",
fish_size: 104,
fish_rarity: 4,
fish_condition: "Bị thương",
gear_usage: "Câu vàng",
},
{
fish_species_id: 3,
fish_name: "Cá chim trắng",
catch_number: 1184,
catch_unit: "kg",
fish_size: 104,
fish_rarity: 2,
fish_condition: "Còn sống",
gear_usage: "",
},
{
fish_species_id: 5,
fish_name: "Cá mú đỏ",
catch_number: 987,
catch_unit: "kg",
fish_size: 171,
fish_rarity: 2,
fish_condition: "Bị thương",
gear_usage: "",
},
{
fish_species_id: 13,
fish_name: "Cá song đỏ",
catch_number: 1676,
catch_unit: "kg",
fish_size: 99,
fish_rarity: 2,
fish_condition: "Bị thương",
gear_usage: "",
},
{
fish_species_id: 11,
fish_name: "Cá ngừ đại dương",
catch_number: 462,
catch_unit: "kg",
fish_size: 11,
fish_rarity: 1,
fish_condition: "Bị thương",
gear_usage: "",
},
{
fish_species_id: 2,
fish_name: "Cá nục",
catch_number: 496,
catch_unit: "kg",
fish_size: 125,
fish_rarity: 1,
fish_condition: "Còn sống",
gear_usage: "",
},
],
sync: true,
};

View File

@@ -4,10 +4,27 @@ import { PolygonWithLabel } from "@/components/map/PolygonWithLabel";
import type { PolylineWithLabelProps } from "@/components/map/PolylineWithLabel";
import { PolylineWithLabel } from "@/components/map/PolylineWithLabel";
import SosButton from "@/components/map/SosButton";
import { ENTITY, IOS_PLATFORM, LIGHT_THEME } from "@/constants";
import {
ENTITY,
EVENT_ALARM_DATA,
EVENT_BANZONE_DATA,
EVENT_ENTITY_DATA,
EVENT_GPS_DATA,
EVENT_TRACK_POINTS_DATA,
IOS_PLATFORM,
LIGHT_THEME,
} from "@/constants";
import { useColorScheme } from "@/hooks/use-color-scheme.web";
import { usePlatform } from "@/hooks/use-platform";
import {
getAlarmEventBus,
getBanzonesEventBus,
getEntitiesEventBus,
getGpsEventBus,
getTrackPointsEventBus,
} from "@/services/device_events";
import { getShipIcon } from "@/services/map_service";
import eventBus from "@/utils/eventBus";
import {
convertWKTLineStringToLatLngArray,
convertWKTtoLatLngString,
@@ -39,74 +56,69 @@ export default function HomeScreen() {
const scale = useRef(new Animated.Value(0)).current;
const opacity = useRef(new Animated.Value(1)).current;
// console.log("Platform: ", platform);
// console.log("Theme: ", theme);
useEffect(() => {
getGpsEventBus();
getAlarmEventBus();
getEntitiesEventBus();
getBanzonesEventBus();
getTrackPointsEventBus();
const queryGpsData = (gpsData: Model.GPSResponse) => {
if (gpsData) {
// console.log("GPS Data: ", gpsData);
setGpsData(gpsData);
} else {
setGpsData(null);
setPolygonCoordinates([]);
setPolylineCoordinates(null);
}
};
const queryAlarmData = (alarmData: Model.AlarmResponse) => {
// console.log("Alarm Data: ", alarmData.alarms.length);
setAlarmData(alarmData);
};
const queryEntityData = (entityData: Model.TransformedEntity[]) => {
// console.log("Entities Length Data: ", entityData.length);
setEntityData(entityData);
};
const queryBanzonesData = (banzoneData: Model.Zone[]) => {
// console.log("Banzone Data: ", banzoneData.length);
// const [number, setNumber] = useState(0);
setBanzoneData(banzoneData);
};
const queryTrackPointsData = (TrackPointsData: Model.ShipTrackPoint[]) => {
// console.log("TrackPoints Data: ", TrackPointsData.length);
if (TrackPointsData && TrackPointsData.length > 0) {
setTrackPointsData(TrackPointsData);
} else {
setTrackPointsData(null);
}
};
// useEffect(() => {
// getGpsEventBus();
// getAlarmEventBus();
// getEntitiesEventBus();
// getBanzonesEventBus();
// getTrackPointsEventBus();
// const queryGpsData = (gpsData: Model.GPSResponse) => {
// if (gpsData) {
// // console.log("GPS Data: ", gpsData);
// setGpsData(gpsData);
// } else {
// setGpsData(null);
// setPolygonCoordinates([]);
// setPolylineCoordinates(null);
// }
// };
// const queryAlarmData = (alarmData: Model.AlarmResponse) => {
// // console.log("Alarm Data: ", alarmData.alarms.length);
// setAlarmData(alarmData);
// };
// const queryEntityData = (entityData: Model.TransformedEntity[]) => {
// // console.log("Entities Length Data: ", entityData.length);
// setEntityData(entityData);
// };
// const queryBanzonesData = (banzoneData: Model.Zone[]) => {
// // console.log("Banzone Data: ", banzoneData.length);
eventBus.on(EVENT_GPS_DATA, queryGpsData);
// console.log("Registering event handlers in HomeScreen");
eventBus.on(EVENT_GPS_DATA, queryGpsData);
// console.log("Subscribed to EVENT_GPS_DATA");
eventBus.on(EVENT_ALARM_DATA, queryAlarmData);
// console.log("Subscribed to EVENT_ALARM_DATA");
eventBus.on(EVENT_ENTITY_DATA, queryEntityData);
// console.log("Subscribed to EVENT_ENTITY_DATA");
eventBus.on(EVENT_TRACK_POINTS_DATA, queryTrackPointsData);
// console.log("Subscribed to EVENT_TRACK_POINTS_DATA");
eventBus.once(EVENT_BANZONE_DATA, queryBanzonesData);
// console.log("Subscribed once to EVENT_BANZONE_DATA");
// setBanzoneData(banzoneData);
// };
// const queryTrackPointsData = (TrackPointsData: Model.ShipTrackPoint[]) => {
// // console.log("TrackPoints Data: ", TrackPointsData.length);
// if (TrackPointsData && TrackPointsData.length > 0) {
// setTrackPointsData(TrackPointsData);
// } else {
// setTrackPointsData(null);
// }
// };
// eventBus.on(EVENT_GPS_DATA, queryGpsData);
// // console.log("Registering event handlers in HomeScreen");
// eventBus.on(EVENT_GPS_DATA, queryGpsData);
// // console.log("Subscribed to EVENT_GPS_DATA");
// eventBus.on(EVENT_ALARM_DATA, queryAlarmData);
// // console.log("Subscribed to EVENT_ALARM_DATA");
// eventBus.on(EVENT_ENTITY_DATA, queryEntityData);
// // console.log("Subscribed to EVENT_ENTITY_DATA");
// eventBus.on(EVENT_TRACK_POINTS_DATA, queryTrackPointsData);
// // console.log("Subscribed to EVENT_TRACK_POINTS_DATA");
// eventBus.once(EVENT_BANZONE_DATA, queryBanzonesData);
// // console.log("Subscribed once to EVENT_BANZONE_DATA");
// return () => {
// // console.log("Unregistering event handlers in HomeScreen");
// eventBus.off(EVENT_GPS_DATA, queryGpsData);
// // console.log("Unsubscribed EVENT_GPS_DATA");
// eventBus.off(EVENT_ALARM_DATA, queryAlarmData);
// // console.log("Unsubscribed EVENT_ALARM_DATA");
// eventBus.off(EVENT_ENTITY_DATA, queryEntityData);
// // console.log("Unsubscribed EVENT_ENTITY_DATA");
// eventBus.off(EVENT_TRACK_POINTS_DATA, queryTrackPointsData);
// // console.log("Unsubscribed EVENT_TRACK_POINTS_DATA");
// };
// }, []);
return () => {
// console.log("Unregistering event handlers in HomeScreen");
eventBus.off(EVENT_GPS_DATA, queryGpsData);
// console.log("Unsubscribed EVENT_GPS_DATA");
eventBus.off(EVENT_ALARM_DATA, queryAlarmData);
// console.log("Unsubscribed EVENT_ALARM_DATA");
eventBus.off(EVENT_ENTITY_DATA, queryEntityData);
// console.log("Unsubscribed EVENT_ENTITY_DATA");
eventBus.off(EVENT_TRACK_POINTS_DATA, queryTrackPointsData);
// console.log("Unsubscribed EVENT_TRACK_POINTS_DATA");
};
}, []);
useEffect(() => {
setPolylineCoordinates(null);
@@ -162,7 +174,7 @@ export default function HomeScreen() {
// foundPolygon = true;
const coordinates = convertWKTtoLatLngString(geom_poly || "");
if (coordinates.length > 0) {
console.log("Polygon Coordinate: ", coordinates);
// console.log("Polygon Coordinate: ", coordinates);
setPolygonCoordinates(
coordinates.map((polygon) => ({
coordinates: polygon.map((coord) => ({