Files
app/src/pages/profile/poi/EditPointOfInterestPage.vue
T

52 lines
1.7 KiB
Vue

<script setup>
import POIEditSkeleton from "components/poi/POIEditSkeleton.vue";
import {fetchPoi, loading, poi} from "src/composables/objects/poi";
import {onMounted} from "vue";
import {useRoute, useRouter} from "vue-router";
import {usePointsOfInterestStore} from "stores/PointsOfInterest";
import {useAppStore} from "stores/App";
import {useQuasar} from "quasar";
import {successObject} from "src/composables/dialog";
import {usePointsOfInterestTypeStore} from "stores/PointOfInterestType";
import {storeToRefs} from "pinia";
import POIForm from "components/poi/POIForm.vue";
import {useUserStore} from "stores/User";
import AccessDeniedBanner from "components/banners/AccessDeniedBanner.vue";
const poiId = parseInt(useRoute().params.id);
onMounted(() => {
fetchPoi(poiId).then(() => {
useAppStore().setPageTitle(`${poi.value.name} - editace`);
useAppStore().setBreadcrumbs([
{to: {name: "poi"}, label: "Zajímavá místa"},
{to: {name: "poiDetail", params: {id: poiId}}, label: poi.value.name},
{label: "Editace"},
]);
});
usePointsOfInterestTypeStore().fetch();
})
const poiTypes = storeToRefs(usePointsOfInterestTypeStore()).items;
const loggedUser = storeToRefs(useUserStore()).user;
const $q = useQuasar();
const router = useRouter();
const handleSave = (data) => {
usePointsOfInterestStore().update(poiId, data).then(respData => {
$q.notify(successObject("Úspěšně uloženo"));
router.push({name: "poiDetail", params: {id: poiId}});
});
}
</script>
<template>
<POIEditSkeleton v-if="loading"/>
<AccessDeniedBanner
v-else-if="poi.createdById !== loggedUser.id"
:route-back="{name: 'poiDetail', params: {id: poiId}}"
/>
<POIForm :poi="poi" :types="poiTypes" v-else @save="handleSave"/>
</template>