Added in the ability to create new reports #7
@ -41,7 +41,7 @@ main form .formControl .selectDiv {
|
||||
transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
}
|
||||
|
||||
#addOwner.shown{
|
||||
#addOwner.shown {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
-webkit-transition: visibility 0s linear 0s, opacity 300ms;
|
||||
|
@ -0,0 +1,52 @@
|
||||
@import "nav.css";
|
||||
|
||||
main .formGroup {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: 2em;
|
||||
}
|
||||
|
||||
main form {
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
main form .formControl .selectDiv {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.formSpace {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
gap: 1em;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
|
||||
#addOwner, #addVehicle {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
-webkit-transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
-moz-transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
-ms-transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
-o-transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
transition: visibility 0s linear 300ms, opacity 300ms;
|
||||
}
|
||||
|
||||
#addOwner.shown, #addVehicle.shown {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
-webkit-transition: visibility 0s linear 0s, opacity 300ms;
|
||||
-moz-transition: visibility 0s linear 0s, opacity 300ms;
|
||||
-ms-transition: visibility 0s linear 0s, opacity 300ms;
|
||||
-o-transition: visibility 0s linear 0s, opacity 300ms;
|
||||
transition: visibility 0s linear 0s, opacity 300ms;
|
||||
}
|
@ -0,0 +1,17 @@
|
||||
<?php
|
||||
session_start();
|
||||
require_once 'config.php';
|
||||
header('Content-Type: application/json');
|
||||
|
||||
if (isset($_SESSION["username"]))
|
||||
{
|
||||
$conn = dbConn();
|
||||
$stmt = $conn->prepare("SELECT Offence_ID, Offence_description, Offence_maxFine FROM Offence");
|
||||
$stmt->execute();
|
||||
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
echo json_encode(array("message" => "ok", "offences" => $result));
|
||||
}
|
||||
else
|
||||
{
|
||||
echo json_encode(array("message" => "Not logged in "));
|
||||
}
|
@ -0,0 +1,17 @@
|
||||
<?php
|
||||
session_start();
|
||||
require_once 'config.php';
|
||||
header('Content-Type: application/json');
|
||||
|
||||
if (isset($_SESSION["username"]))
|
||||
{
|
||||
$conn = dbConn();
|
||||
$stmt = $conn->prepare("SELECT Vehicle_ID, Vehicle_type, Vehicle_licence FROM Vehicle");
|
||||
$stmt->execute();
|
||||
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
echo json_encode(array("message" => "ok", "vehicles" => $result));
|
||||
}
|
||||
else
|
||||
{
|
||||
echo json_encode(array("message" => "Not logged in "));
|
||||
}
|
@ -0,0 +1,136 @@
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () =>
|
||||
{
|
||||
fetch("getOwners.php").then(res => res.json().then(json =>
|
||||
{
|
||||
if(json.message === "ok")
|
||||
{
|
||||
let body = "";
|
||||
for (const owner of json.owners)
|
||||
{
|
||||
body += `<option value="${owner.People_ID}">${owner.People_name} - ${owner.People_licence}</option>`;
|
||||
}
|
||||
body += `<option value="new">New Owner</option>`;
|
||||
document.querySelector("#owner").innerHTML = body;
|
||||
}
|
||||
}));
|
||||
|
||||
fetch("getVehicles.php").then(res => res.json().then(json =>
|
||||
{
|
||||
if (json.message === "ok")
|
||||
{
|
||||
let body = "";
|
||||
for (const owner of json.vehicles)
|
||||
{
|
||||
body += `<option value="${owner.Vehicle_ID}">${owner.Vehicle_type} - ${owner.Vehicle_licence}</option>`;
|
||||
}
|
||||
body += `<option value="new">New Vehicle</option>`;
|
||||
document.querySelector("#vehicle").innerHTML = body;
|
||||
}
|
||||
}));
|
||||
|
||||
|
||||
fetch("getOffences.php").then(res => res.json().then(json =>
|
||||
{
|
||||
if (json.message === "ok")
|
||||
{
|
||||
let body = "";
|
||||
for (const owner of json.offences)
|
||||
{
|
||||
body += `<option value="${owner.Offence_ID}">${owner.Offence_description} - ${owner.Offence_maxFine}</option>`;
|
||||
}
|
||||
body += `<option value="new">New Vehicle</option>`;
|
||||
document.querySelector("#offence").innerHTML = body;
|
||||
}
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
document.querySelector("#owner").addEventListener("change", e =>
|
||||
{
|
||||
let inputs = document.querySelectorAll("#addOwner input");
|
||||
if (e.target.value === "new")
|
||||
{
|
||||
document.querySelector("#addOwner").classList.add("shown");
|
||||
for (const input of inputs)
|
||||
{
|
||||
input.setAttribute("required", "");
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
document.querySelector("#addOwner").classList.remove("shown");
|
||||
for (const input of inputs)
|
||||
{
|
||||
input.removeAttribute("required");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector("#vehicle").addEventListener("change", e =>
|
||||
{
|
||||
let inputs = document.querySelectorAll("#addVehicle input");
|
||||
if (e.target.value === "new")
|
||||
{
|
||||
document.querySelector("#addVehicle").classList.add("shown");
|
||||
for (const input of inputs)
|
||||
{
|
||||
input.setAttribute("required", "");
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
document.querySelector("#addVehicle").classList.remove("shown");
|
||||
for (const input of inputs)
|
||||
{
|
||||
input.removeAttribute("required");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector("#reports").addEventListener("click", e =>
|
||||
{
|
||||
e.preventDefault();
|
||||
let formData = new FormData();
|
||||
formData.append("incidentReport", document.querySelector("#incidentReport").value);
|
||||
formData.append("incidentDate", document.querySelector("#incidentDate").value);
|
||||
if (document.querySelector("#owner").value === "new")
|
||||
{
|
||||
formData.append("name", document.querySelector("#name").value);
|
||||
formData.append("address", document.querySelector("#address").value);
|
||||
formData.append("licence", document.querySelector("#licence").value);
|
||||
}
|
||||
else
|
||||
{
|
||||
formData.append("peopleID", document.querySelector("#owner").value);
|
||||
}
|
||||
|
||||
if (document.querySelector("#vehicle").value === "new")
|
||||
{
|
||||
formData.append("type", document.querySelector("#type").value);
|
||||
formData.append("colour", document.querySelector("#colour").value);
|
||||
formData.append("plateNumber", document.querySelector("#plateNum").value);
|
||||
}
|
||||
else
|
||||
{
|
||||
formData.append("vehicleID", document.querySelector("#vehicle").value);
|
||||
}
|
||||
formData.append("offenceID", document.querySelector("#offence").value);
|
||||
|
||||
fetch("newReport.php",{
|
||||
method: "POST",
|
||||
body: formData
|
||||
}).then(res => res.json().then(json =>
|
||||
{
|
||||
if (json.message === "ok")
|
||||
{
|
||||
alert("Report added");
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("Error adding report");
|
||||
}
|
||||
}));
|
||||
|
||||
|
||||
});
|
@ -1,10 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,57 @@
|
||||
<?php
|
||||
session_start();
|
||||
require_once 'config.php';
|
||||
header('Content-Type: application/json');
|
||||
if (isset($_SESSION["username"]))
|
||||
{
|
||||
$conn = dbConn();
|
||||
$incidentReport = $_POST["incidentReport"];
|
||||
$incidentDate = $_POST["incidentDate"];
|
||||
$peopleID = $_POST["peopleID"];
|
||||
$vehicleID = $_POST["vehicleID"];
|
||||
$offenceID = $_POST["offenceID"];
|
||||
|
||||
if (isset($_POST["type"]) && isset($_POST["colour"]) && isset($_POST["plateNum"]))
|
||||
{
|
||||
$stmt = $conn->prepare("INSERT INTO Vehicle (Vehicle_type, Vehicle_colour, Vehicle_licence) VALUES (:type, :colour, :plateNum)");
|
||||
$stmt->bindParam(":type", $_POST["type"]);
|
||||
$stmt->bindParam(":colour", $_POST["colour"]);
|
||||
$stmt->bindParam(":plateNum", $_POST["plateNum"]);
|
||||
$stmt->execute();
|
||||
$vehicleID = $conn->lastInsertId();
|
||||
}
|
||||
|
||||
if (isset($_POST["name"]) && isset($_POST["address"]) && isset($_POST["licence"]))
|
||||
{
|
||||
$stmtPeople = $conn->prepare("INSERT INTO People (People_name, People_address, People_licence) VALUES (:name, :address, :licence)");
|
||||
$stmtPeople->bindParam(":name", $_POST["name"]);
|
||||
$stmtPeople->bindParam(":address", $_POST["address"]);
|
||||
$stmtPeople->bindParam(":licence", $_POST["licence"]);
|
||||
$stmtPeople->execute();
|
||||
$peopleID = $conn->lastInsertId();
|
||||
}
|
||||
|
||||
$stmtOwner = $conn->prepare("INSERT INTO Ownership (Vehicle_ID, People_ID) VALUES (:vehicleID, :peopleID)");
|
||||
$stmtOwner->bindParam(":vehicleID", $vehicleID);
|
||||
$stmtOwner->bindParam(":peopleID", $peopleID);
|
||||
$stmtOwner->execute();
|
||||
|
||||
$stmt = $conn->prepare("INSERT INTO Incident (Incident_report, Incident_date, People_ID, Vehicle_ID, Offence_ID) VALUES (:incidentReport, :incidentDate, :peopleID, :vehicleID, :offenceID)");
|
||||
$stmt->bindParam(":incidentReport", $incidentReport);
|
||||
$stmt->bindParam(":incidentDate", $incidentDate);
|
||||
$stmt->bindParam(":peopleID", $peopleID);
|
||||
$stmt->bindParam(":vehicleID", $vehicleID);
|
||||
$stmt->bindParam(":offenceID", $offenceID);
|
||||
$stmt->execute();
|
||||
|
||||
$logSQL = "INSERT INTO Logs (Logs_type, Users_username, Logs_date) VALUES ('Add Report', :username, NOW())";
|
||||
$logStmt = $conn->prepare($logSQL);
|
||||
$logStmt->bindParam(":username", $_SESSION["username"]);
|
||||
$logStmt->execute();
|
||||
|
||||
echo json_encode(array("message" => "ok"));
|
||||
}
|
||||
else
|
||||
{
|
||||
echo json_encode(array("message" => "Not logged in"));
|
||||
}
|
@ -0,0 +1,112 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Reports</title>
|
||||
<link rel="stylesheet" href="css/reports.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="search.html" class="btn">Search</a></li>
|
||||
<li><a href="addVehicle.html" class="btn">Add new vehicle</a></li>
|
||||
<li><a href="reports.html" class="btn active">Reports</a></li>
|
||||
<li class="admin"><a href="newUser.html" class="btn">Create new user</a></li>
|
||||
<li class="admin"><a href="addFine.html" class="btn">Add Fines</a></li>
|
||||
<li class="admin"><a href="viewLog.html" class="btn">View log</a></li>
|
||||
<li><a href="changePassword.html" class="btn">Change password</a></li>
|
||||
<li><a id="logout" class="btn">Logout</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<header id="title">
|
||||
<h1></h1>
|
||||
</header>
|
||||
|
||||
<form>
|
||||
<div class="formGroup">
|
||||
<div class="formSpace">
|
||||
|
||||
<div class="formControl">
|
||||
<label for="type">Incident Report</label>
|
||||
<input type="text" name="type" id="incidentReport" required>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="colour">Incident Date</label>
|
||||
<input type="date" name="colour" id="incidentDate" required>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="owner">Owner</label>
|
||||
<div class="selectDiv">
|
||||
<select name="owner" id="owner" required>
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="vehicle">Vehicle</label>
|
||||
<div class="selectDiv">
|
||||
<select name="owner" id="vehicle" required>
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="offence">Offence</label>
|
||||
<div class="selectDiv">
|
||||
<select name="owner" id="offence" required>
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="submit" id="reports" value="Add new report" class="btn btnPrimary">
|
||||
</div>
|
||||
|
||||
<div class="formSpace" id="addOwner">
|
||||
<div class="formControl">
|
||||
<label for="name">Name</label>
|
||||
<input type="text" name="name" id="name">
|
||||
</div>
|
||||
<div class="formControl">
|
||||
<label for="address">Address</label>
|
||||
<input type="text" name="address" id="address">
|
||||
</div>
|
||||
<div class="formControl">
|
||||
<label for="licence">Licence number</label>
|
||||
<input type="text" name="licence" id="licence" maxlength="16" max="16">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="formSpace" id="addVehicle">
|
||||
|
||||
<div class="formControl">
|
||||
<label for="type">Type</label>
|
||||
<input type="text" name="type" id="type" required>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="colour">Colour</label>
|
||||
<input type="text" name="colour" id="colour" required>
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="plateNum">Plate Number</label>
|
||||
<input type="text" name="plateNum" id="plateNum" required>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</main>
|
||||
|
||||
<script src="js/checkUser.js"></script>
|
||||
<script src="js/reports.js"></script>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user