challenge_14

This commit is contained in:
Alvin
2025-10-20 14:54:41 +02:00
parent 6fd5e403bf
commit 77576500ce
33 changed files with 193 additions and 0 deletions

View File

@@ -0,0 +1,2 @@
*.aup3
*.wav

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

@@ -0,0 +1,68 @@
# Challenge 14: Magazijn App
## Over dit project
Voor studenten en docenten liggen er in het magazijn veel materialen die ze kunnen gebruiken. Een app om deze spullen te lenen is een goede oplossing om alles netjes te organiseren. Met de app kun je makkelijk bijhouden wie wat leent en wanneer het terug moet. Zo raken spullen niet meer kwijt. Dit bespaart tijd, zorgt voor minder verwarring en maakt het voorraadbeheer een stuk makkelijker.
## Functies
Dit zijn de belangrijkste functies van de app:
* **Gebruikers:** Je kunt verschillende rollen aanmaken (beheerder, medewerker, gebruiker).
* **Items:** Je kunt spullen toevoegen, aanpassen en verwijderen.
* **Uitleensysteem:** Een systeem om spullen te lenen en terug te brengen.
* **Status:** Je kunt zien of iets is uitgeleend, teruggebracht of te laat is.
* **Notificaties:** Gebruikers krijgen een berichtje, bijvoorbeeld als ze iets moeten terugbrengen.
* **Boetes:** Een systeem voor boetes als spullen te laat terugkomen.
## Database Opbouw (ERD)
Hieronder zie je hoe de database is opgebouwd.
### Entiteiten en Attributen
**1. Gebruiker**
* `gebruiker_id` (PK)
* `gebruikersnaam`
* `wachtwoord`
* `e-mail`
* `rol` (beheerder, medewerker, gebruiker)
* `registratiedatum`
**2. Item**
* `item_id` (PK)
* `naam`
* `beschrijving`
* `categorie`
* `beschikbaarheid` (boolean)
* `locatie`
**3. Uitleen**
* `uitleen_id` (PK)
* `gebruiker_id` (FK)
* `item_id` (FK)
* `uitleendatum`
* `retourdatum`
* `status` (uitgeleend, geretourneerd, te laat)
**4. Notificatie**
* `notificatie_id` (PK)
* `gebruiker_id` (FK)
* `bericht`
* `datum`
* `gelezen` (boolean)
**5. Boete**
* `boete_id` (PK)
* `uitleen_id` (FK)
* `bedrag`
* `betaald` (boolean)
### Relaties
* Een **Gebruiker** kan meerdere spullen **lenen** (meerdere Uitleen-records).
* Een **Item** kan door meerdere mensen **geleend worden** (meerdere Uitleen-records).
* Elke **Uitleen** hoort bij één **Gebruiker** en één **Item**.
* Een **Gebruiker** kan meerdere **Notificaties** krijgen.
* Een **Notificatie** hoort bij één **Gebruiker**.
* Een **Uitleen** kan een **Boete** hebben (als het te laat is).

View File

@@ -0,0 +1,24 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="32" height="32" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
<!-- Vista College Color Palette: #FEFEFE, #CCCECF, #D3705A, #CD977E, #1F4952 -->
<!-- Main Building -->
<rect x="4" y="12" width="24" height="16" fill="#1F4952" rx="1"/>
<!-- Roof with 3D effect -->
<path d="M2 12L16 4L30 12L16 8Z" fill="#D3705A"/>
<!-- Main Door -->
<rect x="13" y="16" width="6" height="12" fill="#CD977E"/>
<circle cx="18" cy="22" r="0.5" fill="#FEFEFE"/>
<!-- Windows -->
<rect x="7" y="15" width="3" height="3" fill="#CCCECF" rx="0.5"/>
<rect x="22" y="15" width="3" height="3" fill="#CCCECF" rx="0.5"/>
<!-- Loading Dock -->
<rect x="11" y="27" width="10" height="1" fill="#CCCECF"/>
<!-- Subtle Shadow -->
<rect x="4" y="28" width="24" height="0.5" fill="rgba(0,0,0,0.2)"/>
</svg>

After

Width:  |  Height:  |  Size: 929 B

View File

@@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Magazijn-App</title>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<header>
<div class="header-buttons">
<div class="left-buttons">
<button>home</button>
<button>info</button>
<button>Magazijn</button>
</div>
<div class="right-buttons">
<button>winkelmand</button>
<button>vertalen</button>
</div>
</div>
</header>
</nav>
<div id="info">
placegolder
</div>
</body>
</html>

View File

@@ -0,0 +1,11 @@
// Main application code
document.addEventListener('DOMContentLoaded', () => {
// Initialize any variables or state
// Add event listeners
// Define helper functions
});
// Utility functions can be defined here

View File

@@ -0,0 +1,55 @@
body{
background: linear-gradient(to right, #d3705a, #cd977e);
}
header{
background-color: #1f4952;
border-radius: 15px;
padding: 1rem;
}
.header-buttons {
display: flex;
justify-content: space-between;
align-items: center;
}
.left-buttons, .right-buttons {
display: flex;
gap: 10px;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
display: none;
}
button{
color: white;
font-size: large;
font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif ;
background-color: #d3705a;
height: 75px;
width: 100px;
border-radius: 5px;
border: black solid 2px;
}
button:hover{
background-color: #cd977e;
}
#info{
padding: 10px;
border-radius: 15px;
border:black solid 2px ;
margin: auto;
background-color: white;
max-width: 90%;
height: 75vb;
margin-top: 25px;
display: flex;
}