MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(front): channel form

This commit is contained in:
ArneBo 2025-02-17 17:32:17 +01:00
parent 76eae47f2f
commit c16eefedfc
3 changed files with 55 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
front/src/components/audio/ChannelForm.vue
View File

@ -165,6 +165,7 @@ defineExpose({
<template>
<Layout form
class="ui form"
@submit.prevent.stop="submit"
>
<Alert
@ -250,21 +251,13 @@ defineExpose({
{{ t('components.audio.ChannelForm.label.image') }}
</attachment-input>
</div>
<div class="ui small hidden divider" />
<div class="ui stackable grid row">
<div class="ten wide column">
<div class="ui field">
<Pills
v-model="tagList"
:label="t('components.audio.ChannelForm.label.tags')"
/>
</div>
</div>
<div
v-if="newValues.content_category === 'podcast'"
class="six wide column"
>
<div class="ui required field">
<label for="channel-language">
{{ t('components.audio.ChannelForm.label.language') }}
</label>
@ -284,18 +277,14 @@ defineExpose({
</option>
</select>
</div>
</div>
</div>
<div class="ui small hidden divider" />
<div class="ui field">
<label for="channel-name">
{{ t('components.audio.ChannelForm.label.description') }}
</label>
<content-form v-model="newValues.description" />
</div>
<div
<template
v-if="newValues.content_category === 'podcast'"
class="ui two fields"
>
<div class="ui required field">
<label for="channel-itunes-category">
@ -337,39 +326,37 @@ defineExpose({
</option>
</select>
</div>
</div>
<div
</template>
<template
v-if="newValues.content_category === 'podcast'"
class="ui two fields"
>
<Alert blue>
<span>
<i class="bi bi-info-circle-fill" />
{{ t('components.audio.ChannelForm.help.podcastFields') }}
</span>
</Alert>
<div class="ui field">
<label for="channel-itunes-email">
{{ t('components.audio.ChannelForm.label.email') }}
</label>
<input
<Input
id="channel-itunes-email"
v-model="newValues.metadata.owner_email"
name="channel-itunes-email"
type="email"
>
:label="t('components.audio.ChannelForm.label.email')"
/>
</div>
<div class="ui field">
<label for="channel-itunes-name">
{{ t('components.audio.ChannelForm.label.owner') }}
</label>
<input
<Input
id="channel-itunes-name"
v-model="newValues.metadata.owner_name"
name="channel-itunes-name"
maxlength="255"
>
</div>
<p>
{{ t('components.audio.ChannelForm.help.podcastFields') }}
</p>
:label="t('components.audio.ChannelForm.label.owner')"
/>
</div>
</template>
</template>
</template>
<div
v-else
class="ui active inverted dimmer"

12
front/src/views/auth/ProfileOverview.vue
View File

@ -13,6 +13,7 @@ import { useModal } from '~/ui/composables/useModal.ts'
import Modal from '~/components/ui/Modal.vue'
import Button from '~/components/ui/Button.vue'
import Link from '~/components/ui/Link.vue'
import Spacer from '~/components/ui/Spacer.vue'
interface Events {
(e: 'updated', value: Actor): void
@ -31,7 +32,7 @@ defineProps<Props>()
const step = ref(1)
const { isOpen, to } = useModal('createChannel')
const loading = ref(false)
const isLoading = ref(false)
const submittable = ref(false)
const category = ref('podcast')
@ -83,7 +84,7 @@ const createForm = ref()
ref="createForm"
:object="null"
:step="step"
@loading="loading = $event"
@loading="isLoading = $event"
@submittable="submittable = $event"
@category="category = $event"
@errored="modalContent.scrollTop = 0"
@ -91,11 +92,12 @@ const createForm = ref()
/>
<template #actions>
<Button secondary
v-if="step === 1"
autofocus
@click="isOpen = false"
>
{{ t('views.auth.ProfileOverview.button.cancel') }}
</Button>
<Spacer grow />
<Button secondary
v-if="step > 1"
@click.stop.prevent="step -= 1"
@ -111,8 +113,8 @@ const createForm = ref()
<Button primary
v-if="step === 2"
type="submit"
:disabled="!submittable && !loading"
:isLoading="loading"
:disabled="!submittable && !isLoading"
:isLoading="isLoading"
@click.prevent.stop="createForm.submit"
>
{{ t('views.auth.ProfileOverview.button.createChannel') }}

8
front/src/views/channels/List.vue
View File

@ -3,15 +3,18 @@ import type { Channel } from '~/types'
import { useI18n } from 'vue-i18n'
import { ref, computed } from 'vue'
import { useRouter } from 'vue-router'
import axios from 'axios'
import ChannelsWidget from '~/components/audio/ChannelsWidget.vue'
import RemoteSearchForm from '~/components/RemoteSearchForm.vue'
import ChannelForm from '~/components/audio/ChannelForm.vue'
import Layout from '~/components/ui/Layout.vue'
import Header from '~/components/ui/Header.vue'
import Modal from '~/components/ui/Modal.vue'
import Button from '~/components/ui/Button.vue'
import Spacer from '~/components/ui/Spacer.vue'
import useErrorHandler from '~/composables/useErrorHandler'
@ -31,6 +34,8 @@ const labels = computed(() => ({
searchPlaceholder: t('views.channels.SubscriptionsList.placeholder.search')
}))
const router = useRouter()
const step = ref(1)
const submittable = ref(false)
const category = ref('podcast')
@ -165,11 +170,12 @@ const showCreateModal = ref(false)
/>
<template #actions>
<Button secondary
v-if="step === 1"
autofocus
@click="showCreateModal = false"
>
{{ t('views.auth.ProfileOverview.button.cancel') }}
</Button>
<Spacer grow />
<Button secondary
v-if="step > 1"
@click.stop.prevent="step -= 1"