Skip to content
Snippets Groups Projects
Commit 3b0c70ca authored by YAHYAOUI Firas's avatar YAHYAOUI Firas
Browse files

Merge branch 'dev/client' into 'main'

add: fetch and display waiting time for a stop

See merge request !9
parents 9bbe0f9a cf3363d1
No related branches found
No related tags found
1 merge request!9add: fetch and display waiting time for a stop
Pipeline #19969 passed
......@@ -81,7 +81,10 @@ const FormArretProche = () => {
className="mt-1"
variant="primary"
type="reset"
onClick={() => setShowResult(false)}
onClick={() => {
setFilter("");
setShowResult(false);
}}
>
Clear
</Button>
......
......@@ -47,7 +47,10 @@ const FormArret = () => {
className="mt-1"
variant="primary"
type="reset"
onClick={() => setShowResult(false)}
onClick={() => {
setFilter("");
setShowResult(false);
}}
>
Clear
</Button>
......
import { useQuery } from "@tanstack/react-query";
import { getWaitingTime } from "../../utils";
import { useState } from "react";
import { Button, Col, Form, Spinner } from "react-bootstrap";
const FormWaitingTime = () => {
const [showResult, setShowResult] = useState(false);
const [codeArret, setCodeArret] = useState("HBLI");
const { isPending, isError, error, data } = useQuery({
queryKey: ["tempsAttente", { codeArret }],
enabled: showResult,
queryFn: async () => getWaitingTime(codeArret),
});
return (
<>
<Form
onSubmit={(e) => {
e.preventDefault();
setShowResult(true);
}}
>
<h1>Temps d'attente par rapport à un arrêt</h1>
<Col xs={4}>
<Form.Group className="mb-3" controlId="formCodeArret">
<Form.Label>Code Arrêt</Form.Label>
<Form.Control
type="text"
defaultValue="HBLI"
onChange={(e) => setCodeArret(e.target.value)}
required
/>
</Form.Group>
</Col>
<Button className="mt-1" variant="primary" type="submit">
Submit
</Button>
<Button
className="mt-1"
variant="primary"
type="reset"
onClick={() => setShowResult(false)}
>
Clear
</Button>
</Form>
{!showResult ? (
<></>
) : isPending ? (
<Spinner animation="border" role="status">
<span className="visually-hidden">Loading...</span>
</Spinner>
) : isError ? (
<p>
An error has occured: {error.name} - {error.message}
</p>
) : (
<Col md={4} className="mt-3">
{data.map((time) => (
<p key={time.id}>
Ligne: {time.ligne.numLigne} - Sens: {time.sens} - Temps: {time.temps}
</p>
))}
</Col>
)}
</>
);
};
export default FormWaitingTime;
import { Col, Container, Form, Row } from "react-bootstrap";
import { Container, Row } from "react-bootstrap";
import FormArret from "./Forms/Form-Arret";
import FormArretProche from "./Forms/Form-Arret-Proche";
import FormHoraire from "./Forms/Form-Horaire";
import FormWaitingTime from "./Forms/Form-Waiting-Time";
type FormulaireProps = {
selection: number;
......@@ -17,17 +18,7 @@ const Formulaire = ({ selection }: FormulaireProps) => {
case 2:
return <FormHoraire />;
case 3:
return (
<>
<h1>Temps d'attente par rapport à un arrêt</h1>
<Col xs={4}>
<Form.Group className="mb-3" controlId="formCodeArret">
<Form.Label>Code Arrêt</Form.Label>
<Form.Control type="text" defaultValue="HBLI" required />
</Form.Group>
</Col>
</>
);
return <FormWaitingTime />;
default:
return <div>{selection}</div>;
}
......
......@@ -13,7 +13,7 @@ const Sidebar = ({ setSelection }: SidebarProps) => {
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="flex-row">
<NavDropdown
title="Temps d'attente"
title="Arrêts"
id="temps-dattente-dropdown"
className="flex-column"
>
......
export type Horaire = {
"ligne": {
"numLigne": string,
"typeligne": 0,
"typeligne": number,
"directionSens1": string,
"directionSens2": string,
"accessible": string,
"etatTrafic": 0
"etatTrafic": number
},
"arret": {
"codeArret": string,
"libelle": string,
"accessible": true
"accessible": boolean
},
"codeCouleur": string,
"notes": [
......
export type RemainingTime = {
id: number,
"sens": number,
"terminus": string,
"infotrafic": boolean,
"temps": string,
"dernierDepart": string,
"tempsReel": string,
"ligne": {
"numLigne": string,
"typeLigne": number
},
"arret": {
"codeArret": string
}
}
\ No newline at end of file
import axios from "axios";
import { Arret } from "./models/Arret.model";
import { Horaire } from "./models/Horaire.model";
import { RemainingTime } from "./models/RemainingTime.model";
const URL = `https://hackathon-login.osc-fr1.scalingo.io`;
......@@ -39,3 +40,8 @@ export const getHoraires = async (codeArret: string, numLigne: string, sense: "1
const result = await axios.get<Horaire>(`${URL}/get_timetable_by_date/${codeArret}/${numLigne}/${sense}/${date}`);
return result.data;
}
export const getWaitingTime = async (codeArret: string) => {
const result = await axios.get<Omit<RemainingTime, "id">[]>(`${URL}/get_waitingtime_by_station/${codeArret}`);
return result.data.map((time, i) => { return { ...time, id: i } as RemainingTime });
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment