feat: photo count + smart nav button visibility
This commit is contained in:
parent
77b092d946
commit
aacf5c80f6
@ -53,16 +53,16 @@
|
||||
{{if .Photos}}
|
||||
<img src="/ui/face-photo/{{index .Photos 0}}" style="width:100%;height:100%;object-fit:cover" id="img-{{.ID}}" />
|
||||
{{if gt .PhotoCount 1}}
|
||||
<button class="btn ghost" style="position:absolute;left:2px;top:50%;transform:translateY(-50%);padding:2px 4px;font-size:10px;opacity:0.7" onclick="prevPhoto({{.ID}})">◀</button>
|
||||
<button class="btn ghost" style="position:absolute;right:2px;top:50%;transform:translateY(-50%);padding:2px 4px;font-size:10px;opacity:0.7" onclick="nextPhoto({{.ID}})">▶</button>
|
||||
<button class="btn ghost nav-btn" id="prev-{{.ID}}" style="position:absolute;left:2px;top:50%;transform:translateY(-50%);padding:2px 4px;font-size:10px;opacity:0.7;display:none" onclick="navPhoto({{.ID}},-1)">◀</button>
|
||||
<button class="btn ghost nav-btn" id="next-{{.ID}}" style="position:absolute;right:2px;top:50%;transform:translateY(-50%);padding:2px 4px;font-size:10px;opacity:0.7" onclick="navPhoto({{.ID}},1)">▶</button>
|
||||
{{end}}
|
||||
{{else}}
|
||||
<div class="muted" style="display:flex;align-items:center;justify-content:center;height:100%">无照片</div>
|
||||
{{end}}
|
||||
</div>
|
||||
<div style="margin-top:6px;display:flex;justify-content:space-between;align-items:center">
|
||||
<span style="font-weight:500;font-size:13px">{{.Name}}</span>
|
||||
<div class="actions compact">
|
||||
<div style="margin-top:6px">
|
||||
<div style="font-weight:500;font-size:13px">{{.Name}} <span class="muted small">{{.PhotoCount}}张</span></div>
|
||||
<div class="actions compact" style="margin-top:4px">
|
||||
<button class="btn ghost" type="button" style="font-size:11px;padding:2px 6px" onclick="editPerson({{.ID}},'{{.Name}}',[{{range $i,$p := .Photos}}{{if $i}},{{end}}'/ui/face-photo/{{$p}}'{{end}}])">编辑</button>
|
||||
<form method="post" action="/ui/face-gallery/delete" style="display:inline" onsubmit="return confirm('确定删除 {{.Name}}?')">
|
||||
<input type="hidden" name="id" value="{{.ID}}">
|
||||
@ -103,15 +103,12 @@ document.querySelectorAll('.photo-viewer').forEach(function(el) {
|
||||
var id = el.querySelector('img') ? el.querySelector('img').id.replace('img-','') : '';
|
||||
if (id) photoData[id] = {photos: photos, idx: 0};
|
||||
});
|
||||
function prevPhoto(id) {
|
||||
function navPhoto(id, dir) {
|
||||
var d = photoData[id]; if (!d || d.photos.length<2) return;
|
||||
d.idx = (d.idx - 1 + d.photos.length) % d.photos.length;
|
||||
document.getElementById('img-'+id).src = d.photos[d.idx];
|
||||
}
|
||||
function nextPhoto(id) {
|
||||
var d = photoData[id]; if (!d || d.photos.length<2) return;
|
||||
d.idx = (d.idx + 1) % d.photos.length;
|
||||
d.idx = (d.idx + dir + d.photos.length) % d.photos.length;
|
||||
document.getElementById('img-'+id).src = d.photos[d.idx];
|
||||
document.getElementById('prev-'+id).style.display = d.idx === 0 ? 'none' : '';
|
||||
document.getElementById('next-'+id).style.display = d.idx === d.photos.length-1 ? 'none' : '';
|
||||
}
|
||||
function editPerson(id, name, photos) {
|
||||
document.getElementById('edit-id').value = id;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user