misskey/packages/frontend/src/pages/qr.vue

51 lines
1.2 KiB
Vue

<!--
SPDX-FileCopyrightText: syuilo and misskey-project
SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<PageWithHeader v-model:tab="tab" :class="$style.root" :tabs="headerTabs" :swipable="true">
<MkQrShow v-if="tab === 'show'"/>
<MkQrRead v-else-if="tab === 'read'"/>
<MkError v-else-if="error" :error="error"/>
<MkLoading v-else/>
</PageWithHeader>
</template>
<script lang="ts" setup>
import { defineAsyncComponent, ref, shallowRef } from 'vue';
import { definePage } from '@/page.js';
import { i18n } from '@/i18n.js';
import { ensureSignin } from '@/i';
import MkQrShow from './qr.show.vue';
// router definitionでloginRequiredが設定されているためエラーハンドリングしない
const $i = ensureSignin();
const tab = ref<'read' | 'show'>('show');
const error = ref<any>(null);
const MkQrRead = defineAsyncComponent(() => import('./qr.read.vue'));
const headerTabs = [{
key: 'show',
title: i18n.ts._qr.showTabTitle,
icon: 'ti ti-qrcode',
}, {
key: 'read',
title: i18n.ts._qr.readTabTitle,
icon: 'ti ti-scan',
}];
definePage(() => ({
title: i18n.ts.qr,
icon: 'ti ti-qrcode',
}));
</script>
<style lang="scss" module>
.root {
height: 100%;
}
</style>