enhanced loading

This commit is contained in:
Julian Krauser 2025-04-08 09:37:38 +02:00
parent 9f7ef03ffd
commit 9006a46a1c

View file

@ -15,7 +15,12 @@
<div class="flex flex-col w-full h-full gap-2 justify-center px-7">
<div class="flex flex-col gap-2 grow overflow-y-scroll" @scrollend="reachedEnd">
<MissionListItem v-for="mission in missions" :key="mission.id" :mission="mission" />
<br />
<Spinner v-if="loading == 'loading'" class="mt-auto mx-auto" />
<p v-if="!hasReachedEnd" class="mt-auto mx-auto text-sm cursor-pointer select-none" @click="reachedEnd">
mehr laden?
</p>
<p v-else class="mt-auto mx-auto text-sm select-none">Ende der Liste!</p>
</div>
<div class="flex flex-row gap-4">
@ -64,8 +69,10 @@ export default defineComponent({
methods: {
...mapActions(useMissionStore, ["fetchMissions", "createMission"]),
reachedEnd() {
this.hasReachedEnd = true;
this.fetchMissions(this.missions.length);
if (!this.hasReachedEnd) {
this.hasReachedEnd = true;
this.fetchMissions(this.missions.length);
}
},
createNewMission() {
this.createMission()