fix: ⏪
This commit is contained in:
parent
78bd658a4f
commit
c9792492cb
3 changed files with 15 additions and 48 deletions
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "calckey",
|
||||
"version": "12.118.1-calc.2-beta.2-rc.14",
|
||||
"version": "12.118.1-calc.2-beta.2-rc.15",
|
||||
"codename": "aqua",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<template v-if="metadata">
|
||||
<div v-if="!hideTitle" class="titleContainer" @click="showTabsPopup">
|
||||
<MkAvatar v-if="metadata.avatar" class="avatar" :user="metadata.avatar" :disable-preview="true" :show-indicator="true"/>
|
||||
<i v-else-if="metadata.icon" class="icon" :class="metadata.icon"></i>
|
||||
<i v-else-if="metadata.icon && !narrow" class="icon" :class="metadata.icon"></i>
|
||||
|
||||
<div class="title">
|
||||
<MkUserName v-if="metadata.userName" :user="metadata.userName" :nowrap="true" class="title"/>
|
||||
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
<div class="tabs">
|
||||
<button v-for="tab in tabs" :ref="(el) => tabRefs[tab.key] = el" v-tooltip.noDelay="tab.title" class="tab _button" :class="{ active: tab.key != null && tab.key === props.tab }" @mousedown="(ev) => onTabMousedown(tab, ev)" @click="(ev) => onTabClick(tab, ev)">
|
||||
<i v-if="tab.icon && !narrow" class="icon" :class="tab.icon"></i>
|
||||
<i v-if="tab.icon" class="icon" :class="tab.icon"></i>
|
||||
<span v-if="!tab.iconOnly && !narrow" class="title">{{ tab.title }}</span>
|
||||
</button>
|
||||
<div ref="tabHighlightEl" class="highlight"></div>
|
||||
|
|
|
@ -9,25 +9,15 @@
|
|||
/>
|
||||
</template>
|
||||
<MkSpacer :content-max="800">
|
||||
<swiper
|
||||
:modules="[Virtual]"
|
||||
:space-between="20"
|
||||
:virtual="true"
|
||||
@swiper="setSwiperRef"
|
||||
>
|
||||
<swiper-slide>
|
||||
<XNotifications class="notifications" :include-types="includeTypes" :unread-only="false"/>
|
||||
</swiper-slide>
|
||||
<swiper-slide>
|
||||
<XNotifications class="notifications" :include-types="includeTypes" :unread-only="true"/>
|
||||
</swiper-slide>
|
||||
<swiper-slide>
|
||||
<div v-if="tab === 'all' || tab === 'unread'">
|
||||
<XNotifications class="notifications" :include-types="includeTypes" :unread-only="unreadOnly"/>
|
||||
</div>
|
||||
<div v-else-if="tab === 'mentions'">
|
||||
<XNotes :pagination="mentionsPagination"/>
|
||||
</swiper-slide>
|
||||
<swiper-slide>
|
||||
</div>
|
||||
<div v-else-if="tab === 'directNotes'">
|
||||
<XNotes :pagination="directNotesPagination"/>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
@ -35,30 +25,21 @@
|
|||
<script lang="ts" setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import { notificationTypes } from 'misskey-js';
|
||||
import { Virtual } from 'swiper';
|
||||
import { Swiper, SwiperSlide } from 'swiper/vue';
|
||||
import XNotifications from '@/components/MkNotifications.vue';
|
||||
import XNotes from '@/components/MkNotes.vue';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata';
|
||||
import { deviceKind } from '@/scripts/device-kind';
|
||||
import 'swiper/scss';
|
||||
import 'swiper/scss/virtual';
|
||||
|
||||
let tab = $ref('all');
|
||||
let includeTypes = $ref<string[] | null>(null);
|
||||
let unreadOnly = $computed(() => tab === 'unread');
|
||||
os.api('notifications/mark-all-as-read');
|
||||
|
||||
const tab = $computed({
|
||||
get: () => 'all',
|
||||
set: (x) => {
|
||||
syncSlide(['all', 'unread', 'mentions', 'directNotes'].indexOf(x));
|
||||
},
|
||||
});
|
||||
|
||||
const MOBILE_THRESHOLD = 500;
|
||||
const isMobile = ref(
|
||||
deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD,
|
||||
deviceKind === 'smartphone' || window.innerWidth <= MOBILE_THRESHOLD
|
||||
);
|
||||
window.addEventListener('resize', () => {
|
||||
isMobile.value =
|
||||
|
@ -113,34 +94,20 @@ const headerTabs = $computed(() => [{
|
|||
key: 'all',
|
||||
title: i18n.ts.all,
|
||||
icon: 'fas fa-bell',
|
||||
iconOnly: true,
|
||||
}, {
|
||||
key: 'unread',
|
||||
title: i18n.ts.unread,
|
||||
icon: 'fas fa-exclamation',
|
||||
iconOnly: true,
|
||||
}, {
|
||||
key: 'mentions',
|
||||
title: i18n.ts.mentions,
|
||||
icon: 'fas fa-at',
|
||||
iconOnly: true,
|
||||
}, {
|
||||
key: 'directNotes',
|
||||
title: i18n.ts.directNotes,
|
||||
icon: 'fas fa-envelope',
|
||||
iconOnly: true,
|
||||
}]);
|
||||
|
||||
let swiperRef = null;
|
||||
|
||||
function setSwiperRef(swiper) {
|
||||
swiperRef = swiper;
|
||||
}
|
||||
|
||||
function syncSlide(index) {
|
||||
swiperRef.slideTo(index);
|
||||
}
|
||||
|
||||
definePageMetadata(computed(() => ({
|
||||
title: i18n.ts.notifications,
|
||||
icon: 'fas fa-bell',
|
||||
|
|
Loading…
Reference in a new issue