enhance(frontend): 유저 페이지 개선
This commit is contained in:
parent
ccb2ef4bc1
commit
5d396a7c1e
|
@ -148,7 +148,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<XFiles :key="user.id" :user="user"/>
|
<XFiles :key="user.id" :user="user"/>
|
||||||
<XActivity :key="user.id" :user="user"/>
|
<XActivity :key="user.id" :user="user"/>
|
||||||
</template>
|
</template>
|
||||||
<MkNotes v-if="!disableNotes" :class="$style.tl" :noGap="true" :pagination="pagination"/>
|
<XTimeline v-if="!disableNotes" :user="user"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;">
|
<div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;">
|
||||||
|
@ -204,6 +204,7 @@ function calcAge(birthdate: string): number {
|
||||||
|
|
||||||
const XFiles = defineAsyncComponent(() => import('./index.files.vue'));
|
const XFiles = defineAsyncComponent(() => import('./index.files.vue'));
|
||||||
const XActivity = defineAsyncComponent(() => import('./index.activity.vue'));
|
const XActivity = defineAsyncComponent(() => import('./index.activity.vue'));
|
||||||
|
const XTimeline = defineAsyncComponent(() => import('./index.timeline.vue'));
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
user: Misskey.entities.UserDetailed;
|
user: Misskey.entities.UserDetailed;
|
||||||
|
@ -233,14 +234,6 @@ watch($$(moderationNote), async () => {
|
||||||
await os.api('admin/update-user-note', { userId: props.user.id, text: moderationNote });
|
await os.api('admin/update-user-note', { userId: props.user.id, text: moderationNote });
|
||||||
});
|
});
|
||||||
|
|
||||||
const pagination = {
|
|
||||||
endpoint: 'users/notes' as const,
|
|
||||||
limit: 10,
|
|
||||||
params: computed(() => ({
|
|
||||||
userId: props.user.id,
|
|
||||||
})),
|
|
||||||
};
|
|
||||||
|
|
||||||
const style = $computed(() => {
|
const style = $computed(() => {
|
||||||
if (props.user.bannerUrl == null) return {};
|
if (props.user.bannerUrl == null) return {};
|
||||||
return {
|
return {
|
||||||
|
@ -746,12 +739,6 @@ onUnmounted(() => {
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style lang="scss" module>
|
<style lang="scss" module>
|
||||||
.tl {
|
|
||||||
background: var(--bg);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
overflow: clip;
|
|
||||||
}
|
|
||||||
|
|
||||||
.verifiedLink {
|
.verifiedLink {
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
color: var(--success);
|
color: var(--success);
|
||||||
|
|
|
@ -4,8 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<MkSpacer :contentMax="800" style="padding-top: 0">
|
<MkStickyContainer>
|
||||||
<MkStickyContainer>
|
|
||||||
<template #header>
|
<template #header>
|
||||||
<MkTab v-model="include" :class="$style.tab">
|
<MkTab v-model="include" :class="$style.tab">
|
||||||
<option :value="null">{{ i18n.ts.notes }}</option>
|
<option :value="null">{{ i18n.ts.notes }}</option>
|
||||||
|
@ -16,8 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</template>
|
</template>
|
||||||
<MkNotes v-if="include === 'featured'" :noGap="true" :pagination="featuredPagination" :class="$style.tl"/>
|
<MkNotes v-if="include === 'featured'" :noGap="true" :pagination="featuredPagination" :class="$style.tl"/>
|
||||||
<MkNotes v-else :noGap="true" :pagination="pagination" :class="$style.tl"/>
|
<MkNotes v-else :noGap="true" :pagination="pagination" :class="$style.tl"/>
|
||||||
</MkStickyContainer>
|
</MkStickyContainer>
|
||||||
</MkSpacer>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
|
|
@ -12,7 +12,6 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
<div>
|
<div>
|
||||||
<div v-if="user">
|
<div v-if="user">
|
||||||
<XHome v-if="tab === 'home'" :user="user"/>
|
<XHome v-if="tab === 'home'" :user="user"/>
|
||||||
<XTimeline v-else-if="tab === 'notes'" :user="user"/>
|
|
||||||
<XEvent v-else-if="tab === 'events'" :user="user"/>
|
<XEvent v-else-if="tab === 'events'" :user="user"/>
|
||||||
<XActivity v-else-if="tab === 'activity'" :user="user"/>
|
<XActivity v-else-if="tab === 'activity'" :user="user"/>
|
||||||
<XAchievements v-else-if="tab === 'achievements'" :user="user"/>
|
<XAchievements v-else-if="tab === 'achievements'" :user="user"/>
|
||||||
|
@ -50,7 +49,6 @@ window.addEventListener('resize', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
const XHome = defineAsyncComponent(() => import('./home.vue'));
|
const XHome = defineAsyncComponent(() => import('./home.vue'));
|
||||||
const XTimeline = defineAsyncComponent(() => import('./index.timeline.vue'));
|
|
||||||
const XEvent = defineAsyncComponent(() => import('./events.vue'));
|
const XEvent = defineAsyncComponent(() => import('./events.vue'));
|
||||||
const XActivity = defineAsyncComponent(() => import('./activity.vue'));
|
const XActivity = defineAsyncComponent(() => import('./activity.vue'));
|
||||||
const XAchievements = defineAsyncComponent(() => import('./achievements.vue'));
|
const XAchievements = defineAsyncComponent(() => import('./achievements.vue'));
|
||||||
|
@ -96,10 +94,6 @@ const headerTabs = $computed(() => user ? [{
|
||||||
key: 'home',
|
key: 'home',
|
||||||
title: i18n.ts.overview,
|
title: i18n.ts.overview,
|
||||||
icon: 'ti ti-home',
|
icon: 'ti ti-home',
|
||||||
}, {
|
|
||||||
key: 'notes',
|
|
||||||
title: i18n.ts.notes,
|
|
||||||
icon: 'ti ti-pencil',
|
|
||||||
}, {
|
}, {
|
||||||
key: 'events',
|
key: 'events',
|
||||||
title: i18n.ts.events,
|
title: i18n.ts.events,
|
||||||
|
|
Loading…
Reference in a new issue