Upravy UI, refaktoring, davkove upravy a mazani fotek

src/components/aircrafts/AircraftDetailCard.vue

@@ -0,0 +1,59 @@
+<script setup>
+import {aircraft} from "src/composables/objects/aircraft";
+import {confirmObject} from "src/composables/dialog";
+import {useQuasar} from "quasar";
+
+const props = defineProps({
+  aircraft: {
+    type: Object,
+    required: true
+  }
+});
+
+const emits = defineEmits(["delete"]);
+
+const $q = useQuasar();
+
+const confirmDelete = (aircraftId) => {
+  $q.dialog(confirmObject('Opravdu chceš smazat toto letadlo?'))
+    .onOk(() => {
+      emits("delete", aircraftId);
+    });
+};
+</script>
+
+<template>
+  <q-card class="q-mx-md q-my-md flight-detail-card">
+    <q-img :src="aircraft.photoUrl" v-if="aircraft.photoUrl"/>
+
+    <q-card-actions class="q-my-md">
+      <div class="col-grow">
+        <q-btn
+          flat
+          :to='{name: "aircraftEdit", params: {id: aircraft.id}}'
+          icon="edit"
+          text-color="primary"
+          label="Upravit"
+        />
+      </div>
+      <q-btn @click="confirmDelete(aircraft.id)" icon="delete" flat text-color="red" label="Smazat"/>
+    </q-card-actions>
+
+    <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-item v-if="aircraft.seats">
+          Počet míst: {{ aircraft.seats }}
+        </q-item>
+      </q-list>
+    </q-card-section>
+    <q-card-section>
+      <article v-html="aircraft.description" class="q-my-md"/>
+    </q-card-section>
+  </q-card>
+</template>