fix: 改名按钮加边框文字、取消时恢复名字显示

internal/web/ui/templates/device.html

@@ -49,7 +49,7 @@
       {{if .Device.Online}}<span class="pill ok">在线</span>{{else}}<span class="pill bad">离线</span>{{end}}
     </div>
     <div class="info-list">
-      <div><span>设备名称</span><strong style="display:flex;align-items:center;gap:6px"><span>{{displayDeviceName .Device .ConfigStatus}}</span><span class="btn-icon ghost" style="font-size:11px;cursor:pointer" onclick="editDeviceName(this,'{{.Device.DeviceID}}')">✎</span></strong></div>
+      <div><span>设备名称</span><strong style="display:flex;align-items:center;gap:6px"><span>{{displayDeviceName .Device .ConfigStatus}}</span><span class="btn-icon" style="font-size:11px;cursor:pointer;color:var(--primary);border:1px solid var(--border);border-radius:4px;padding:0 6px;line-height:20px" onclick="editDeviceName(this,'{{.Device.DeviceID}}')">✎ 改名</span></strong></div>
       <div><span>设备 ID</span><strong class="mono">{{.Device.DeviceID}}</strong></div>
       <div><span>管理地址</span><strong class="mono">{{.Device.IP}}:{{.Device.AgentPort}}</strong></div>
       <div><span>视频端口</span><strong class="mono">{{.Device.MediaPort}}</strong></div>
@@ -262,8 +262,9 @@ function editDeviceName(el, deviceID) {
   function save() {
     var name = input.value.trim();
     input.remove();
+    nameSpan.style.display = '';
     el.style.display = '';
-    if (!name || name === current) { input.remove(); el.style.display = ''; return; }
+    if (!name || name === current) return;
     var form = document.createElement('form');
     form.method = 'POST';
     form.action = '/devices/' + deviceID + '/alias';
@@ -276,7 +277,7 @@ function editDeviceName(el, deviceID) {
     form.submit();
   }
   input.addEventListener('blur', save);
-  input.addEventListener('keydown', function(e) { if (e.key === 'Enter') save(); if (e.key === 'Escape') { input.remove(); el.style.display = ''; } });
+  input.addEventListener('keydown', function(e) { if (e.key === 'Enter') save(); if (e.key === 'Escape') { input.remove(); nameSpan.style.display = ''; el.style.display = ''; } });
 }
 </script>
 {{end}}