Rozdeleni planovace do samostatnych routes

src/components/flightPlans/FlightFromPlanForm.vue

@@ -1,9 +1,9 @@
 <script setup>
 import DatetimePicker from "components/inputs/DatetimePicker.vue";
-import {computed, reactive} from "vue";
+import {reactive} from "vue";
 import {commonProps} from "src/composables/inputs";
 import FormWrapper from "components/FormWrapper.vue";
-import {useFlightPlanCalculations, useFlightPlanUtils} from "src/composables/flightPlan";
+import {useFlightPlanCalculations} from "src/composables/flightPlan";
 
 const props = defineProps({
   flightPlan: {
@@ -17,18 +17,13 @@ const {getTotalDuration} = useFlightPlanCalculations();
 const formData = reactive({
   gpxTrackFile: null,
   takeoffDatetime: props.flightPlan.plannedTakeoffDatetime,
-  landingDatetime: new Date((new Date(props.flightPlan.plannedTakeoffDatetime)).getTime() + 60 * 1000 * getTotalDuration(props.flightPlan)),
+  landingDatetime: new Date(
+    (new Date(props.flightPlan.plannedTakeoffDatetime)).getTime() + 60 * 1000 * getTotalDuration(props.flightPlan)
+  ),
   copyTrack: true,
   createPointsOfInterests: true,
   flightPlan: props.flightPlan,
 });
-
-const {getMarkersFrom} = useFlightPlanUtils();
-
-const hasGeocodeInTrack = computed(() => {
-  return !!getMarkersFrom(props.flightPlan).find(point => point.type === 'geocode');
-});
-
 </script>
 
 <template>

src/components/flightPlans/FlightPlanWeatherInfo.vue

@@ -1,12 +1,9 @@
 <script setup>
-
-import {computed} from "vue";
-import {textEllipsis} from "src/composables/utils";
-import {minutesToHumanReadable} from "src/composables/datetimeUtils";
 import {useFlightPlanUtils} from "src/composables/flightPlan";
 import {useQuasar} from "quasar";
 import {useUnitsConvertors} from "src/composables/units";
 import CloudCoverIcon from "components/weather/CloudCoverIcon.vue";
+import {formatDatetime} from "src/composables/datetimeUtils";
 
 const props = defineProps({
   flightPlan: {
@@ -17,7 +14,6 @@ const props = defineProps({
 
 
 const columns = [
-
   {
     label: 'Místo',
     align: "left",
@@ -42,9 +38,17 @@ const columns = [
 
 const {screen} = useQuasar();
 const {getMarkersFrom} = useFlightPlanUtils();
-const {kmhToKnots} = useUnitsConvertors();
+const {kmhToKnots, ftToM} = useUnitsConvertors();
+
+const getCloudsBase = (weatherInfo) => {
+  const tempDiff = weatherInfo.temperatureSurface - weatherInfo.dewpointSurface;
+  const cloudLevelInFt = tempDiff / 2.5 * 1000;
+
+  return Math.round(ftToM(cloudLevelInFt));
+}
 
 const markers = getMarkersFrom(props.flightPlan);
+const markersWithWeather = markers.filter(marker => !!marker.weatherInfo);
 </script>
 
 <template>
@@ -54,13 +58,19 @@ const markers = getMarkersFrom(props.flightPlan);
     flat bordered
     hide-bottom
     :title="flightPlan.name"
-    :rows="markers"
+    :rows="markersWithWeather"
     :columns="columns"
     :rows-per-page-options="[0]"
   >
     <template v-slot:body-cell-place="props">
       <q-td :props="props">
-        {{ props.row.name }}
+        <strong>
+          {{ props.row.name }}
+        </strong>
+        <br>
+        <small>
+          {{ formatDatetime(props.row.weatherInfo.datetime) }}
+        </small>
       </q-td>
     </template>
 
@@ -68,14 +78,15 @@ const markers = getMarkersFrom(props.flightPlan);
       <q-td :props="props">
         {{ props.row.weatherInfo.temperatureSurface }}° C
         <br>
-        Rosný bod {{ props.row.weatherInfo.dewpointSurface }}° C
+        <small>
+          Rosný bod {{ props.row.weatherInfo.dewpointSurface }}° C
+        </small>
       </q-td>
     </template>
 
     <template v-slot:body-cell-wind="props">
       <q-td :props="props">
         <q-icon name="navigation" :style="`transform: rotate(${props.row.weatherInfo.windDirectionSurface}deg)`"/>
-        <br>
         {{ props.row.weatherInfo.windDirectionSurface }}°
         <br>
         {{ kmhToKnots(props.row.weatherInfo.windSpeedSurface) }} kt
@@ -84,11 +95,16 @@ const markers = getMarkersFrom(props.flightPlan);
 
     <template v-slot:body-cell-clouds="props">
       <q-td :props="props">
-            <CloudCoverIcon :cloudcover="props.row.weatherInfo.cloudcoverTotal"/>
+        <CloudCoverIcon :cloudcover="props.row.weatherInfo.cloudcoverTotal"/>
         <br>
         celkové pokrytí oblačností {{ props.row.weatherInfo.cloudcoverTotal }} %
         <br>
         nízké mraky {{ props.row.weatherInfo.cloudcoverLow }} %
+
+        <template v-if="props.row.weatherInfo.cloudcoverLow > 5">
+          <br>
+          odhadovaná výška základen: {{ getCloudsBase(props.row.weatherInfo) }} m
+        </template>
       </q-td>
     </template>