Sujet type bac pratique STI n°2 : le covoiturage des étudiants

Partie A : création de la base de données (6 pts)

Le site utilise une base de données décrite par la représentation textuelle suivante :

• conducteur (tel, nom, ville)
• trajet (idTrajet, depart, arrivee, dateTrajet, places, prix, #tel)
• reservation (idRes, #idTrajet, passager, nbPlaces)

Description des champs :

• tel : chaîne de 8 caractères, le numéro de téléphone qui identifie un conducteur ; idTrajet et idRes : entiers auto-incrémentés, identifiants ; tous les autres champs sont obligatoires.
• nom et passager : chaînes de 40 caractères ; ville, depart et arrivee : chaînes de 20 caractères ; dateTrajet : date ; dans trajet, tel désigne le conducteur du trajet.
• places : entier, nombre de places proposées, au plus 4 ; prix : entier en dinars, strictement positif ; nbPlaces : entier strictement positif, nombre de places réservées.

Lignes à insérer :

• conducteur : (22445566, Yassine Gharbi, Sousse), (98123123, Amel Kefi, Tunis) ;
• trajet : (Sousse, Tunis, 2026-05-04, 3, 12, 22445566), (Tunis, Sfax, 2026-05-06, 4, 20, 98123123), (Sousse, Monastir, 2026-05-07, 2, 5, 22445566) ;
• reservation : (1, Rim, 2), (2, Omar, 1), (1, Lina, 1), (2, Hedi, 2).

• 1) Créer la base de données covoiturage, ses tables et leurs relations, puis insérer les lignes données (4 pts).
• 2) Écrire la requête qui affiche, pour chaque trajet réservé, sa ville de départ, sa ville d'arrivée, le nom de son conducteur et le nombre de places réservées, par numéro de trajet (2 pts).

Partie B : création des documents web (14 pts)

Consignes : toutes les fonctions JavaScript sont enregistrées dans mesControles.js ; toutes les règles CSS sont dans le fichier mesStyles.css, donné ci-dessous ; toutes les pages HTML sont reliées à mesStyles.css, et trajet.html est aussi reliée à mesControles.js. Le bouton « Annuler » d'un formulaire efface ses champs.

body { font-family: Verdana, sans-serif; margin: 0; background-color: #fdfefe; }
header { background-color: #117a65; color: white; text-align: center; padding: 8px; }
nav { width: 19%; display: inline-block; }
section { width: 59%; display: inline-block; }
aside { width: 19%; display: inline-block; }
footer { text-align: center; font-size: 12px; }
iframe { width: 100%; height: 420px; border: none; }

• 1) Créer la page index.html reliée à mesStyles.css : un élément <header> contient le titre de niveau 1 « Covoiturage étudiant » ; un élément <nav> contient une liste de deux liens, « Proposer un trajet » vers trajet.html et « Réserver » vers reserver.html, qui s'ouvrent dans le cadre contenu ; un élément <section> contient le cadre (iframe) de nom contenu, qui affiche par défaut trajet.html ; un élément <aside> contient l'image voiture.png ; un élément <footer> contient le numéro de l'association 71 000 222 (3 pts).
• 2) Créer la page trajet.html, reliée à mesStyles.css et à mesControles.js, avec un formulaire qui envoie ses champs à ajoutTrajet.php par la méthode POST et appelle verifier() avant l'envoi : le téléphone du conducteur (tel), la ville de départ (liste depart) et la ville d'arrivée (liste arrivee), chacune avec les choix Tunis, Sousse, Sfax et Monastir, la date (dateTrajet, de type date), le nombre de places (places, nombre de 1 à 4), le prix (prix), et les boutons « Proposer » et « Annuler » (3 pts).
• 3) Écrire dans mesControles.js la fonction telValide(tel), vraie si tel a exactement 8 chiffres et commence par 2, 4, 5 ou 9, et la fonction villesDifferentes(d, a), vraie si les deux villes ne sont pas les mêmes ; puis la fonction verifier() qui affiche un message (alert) et renvoie false si le téléphone n'est pas valide ou si les deux villes sont les mêmes (4 pts).
• 4) Écrire la page ajoutTrajet.php, qui travaille sur la base de la partie A (connexion dans connexion.php, donné) : si aucun conducteur n'a le téléphone reçu, elle affiche « Conducteur inconnu » ; sinon, si le nombre de places n'est pas entre 1 et 4, « Nombre de places invalide » ; sinon elle ajoute le trajet de ce conducteur et affiche « Trajet n°4 ajouté » avec son identifiant (4 pts).

<?php
$cnx = mysqli_connect("localhost", "root", "", "covoiturage");
?>

Pour essayer la page PHP sans la partie A, voici la base sur laquelle elle est vérifiée (les colonnes des tables, sans leurs contraintes) :

CREATE DATABASE covoiturage;
USE covoiturage;
CREATE TABLE conducteur (tel CHAR(8) PRIMARY KEY, nom VARCHAR(40), ville VARCHAR(20));
CREATE TABLE trajet (idTrajet INT AUTO_INCREMENT PRIMARY KEY, depart VARCHAR(20), arrivee VARCHAR(20), dateTrajet DATE, places INT, prix INT, tel CHAR(8));
INSERT INTO conducteur VALUES ('22445566', 'Yassine Gharbi', 'Sousse'), ('98123123', 'Amel Kefi', 'Tunis');
INSERT INTO trajet (depart, arrivee, dateTrajet, places, prix, tel) VALUES ('Sousse', 'Tunis', '2026-05-04', 3, 12, '22445566'), ('Tunis', 'Sfax', '2026-05-06', 4, 20, '98123123'), ('Sousse', 'Monastir', '2026-05-07', 2, 5, '22445566');