mirror of
https://iceshrimp.dev/crimekillz/trashposs
synced 2024-11-22 08:53:48 +01:00
chore: reformat messaging/index.vue
This commit is contained in:
parent
b360a47310
commit
bb5e3450a5
@ -1,39 +1,43 @@
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<div>
|
||||
<MkSpacer :content-max="800">
|
||||
<swiper
|
||||
:modules="[Virtual]"
|
||||
:space-between="20"
|
||||
:virtual="true"
|
||||
:allow-touch-move="!(deviceKind === 'desktop' && !defaultStore.state.swipeOnDesktop)"
|
||||
@swiper="setSwiperRef"
|
||||
@slide-change="onSlideChange"
|
||||
>
|
||||
<swiper-slide>
|
||||
<div class="_content yweeujhr dms">
|
||||
<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
|
||||
<MkPagination v-slot="{items}" :externalItemArray="messages" :pagination="dmsPagination">
|
||||
<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block" :message="message"/>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
<swiper-slide>
|
||||
<div class="_content yweeujhr groups">
|
||||
<div class="groupsbuttons">
|
||||
<MkButton primary class="start" :link="true" to="/my/groups"><i class="ph-user-circle-gear-bold ph-lg"></i> {{ i18n.ts.manageGroups }}</MkButton>
|
||||
<MkButton primary class="start" @click="startGroup"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
|
||||
<MkStickyContainer>
|
||||
<template #header>
|
||||
<MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs" />
|
||||
</template>
|
||||
<div>
|
||||
<MkSpacer :content-max="800">
|
||||
<swiper :modules="[Virtual]" :space-between="20" :virtual="true"
|
||||
:allow-touch-move="!(deviceKind === 'desktop' && !defaultStore.state.swipeOnDesktop)" @swiper="setSwiperRef"
|
||||
@slide-change="onSlideChange">
|
||||
<swiper-slide>
|
||||
<div class="_content yweeujhr dms">
|
||||
<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{
|
||||
i18n.ts.startMessaging
|
||||
}}</MkButton>
|
||||
<MkPagination v-slot="{ items }" :externalItemArray="messages" :pagination="dmsPagination">
|
||||
<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block"
|
||||
:message="message" />
|
||||
</MkPagination>
|
||||
</div>
|
||||
<MkPagination v-slot="{items}" :externalItemArray="groupMessages" :pagination="groupsPagination">
|
||||
<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block" :message="message"/>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
</MkStickyContainer>
|
||||
</swiper-slide>
|
||||
<swiper-slide>
|
||||
<div class="_content yweeujhr groups">
|
||||
<div class="groupsbuttons">
|
||||
<MkButton primary class="start" :link="true" to="/my/groups"><i
|
||||
class="ph-user-circle-gear-bold ph-lg"></i> {{ i18n.ts.manageGroups }}</MkButton>
|
||||
<MkButton primary class="start" @click="startGroup"><i class="ph-plus-bold ph-lg"></i> {{
|
||||
i18n.ts.startMessaging
|
||||
}}</MkButton>
|
||||
</div>
|
||||
<MkPagination v-slot="{ items }" :externalItemArray="groupMessages" :pagination="groupsPagination">
|
||||
<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block"
|
||||
:message="message" />
|
||||
</MkPagination>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
@ -106,7 +110,7 @@ function onMessage(message): void {
|
||||
if (message.recipientId) {
|
||||
messages = messages.filter(m => !(
|
||||
(m.recipientId === message.recipientId && m.userId === message.userId) ||
|
||||
(m.recipientId === message.userId && m.userId === message.recipientId)));
|
||||
(m.recipientId === message.userId && m.userId === message.recipientId)));
|
||||
|
||||
messages.unshift(message);
|
||||
} else if (message.groupId) {
|
||||
@ -206,17 +210,17 @@ onUnmounted(() => {
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.yweeujhr {
|
||||
> .start {
|
||||
margin: 0 auto var(--margin) auto;
|
||||
}
|
||||
|
||||
> .groupsbuttons {
|
||||
max-width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
.yweeujhr {
|
||||
>.start {
|
||||
margin: 0 auto var(--margin) auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
>.groupsbuttons {
|
||||
max-width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user