<!DOCTYPE html>
<html>
<head>
<title>Login - Urenoverzicht en Salarisstroken</title>
<style>
body {
text-align: center;
}
h1 {
padding-top: 50px;
color: #003366;
}
.login-form {
margin: 0 auto;
width: 300px;
padding: 20px;
background-color: #e2e2e2;
border-radius: 5px;
margin-top: 100px;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: bold;
}
.form-group input {
width: 100%;
padding: 7px;
border-radius: 3px;
border: 1px solid #6e6e6e;
}
.form-group button {
width: 100%;
padding: 7px;
border-radius: 3px;
background-color: #003366;
border: none;
color: rgb(255, 255, 255);
font-weight: bold;
}
</style>
<script>
function login() {
var email = document.getElementById("email").value;
var password = document.getElementById("password").value;
// Voeg hier je eigen inloglogica toe
if (email === "TKS01@bbb.local" && password === "P@ssw0rd") {
alert("Inloggen succesvol!");
// Voer hier de gewenste acties uit, zoals het downloaden van de salarisstrook
var downloadLink = document.createElement("a");
downloadLink.href = "https://drive.google.com/uc?export=download&id=1piw1xcRYSxP4Fp0vv6hkNVHbzK1sVSyv";
downloadLink.download = "salary_this_month.pdf";
downloadLink.click();
} else {
alert("Ongeldige gebruikersnaam of wachtwoord. Probeer het opnieuw.");
}
}
</script>
</head>
<body>
<h1>Urenoverzicht en Salarisstroken</h1>
<div class="login-form">
<form>
<div class="form-group">
<label for="email">E-mail:</label>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="password">Wachtwoord:</label>
<input type="password" id="password" name="password" required>
</div>
<div class="form-group">
<button type="button" onclick="login()">Inloggen</button>
</div>
</form>
</div>
</body>
</html>