Theodor-Springmann-Stiftung/musenalm
1
0
Fork 0
mirror of https://github.com/Theodor-Springmann-Stiftung/musenalm.git synced 2026-02-04 02:25:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

load more button

Browse Source
This commit is contained in:
Simon Martens
2026-01-25 16:49:39 +01:00
parent 58ef235a09
commit 5d57042edb
3 changed files with 4 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
views/routes/baende/body.gohtml
View File

@@ -73,13 +73,6 @@
selectedLetter = params.get('letter') || ''; selectedLetter = params.get('letter') || '';
sortField = params.get('sort') || sortField; sortField = params.get('sort') || sortField;
sortOrder = params.get('order') || sortOrder; sortOrder = params.get('order') || sortOrder;
const nextOffsetAttr = $event.detail.target.dataset.nextOffset;
if (nextOffsetAttr) {
const parsed = Number(nextOffsetAttr);
if (!Number.isNaN(parsed)) {
offset = parsed;
}
}
updateUrl(); updateUrl();
} }
" "

5
views/routes/baende/more/body.gohtml
View File

@@ -159,8 +159,3 @@
</td> </td>
</tr> </tr>
{{- end -}} {{- end -}}
<!-- Update count display with OOB swap -->
<div id="baende-count" class="text-lg font-semibold font-sans text-gray-600 whitespace-nowrap" hx-swap-oob="true">
{{ if $model.current_count }}{{ $model.current_count }}&thinsp;/&thinsp;{{ end }}{{ if $model.total_count }}{{ $model.total_count }}{{ else }}{{ len $model.result.Entries }}{{ end }} Bände
</div>

11
views/routes/baende/results/body.gohtml
View File

@@ -3,7 +3,7 @@
<div id="baenderesults" <div id="baenderesults"
x-data="{ hasMore: {{ if $model.has_more }}true{{ else }}false{{ end }}, offset: {{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}, loading: false }"> x-data="{ hasMore: {{ if $model.has_more }}true{{ else }}false{{ end }}, offset: {{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}, loading: false }">
<div id="baende-count" class="text-lg font-semibold font-sans text-gray-600 whitespace-nowrap" hx-swap-oob="true"> <div id="baende-count" class="text-lg font-semibold font-sans text-gray-600 whitespace-nowrap">
{{ if $model.current_count }}{{ $model.current_count }}&thinsp;/&thinsp;{{ end }}{{ if $model.total_count }}{{ $model.total_count }}{{ else }}{{ len $model.result.Entries }}{{ end }} Bände {{ if $model.current_count }}{{ $model.current_count }}&thinsp;/&thinsp;{{ end }}{{ if $model.total_count }}{{ $model.total_count }}{{ else }}{{ len $model.result.Entries }}{{ end }} Bände
</div> </div>
@@ -15,15 +15,12 @@
type="button" type="button"
class="content-action-button" class="content-action-button"
hx-get="/baende/more/?offset={{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}{{ if $model.search }}&search={{ $model.search }}{{ end }}{{ if $model.letter }}&letter={{ $model.letter }}{{ end }}&sort={{ $model.sort_field }}&order={{ $model.sort_order }}" hx-get="/baende/more/?offset={{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}{{ if $model.search }}&search={{ $model.search }}{{ end }}{{ if $model.letter }}&letter={{ $model.letter }}{{ end }}&sort={{ $model.sort_field }}&order={{ $model.sort_order }}"
hx-push-url="/baende/?offset={{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}{{ if $model.search }}&search={{ $model.search }}{{ end }}{{ if $model.letter }}&letter={{ $model.letter }}{{ end }}&sort={{ $model.sort_field }}&order={{ $model.sort_order }}"
hx-target="#baende-tbody" hx-target="#baende-tbody"
hx-swap="beforeend" hx-swap="beforeend"
hx-indicator="this" hx-indicator="this"
@htmx:before-request="loading = true" >
@htmx:after-request="loading = false; hasMore = $event.detail.xhr.getResponseHeader('X-Has-More') === 'true'; offset = {{ if $model.next_offset }}{{ $model.next_offset }}{{ else }}0{{ end }}" <i class="ri-arrow-down-line"></i>
:disabled="loading"> <span>Weitere 150 laden</span>
<i class="ri-arrow-down-line" :class="{ 'spinning': loading }"></i>
<span x-text="loading ? 'Lädt...' : 'Weitere 150 laden'"></span>
</button> </button>
</div> </div>