style: inline edit fields, X close button, confirm delete photo
This commit is contained in:
parent
aacf5c80f6
commit
d7bd252044
@ -79,20 +79,20 @@
|
||||
</div>
|
||||
|
||||
<div id="edit-modal" style="display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1000;align-items:center;justify-content:center">
|
||||
<div class="card" style="max-width:500px;width:90%;max-height:80vh;overflow-y:auto">
|
||||
<h3 style="margin-bottom:12px">编辑人员</h3>
|
||||
<form method="post" action="/ui/face-gallery/rename" style="margin-bottom:12px">
|
||||
<div class="card" style="max-width:500px;width:90%;max-height:80vh;overflow-y:auto;position:relative">
|
||||
<button class="btn ghost" type="button" onclick="closeEdit()" style="position:absolute;top:8px;right:8px;font-size:16px;padding:2px 8px;line-height:1">×</button>
|
||||
<h3 style="margin-bottom:8px">编辑人员</h3>
|
||||
<form method="post" action="/ui/face-gallery/rename" style="margin-bottom:12px;display:flex;gap:8px;align-items:flex-end">
|
||||
<input type="hidden" name="id" id="edit-id">
|
||||
<div class="field-grid"><label class="full"><span>姓名</span><input type="text" name="name" id="edit-name" required /></label></div>
|
||||
<div class="actions" style="margin-top:8px"><button class="btn" type="submit">保存姓名</button></div>
|
||||
<label style="flex:1;margin:0"><span class="small muted" style="display:block;margin-bottom:4px">姓名</span><input type="text" name="name" id="edit-name" required /></label>
|
||||
<button class="btn" type="submit" style="margin-bottom:1px">保存</button>
|
||||
</form>
|
||||
<div id="edit-photos" style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px"></div>
|
||||
<form method="post" action="/ui/face-gallery/add-photo" enctype="multipart/form-data">
|
||||
<form method="post" action="/ui/face-gallery/add-photo" enctype="multipart/form-data" style="display:flex;gap:8px;align-items:flex-end">
|
||||
<input type="hidden" name="id" id="add-photo-id">
|
||||
<div class="field-grid"><label><span>添加照片</span><input type="file" name="photo" accept="image/*" /></label></div>
|
||||
<div class="actions" style="margin-top:8px"><button class="btn ghost" type="submit">上传</button></div>
|
||||
<label style="flex:1;margin:0"><span class="small muted" style="display:block;margin-bottom:4px">添加照片</span><input type="file" name="photo" accept="image/*" /></label>
|
||||
<button class="btn ghost" type="submit" style="margin-bottom:1px">上传</button>
|
||||
</form>
|
||||
<div class="actions" style="margin-top:12px"><button class="btn ghost" type="button" onclick="closeEdit()">关闭</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -115,7 +115,7 @@ function editPerson(id, name, photos) {
|
||||
document.getElementById('edit-name').value = name;
|
||||
document.getElementById('add-photo-id').value = id;
|
||||
var ph = document.getElementById('edit-photos');
|
||||
ph.innerHTML = photos.map(function(p,i) { return '<div style="position:relative;width:80px;height:100px"><img src="'+p+'" style="width:100%;height:100%;object-fit:cover;border-radius:4px">' + '<button class="btn ghost" style="position:absolute;top:2px;right:2px;font-size:10px;padding:1px 3px;color:red;background:rgba(0,0,0,0.5)" onclick="return confirm(\'删除这张照片?\')">x</button></div>'; }).join('');
|
||||
ph.innerHTML = photos.map(function(p,i) { return '<div style="position:relative;width:80px;height:100px"><img src="'+p+'" style="width:100%;height:100%;object-fit:cover;border-radius:4px"><button class="btn ghost" style="position:absolute;top:2px;right:2px;font-size:10px;padding:1px 3px;color:red;background:rgba(0,0,0,0.5)" onclick="if(confirm(\'删除这张照片?\')) this.parentElement.remove()">×</button></div>'; }).join('');
|
||||
document.getElementById('edit-modal').style.display = 'flex';
|
||||
}
|
||||
function closeEdit() { document.getElementById('edit-modal').style.display = 'none'; }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user