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

52 lines
1.8 KiB
Vue

<script setup>
import POIEditSkeleton from "components/poi/POIEditSkeleton.vue";
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(() => {
usePointsOfInterestStore().fetchDetail(poiId).then((p) => {
useAppStore().setPageTitle(`${p.name} - editace`);
useAppStore().setBreadcrumbs([
{to: {name: "poi"}, label: "Zajímavá místa"},
{to: {name: "poiDetail", params: {id: poiId}}, label: p.name},
{label: "Editace"},
]);
});
usePointsOfInterestTypeStore().fetch();
})
const poiTypes = storeToRefs(usePointsOfInterestTypeStore()).items;
const loggedUser = storeToRefs(useUserStore()).user;
const {isQueryRunning, pointOfInterest, isMutationRunning} = storeToRefs(usePointsOfInterestStore());
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="isQueryRunning"/>
<AccessDeniedBanner
v-else-if="pointOfInterest.createdById !== loggedUser.id"
:route-back="{name: 'poiDetail', params: {id: poiId}}"
/>
<POIForm :poi="pointOfInterest" :types="poiTypes" v-else @save="handleSave"/>
</template>