Zdockerovani, sjednoceni marginu, drobnejsi upravy

src/pages/profile/lists/AircraftsPage.vue

@@ -1,19 +1,34 @@
 <script setup>
 import {onMounted} from "vue";
 import AircraftsList from "components/aircrafts/AircraftsList.vue";
-import AircraftsListSkeleton from "components/aircrafts/AircraftsListSkeleton.vue";
 import {aircrafts, fetchAircrafts, loading} from "src/composables/objects/aircraft";
 import FAB from "components/FAB.vue";
+import BasicListSkeleton from "components/BasicListSkeleton.vue";
 
 onMounted(() => {
- fetchAircrafts();
+  fetchAircrafts();
 })
 </script>
 
 <template>
-  <AircraftsListSkeleton v-if="loading" />
+  <BasicListSkeleton v-if="loading"/>
 
-  <AircraftsList class="q-my-lg" :items="aircrafts" v-else />
+  <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/lists/CopilotsPage.vue

@@ -1,10 +1,11 @@
 <script setup>
 import {onMounted} from "vue";
-import CopilotListSkeleton from "components/copilots/CopilotListSkeleton.vue";
 import {fetchCopilots, loading, copilots} from "src/composables/objects/copilot";
 import CopilotsList from "components/copilots/CopilotsList.vue";
 import FAB from "components/FAB.vue";
 import {useAppStore} from "stores/App";
+import {aircrafts} from "src/composables/objects/aircraft";
+import BasicListSkeleton from "components/BasicListSkeleton.vue";
 
 onMounted(() => {
   fetchCopilots();
@@ -13,10 +14,21 @@ onMounted(() => {
 </script>
 
 <template>
-  <CopilotListSkeleton v-if="loading"/>
+  <BasicListSkeleton :items-count-min="5" :items-count-max="10" v-if="loading"/>
+
+   <div class="q-pa-md q-gutter-sm" v-else-if="!loading && copilots.length === 0">
+    <q-banner class="bg-light-blue text-white">
+      <template v-slot:avatar>
+        <q-icon name="info"/>
+      </template>
+      Zatím tu není nikdo. Přidej si let s někým nebo kopilota vytvoř ručně tu.
+      <template v-slot:action>
+        <q-btn flat color="white" :to="{name: 'addCopilot'}" label="Přidat"/>
+      </template>
+    </q-banner>
+  </div>
+
+    <CopilotsList :items="copilots" v-else/>
 
-  <template v-else>
-    <CopilotsList class="q-my-lg" :items="copilots"/>
     <FAB :router-link="{name: 'addCopilot'}" mode="add"/>
-  </template>
 </template>

src/pages/profile/lists/FlightsPage.vue

@@ -30,7 +30,7 @@ onMounted(() => {
     </q-banner>
   </div>
 
-  <FlightsList v-else :items="flights" @delete="handleDeleteFlight($q, $event)" />
+  <FlightsList class="q-mx-md q-my-md" v-else :items="flights" @delete="handleDeleteFlight($q, $event)" />
 
   <FAB mode="add" :router-link="{name: 'addFlight'}"/>
 </template>

src/pages/profile/lists/PointsOfInterestPage.vue

@@ -1,10 +1,10 @@
 <script setup>
 import {onMounted} from "vue";
-import POIListSkeleton from "components/poi/POIListSkeleton.vue";
 import {fetchPOIList, loading, pointsOfInterest} from "src/composables/objects/poi";
 import {useAppStore} from "stores/App";
 import POIList from "components/poi/POIList.vue";
 import FAB from "components/FAB.vue";
+import BasicListSkeleton from "components/BasicListSkeleton.vue";
 
 onMounted(() => {
   fetchPOIList();
@@ -14,9 +14,25 @@ useAppStore().setPageTitle("Zajímavá místa")
 </script>
 
 <template>
-  <POIListSkeleton v-if="loading"/>
+  <BasicListSkeleton :items-count-min="5" :items-count-max="10" v-if="loading"/>
 
-  <POIList v-else class="q-my-lg" :items="pointsOfInterest"/>
+  <div class="q-pa-md q-gutter-sm" v-else-if="!loading && pointsOfInterest.length === 0">
+    <q-banner class="bg-light-blue text-white">
+      <template v-slot:avatar>
+        <q-icon name="info"/>
+      </template>
+      Nemáš tu uložené žádné zajímavé místo. Přidej si let, nastav si tam ručně trasu a jednotlivé body se zobrazí
+      i v tomto seznamu.
+      <template v-slot:action>
+        <q-btn flat color="white" :to="{name: 'addPoi'}" label="Přidat"/>
+      </template>
+    </q-banner>
+  </div>
 
-  <FAB :router-link="{name: 'addPOI'}" mode="add" />
+  <POIList
+    v-else
+    :items="pointsOfInterest"
+  />
+
+  <FAB :router-link="{name: 'addPOI'}" mode="add"/>
 </template>