Files
mek-tech-consulting/engagement-form.ejs
T

93 lines
5.2 KiB
Plaintext

<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= engagement ? 'Bewerk' : 'Nieuw' %> Engagement — Mek-Tech Consulting</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/dynamic.css">
<link rel="icon" href="/img/favicon.svg" type="image/svg+xml">
</head>
<body>
<nav class="navbar"><div class="nav-inner"><a href="/" class="nav-brand"><img src="/img/logo.svg" class="nav-logo" alt="Mek-Tech"></a><div style="display:flex;align-items:center;gap:.4rem"><a href="/" class="nav-icon-btn" title="Dashboard"><i data-lucide="layout-dashboard" style="width:15px;height:15px"></i> Dashboard</a><button class="theme-toggle" id="themeToggle" onclick="toggleTheme()"></button><a href="/auth/logout" class="nav-icon-btn" style="color:var(--red)"><i data-lucide="log-out" style="width:15px;height:15px"></i> Uitloggen</a></div></div></nav>
<div class="container">
<a href="javascript:history.back()" class="back-link"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"/></svg> Terug</a>
<div class="page-header">
<div>
<a href="/engagements" class="back-link">← Terug naar engagements</a>
<h1><%= engagement ? 'Bewerk: ' + engagement.title : 'Nieuw Engagement' %></h1>
</div>
</div>
<% if (error) { %><div class="alert alert-error"><%= error %></div><% } %>
<form action="/engagements/<%= engagement ? engagement.id + '/edit' : 'new' %>" method="POST" class="form-card">
<% if (!engagement) { %>
<div class="field">
<label for="client_id">Cliënt *</label>
<select name="client_id" id="client_id" required>
<option value="">Selecteer een cliënt...</option>
<% clients.forEach(function(c) { %>
<option value="<%= c.id %>" <%= (selected && String(selected) === String(c.id)) ? 'selected' : '' %>><%= c.name %></option>
<% }) %>
</select>
</div>
<% } else { %>
<input type="hidden" name="client_id" value="<%= engagement.client_id %>">
<% } %>
<div class="form-grid">
<div class="field">
<label for="title">Titel *</label>
<input type="text" name="title" id="title" value="<%= engagement ? engagement.title : '' %>" required>
</div>
<div class="field">
<label for="type">Type</label>
<select name="type" id="type">
<option value="assessment" <%= engagement && engagement.type === 'assessment' ? 'selected' : '' %>>Assessment</option>
<option value="architecture" <%= engagement && engagement.type === 'architecture' ? 'selected' : '' %>>Architectuur</option>
<option value="implementation" <%= engagement && engagement.type === 'implementation' ? 'selected' : '' %>>Implementatie</option>
<option value="monitoring" <%= engagement && engagement.type === 'monitoring' ? 'selected' : '' %>>Monitoring</option>
<option value="consulting" <%= engagement && engagement.type === 'consulting' ? 'selected' : '' %>>Consulting</option>
<option value="training" <%= engagement && engagement.type === 'training' ? 'selected' : '' %>>Training</option>
</select>
</div>
<div class="field">
<label for="status">Status</label>
<select name="status" id="status">
<option value="planned" <%= engagement && engagement.status === 'planned' ? 'selected' : '' %>>Gepland</option>
<option value="in_progress" <%= engagement && engagement.status === 'in_progress' ? 'selected' : '' %>>Bezig</option>
<option value="completed" <%= engagement && engagement.status === 'completed' ? 'selected' : '' %>>Afgerond</option>
<option value="on_hold" <%= engagement && engagement.status === 'on_hold' ? 'selected' : '' %>>On Hold</option>
</select>
</div>
<div class="field">
<label for="start_date">Startdatum</label>
<input type="date" name="start_date" id="start_date" value="<%= engagement ? engagement.start_date : '' %>">
</div>
<div class="field">
<label for="end_date">Einddatum</label>
<input type="date" name="end_date" id="end_date" value="<%= engagement ? engagement.end_date : '' %>">
</div>
</div>
<div class="field">
<label for="description">Omschrijving</label>
<textarea name="description" id="description" rows="4"><%= engagement ? engagement.description : '' %></textarea>
</div>
<% if (engagement) { %>
<div class="field">
<label for="outcome">Resultaat / Oplevering</label>
<textarea name="outcome" id="outcome" rows="4"><%= engagement.outcome || '' %></textarea>
</div>
<% } %>
<div class="form-actions">
<button type="submit" class="btn btn-accent"><%= engagement ? 'Opslaan' : 'Aanmaken' %></button>
<a href="/engagements" class="btn btn-secondary">Annuleren</a>
</div>
</form>
</div>
<script src="/js/theme.js"></script></body>
</html>