77 lines
3.6 KiB
Plaintext
77 lines
3.6 KiB
Plaintext
|
|
<!DOCTYPE html>
|
||
|
|
<html lang="nl">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>AI Consultancy Framework — Mek-Tech</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">
|
||
|
|
<header class="header">
|
||
|
|
<div class="logo">
|
||
|
|
<img src="/img/logo.svg" style="height:48px;width:auto;margin-right:.75rem" alt="Mek-Tech">
|
||
|
|
<div>
|
||
|
|
<h1>AI Consultancy Framework</h1>
|
||
|
|
<p class="subtitle">Mek-Tech.nl — Datacenter & AI Architectuur</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="progress-bar">
|
||
|
|
<div class="progress-fill" id="progressFill" style="width: 0%"></div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<form id="consultingForm" action="/assess/report" method="POST">
|
||
|
|
<div class="field" style="margin-bottom:1.5rem">
|
||
|
|
<label for="_client_id">Koppel aan cliënt (optioneel)</label>
|
||
|
|
<select name="_client_id" id="_client_id">
|
||
|
|
<option value="">— Geen cliënt —</option>
|
||
|
|
<% clients.forEach(function(c) { %>
|
||
|
|
<option value="<%= c.id %>" <%= clientId == c.id ? 'selected' : '' %>><%= c.name %></option>
|
||
|
|
<% }) %>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<input type="hidden" name="_engagement_id" value="<%= engagementId || '' %>">
|
||
|
|
|
||
|
|
<% questions.forEach(function(q, index) { %>
|
||
|
|
<div class="step" id="step<%= index %>" style="display: <%= index === 0 ? 'block' : 'none' %>">
|
||
|
|
<div class="step-header">
|
||
|
|
<span class="step-number">Stap <%= index + 1 %> / <%= questions.length %></span>
|
||
|
|
<h2><%= q.title %></h2>
|
||
|
|
</div>
|
||
|
|
<div class="fields">
|
||
|
|
<% q.fields.forEach(function(field) { %>
|
||
|
|
<div class="field">
|
||
|
|
<label for="<%= field.name %>"><%= field.label %></label>
|
||
|
|
<% if (field.type === 'textarea') { %>
|
||
|
|
<textarea name="<%= field.name %>" id="<%= field.name %>" rows="3" <%= field.required ? 'required' : '' %>></textarea>
|
||
|
|
<% } else { %>
|
||
|
|
<input type="<%= field.type %>" name="<%= field.name %>" id="<%= field.name %>" <%= field.required ? 'required' : '' %>>
|
||
|
|
<% } %>
|
||
|
|
</div>
|
||
|
|
<% }) %>
|
||
|
|
</div>
|
||
|
|
<div class="step-actions">
|
||
|
|
<% if (index > 0) { %>
|
||
|
|
<button type="button" class="btn btn-secondary" onclick="prevStep(<%= index %>)">Vorige</button>
|
||
|
|
<% } %>
|
||
|
|
<% if (index < questions.length - 1) { %>
|
||
|
|
<button type="button" class="btn btn-primary" onclick="nextStep(<%= index %>)">Volgende</button>
|
||
|
|
<% } else { %>
|
||
|
|
<button type="submit" class="btn btn-accent">Genereer Rapport</button>
|
||
|
|
<% } %>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<% }) %>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="/js/main.js"></script>
|
||
|
|
<script src="/js/theme.js"></script></body>
|
||
|
|
</html>
|