style(front): Section components on profile activity

This commit is contained in:
ArneBo 2025-02-05 13:07:49 +01:00
parent 16c74b4078
commit eff50f25ea
1 changed files with 38 additions and 24 deletions

View File

@ -22,6 +22,7 @@ import LibraryWidget from '~/components/federation/LibraryWidget.vue'
import ChannelsWidget from '~/components/audio/ChannelsWidget.vue' import ChannelsWidget from '~/components/audio/ChannelsWidget.vue'
import AlbumWidget from '~/components/album/Widget.vue' import AlbumWidget from '~/components/album/Widget.vue'
import TrackWidget from '~/components/audio/track/Widget.vue' import TrackWidget from '~/components/audio/track/Widget.vue'
import PlaylistWidget from '~/components/playlists/Widget.vue'
interface Events { interface Events {
(e: 'updated', value: Actor): void (e: 'updated', value: Actor): void
@ -132,6 +133,10 @@ const recentActivity = ref(0)
<Tabs> <Tabs>
<Tab :title="t('views.auth.ProfileBase.link.overview')" :to="{name: 'profile.overview', params: routerParams}"> <Tab :title="t('views.auth.ProfileBase.link.overview')" :to="{name: 'profile.overview', params: routerParams}">
<h2>{{ t('views.auth.ProfileBase.link.overview') }}</h2> <h2>{{ t('views.auth.ProfileBase.link.overview') }}</h2>
<!-- <router-view
:object="object"
@updated="fetchData"
/> -->
</Tab> </Tab>
<Tab :title="t('views.auth.ProfileOverview.header.libraries')"> <Tab :title="t('views.auth.ProfileOverview.header.libraries')">
@ -170,33 +175,42 @@ const recentActivity = ref(0)
</Tab> </Tab>
<Tab :title="t('views.auth.ProfileBase.link.activity')" :to="{name: 'profile.activity', params: routerParams}"> <Tab :title="t('views.auth.ProfileBase.link.activity')" :to="{name: 'profile.activity', params: routerParams}">
<Layout stack>
<track-widget
:url="'history/listenings/'"
:filters="{ scope: `actor:${object?.full_username}`, ordering: '-creation_date', ...qualityFilters}"
:websocket-handlers="['Listen']"
@count="recentActivity = $event"
>
<template #title>
{{ t('components.library.Home.header.recentlyListened') }}
</template>
</track-widget>
<track-widget <track-widget
:url="'history/listenings/'" :url="'favorites/tracks/'"
:filters="{ scope: `actor:${object?.full_username}`, ordering: '-creation_date', ...qualityFilters}" :filters="{scope: 'actor:${object.full_username}', ordering: '-creation_date'}"
:websocket-handlers="['Listen']" >
@count="recentActivity = $event" <template #title>
> {{ t('components.library.Home.header.recentlyFavorited') }}
<template #title> </template>
{{ t('components.library.Home.header.recentlyListened') }} </track-widget>
</template>
</track-widget>
<track-widget <playlist-widget
:url="'favorites/tracks/'" :url="'playlists/'"
:filters="{scope: 'actor:${object.full_username}', ordering: '-creation_date'}" :filters="{scope: `actor:${object.full_username}`, playable: true, ordering: '-modification_date'}"
> >
<template #title> <template #title>
{{ t('components.library.Home.header.recentlyFavorited') }} {{ t('views.auth.ProfileActivity.header.playlists') }}
</template> </template>
</track-widget> </playlist-widget>
<album-widget :filters="{scope: `actor:${object?.full_username}`, playable: true, ordering: '-creation_date', ...qualityFilters}">
<template #title>
{{ t('components.library.Home.header.recentlyAdded') }}
</template>
</album-widget>
<album-widget :filters="{scope: `actor:${object?.full_username}`, playable: true, ordering: '-creation_date', ...qualityFilters}">
<template #title>
{{ t('components.library.Home.header.recentlyAdded') }}
</template>
</album-widget>
</Layout>
</Tab> </Tab>
</Tabs> </Tabs>
</Layout> </Layout>