Files
2026-03-24 00:26:25 +01:00

101 lines
4.4 KiB
HTML

<%- include('layouts/main', {
title: _('inventory.title'),
pageStyles: ['inventory'],
pageScripts: ['inventory'],
currentPage: 'inventory',
breadcrumb: [{ label: _('inventory.title') }],
body: `
<div class="inventory-page">
<!-- Header -->
<div class="page-header">
<div class="page-title">
<h1>${_('inventory.title')}</h1>
</div>
<p class="page-subtitle">${_('inventory.subtitle')}</p>
</div>
<!-- Stats Cards -->
<div class="inventory-stats" id="inventory-stats">
<div class="stat-card">
<span class="material-icons">devices</span>
<div class="stat-value" id="stat-devices">0</div>
<div class="stat-label">${_('nav.devices')}</div>
</div>
<div class="stat-card">
<span class="material-icons">memory</span>
<div class="stat-value" id="stat-cpu"></div>
<div class="stat-label">${_('inventory.cpu')}</div>
</div>
<div class="stat-card">
<span class="material-icons">storage</span>
<div class="stat-value" id="stat-memory"></div>
<div class="stat-label">${_('inventory.memory')}</div>
</div>
<div class="stat-card">
<span class="material-icons">disc_full</span>
<div class="stat-value" id="stat-disks"></div>
<div class="stat-label">${_('inventory.disks')}</div>
</div>
</div>
<!-- Filters -->
<div class="page-filters">
<div class="search-wrapper">
<span class="material-icons">search</span>
<input type="text" class="form-input" id="search-input"
placeholder="${_('devices.search_placeholder')}">
</div>
<button class="btn btn-secondary" id="refresh-btn">
<span class="material-icons">refresh</span>
<span>${_('inventory.refresh')}</span>
</button>
</div>
<!-- Inventory Table -->
<div class="table-wrapper">
<table class="data-table" id="inventory-table">
<thead>
<tr>
<th>${_('inventory.device_id')}</th>
<th>${_('inventory.hostname')}</th>
<th>${_('inventory.os')}</th>
<th>${_('inventory.cpu')}</th>
<th>${_('inventory.memory')}</th>
<th>${_('inventory.disks')}</th>
<th>${_('inventory.last_seen')}</th>
<th>${_('common.actions')}</th>
</tr>
</thead>
<tbody id="inventory-body">
<tr class="empty-row">
<td colspan="8">
<div class="empty-state">
<span class="material-icons">inventory_2</span>
<p>${_('inventory.no_devices')}</p>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- Detail Modal -->
<div class="modal-overlay" id="detail-modal" style="display: none;">
<div class="modal modal-lg">
<div class="modal-header">
<h3 id="detail-modal-title">${_('inventory.detail_title')}</h3>
<button class="btn-icon modal-close" data-modal="detail-modal">
<span class="material-icons">close</span>
</button>
</div>
<div class="modal-body" id="detail-modal-body">
</div>
<div class="modal-footer">
<button class="btn btn-secondary modal-close" data-modal="detail-modal">${_('common.close')}</button>
</div>
</div>
</div>
</div>
`
}) %>