Homepage, verejna cast, vetsi sada uprav a oprav

src/pages/profile/aircraft/AircraftDetailPage.vue

@@ -0,0 +1,73 @@
+<script setup>
+import {onMounted, watch} from "vue";
+import {useAircraftsStore} from "stores/Aircrafts";
+import {useRoute, useRouter} from "vue-router";
+import {useQuasar} from "quasar";
+import AircraftDetailSkeleton from "components/aircrafts/AircraftDetailSkeleton.vue";
+import {confirmObject, successObject} from "src/composables/dialog";
+import {loading, aircraft, fetchAircraft} from "src/composables/objects/aircraft";
+import FAB from "components/FAB.vue";
+import {useAppStore} from "stores/App";
+import FlightsList from "components/flights/FlightsList.vue";
+import {copilot} from "src/composables/objects/copilot";
+
+const aircraftId = parseInt(useRoute().params.id);
+onMounted(() => {
+  fetchAircraft(aircraftId);
+})
+
+const $q = useQuasar();
+const confirmDelete = (id) => {
+  $q.dialog(confirmObject('Opravdu chceš smazat toto letadlo?'))
+    .onOk(() => {
+      useAircraftsStore().delete(id).then(() => {
+        useRouter().push({name: "aircrafts"});
+        $q.notify(successObject("Letadlo uspesne odstraneno"));
+      });
+    })
+};
+
+watch(aircraft, (newVal) => {
+  useAppStore().setPageTitle(newVal.callSign);
+  useAppStore().setBreadcrumbs([
+    {label: "Letadla", to: {name: "aircrafts"}},
+    {label: newVal.callSign}
+  ])
+});
+
+</script>
+
+<template>
+  <AircraftDetailSkeleton v-if="loading || !aircraft"/>
+  <template v-else>
+
+    <q-card class="q-mx-md q-my-md flight-detail-card">
+      <q-img :src="aircraft.photoUrl" v-if="aircraft.photoUrl" />
+
+      <q-card-section>
+        <q-list>
+          <q-item v-if="aircraft.manufacturer">
+            Výrobce: {{ aircraft.manufacturer }}
+          </q-item>
+          <q-item v-if="aircraft.model">
+            Model: {{ aircraft.model }}
+          </q-item>
+        </q-list>
+
+        <h3>Lety</h3>
+        <q-banner v-if="aircraft.flights.length === 0" class="bg-light-blue text-white">
+          Zatím žádné lety.
+        </q-banner>
+        <FlightsList :items="aircraft.flights" v-else/>
+      </q-card-section>
+
+      <q-card-actions align="right">
+        <q-btn @click="confirmDelete(aircraft.id)" icon="delete" text-color="red" rounded flat/>
+      </q-card-actions>
+    </q-card>
+
+    <FAB :router-link='{name: "aircraftEdit", params: {id: aircraft.id}}' mode="edit"/>
+  </template>
+
+
+</template>

src/pages/profile/aircraft/AircraftsPage.vue

@@ -0,0 +1,34 @@
+<script setup>
+import {onMounted} from "vue";
+import AircraftsList from "components/aircrafts/AircraftsList.vue";
+import {aircrafts, fetchAircrafts, loading} from "src/composables/objects/aircraft";
+import FAB from "components/FAB.vue";
+import BasicListSkeleton from "components/BasicListSkeleton.vue";
+
+onMounted(() => {
+  fetchAircrafts();
+})
+</script>
+
+<template>
+  <BasicListSkeleton v-if="loading"/>
+
+  <div class="q-pa-md q-gutter-sm" v-else-if="!loading && aircrafts.length === 0">
+    <q-banner class="bg-light-blue text-white">
+      <template v-slot:avatar>
+        <q-icon name="info"/>
+      </template>
+      Aktuálně nemáš přidané žádné letadlo.
+      <template v-slot:action>
+        <q-btn flat color="white" :to="{name: 'addAircraft'}" label="Vytvořit letadlo"/>
+      </template>
+    </q-banner>
+  </div>
+
+  <AircraftsList
+    v-else
+    :items="aircrafts"
+  />
+
+  <FAB mode="add" :router-link="{name: 'addAircraft'}"/>
+</template>

src/pages/profile/aircraft/EditAircraftPage.vue

@@ -0,0 +1,54 @@
+<script setup>
+import AircraftForm from "components/aircrafts/AircraftForm.vue";
+import {useAircraftsStore} from "stores/Aircrafts";
+import {useRoute, useRouter} from "vue-router";
+import {useQuasar} from "quasar";
+import {onMounted, ref} from "vue";
+import AircraftEditSkeleton from "components/aircrafts/AircraftEditSkeleton.vue";
+import {successObject} from "src/composables/dialog";
+import {aircraft, fetchAircraft, loading} from "src/composables/objects/aircraft";
+import {useAppStore} from "stores/App";
+import {copilot} from "src/composables/objects/copilot";
+
+
+const isRequestPending = ref(false);
+const $router = useRouter();
+const $q = useQuasar();
+const aircraftId = parseInt(useRoute().params.id);
+
+const handleSave = (formData) => {
+  isRequestPending.value = true;
+  useAircraftsStore().update(aircraftId, formData).then(() => {
+    $q.notify(successObject("Letadlo úspěšně upraveno"));
+    $router.push({name: "aircrafts"});
+  }).finally(() => {
+    isRequestPending.value = false;
+  })
+}
+
+onMounted(() => {
+  fetchAircraft(aircraftId).then(() => {
+    useAppStore().setPageTitle(`${aircraft.value.callSign} - editace`);
+    useAppStore().setBreadcrumbs([
+      {to: {name: "aircraft"}, label: "Letadla"},
+      {to: {name: "aircraftDetail", params: {id: aircraftId}}, label: aircraft.value.callSign},
+      {label: "Editace"}
+    ])
+  })
+});
+</script>
+
+<template>
+  <AircraftEditSkeleton v-if="loading"/>
+
+  <q-card v-else class="q-mx-md">
+    <q-card-section>
+      <AircraftForm
+        @save="handleSave"
+        :default-values="aircraft"
+        :is-request-pending="isRequestPending"
+      />
+    </q-card-section>
+  </q-card>
+
+</template>

src/pages/profile/aircraft/NewAircraftsPage.vue

@@ -0,0 +1,38 @@
+<script setup>
+import AircraftForm from "components/aircrafts/AircraftForm.vue";
+import {useAircraftsStore} from "stores/Aircrafts";
+import {useRouter} from "vue-router";
+import {useQuasar} from "quasar";
+import {ref} from "vue";
+import {useAppStore} from "stores/App";
+import {successObject} from "src/composables/dialog";
+
+const $q = useQuasar();
+const router = useRouter();
+
+let isRequestPending = ref(false);
+const handleSave = (formData) => {
+  isRequestPending.value = true;
+  useAircraftsStore().create(formData).then(() => {
+    $q.notify(successObject("Letadlo úspěšně vytvořeno"));
+    router.push({name: "aircrafts"});
+  }).finally(() => {
+    isRequestPending.value = false;
+  })
+}
+
+
+useAppStore().setPageTitle("Nové letadlo");
+useAppStore().setBreadcrumbs([
+  {to: {name: "aircrafts"}, label: "Letadla"},
+  {label: "Nové"}
+]);
+</script>
+
+<template>
+  <q-card class="q-mx-md q-my-md">
+    <q-card-section>
+      <AircraftForm @save="handleSave" :is-request-pending="isRequestPending"/>
+    </q-card-section>
+  </q-card>
+</template>