168 lines
No EOL
4 KiB
Vue
168 lines
No EOL
4 KiB
Vue
<script setup lang="ts">
|
|
import Table from "@partials/Table.vue";
|
|
import {usePodcastStore} from "@/stores/podcast.store.ts";
|
|
import {podcast_page} from "@/composables/content/podcast_page.ts";
|
|
import {basePodcast} from "@models/podcast/podcast.ts";
|
|
import {reactive, ref} from "vue";
|
|
import ConfirmDelete from "@partials/dialogs/ConfirmDelete.vue";
|
|
import PodcastEditor from "@partials/PodcastEditor.vue";
|
|
import SmartBlockEditor from "@partials/SmartBlockEditor.vue";
|
|
|
|
|
|
const podcastStore = usePodcastStore();
|
|
podcastStore.loadPodcast(basePodcast());
|
|
const { items, listData, headers, selected, loading, search, getItems, editItem, deleteItem } = podcast_page();
|
|
const url = ref('');
|
|
const itemEdited = ref(basePodcast());
|
|
const episodes = ref([]);
|
|
const bulk = ref(false);
|
|
const dialog = reactive({
|
|
open: false,
|
|
type: '',
|
|
title: '',
|
|
text: ''
|
|
});
|
|
const dialogLoading = ref(false);
|
|
|
|
const openDialog = (type, title = '', text = '', bulk = false) => {
|
|
dialog.open = true
|
|
dialog.type = type
|
|
dialog.title = title
|
|
dialog.text = text
|
|
}
|
|
|
|
const add = () => {
|
|
openDialog(
|
|
'add',
|
|
'Aggiungi podcast',
|
|
'Inserisci l\'url del feed RSS del podcast che vuoi aggiungere.'
|
|
);
|
|
}
|
|
|
|
const confirm = (confirm, bulk) => {
|
|
switch (dialog.type) {
|
|
case 'delete':
|
|
confirmDelete(confirm, bulk);
|
|
break;
|
|
case 'add':
|
|
confirmAdd(confirm);
|
|
}
|
|
}
|
|
|
|
const confirmAdd = async (confirm) => {
|
|
if (confirm) {
|
|
dialogLoading.value = true;
|
|
await axios.get('/rss_podcast_load', {
|
|
params: {
|
|
url: url.value,
|
|
}
|
|
}).then(res => {
|
|
if (res.data.podcast) {
|
|
podcastStore.updateField({key: 'title', value: res.data.podcast.title});
|
|
podcastStore.updateField({key: 'url', value: url});
|
|
podcastStore.currentPodcastEpisodes = res.data.episodes;
|
|
}
|
|
closeDialog();
|
|
dialogLoading.value = false;
|
|
//episodes.value = res.data.episodes;
|
|
openDialog(
|
|
'info',
|
|
'Attenzione',
|
|
'L\'URL inserito non è un feed RSS valido'
|
|
);
|
|
})
|
|
}
|
|
}
|
|
|
|
const edit = (item) => {
|
|
podcastStore.loadPodcast(item);
|
|
}
|
|
|
|
const cancel = (item) => {
|
|
bulk.value = Array.isArray(item);
|
|
itemEdited.value = item;
|
|
openDialog(
|
|
'delete',
|
|
'Cancella',
|
|
bulk.value ? 'Vuoi cancellare i podcast selezionati?' : 'Vuoi cancellare il podcast selezionato?'
|
|
);
|
|
}
|
|
|
|
const confirmDelete = (confirm, bulk) => {
|
|
if (confirm) {
|
|
if (!bulk) {
|
|
deleteItem(itemEdited.value.id);
|
|
} else {
|
|
itemEdited.value.forEach(el => {
|
|
deleteItem(el.id);
|
|
})
|
|
}
|
|
}
|
|
closeDialog();
|
|
}
|
|
|
|
const closeDialog = () => {
|
|
dialog.open = false;
|
|
itemEdited.value = basePodcast();
|
|
}
|
|
|
|
const updateSearch = (text) => {
|
|
search.value = text;
|
|
}
|
|
|
|
const resetItemEdited = () => {
|
|
podcastStore.currentPodcast = basePodcast();
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<PodcastEditor
|
|
v-if="podcastStore.currentPodcast.url != '' && podcastStore.currentPodcast.url != null"
|
|
@go-back="resetItemEdited"
|
|
/>
|
|
<Table
|
|
v-else
|
|
:headers="headers"
|
|
v-model:selected="selected"
|
|
v-model:search="search"
|
|
:list-data="listData"
|
|
:items="items"
|
|
:loading="loading"
|
|
:get-items="getItems"
|
|
:actions="true"
|
|
:show-select="true"
|
|
@update-table="getItems"
|
|
@update-search="updateSearch"
|
|
@delete-item="cancel"
|
|
@edit-item="edit"
|
|
>
|
|
<template v-slot:header-buttons>
|
|
<v-btn color="primary" @click="add">
|
|
Aggiungi podcast
|
|
</v-btn>
|
|
</template>
|
|
<template v-slot:dialog>
|
|
<v-dialog v-model="dialog.open">
|
|
<ConfirmDelete
|
|
:title="dialog.title"
|
|
:text="dialog.text"
|
|
:bulk="bulk"
|
|
@confirm="confirm"
|
|
@after-leave="closeDialog"
|
|
:loading="dialogLoading"
|
|
:hide_confirm="dialog.type === 'info' ? true : false"
|
|
>
|
|
<VTextField
|
|
label="Feed RSS"
|
|
v-if="dialog.type === 'add'"
|
|
v-model="url"
|
|
/>
|
|
</ConfirmDelete>
|
|
</v-dialog>
|
|
</template>
|
|
</Table>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |