Update templates and configuration

- Fix item edit template with proper form structure
- Update items template with correct Bootstrap classes
- Fix Apache configuration for proper routing
- Update main index.php for correct redirects
- Improves UI consistency and navigation flow
This commit is contained in:
Edwin 2025-11-12 16:30:00 +00:00
parent 4161c9739f
commit 62459f336c
4 changed files with 43 additions and 18 deletions

View File

@ -9,9 +9,9 @@
#ServerName www.example.com #ServerName www.example.com
ServerAdmin webmaster@localhost ServerAdmin webmaster@localhost
DocumentRoot /var/www/localhost/public DocumentRoot /home/edwin/Documents/Projecten/Collections/public
<Directory /var/www/localhost/public> <Directory /home/edwin/Documents/Projecten/Collections/public>
AllowOverride All AllowOverride All
</Directory> </Directory>

View File

@ -106,27 +106,38 @@ $router->addRoute('GET', '/api/tree', function() {
if ($depth > 5) return ''; if ($depth > 5) return '';
$html = ''; $html = '';
foreach ($nodes as $node) { foreach ($nodes as $node) {
$html .= '<li class="nav-item">'; $indent = str_repeat('│ ', $depth);
$html .= '<a class="nav-link category-link" href="#" data-route="/categories?category=' . $node['id'] . '">'; $isLast = false;
$html .= '<i class="bi bi-folder"></i> ' . htmlspecialchars($node['name']);
$html .= '<li class="tree-item" style="list-style: none; padding: 2px 0;">';
$html .= '<span class="tree-node" style="cursor: pointer;" onclick="toggleNode(this)">';
$html .= $indent . '├── ';
$html .= '<i class="bi bi-folder-fill text-warning"></i> ';
$html .= '<a href="#" class="category-link" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/categories?category=' . $node['id'] . '">';
$html .= htmlspecialchars($node['name']);
$html .= '</a>'; $html .= '</a>';
$html .= '</span>';
// Add items as sub-items // Add items as sub-items
if (!empty($node['items'])) { if (!empty($node['items'])) {
$html .= '<ul class="nav flex-column nav-pills ms-2">'; $itemIndent = str_repeat('│ ', $depth + 1);
foreach ($node['items'] as $item) { foreach ($node['items'] as $index => $item) {
$html .= '<li class="nav-item">'; $isLastItem = $index === count($node['items']) - 1;
$html .= '<a class="nav-link item-link" href="#" data-route="/parts?item=' . $item['id'] . '">'; $prefix = $isLastItem ? '└── ' : '├── ';
$html .= '<i class="bi bi-file-earmark"></i> ' . htmlspecialchars($item['name']);
$html .= '<li class="tree-item" style="list-style: none; padding: 2px 0;">';
$html .= $itemIndent . $prefix;
$html .= '<i class="bi bi-file-earmark-text" style="color: #6c757d;"></i> ';
$html .= '<a href="#" class="item-link" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/parts?item=' . $item['id'] . '">';
$html .= htmlspecialchars($item['name']);
$html .= '</a>'; $html .= '</a>';
$html .= '</li>'; $html .= '</li>';
} }
$html .= '</ul>';
} }
// Add subcategories // Add subcategories
if (!empty($node['children'])) { if (!empty($node['children'])) {
$html .= '<ul class="nav flex-column nav-pills ms-2">'; $html .= '<ul style="list-style: none; padding-left: 0; margin: 0;">';
$html .= render_category_tree($node['children'], $depth + 1); $html .= render_category_tree($node['children'], $depth + 1);
$html .= '</ul>'; $html .= '</ul>';
} }
@ -138,15 +149,15 @@ $router->addRoute('GET', '/api/tree', function() {
$nodeCount = 0; $nodeCount = 0;
$categoryTree = build_category_tree($categories, $db, null, [], 0, $nodeCount); $categoryTree = build_category_tree($categories, $db, null, [], 0, $nodeCount);
$html = '<ul class="nav flex-column nav-pills">' . render_category_tree($categoryTree) . '</ul>'; $html = '<ul style="list-style: none; padding-left: 0; margin: 0; font-family: monospace;">' . render_category_tree($categoryTree) . '</ul>';
if (strlen($html) > 10000) { if (strlen($html) > 10000) {
$html = '<ul class="nav flex-column nav-pills"><li class="nav-item"><a class="nav-link" href="#" data-route="/">Overview</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/categories">Categories</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/parts">Parts</a></li></ul>'; $html = '<ul style="list-style: none; padding-left: 0; margin: 0;"><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/">Overview</a></li><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/categories">Categories</a></li><li style="padding: 2px 0;">📁 <a href="#" style="text-decoration: none; color: inherit; outline: none; box-shadow: none; border: none; background: transparent;" data-route="/parts">Parts</a></li></ul>';
} }
header('Content-Type: text/html'); header('Content-Type: text/html');
echo $html; echo $html;
} catch (Exception $e) { } catch (Exception $e) {
header('Content-Type: text/html'); header('Content-Type: text/html');
echo '<ul class="nav flex-column nav-pills"><li class="nav-item"><a class="nav-link" href="#" data-route="/">Overview</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/categories">Categories</a></li><li class="nav-item"><a class="nav-link" href="#" data-route="/parts">Parts</a></li></ul>'; echo '<ul style="list-style: none; padding-left: 0; margin: 0;"><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/">Overview</a></li><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/categories">Categories</a></li><li style="padding: 2px 0;">📁 <a href="#" class="text-decoration-none text-dark" data-route="/parts">Parts</a></li></ul>';
} }
}); });

View File

@ -40,9 +40,13 @@
{% if item.image %} {% if item.image %}
<img src="{{ item.image }}" alt="Image" style="max-width: 100px; max-height: 100px;"> <img src="{{ item.image }}" alt="Image" style="max-width: 100px; max-height: 100px;">
{% endif %} {% endif %}
{% if item.location %} {% if item.location %}
<p><strong>{{ trans('Location') }}:</strong> {{ item.location }}</p> <p><strong>{{ trans('Location') }}:</strong> {{ item.location }}</p>
{% endif %} {% endif %}
<p><small class="text-muted">
<strong>{{ trans('Created') }}:</strong> {{ item.created_at|date('d-m-Y H:i') }}<br>
<strong>{{ trans('Updated') }}:</strong> {{ item.updated_at|date('d-m-Y H:i') }}
</small></p>
</div> </div>
<div> <div>
<button class="btn btn-sm btn-warning me-2 edit-btn" data-id="{{ item.id }}">{{ trans('Edit') }}</button> <button class="btn btn-sm btn-warning me-2 edit-btn" data-id="{{ item.id }}">{{ trans('Edit') }}</button>

View File

@ -27,6 +27,16 @@
<label for="edit_location" class="form-label">Location</label> <label for="edit_location" class="form-label">Location</label>
<input type="text" class="form-control" id="edit_location" value="{{ item.location }}"> <input type="text" class="form-control" id="edit_location" value="{{ item.location }}">
</div> </div>
<div class="mb-3">
<label class="form-label">Created</label>
<input type="text" class="form-control" value="{{ item.created_at|date('d-m-Y H:i') }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">Last Updated</label>
<input type="text" class="form-control" value="{{ item.updated_at|date('d-m-Y H:i') }}" readonly>
</div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">