83 lines
2.1 KiB
TypeScript
83 lines
2.1 KiB
TypeScript
import { useEffect, useState } from "react";
|
|
import CustomTable, { Column } from "../../components/CustomTable/customTable";
|
|
import { useDispatch, useSelector } from "react-redux";
|
|
import { RootState, AppDispatch } from "../../redux/store/store";
|
|
|
|
import {
|
|
fetchAvailableSlots,
|
|
|
|
} from "../../redux/slices/slotSlice";
|
|
import dayjs from "dayjs";
|
|
|
|
export default function EVSlotList() {
|
|
|
|
|
|
const dispatch = useDispatch<AppDispatch>();
|
|
const availableSlots = useSelector(
|
|
(state: RootState) => state?.slotReducer.availableSlots
|
|
);
|
|
|
|
useEffect(() => {
|
|
dispatch(fetchAvailableSlots());
|
|
}, [dispatch]);
|
|
|
|
console.log("first", availableSlots);
|
|
|
|
const slotColumns: Column[] = [
|
|
{ id: "srno", label: "Sr No" },
|
|
{ id: "name", label: "Station Name" },
|
|
{ id: "stationId", label: "Station Id" },
|
|
{ id: "date", label: "Date" },
|
|
{ id: "startTime", label: "Start Time" },
|
|
{ id: "endTime", label: "End Time" },
|
|
{ id: "isAvailable", label: "Is Available", align: "center" },
|
|
|
|
];
|
|
|
|
const slotRows = availableSlots?.length
|
|
? availableSlots.map((slot, index) => {
|
|
// const formattedDate = dayjs(slot?.date).format("YYYY-MM-DD");
|
|
// const startTime = dayjs(
|
|
// slot?.startTime,
|
|
// "YYYY-MM-DD hh:mm A"
|
|
// ).isValid()
|
|
// ? dayjs(slot?.startTime, "YYYY-MM-DD hh:mm A").format(
|
|
// "hh:mm A"
|
|
// )
|
|
// : "Invalid";
|
|
|
|
// const endTime = dayjs(
|
|
// slot?.endTime,
|
|
// "YYYY-MM-DD hh:mm A"
|
|
// ).isValid()
|
|
// ? dayjs(slot?.endTime, "YYYY-MM-DD hh:mm A").format(
|
|
// "hh:mm A"
|
|
// )
|
|
// : "Invalid";
|
|
|
|
return {
|
|
srno: index + 1,
|
|
id: slot?.id ?? "NA",
|
|
stationId: slot?.stationId ?? "NA",
|
|
name: slot?.ChargingStation?.name ?? "NA",
|
|
date: slot?.date ?? "NA",
|
|
startTime: slot?.startTime ?? "NA",
|
|
endTime: slot?.endTime ?? "NA",
|
|
isAvailable: slot?.isAvailable ? "Yes" : "No",
|
|
};
|
|
})
|
|
: [];
|
|
|
|
return (
|
|
<>
|
|
<CustomTable
|
|
columns={slotColumns}
|
|
rows={slotRows}
|
|
tableType="all-available-slots"
|
|
|
|
/>
|
|
|
|
</>
|
|
);
|
|
}
|