fix:memperbaiki pesan kesalahan saat menginputan

This commit is contained in:
muhamad fais aizat 2025-05-08 10:35:08 +07:00
parent 89ce77b631
commit fddd8bb413
2 changed files with 99 additions and 15 deletions

View File

@ -10,7 +10,7 @@ import BgTomat from '../../assets/bg-tomat.png'
const LandingPage = () => { const LandingPage = () => {
const [date, setDate] = useState(null); const [date, setDate] = useState(null);
const [dataYAxis, setDataYAxis] = useState([11000, 15000]); const [dataYAxis, setDataYAxis] = useState([11000, 15000]);
const [priceType, setPriceType] = useState("all"); const [priceType, setPriceType] = useState("");
const [chartData, setChartData] = useState([]); const [chartData, setChartData] = useState([]);
const [tabelDataAktual, setTabelDataAktual] = useState([]); const [tabelDataAktual, setTabelDataAktual] = useState([]);
const [tabelDataPredict, setTabelDataPredict] = useState([]); const [tabelDataPredict, setTabelDataPredict] = useState([]);
@ -35,8 +35,20 @@ const LandingPage = () => {
<div className=' border rounded-[20px] bg-[#ffffff81] px-[10px] py-[10px]'> <div className=' border rounded-[20px] bg-[#ffffff81] px-[10px] py-[10px]'>
<ScrollArea> <ScrollArea>
<div className='flex gap-[20px] rounded-[18px] bg-white px-[30px] py-[10px]'> <div className='flex gap-[20px] rounded-[18px] bg-white px-[30px] py-[10px]'>
{priceType === "all" && (
<>
{tabelDataAktual.length > 0 && <TableAktual tabelDataAktual={tabelDataAktual} />} {tabelDataAktual.length > 0 && <TableAktual tabelDataAktual={tabelDataAktual} />}
{tabelDataPredict.length > 0 && <TablePrediksi tabelDataPredict={tabelDataPredict} />} {tabelDataPredict.length > 0 && <TablePrediksi tabelDataPredict={tabelDataPredict} />}
</>
)}
{priceType === "actual" && tabelDataAktual.length > 0 && (
<TableAktual tabelDataAktual={tabelDataAktual} />
)}
{priceType === "predicted" && tabelDataPredict.length > 0 && (
<TablePrediksi tabelDataPredict={tabelDataPredict} />
)}
</div> </div>
<ScrollBar orientation="horizontal" /> <ScrollBar orientation="horizontal" />
</ScrollArea> </ScrollArea>

View File

@ -46,9 +46,10 @@ const ViewGrafik = ({ date, setDate, dataYAxis, setDataYAxis, priceType, setPric
const [dateTerlama, setDateTerlama] = useState(null); const [dateTerlama, setDateTerlama] = useState(null);
const oldestDate = dateTerlama ? parseISO(dateTerlama) : null; const oldestDate = dateTerlama ? parseISO(dateTerlama) : null;
const latestDate = dateTerbaru ? parseISO(dateTerbaru) : null; const latestDate = dateTerbaru ? parseISO(dateTerbaru) : null;
const [tempPriceType, setTempPriceType] = useState("");
const handleDateChange = (selectedDate) => setDate(selectedDate); const handleDateChange = (selectedDate) => setDate(selectedDate);
const handlePriceTypeChange = (value) => setPriceType(value); const handlePriceTypeChange = (value) => setTempPriceType(value);
const fetchDataDate = async () => { const fetchDataDate = async () => {
try { try {
@ -67,8 +68,32 @@ const ViewGrafik = ({ date, setDate, dataYAxis, setDataYAxis, priceType, setPric
}, []); }, []);
const fetchData = async () => { const fetchData = async () => {
const formattedDate = format(date, "yyyy-MM-dd");
if (!date && !tempPriceType) {
setTabelDataAktual([]);
setTabelDataPredict([]);
setPriceType("");
setChartData([]);
setDataYAxis([11000, 15000]);
toast({
description: "tanggal dan harga harus di isi!",
variant: "destructive",
});
return;
}
if (!date) { if (!date) {
setTabelDataAktual([]);
setTabelDataPredict([]);
setPriceType("");
setChartData([]);
setDataYAxis([11000, 15000]);
toast({ toast({
description: "Pilih tanggal terlebih dahulu!", description: "Pilih tanggal terlebih dahulu!",
variant: "destructive", variant: "destructive",
@ -76,16 +101,63 @@ const ViewGrafik = ({ date, setDate, dataYAxis, setDataYAxis, priceType, setPric
return; return;
} }
const formattedDate = format(date, "yyyy-MM-dd");
if (formattedDate==dateTerbaru && tempPriceType=="all") {
setTabelDataAktual([]);
setTabelDataPredict([]);
setPriceType("");
setChartData([]);
setDataYAxis([11000, 15000]);
toast({
description: "tanggal ini hanya ada data prediksi",
variant: "destructive",
});
return;
}
if (formattedDate==dateTerbaru && tempPriceType=="actual") {
setTabelDataAktual([]);
setTabelDataPredict([]);
setPriceType("");
setChartData([]);
setDataYAxis([11000, 15000]);
toast({
description: "tanggal ini hanya ada data prediksi",
variant: "destructive",
});
return;
}
if (!tempPriceType) {
setTabelDataAktual([]);
setTabelDataPredict([]);
setPriceType("");
setChartData([]);
setDataYAxis([11000, 15000]);
toast({
description: "Pilih harga terlebih dahulu!",
variant: "destructive",
});
return;
}
try { try {
const response = await axios.get(`${API_URL}/predict/history?tanggal=${formattedDate}&data_type=${priceType}`); const response = await axios.get(`${API_URL}/predict/history?tanggal=${formattedDate}&data_type=${tempPriceType}`);
const formattedData = response.data.dataGrafik.map(item => ({ const formattedData = response.data.dataGrafik.map(item => ({
date: item.tanggal, date: item.tanggal,
actual: item.harga_aktual, actual: item.harga_aktual,
predicted: item.harga_prediksi predicted: item.harga_prediksi
})); }));
setPriceType(tempPriceType);
setDataYAxis(response.data.YAxis); setDataYAxis(response.data.YAxis);
setChartData(formattedData); setChartData(formattedData);
setTabelDataAktual(response.data.dataTableAktual); setTabelDataAktual(response.data.dataTableAktual);