Files
FE-DEVICE-SGW/src/pages/Trip/components/CreateNewHaulOrTrip.tsx
2025-09-29 15:05:51 +07:00

139 lines
3.8 KiB
TypeScript

import { STATUS } from '@/constants/enums';
import { getGPS } from '@/services/controller/DeviceController';
import {
startNewHaul,
updateTripState,
} from '@/services/controller/TripController';
import { PlusOutlined } from '@ant-design/icons';
import { useModel } from '@umijs/max';
import { Button, Grid, message, theme } from 'antd';
import { useState } from 'react';
import CreateOrUpdateFishingLog from './CreateOrUpdateFishingLog';
interface CreateNewHaulOrTripProps {
trips?: API.Trip;
onCallBack?: (success: string) => void;
}
const CreateNewHaulOrTrip: React.FC<CreateNewHaulOrTripProps> = ({
trips,
onCallBack,
}) => {
const [isFinishHaulModalOpen, setIsFinishHaulModalOpen] = useState(false);
const { token } = theme.useToken();
const { getApi } = useModel('getTrip');
const checkHaulFinished = () => {
return trips?.fishing_logs?.some((h) => h.status === 0);
};
const { useBreakpoint } = Grid;
const screens = useBreakpoint();
const createNewHaul = async () => {
if (trips?.fishing_logs?.some((f) => f.status === 0)) {
message.warning(
'Vui lòng kết thúc mẻ lưới hiện tại trước khi bắt đầu mẻ mới',
);
return;
}
try {
const gpsData = await getGPS();
console.log('GPS Data:', gpsData);
const body: API.NewFishingLogRequest = {
trip_id: trips?.id || '',
start_at: new Date(),
start_lat: gpsData.lat,
start_lon: gpsData.lon,
weather_description: 'Nắng đẹp',
};
const resp = await startNewHaul(body);
onCallBack?.(STATUS.CREATE_FISHING_LOG_SUCCESS);
getApi();
} catch (error) {
console.log(error);
onCallBack?.(STATUS.CREATE_FISHING_LOG_FAIL);
}
};
const handleStartTrip = async (state: number, note?: string) => {
if (trips?.trip_status !== 2) {
message.warning('Chuyến đi đã được bắt đầu hoặc hoàn thành.');
return;
}
try {
const resp = await updateTripState({ status: state, note: note || '' });
onCallBack?.(STATUS.START_TRIP_SUCCESS);
getApi();
} catch (error) {
console.error('Error stating trip :', error);
onCallBack?.(STATUS.START_TRIP_FAIL);
}
};
// Không render gì nếu trip đã hoàn thành hoặc bị hủy
if (trips?.trip_status === 4 || trips?.trip_status === 5) {
return null;
}
return (
<div style={{
padding: screens.sm ? '0px': '10px',
marginRight: screens.sm ? '24px': '0px',
}}>
{trips?.trip_status === 2 ? (
<Button
color="green"
variant="solid"
onClick={async () => handleStartTrip(3)}
>
Bắt đu chuyến đi
</Button>
) : checkHaulFinished() ? (
<Button
key="button"
icon={<PlusOutlined />}
onClick={async () => {
setIsFinishHaulModalOpen(true);
}}
color="geekblue"
variant="solid"
>
Kết thúc mẻ lưới
</Button>
) : (
<Button
key="button"
icon={<PlusOutlined />}
onClick={async () => {
createNewHaul();
}}
color="cyan"
variant="solid"
>
Bắt đu mẻ lưới
</Button>
)}
<CreateOrUpdateFishingLog
trip={trips!}
isFinished={false}
fishingLogs={undefined}
isOpen={isFinishHaulModalOpen}
onOpenChange={setIsFinishHaulModalOpen}
onFinished={(success) => {
if (success) {
onCallBack?.(STATUS.UPDATE_FISHING_LOG_SUCCESS);
getApi();
} else {
onCallBack?.(STATUS.UPDATE_FISHING_LOG_FAIL);
}
}}
/>
</div>
);
};
export default CreateNewHaulOrTrip;