draft planovace

2024-03-25 21:59:55 +01:00
parent 02b839674e
commit 9af80cda06
12 changed files with 262 additions and 57 deletions
@@ -0,0 +1,76 @@
+<script setup>
+import {computed, onMounted} from "vue";
+import {useAppStore} from "stores/App";
+import CopilotEditSkeleton from "components/copilots/skeletons/CopilotEditSkeleton.vue";
+import CopilotEditForm from "components/copilots/CopilotForm.vue";
+import {useRoute, useRouter} from "vue-router";
+import {useCopilotsStore} from "stores/Copilots";
+import {successObject} from "src/composables/dialog";
+import {useQuasar} from "quasar";
+import {storeToRefs} from "pinia";
+import PhotosEditorList from "components/photos/PhotosEditorList.vue";
+import CommonEditSwitcher from "components/navigation/CommonEditSwitcher.vue";
+import PhotoGallerySkeleton from "components/photos/skeletons/PhotoGallerySkeleton.vue";
+import BasicInfoBanner from "components/banners/BasicInfoBanner.vue";
+
+const $q = useQuasar();
+const $router = useRouter();
+const $route = useRoute();
+
+const copilotId = parseInt($route.params.id);
+
+onMounted(() => {
+  useCopilotsStore().fetchDetail(copilotId).then(() => {
+    useAppStore().setPageTitle(`${copilot.value.name} - editace`);
+    useAppStore().setBreadcrumbs([
+      {to: {name: "copilots"}, label: "Kopiloti"},
+      {to: {name: "copilotDetail", params: {id: copilotId}}, label: copilot.value.name},
+      {label: "Editace"}
+    ])
+  });
+});
+
+const handleSave = (formData) => {
+  useCopilotsStore().update(copilotId, formData).then(() => {
+    $q.notify(successObject("Kopilot úspěšně upraven"));
+    $router.push({name: "copilotDetail", params: {id: copilotId}});
+  });
+}
+
+const {isQueryRunning, isMutationRunning, copilot} = storeToRefs(useCopilotsStore());
+
+const formStep = computed(() => useRoute().params.step || "info");
+const setTitlePhoto = (titlePhoto) => {
+  useCopilotsStore().update(copilotId, {titlePhotoId: titlePhoto.id}).then(() => {
+    $q.notify(successObject("Úvodní fotka nastavena"));
+  })
+}
+</script>
+
+<template>
+  <CommonEditSwitcher :route="{name: 'copilotEdit', params: {id: copilot.id}}"/>
+
+  <template v-if="formStep === 'info'">
+    <CopilotEditSkeleton v-if="isQueryRunning || !copilot"/>
+    <CopilotEditForm
+        v-else
+        :copilot="copilot"
+        :is-request-pending="isMutationRunning"
+        @save="handleSave"
+    />
+  </template>
+
+  <template v-else-if="formStep === 'photo'">
+    <PhotoGallerySkeleton v-if="isQueryRunning || !copilot" />
+    <BasicInfoBanner v-else-if="!isQueryRunning && copilot.photos.length === 0">
+      U tohoto kopilota nemáš označenou žádnou fotku. Bez toho není možné zvolit úvodní fotografii.
+    </BasicInfoBanner>
+    <PhotosEditorList
+        v-else
+        :photos="copilot.photos"
+        :title-photo="copilot.titlePhoto"
+        :show-actions="false"
+        @set-title-photo="setTitlePhoto"
+    />
+  </template>
+</template>