qinglong
c4e2783120
- Add projects + proxy nav items to sidebar - Rewrite projects.html with MD3 cards + tabs + mgmt-cards - Rewrite proxy.html with MD3 form + mgmt-cards - CSS: button ripple, card elevation, page fade, tab slide, input glow, nav dot, status pulse, log entry fade, shimmer, scrollbar, badge bounce, card hover mouse-glow (428 lines)
33 lines
1.8 KiB
HTML
33 lines
1.8 KiB
HTML
<div>
|
|
<h2 style="margin-bottom:16px">🔀 反向代理</h2>
|
|
|
|
<div class="card outlined" style="max-width:520px;margin-bottom:16px">
|
|
<h3 style="margin-bottom:12px">添加代理</h3>
|
|
<div class="input-group"><span class="label">框架路径</span><input class="input" id="px-path" placeholder="/app"></div>
|
|
<div class="input-group"><span class="label">目标 URL</span><input class="input" id="px-target" placeholder="http://192.168.1.5:8080"></div>
|
|
<div class="input-group"><span class="label">描述 (可选)</span><input class="input" id="px-desc" placeholder="我的应用"></div>
|
|
<button class="btn btn-filled" onclick="addP()">添加代理</button>
|
|
</div>
|
|
|
|
<div id="proxy-list" style="display:flex;flex-direction:column;gap:12px">加载中...</div>
|
|
</div>
|
|
|
|
<script>
|
|
function refresh(){
|
|
fetch("/SenSu/api/proxy").then(r=>r.json()).then(d=>{
|
|
var h="";
|
|
for(var p of d.proxies||[]){
|
|
h+='<div class="mgmt-card"><div class="status-dot status-running"></div><div class="info"><b>'+p.path+'</b><br><small>→ '+p.target+(p.description?" ("+p.description+")":"")+(p.external?" 🌐":"")+'</small></div><div class="actions"><button class="btn btn-sm btn-danger" onclick="delP(\"'+p.path+'\")">删除</button></div></div>';
|
|
}
|
|
document.getElementById("proxy-list").innerHTML=h||"暂无代理"
|
|
})
|
|
}
|
|
function addP(){
|
|
var p=document.getElementById("px-path").value,t=document.getElementById("px-target").value;
|
|
if(!p||!t){alert("请填写");return}
|
|
fetch("/SenSu/api/proxy",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:p,target:t,description:document.getElementById("px-desc").value})}).then(r=>r.json()).then(d=>{if(d.ok)refresh()})
|
|
}
|
|
function delP(path){fetch("/SenSu/api/proxy/"+encodeURIComponent(path),{method:"DELETE"}).then(()=>refresh())}
|
|
refresh();
|
|
</script>
|