jukka/intra.noxus.fi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

IPAM: Hierarkkinen puunäkymä + VLANit erilleen

Browse Source 
- Subnetit ja IP:t näytetään hierarkkisena puuna jossa pienemmät
  verkot menevät isomman sisään (esim. /24 → /16 → /8)
- Expand/collapse klikkaamalla ▶/▼ ikonia
- Drill-down: poraudu verkon sisään → -nuolella, breadcrumb ylhäällä
- VLANit erotettu omaksi luetteloksi verkkojen alapuolelle
- Omat "Lisää verkko/IP" ja "Lisää VLAN" -napit

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jukka Lampikoski
2026-03-11 09:13:53 +02:00
parent 1dc04326aa
commit 565a7b6ab3
3 changed files with 278 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
index.html
View File

@@ -271,17 +271,18 @@
<div class="sub-tab-content" id="subtab-ipam">
<div class="main-container">
<div class="search-bar" style="display:flex;gap:0.5rem;align-items:center;">
<input type="text" id="ipam-search-input" placeholder="Hae IP, VLAN, verkko..." style="flex:1;">
<button class="btn-primary" id="btn-add-ipam" style="white-space:nowrap;">+ Lisää merkintä</button>
<input type="text" id="ipam-search-input" placeholder="Hae IP, verkko, VLAN..." style="flex:1;">
<button class="btn-primary" id="btn-add-ipam" style="white-space:nowrap;">+ Lisää verkko / IP</button>
</div>
<div id="ipam-breadcrumb" class="ipam-breadcrumb" style="display:none;"></div>
<div class="table-card">
<table id="ipam-table">
<table id="ipam-table" class="ipam-tree-table">
<thead>
<tr>
<th>Tyyppi</th>
<th style="width:120px;">Tyyppi</th>
<th>Verkko / IP</th>
<th>VLAN</th>
<th>Nimi / Kuvaus</th>
<th>VLAN</th>
<th>Sijainti</th>
<th>Tila</th>
<th>Asiakas</th>
@@ -291,11 +292,38 @@
<tbody id="ipam-tbody"></tbody>
</table>
<div id="no-ipam" class="empty-state" style="display:none;">
<p>Ei IPAM-merkintöjä vielä.</p>
<p>Ei verkkoja tai IP-osoitteita vielä.</p>
</div>
</div>
<div class="summary-bar">
<span id="ipam-count">0 merkintää</span>
<span id="ipam-count">0 verkkoa</span>
</div>
<!-- VLAN-luettelo -->
<div id="ipam-vlan-section" style="margin-top:1.5rem;">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem;">
<h4 style="margin:0;color:#0f3460;">VLANit</h4>
<button class="btn-primary" id="btn-add-vlan" style="white-space:nowrap;font-size:0.82rem;">+ Lisää VLAN</button>
</div>
<div class="table-card">
<table>
<thead>
<tr>
<th style="width:80px;">VLAN</th>
<th>Verkko</th>
<th>Nimi / Kuvaus</th>
<th>Sijainti</th>
<th>Tila</th>
<th>Asiakas</th>
<th>Toiminnot</th>
</tr>
</thead>
<tbody id="ipam-vlan-tbody"></tbody>
</table>
</div>
<div class="summary-bar">
<span id="ipam-vlan-count">0 VLANia</span>
</div>
</div>
</div>
</div>