Compare commits
2 Commits
0235886d60
...
5a71f98a9a
| Author | SHA1 | Date | |
|---|---|---|---|
| 5a71f98a9a | |||
| 996fee5ad2 |
@ -0,0 +1,41 @@
|
|||||||
|
<?php
|
||||||
|
session_start();
|
||||||
|
require_once 'config.php';
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
if (isset($_SESSION["username"]))
|
||||||
|
{
|
||||||
|
$conn = dbConn();
|
||||||
|
$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();
|
||||||
|
echo json_encode(array("message" => "Vehicle and new owner added successfully"));
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
$stmt = $conn->prepare("INSERT INTO Ownership (Vehicle_ID, People_ID) VALUES (:vehicleID, :peopleID)");
|
||||||
|
$stmt->bindParam(":vehicleID", $vehicleID);
|
||||||
|
$stmt->bindParam(":peopleID", $_POST["peopleID"]);
|
||||||
|
$stmt->execute();
|
||||||
|
echo json_encode(array("message" => "Vehicle added successfully and assigned to existing owner"));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
echo json_encode(array("message" => "Not logged in"));
|
||||||
|
}
|
||||||
@ -6,33 +6,40 @@
|
|||||||
<link rel="stylesheet" href="css/changePassword.css">
|
<link rel="stylesheet" href="css/changePassword.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="search.html" class="btn">Search</a></li>
|
<li><a href="search.html" class="btn">Search</a></li>
|
||||||
<li><a href="newVehicle.html" class="btn">Add new vehicle</a></li>
|
<li><a href="newVehicle.html" class="btn">Add new vehicle</a></li>
|
||||||
<li><a href="newReport.html" class="btn">Create new report</a></li>
|
<li><a href="newReport.html" class="btn">Create new report</a></li>
|
||||||
<li><a href="newUser.html" class="btn">Create new user</a></li>
|
<li><a href="newUser.html" class="btn">Create new user</a></li>
|
||||||
<li><a href="addFines.html" class="btn">Add Fines</a></li>
|
<li><a href="addFines.html" class="btn">Add fines</a></li>
|
||||||
<li><a href="viewLog.html" class="btn">View log</a></li>
|
<li><a href="viewLog.html" class="btn">View log</a></li>
|
||||||
<li><a href="changePassword.html" class="btn active">Change password</a></li>
|
<li><a href="changePassword.html" class="btn active">Change password</a></li>
|
||||||
<li><a href="#" class="btn">Logout</a></li>
|
<li><a href="#" class="btn">Logout</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<form action="" method="POST" id="changePass">
|
<header id="title">
|
||||||
<div class="formControl">
|
<h1></h1>
|
||||||
<label for="pass">Password</label>
|
</header>
|
||||||
<input type="password" name="pass" id="pass">
|
|
||||||
</div>
|
|
||||||
<div class="formControl">
|
|
||||||
<label for="rePass">Retype Password</label>
|
|
||||||
<input type="password" name="rePass" id="rePass">
|
|
||||||
</div>
|
|
||||||
<input type="submit" value="Change Password" class="btn btnPrimary">
|
|
||||||
</form>
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<script src="js/changePassword.js"></script>
|
<form method="POST" id="changePass">
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="pass">Password</label>
|
||||||
|
<input type="password" name="pass" id="pass">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="rePass">Retype Password</label>
|
||||||
|
<input type="password" name="rePass" id="rePass">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="submit" value="Change Password" class="btn btnPrimary">
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="js/checkUser.js"></script>
|
||||||
|
<script src="js/changePassword.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -24,7 +24,7 @@ nav ul li a {
|
|||||||
}
|
}
|
||||||
|
|
||||||
nav ul li a.active, nav ul li a:hover {
|
nav ul li a.active, nav ul li a:hover {
|
||||||
padding: 1.4em 1.75em;
|
padding: 1.5em 1.75em;
|
||||||
-webkit-border-radius: 0;
|
-webkit-border-radius: 0;
|
||||||
-moz-border-radius: 0;
|
-moz-border-radius: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|||||||
@ -0,0 +1,64 @@
|
|||||||
|
@import "nav.css";
|
||||||
|
|
||||||
|
main {
|
||||||
|
padding-top: 2.5em;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
main .formGroup {
|
||||||
|
width: 30%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: flex-start;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
main form {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1em;
|
||||||
|
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 {
|
||||||
|
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{
|
||||||
|
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;
|
||||||
|
}
|
||||||
@ -58,73 +58,6 @@ main#search div.searchBtnContainer:hover button {
|
|||||||
background-color: var(--hover);
|
background-color: var(--hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
.selectDiv {
|
|
||||||
position: relative;
|
|
||||||
min-width: 300px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectDiv:before {
|
|
||||||
content: '';
|
|
||||||
-webkit-transform: rotate(90deg);
|
|
||||||
-moz-transform: rotate(90deg);
|
|
||||||
-ms-transform: rotate(90deg);
|
|
||||||
transform: rotate(90deg);
|
|
||||||
right: -5px;
|
|
||||||
top: 13px;
|
|
||||||
padding: 0 0 2px;
|
|
||||||
position: absolute;
|
|
||||||
width: 46px;
|
|
||||||
background-color: var(--primary);
|
|
||||||
height: 30px;
|
|
||||||
border-top-right-radius: 0.5em;
|
|
||||||
border-top-left-radius: 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectDiv:after {
|
|
||||||
content: '<>';
|
|
||||||
font: 18px "Consolas", monospace;
|
|
||||||
color: #FFFFFF;
|
|
||||||
-webkit-transform: rotate(90deg);
|
|
||||||
-moz-transform: rotate(90deg);
|
|
||||||
-ms-transform: rotate(90deg);
|
|
||||||
transform: rotate(90deg);
|
|
||||||
right: 6px;
|
|
||||||
top: 18px;
|
|
||||||
padding: 0 0 2px;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectDiv select {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
-moz-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
cursor: pointer;
|
|
||||||
display: block;
|
|
||||||
outline: none;
|
|
||||||
width: 100%;
|
|
||||||
max-width: 30em;
|
|
||||||
height: 3em;
|
|
||||||
float: right;
|
|
||||||
margin: 6px 0;
|
|
||||||
padding: 0 24px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
background-image: none;
|
|
||||||
border: 4px solid var(--primary);
|
|
||||||
-webkit-border-radius: 0.5em;
|
|
||||||
-moz-border-radius: 0.5em;
|
|
||||||
border-radius: 0.5em;
|
|
||||||
word-break: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectDiv:hover select, .selectDiv select:hover {
|
|
||||||
border: 4px solid var(--hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectDiv:hover:before {
|
|
||||||
background-color: var(--hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
margin-top: 3em;
|
margin-top: 3em;
|
||||||
}
|
}
|
||||||
@ -74,6 +74,71 @@ input:not([type="submit"]):hover, form .formControl textarea:hover {
|
|||||||
border: 4px solid var(--hover);
|
border: 4px solid var(--hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.selectDiv {
|
||||||
|
position: relative;
|
||||||
|
min-width: 300px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectDiv:before {
|
||||||
|
content: '';
|
||||||
|
-webkit-transform: rotate(90deg);
|
||||||
|
-moz-transform: rotate(90deg);
|
||||||
|
-ms-transform: rotate(90deg);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
right: -5px;
|
||||||
|
top: 13px;
|
||||||
|
padding: 0 0 2px;
|
||||||
|
position: absolute;
|
||||||
|
width: 46px;
|
||||||
|
background-color: var(--primary);
|
||||||
|
height: 30px;
|
||||||
|
border-top-right-radius: 0.5em;
|
||||||
|
border-top-left-radius: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectDiv:after {
|
||||||
|
content: '<>';
|
||||||
|
font: 18px "Consolas", monospace;
|
||||||
|
color: #FFFFFF;
|
||||||
|
-webkit-transform: rotate(90deg);
|
||||||
|
-moz-transform: rotate(90deg);
|
||||||
|
-ms-transform: rotate(90deg);
|
||||||
|
transform: rotate(90deg);
|
||||||
|
right: 6px;
|
||||||
|
top: 18px;
|
||||||
|
padding: 0 0 2px;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectDiv select {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
-moz-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
outline: none;
|
||||||
|
width: 100%;
|
||||||
|
height: 3em;
|
||||||
|
margin: 6px 0;
|
||||||
|
padding: 0 24px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
background-image: none;
|
||||||
|
border: 4px solid var(--primary);
|
||||||
|
-webkit-border-radius: 0.5em;
|
||||||
|
-moz-border-radius: 0.5em;
|
||||||
|
border-radius: 0.5em;
|
||||||
|
word-break: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectDiv:hover select, .selectDiv select:hover {
|
||||||
|
border: 4px solid var(--hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectDiv:hover:before {
|
||||||
|
background-color: var(--hover);
|
||||||
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
}
|
}
|
||||||
@ -97,4 +162,8 @@ table th {
|
|||||||
text-align: left;
|
text-align: left;
|
||||||
background-color: var(--primary);
|
background-color: var(--primary);
|
||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
main #title {
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
|||||||
@ -0,0 +1,13 @@
|
|||||||
|
<?php
|
||||||
|
session_start();
|
||||||
|
require_once 'config.php';
|
||||||
|
header('Content-Type: application/json');
|
||||||
|
|
||||||
|
if (isset($_SESSION["username"]))
|
||||||
|
{
|
||||||
|
$conn = dbConn();
|
||||||
|
$stmt = $conn->prepare("SELECT People_ID, People_name FROM People");
|
||||||
|
$stmt->execute();
|
||||||
|
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||||
|
echo json_encode(array("message" => "ok", "owners" => $result));
|
||||||
|
}
|
||||||
@ -12,15 +12,18 @@
|
|||||||
<main>
|
<main>
|
||||||
<div class="login">
|
<div class="login">
|
||||||
<h1>Login To Traffic Reporter</h1>
|
<h1>Login To Traffic Reporter</h1>
|
||||||
|
|
||||||
<form method="POST" class="loginForm" id="login">
|
<form method="POST" class="loginForm" id="login">
|
||||||
<div class="formControl">
|
<div class="formControl">
|
||||||
<label for="username">Username</label>
|
<label for="username">Username</label>
|
||||||
<input type="text" name="username" id="username" required>
|
<input type="text" name="username" id="username" required>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="formControl">
|
<div class="formControl">
|
||||||
<label for="password">Password</label>
|
<label for="password">Password</label>
|
||||||
<input type="password" name="password" id="password" required>
|
<input type="password" name="password" id="password" required>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<input type="submit" value="Login" class="btn btnPrimary">
|
<input type="submit" value="Login" class="btn btnPrimary">
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -0,0 +1,15 @@
|
|||||||
|
// document.addEventListener("DOMContentLoaded", () =>
|
||||||
|
// {
|
||||||
|
// fetch("isLoggedIn.php").then(res => res.json().then(json =>
|
||||||
|
// {
|
||||||
|
// if (json.message !== "ok")
|
||||||
|
// {
|
||||||
|
// window.location.href = "index.html";
|
||||||
|
// }
|
||||||
|
// else
|
||||||
|
// {
|
||||||
|
// document.querySelector("#title h1").innerText = "Logged in as: " + json.username;
|
||||||
|
// }
|
||||||
|
// }));
|
||||||
|
// });
|
||||||
|
|
||||||
@ -0,0 +1,67 @@
|
|||||||
|
|
||||||
|
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}</option>`;
|
||||||
|
}
|
||||||
|
body += `<option value="new">New Owner</option>`;
|
||||||
|
document.querySelector("#owner").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("#vehicleForm").addEventListener("submit", e =>
|
||||||
|
{
|
||||||
|
e.preventDefault();
|
||||||
|
let formData = new FormData();
|
||||||
|
formData.append("type", document.querySelector("#type").value);
|
||||||
|
formData.append("colour", document.querySelector("#colour").value);
|
||||||
|
formData.append("plateNum", document.querySelector("#plateNum").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);
|
||||||
|
}
|
||||||
|
|
||||||
|
fetch("addVehicle.php", {
|
||||||
|
method: "POST",
|
||||||
|
body: formData
|
||||||
|
}).then(res => res.json().then(json =>
|
||||||
|
{
|
||||||
|
alert(json.message);
|
||||||
|
}));
|
||||||
|
|
||||||
|
});
|
||||||
@ -1,13 +1,4 @@
|
|||||||
// document.addEventListener("DOMContentLoaded", () =>
|
//Search stuff
|
||||||
// {
|
|
||||||
// fetch("isLoggedIn.php").then(res => res.json().then(json =>
|
|
||||||
// {
|
|
||||||
// if (json.message !== "ok")
|
|
||||||
// {
|
|
||||||
// window.location.href = "index.html";
|
|
||||||
// }
|
|
||||||
// }));
|
|
||||||
// });
|
|
||||||
|
|
||||||
document.querySelector("#searchType").addEventListener("change", e =>
|
document.querySelector("#searchType").addEventListener("change", e =>
|
||||||
{
|
{
|
||||||
|
|||||||
@ -2,9 +2,78 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Title</title>
|
<title>Add New Vehicle</title>
|
||||||
|
<link rel="stylesheet" href="css/newVehicle.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="search.html" class="btn">Search</a></li>
|
||||||
|
<li><a href="newVehicle.html" class="btn active">Add new vehicle</a></li>
|
||||||
|
<li><a href="newReport.html" class="btn">Create new report</a></li>
|
||||||
|
<li><a href="newUser.html" class="btn">Create new user</a></li>
|
||||||
|
<li><a href="addFines.html" class="btn">Add fines</a></li>
|
||||||
|
<li><a href="viewLog.html" class="btn">View log</a></li>
|
||||||
|
<li><a href="changePassword.html" class="btn">Change password</a></li>
|
||||||
|
<li><a href="#" class="btn">Logout</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<header id="title">
|
||||||
|
<h1></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<form action="" id="vehicleForm">
|
||||||
|
<div class="formGroup">
|
||||||
|
<div class="formSpace">
|
||||||
|
|
||||||
|
<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 class="formControl">
|
||||||
|
<label for="owner">Owner</label>
|
||||||
|
<div class="selectDiv">
|
||||||
|
<select name="owner" id="owner" required>
|
||||||
|
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="submit" value="Add new vehicle" 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>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="js/newVehicle.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Add New Vehicle</title>
|
||||||
|
<link rel="stylesheet" href="css/newVehicle.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="search.html" class="btn">Search</a></li>
|
||||||
|
<li><a href="newVehicle.html" class="btn active">Add new vehicle</a></li>
|
||||||
|
<li><a href="newReport.html" class="btn">Create new report</a></li>
|
||||||
|
<li><a href="newUser.html" class="btn">Create new user</a></li>
|
||||||
|
<li><a href="addFines.html" class="btn">Add fines</a></li>
|
||||||
|
<li><a href="viewLog.html" class="btn">View log</a></li>
|
||||||
|
<li><a href="changePassword.html" class="btn">Change password</a></li>
|
||||||
|
<li><a href="#" class="btn">Logout</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<header id="title">
|
||||||
|
<h1></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="formGroup">
|
||||||
|
<form method="post" id="vehicleForm">
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="plateNum">Plate Number</label>
|
||||||
|
<input type="text" name="plateNum" id="plateNum">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="make">Make</label>
|
||||||
|
<input type="text" name="make" id="make">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="model">Model</label>
|
||||||
|
<input type="text" name="model" id="model">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="formControl">
|
||||||
|
<label for="owner">Owner</label>
|
||||||
|
<div class="selectDiv">
|
||||||
|
<select name="owner" id="owner">
|
||||||
|
<option value="james-smith">James Smith</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="submit" value="Add new vehicle" class="btn btnPrimary">
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<form method="post" id="ownerForm">
|
||||||
|
<div class="formSpace">
|
||||||
|
<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">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="formSpace">
|
||||||
|
<input type="submit" value="Add new Owner" class="btn btnPrimary">
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src=""></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -19,34 +19,40 @@
|
|||||||
<li><a href="#" class="btn">Logout</a></li>
|
<li><a href="#" class="btn">Logout</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
<main id="search">
|
<main id="search">
|
||||||
<div class="searchContainer">
|
<header id="title">
|
||||||
<form method="POST" id="searchForm">
|
<h1></h1>
|
||||||
<div class="selectDiv">
|
</header>
|
||||||
<select name="searchType" id="searchType">
|
|
||||||
<option value="dln">Name/Driving licence number</option>
|
|
||||||
<option value="pn">Plate Number</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="searchBtnContainer">
|
|
||||||
<input type="text" id="searchField" name="searchField" placeholder="Find owner">
|
|
||||||
<button type="submit"><i class="fa-solid fa-magnifying-glass"></i></button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
<div class="searchContainer">
|
||||||
<table id="searchResults">
|
<form method="POST" id="searchForm">
|
||||||
<thead>
|
<div class="selectDiv">
|
||||||
<tr>
|
<select name="searchType" id="searchType">
|
||||||
|
<option value="dln">Name/Driving licence number</option>
|
||||||
|
<option value="pn">Plate Number</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
</tr>
|
<div class="searchBtnContainer">
|
||||||
</thead>
|
<input type="text" id="searchField" name="searchField" placeholder="Find owner">
|
||||||
<tbody></tbody>
|
<button type="submit"><i class="fa-solid fa-magnifying-glass"></i></button>
|
||||||
</table>
|
</div>
|
||||||
</div>
|
</form>
|
||||||
</main>
|
</div>
|
||||||
|
|
||||||
<script src="js/search.js"></script>
|
<div class="content">
|
||||||
|
<table id="searchResults">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="js/checkUser.js"></script>
|
||||||
|
<script src="js/search.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user