diff --git a/backend/public/index.html b/backend/public/index.html
index b327fde..368bb75 100644
--- a/backend/public/index.html
+++ b/backend/public/index.html
@@ -87,6 +87,24 @@ border-radius:6px;
 
 <section>
 
+<h2>Kosten Dashboard</h2>
+
+<div id="costDashboard">
+
+Server monatlich: <span id="costMonth">0</span> €<br>
+Server jährlich: <span id="costYear">0</span> €<br>
+Domains jährlich: <span id="costDomain">0</span> €<br>
+
+<hr>
+
+<b>Gesamt jährlich: <span id="costTotal">0</span> €</b>
+
+</div>
+
+</section>
+
+<section>
+
 <h2>Active Resources</h2>
 
 <button onclick="openCreate()">Neue Resource</button>
@@ -102,6 +120,7 @@ border-radius:6px;
 <th>RAM</th>
 <th>Disk</th>
 <th>OS</th>
+<th>Domains</th>
 <th>IPs</th>
 <th>Actions</th>
 </tr>
@@ -290,6 +309,9 @@ async function loadResources(){
 
 const res=await fetch(API+"/resources/active")
 const data=await res.json()
+const mapRes=await fetch(API+"/domainmap")
+const mappings=await mapRes.json()
+
 
 const table=document.getElementById("resources")
 table.innerHTML=""
@@ -306,6 +328,12 @@ ips=r.ips.map(ip=>`
 
 }
 
+let domains=mappings
+.filter(m=>m.resource_id==r.id)
+.map(m=>`<div>${m.domain_name}</div>`)
+.join("")
+
+
 const tr=document.createElement("tr")
 
 tr.innerHTML=`
@@ -317,7 +345,7 @@ tr.innerHTML=`
 <td>${r.ram||""}</td>
 <td>${r.disk||""}</td>
 <td>${r.os||""}</td>
-
+<td>${domains}</td>
 <td>
 ${ips}
 <br>
@@ -585,7 +613,13 @@ tr.innerHTML=`
 <td>${d.domain_name}</td>
 <td>${d.provider||""}</td>
 <td>${d.ip_address||""}</td>
-<td>${d.resource_name||""}</td>
+<td>
+
+${d.resource_name ? 
+d.resource_name : 
+"<span style='color:red'>⚠ no server</span>"}
+
+</td>
 <td>${d.yearly_cost||""}</td>
 
 <td>
@@ -728,12 +762,44 @@ table.appendChild(tr)
 
 }
 
+async function loadCosts(){
+
+const res=await fetch(API+"/resources/active")
+const resources=await res.json()
+
+const domRes=await fetch(API+"/domains")
+const domains=await domRes.json()
+
+let month=0
+let year=0
+let domainYear=0
+
+resources.forEach(r=>{
+
+month+=Number(r.kosten_monat||0)
+year+=Number(r.kosten_jahr||0)
+
+})
+
+domains.forEach(d=>{
+domainYear+=Number(d.yearly_cost||0)
+})
+
+document.getElementById("costMonth").innerText=month.toFixed(2)
+document.getElementById("costYear").innerText=year.toFixed(2)
+document.getElementById("costDomain").innerText=domainYear.toFixed(2)
+
+document.getElementById("costTotal").innerText=(year+domainYear).toFixed(2)
+
+}
+
 
 
 loadResources()
 loadCancelled()
 loadDomains()
 loadMapping()
+loadCosts()
 
 </script>
 
diff --git a/backend/public/index.sav b/backend/public/index.sav
new file mode 100644
index 0000000..b327fde
--- /dev/null
+++ b/backend/public/index.sav
@@ -0,0 +1,741 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+<meta charset="UTF-8">
+<title>ResMan</title>
+
+<style>
+
+body{
+font-family:Arial;
+margin:40px;
+background:#f4f6f8;
+}
+
+h1{
+margin-bottom:30px;
+}
+
+section{
+background:white;
+padding:20px;
+margin-bottom:30px;
+border-radius:8px;
+box-shadow:0 2px 6px rgba(0,0,0,0.1);
+}
+
+table{
+width:100%;
+border-collapse:collapse;
+margin-top:10px;
+}
+
+th,td{
+padding:8px;
+border-bottom:1px solid #ddd;
+text-align:left;
+}
+
+th{
+background:#333;
+color:white;
+}
+
+button{
+padding:6px 10px;
+margin:2px;
+cursor:pointer;
+}
+
+input,textarea{
+padding:6px;
+margin:4px;
+width:95%;
+}
+
+.ip{
+background:#eee;
+padding:2px 6px;
+border-radius:4px;
+margin-right:4px;
+display:inline-block;
+}
+
+.modal{
+display:none;
+position:fixed;
+top:10%;
+left:50%;
+transform:translateX(-50%);
+background:white;
+padding:20px;
+width:600px;
+max-height:80vh;
+overflow:auto;
+box-shadow:0 10px 30px rgba(0,0,0,0.3);
+border-radius:6px;
+}
+
+</style>
+
+</head>
+
+<body>
+
+<h1>Resource Manager</h1>
+
+<section>
+
+<h2>Active Resources</h2>
+
+<button onclick="openCreate()">Neue Resource</button>
+
+<table>
+
+<thead>
+<tr>
+<th>Name</th>
+<th>Produkt</th>
+<th>Provider</th>
+<th>CPU</th>
+<th>RAM</th>
+<th>Disk</th>
+<th>OS</th>
+<th>IPs</th>
+<th>Actions</th>
+</tr>
+</thead>
+
+<tbody id="resources"></tbody>
+
+</table>
+
+</section>
+
+<section>
+
+<h2>Domains</h2>
+
+<button onclick="openDomainCreate()">Neue Domain</button>
+
+<table>
+
+<thead>
+<tr>
+<th>Domain</th>
+<th>Provider</th>
+<th>IP</th>
+<th>Server</th>
+<th>Cost/Y</th>
+<th>Actions</th>
+</tr>
+</thead>
+
+<tbody id="domains"></tbody>
+
+</table>
+
+</section>
+
+<section>
+
+<h2>Domain → Server Mapping</h2>
+
+<table>
+
+<thead>
+<tr>
+<th>Domain</th>
+<th>IP</th>
+<th>Server</th>
+</tr>
+</thead>
+
+<tbody id="mapping"></tbody>
+
+</table>
+
+</section>
+
+<section>
+
+<h2>Cancelled Resources</h2>
+
+<table>
+
+<thead>
+<tr>
+<th>Name</th>
+<th>Produkt</th>
+<th>Provider</th>
+<th>CPU</th>
+<th>RAM</th>
+<th>Disk</th>
+<th>Status</th>
+</tr>
+</thead>
+
+<tbody id="cancelled"></tbody>
+
+</table>
+
+</section>
+
+<div id="resourceModal" class="modal">
+
+<h3 id="modalTitle">Resource</h3>
+
+<input type="hidden" id="resource_id">
+
+<label>Name</label> <input id="name">
+
+<label>Produkt</label> <input id="produkt">
+
+<label>Provider</label> <input id="provider">
+
+<label>Art</label> <input id="art">
+
+<label>CPU</label> <input id="cpu">
+
+<label>RAM</label> <input id="ram">
+
+<label>Disk</label> <input id="disk">
+
+<label>OS</label> <input id="os">
+
+<label>Kosten Monat</label> <input id="kosten_monat">
+
+<label>Kosten Jahr</label> <input id="kosten_jahr">
+
+<label>Providername</label> <input id="providername">
+
+<label>IPv6 Netz</label> <input id="ipv6_net">
+
+<label>Bestelldatum</label> <input id="bestelldatum">
+
+<label>Kündbar ab</label> <input id="kuendbar_ab">
+
+<label>Kündigungsdatum</label> <input id="kuendigungsdatum">
+
+<label>Status</label> <select id="status">
+
+<option value="aktiv">aktiv</option>
+<option value="gekündigt">gekündigt</option>
+</select>
+
+<label>Bemerkung</label>
+
+<textarea id="bemerkung"></textarea>
+
+<br><br>
+
+<button onclick="saveResource()">Save</button> <button onclick="closeModal()">Cancel</button>
+
+</div>
+
+<div id="ipModal" class="modal">
+
+<h3>IP Manager</h3>
+
+<input type="hidden" id="ip_resource_id">
+
+<div id="ipList"></div>
+
+<hr>
+
+<input id="new_ip" placeholder="IP">
+<input id="new_type" placeholder="type">
+<input id="new_comment" placeholder="comment">
+
+<button onclick="saveIP()">Add</button>
+
+<br><br>
+
+<button onclick="closeIPModal()">Close</button>
+
+</div>
+
+<div id="domainModal" class="modal">
+
+<h3 id="domainModalTitle">Domain</h3>
+
+<input type="hidden" id="domain_id">
+
+<label>Domain</label> <input id="domain_name">
+
+<label>Provider</label> <input id="domain_provider">
+
+<label>IP Adresse</label> <input id="domain_ip">
+
+<label>Yearly Cost</label> <input id="domain_cost">
+
+<label>Notes</label>
+
+<textarea id="domain_notes"></textarea>
+
+<br><br>
+
+<button onclick="saveDomain()">Save</button> <button onclick="closeDomainModal()">Cancel</button>
+
+</div>
+
+<script>
+
+const API="/resman/api"
+
+
+
+async function loadResources(){
+
+const res=await fetch(API+"/resources/active")
+const data=await res.json()
+
+const table=document.getElementById("resources")
+table.innerHTML=""
+
+data.forEach(r=>{
+
+let ips=""
+
+if(Array.isArray(r.ips)){
+
+ips=r.ips.map(ip=>`
+<span class="ip">${ip.ip}</span>
+`).join("")
+
+}
+
+const tr=document.createElement("tr")
+
+tr.innerHTML=`
+
+<td>${r.name}</td>
+<td>${r.produkt||""}</td>
+<td>${r.provider||""}</td>
+<td>${r.cpu||""}</td>
+<td>${r.ram||""}</td>
+<td>${r.disk||""}</td>
+<td>${r.os||""}</td>
+
+<td>
+${ips}
+<br>
+<button onclick="openIPManager(${r.id})">Manage</button>
+</td>
+
+<td>
+
+<button onclick='openEdit(${JSON.stringify(r)})'>Edit</button>
+<button onclick="deleteResource(${r.id})">Delete</button>
+
+</td>
+
+`
+
+table.appendChild(tr)
+
+})
+
+}
+
+
+
+async function loadCancelled(){
+
+const res=await fetch(API+"/resources/cancelled")
+const data=await res.json()
+
+const table=document.getElementById("cancelled")
+
+table.innerHTML=""
+
+data.forEach(r=>{
+
+const tr=document.createElement("tr")
+
+tr.innerHTML=`
+
+<td>${r.name}</td>
+<td>${r.produkt||""}</td>
+<td>${r.provider||""}</td>
+<td>${r.cpu||""}</td>
+<td>${r.ram||""}</td>
+<td>${r.disk||""}</td>
+<td>gekündigt</td>
+
+`
+
+table.appendChild(tr)
+
+})
+
+}
+
+
+
+async function openIPManager(resourceId){
+
+document.getElementById("ip_resource_id").value=resourceId
+
+document.getElementById("ipModal").style.display="block"
+
+loadIPs(resourceId)
+
+}
+
+
+
+function closeIPModal(){
+
+document.getElementById("ipModal").style.display="none"
+
+}
+
+
+
+async function loadIPs(resourceId){
+
+const res=await fetch(`/resman/api/resources/${resourceId}/ips`)
+const ips=await res.json()
+
+const container=document.getElementById("ipList")
+
+container.innerHTML=""
+
+ips.forEach(ip=>{
+
+const div=document.createElement("div")
+
+div.innerHTML=`
+
+${ip.ip} (${ip.type||""}) ${ip.comment||""}
+
+<button onclick="deleteIP(${ip.id},${resourceId})">Delete</button>
+
+`
+
+container.appendChild(div)
+
+})
+
+}
+
+
+
+async function saveIP(){
+
+const resourceId=document.getElementById("ip_resource_id").value
+
+const ip=document.getElementById("new_ip").value
+const type=document.getElementById("new_type").value
+const comment=document.getElementById("new_comment").value
+
+await fetch(`/resman/api/resources/${resourceId}/ips`,{
+
+method:"POST",
+headers:{'Content-Type':'application/json'},
+
+body:JSON.stringify({ip,type,comment})
+
+})
+
+loadIPs(resourceId)
+loadResources()
+
+}
+
+
+
+async function deleteIP(id,res){
+
+await fetch(`/resman/api/ips/${id}`,{method:"DELETE"})
+
+loadIPs(res)
+loadResources()
+
+}
+
+
+
+async function deleteResource(id){
+
+if(!confirm("delete resource?")) return
+
+await fetch(API+"/resources/"+id,{method:"DELETE"})
+
+loadResources()
+
+}
+
+
+
+function openCreate(){
+
+document.getElementById("modalTitle").innerText="Create Resource"
+document.getElementById("resource_id").value=""
+
+document.querySelectorAll("#resourceModal input, #resourceModal textarea")
+.forEach(e=>e.value="")
+
+document.getElementById("resourceModal").style.display="block"
+
+}
+
+
+
+function openEdit(resource){
+
+document.getElementById("modalTitle").innerText="Edit Resource"
+
+document.getElementById("resource_id").value=resource.id
+
+Object.keys(resource).forEach(k=>{
+
+const el=document.getElementById(k)
+
+if(el) el.value=resource[k]||""
+
+})
+
+document.getElementById("resourceModal").style.display="block"
+
+}
+
+
+
+function closeModal(){
+
+document.getElementById("resourceModal").style.display="none"
+
+}
+
+
+
+async function saveResource(){
+
+const id=document.getElementById("resource_id").value
+
+const data={
+
+name:name.value,
+produkt:produkt.value,
+provider:provider.value,
+art:art.value,
+
+cpu:cpu.value,
+ram:ram.value,
+disk:disk.value,
+os:os.value,
+
+kosten_monat:kosten_monat.value,
+kosten_jahr:kosten_jahr.value,
+
+providername:providername.value,
+ipv6_net:ipv6_net.value,
+
+bestelldatum:bestelldatum.value,
+kuendbar_ab:kuendbar_ab.value,
+kuendigungsdatum:kuendigungsdatum.value,
+
+status:status.value,
+bemerkung:bemerkung.value
+
+}
+
+if(id){
+
+await fetch(API+"/resources/"+id,{
+method:"PUT",
+headers:{'Content-Type':'application/json'},
+body:JSON.stringify(data)
+})
+
+}else{
+
+await fetch(API+"/resources",{
+method:"POST",
+headers:{'Content-Type':'application/json'},
+body:JSON.stringify(data)
+})
+
+}
+
+closeModal()
+loadResources()
+
+}
+
+
+
+async function loadDomains(){
+
+const res=await fetch(API+"/domains")
+const data=await res.json()
+
+const table=document.getElementById("domains")
+table.innerHTML=""
+
+data.forEach(d=>{
+
+const tr=document.createElement("tr")
+
+tr.innerHTML=`
+
+<td>${d.domain_name}</td>
+<td>${d.provider||""}</td>
+<td>${d.ip_address||""}</td>
+<td>${d.resource_name||""}</td>
+<td>${d.yearly_cost||""}</td>
+
+<td>
+
+<button onclick='openDomainEdit(${JSON.stringify(d)})'>Edit</button>
+
+<button onclick="deleteDomain(${d.id})">Delete</button>
+
+</td>
+
+`
+
+table.appendChild(tr)
+
+})
+
+}
+
+
+
+function openDomainCreate(){
+
+document.getElementById("domainModalTitle").innerText="Create Domain"
+
+document.getElementById("domain_id").value=""
+
+document.getElementById("domain_name").value=""
+document.getElementById("domain_provider").value=""
+document.getElementById("domain_ip").value=""
+document.getElementById("domain_cost").value=""
+document.getElementById("domain_notes").value=""
+
+document.getElementById("domainModal").style.display="block"
+
+}
+
+
+
+function openDomainEdit(d){
+
+document.getElementById("domainModalTitle").innerText="Edit Domain"
+
+document.getElementById("domain_id").value=d.id
+
+document.getElementById("domain_name").value=d.domain_name||""
+document.getElementById("domain_provider").value=d.provider||""
+document.getElementById("domain_ip").value=d.ip_address||""
+document.getElementById("domain_cost").value=d.yearly_cost||""
+document.getElementById("domain_notes").value=d.notes||""
+
+document.getElementById("domainModal").style.display="block"
+
+}
+
+
+
+function closeDomainModal(){
+
+document.getElementById("domainModal").style.display="none"
+
+}
+
+
+
+async function saveDomain(){
+
+const id=document.getElementById("domain_id").value
+
+const data={
+
+domain_name:domain_name.value,
+provider:domain_provider.value,
+ip_address:domain_ip.value,
+yearly_cost:domain_cost.value,
+notes:domain_notes.value
+
+}
+
+if(id){
+
+await fetch(API+"/domains/"+id,{
+method:"PUT",
+headers:{'Content-Type':'application/json'},
+body:JSON.stringify(data)
+})
+
+}else{
+
+await fetch(API+"/domains",{
+method:"POST",
+headers:{'Content-Type':'application/json'},
+body:JSON.stringify(data)
+})
+
+}
+
+closeDomainModal()
+
+loadDomains()
+loadMapping()
+
+}
+
+
+
+async function deleteDomain(id){
+
+await fetch(API+"/domains/"+id,{method:"DELETE"})
+
+loadDomains()
+loadMapping()
+
+}
+
+
+
+async function loadMapping(){
+
+const res=await fetch(API+"/domainmap")
+const data=await res.json()
+
+const table=document.getElementById("mapping")
+table.innerHTML=""
+
+data.forEach(m=>{
+
+const tr=document.createElement("tr")
+
+tr.innerHTML=`
+
+<td>${m.domain_name}</td>
+<td>${m.ip_address}</td>
+<td>${m.server_name||""}</td>
+
+`
+
+table.appendChild(tr)
+
+})
+
+}
+
+
+
+loadResources()
+loadCancelled()
+loadDomains()
+loadMapping()
+
+</script>
+
+</body>
+</html>
