1
1
mirror of https://github.com/kokonect-link/cherrypick synced 2024-12-16 15:48:23 +09:00
cherrypick/packages/client/src/pages/about.vue
syuilo 0e4a111f81 refactoring
Resolve #7779
2021-11-12 02:02:25 +09:00

124 lines
3.1 KiB
Vue

<template>
<FormBase>
<div class="_debobigegoItem">
<div class="_debobigegoPanel fwhjspax">
<img :src="$instance.iconUrl || $instance.faviconUrl || '/favicon.ico'" alt="" class="icon"/>
<span class="name">{{ $instance.name || host }}</span>
</div>
</div>
<FormTextarea readonly :value="$instance.description">
</FormTextarea>
<FormGroup>
<FormKeyValueView>
<template #key>Misskey</template>
<template #value>v{{ version }}</template>
</FormKeyValueView>
<FormLink to="/about-misskey">{{ $ts.aboutMisskey }}</FormLink>
</FormGroup>
<FormGroup>
<FormKeyValueView>
<template #key>{{ $ts.administrator }}</template>
<template #value>{{ $instance.maintainerName }}</template>
</FormKeyValueView>
<FormKeyValueView>
<template #key>{{ $ts.contact }}</template>
<template #value>{{ $instance.maintainerEmail }}</template>
</FormKeyValueView>
</FormGroup>
<FormLink v-if="$instance.tosUrl" :to="$instance.tosUrl" external>{{ $ts.tos }}</FormLink>
<FormSuspense :p="initStats">
<FormGroup>
<template #label>{{ $ts.statistics }}</template>
<FormKeyValueView>
<template #key>{{ $ts.users }}</template>
<template #value>{{ number(stats.originalUsersCount) }}</template>
</FormKeyValueView>
<FormKeyValueView>
<template #key>{{ $ts.notes }}</template>
<template #value>{{ number(stats.originalNotesCount) }}</template>
</FormKeyValueView>
</FormGroup>
</FormSuspense>
<FormGroup>
<template #label>Well-known resources</template>
<FormLink :to="`/.well-known/host-meta`" external>host-meta</FormLink>
<FormLink :to="`/.well-known/host-meta.json`" external>host-meta.json</FormLink>
<FormLink :to="`/.well-known/nodeinfo`" external>nodeinfo</FormLink>
<FormLink :to="`/robots.txt`" external>robots.txt</FormLink>
<FormLink :to="`/manifest.json`" external>manifest.json</FormLink>
</FormGroup>
</FormBase>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { version, instanceName } from '@/config';
import FormLink from '@/components/debobigego/link.vue';
import FormBase from '@/components/debobigego/base.vue';
import FormGroup from '@/components/debobigego/group.vue';
import FormKeyValueView from '@/components/debobigego/key-value-view.vue';
import FormTextarea from '@/components/debobigego/textarea.vue';
import FormSuspense from '@/components/debobigego/suspense.vue';
import * as os from '@/os';
import number from '@/filters/number';
import * as symbols from '@/symbols';
import { host } from '@/config';
export default defineComponent({
components: {
FormBase,
FormGroup,
FormLink,
FormKeyValueView,
FormTextarea,
FormSuspense,
},
data() {
return {
[symbols.PAGE_INFO]: {
title: this.$ts.instanceInfo,
icon: 'fas fa-info-circle'
},
host,
version,
instanceName,
stats: null,
initStats: () => os.api('stats', {
}).then((stats) => {
this.stats = stats;
})
}
},
methods: {
number
}
});
</script>
<style lang="scss" scoped>
.fwhjspax {
padding: 16px;
text-align: center;
> .icon {
display: block;
margin: auto;
height: 64px;
border-radius: 8px;
}
> .name {
display: block;
margin-top: 12px;
}
}
</style>