fix(front): correct layout closing tag placement in channel list page

This commit is contained in:
ArneBo 2025-02-17 17:30:18 +01:00
parent 148e87c28e
commit 76eae47f2f
1 changed files with 53 additions and 51 deletions

View File

@ -31,6 +31,11 @@ const labels = computed(() => ({
searchPlaceholder: t('views.channels.SubscriptionsList.placeholder.search') searchPlaceholder: t('views.channels.SubscriptionsList.placeholder.search')
})) }))
const step = ref(1)
const submittable = ref(false)
const category = ref('podcast')
const modalContent = ref()
const createForm = ref()
const previousPage = ref() const previousPage = ref()
const nextPage = ref() const nextPage = ref()
const channels = ref([] as Channel[]) const channels = ref([] as Channel[])
@ -114,7 +119,7 @@ const showCreateModal = ref(false)
:key="widgetKey" :key="widgetKey"
:limit="50" :limit="50"
:show-modification-date="true" :show-modification-date="true"
:filters="{q: query, ordering: '-name'}" :filters="{q: query, subscribed: 'true'}"
/> />
<!-- TODO: Translations --> <!-- TODO: Translations -->
<Header <Header
@ -126,70 +131,67 @@ const showCreateModal = ref(false)
icon="bi-plus" icon="bi-plus"
primary primary
/> />
<inline-search-bar
v-model="query"
:placeholder="labels.searchPlaceholder"
@search="reloadWidget"
/>
<channels-widget <channels-widget
:show-modification-date="true" :show-modification-date="true"
:limit="12" :limit="12"
:filters="{ordering: '-creation_date', external: 'true'}" :filters="{ordering: '-creation_date'}"
> >
<template #title>
{{ t('components.library.Home.header.newChannels') }}
</template>
</channels-widget> </channels-widget>
</Layout>
<Modal v-model="showCreateModal" <Modal v-model="showCreateModal"
:title="t(`views.auth.ProfileOverview.modal.createChannel.${ :title="t(`views.auth.ProfileOverview.modal.createChannel.${
step === 1 ? step === 1 ?
'header' : 'header' :
category === 'podcast' ? category === 'podcast' ?
'podcast.header' 'podcast.header'
: :
'artist.header' 'artist.header'
}`)" }`)"
>
<div
ref="modalContent"
class="scrolling content"
> >
<channel-form <channel-form
ref="createForm" ref="createForm"
:object="null" :object="null"
:step="step" :step="step"
@loading="loading = $event" @loading="isLoading = $event"
@submittable="submittable = $event" @submittable="submittable = $event"
@category="category = $event" @category="category = $event"
@errored="modalContent.scrollTop = 0" @errored="modalContent.scrollTop = 0"
@created="router.push({name: 'channels.detail', params: {id: $event.actor.preferred_username}})" @created="router.push({name: 'channels.detail', params: {id: $event.actor.preferred_username}})"
/> />
</div> <template #actions>
<template #actions> <Button secondary
<Button secondary v-if="step === 1"
v-if="step === 1" autofocus
autofocus >
> {{ t('views.auth.ProfileOverview.button.cancel') }}
{{ t('views.auth.ProfileOverview.button.cancel') }} </Button>
</Button> <Button secondary
<Button secondary v-if="step > 1"
v-if="step > 1" @click.stop.prevent="step -= 1"
@click.stop.prevent="step -= 1" >
> {{ t('views.auth.ProfileOverview.button.previous') }}
{{ t('views.auth.ProfileOverview.button.previous') }} </Button>
</Button> <Button primary
<Button primary v-if="step === 1"
v-if="step === 1" @click.stop.prevent="step += 1"
@click.stop.prevent="step += 1" >
> {{ t('views.auth.ProfileOverview.button.next') }}
{{ t('views.auth.ProfileOverview.button.next') }} </Button>
</Button> <Button primary
<Button primary v-if="step === 2"
v-if="step === 2" type="submit"
type="submit" :disabled="!submittable && !isLoading"
:disabled="!submittable && !loading" :isLoading="isLoading"
:isLoading="loading" @click.prevent.stop="createForm.submit"
@click.prevent.stop="createForm.submit" >
> {{ t('views.auth.ProfileOverview.button.createChannel') }}
{{ t('views.auth.ProfileOverview.button.createChannel') }} </Button>
</Button> </template>
</template> </Modal>
</Modal> </Layout>
</template> </template>