fix: ⚗️ messaging pagination
This commit is contained in:
parent
e5606ef249
commit
dae60381be
3 changed files with 39 additions and 31 deletions
|
@ -2,6 +2,7 @@ version: "3"
|
||||||
|
|
||||||
services:
|
services:
|
||||||
web:
|
web:
|
||||||
|
image: thatonecalculator/calckey
|
||||||
build: .
|
build: .
|
||||||
restart: always
|
restart: always
|
||||||
links:
|
links:
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "calckey",
|
"name": "calckey",
|
||||||
"version": "12.119.0-calc.6.5",
|
"version": "12.119.0-calc.7",
|
||||||
"codename": "aqua",
|
"codename": "aqua",
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
|
|
|
@ -3,11 +3,12 @@
|
||||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||||
<MkSpacer :content-max="800">
|
<MkSpacer :content-max="800">
|
||||||
<div v-size="{ max: [400] }" class="yweeujhr">
|
<div v-size="{ max: [400] }" class="yweeujhr">
|
||||||
<MkButton primary class="start" @click="start"><i class="fas fa-plus"></i> {{ $ts.startMessaging }}</MkButton>
|
<MkButton primary class="start" @click="start"><i class="fas fa-plus"></i> {{ i18n.ts.startMessaging }}</MkButton>
|
||||||
|
|
||||||
<div v-if="messages.length > 0" class="history">
|
<div v-if="messages.length > 0" class="history">
|
||||||
|
<MkPagination v-slot="{items}" :pagination="pagination">
|
||||||
<MkA
|
<MkA
|
||||||
v-for="(message, i) in messages"
|
v-for="(message, i) in items"
|
||||||
:key="message.id"
|
:key="message.id"
|
||||||
v-anim="i"
|
v-anim="i"
|
||||||
class="message _block"
|
class="message _block"
|
||||||
|
@ -28,17 +29,18 @@
|
||||||
</header>
|
</header>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<p class="text">
|
<p class="text">
|
||||||
<span v-if="isMe(message)" class="me">{{ $ts.you }}: </span>
|
<span v-if="isMe(message)" class="me">{{ i18n.ts.you }}: </span>
|
||||||
<span v-if="message.text != null && message.text.length > 0">{{ message.text }}</span>
|
<span v-if="message.text != null && message.text.length > 0">{{ message.text }}</span>
|
||||||
<span v-else> 📎</span>
|
<span v-else> 📎</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</MkA>
|
</MkA>
|
||||||
|
</MkPagination>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!fetching && messages.length == 0" class="_fullinfo">
|
<div v-if="!fetching && messages.length == 0" class="_fullinfo">
|
||||||
<img src="/static-assets/badges/info.png" class="_ghost" alt="Info"/>
|
<img src="/static-assets/badges/info.png" class="_ghost" alt="Info"/>
|
||||||
<div>{{ $ts.noHistory }}</div>
|
<div>{{ i18n.ts.noHistory }}</div>
|
||||||
</div>
|
</div>
|
||||||
<MkLoading v-if="fetching"/>
|
<MkLoading v-if="fetching"/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -67,6 +69,11 @@ let connection = $ref(null);
|
||||||
|
|
||||||
const getAcct = Acct.toString;
|
const getAcct = Acct.toString;
|
||||||
|
|
||||||
|
const pagination = {
|
||||||
|
endpoint: 'messaging' as const,
|
||||||
|
limit: 10,
|
||||||
|
};
|
||||||
|
|
||||||
function isMe(message) {
|
function isMe(message) {
|
||||||
return message.userId === $i.id;
|
return message.userId === $i.id;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue