Combobox, POI

src/components/flights/form/FlightFormCopilot.vue

@@ -1,7 +1,8 @@
 <script setup>
-import {onMounted, reactive} from "vue";
+import {onMounted, reactive, ref} from "vue";
 import FormWrapper from "components/FormWrapper.vue";
 import {setDefaultData} from "src/composables/form/formHandling";
+import ComboboxInput from "components/inputs/ComboboxInput.vue";
 
 const props = defineProps({
   flight: {
@@ -17,7 +18,7 @@ const props = defineProps({
 const formData = reactive({
   solo: true,
   withInstructor: false,
-  copilotId: null,
+  copilot: null,
 })
 
 onMounted(() => {
@@ -25,18 +26,22 @@ onMounted(() => {
     setDefaultData(formData, props.flight);
   }
 })
+
 </script>
 
 <template>
-    <FormWrapper v-model="formData">
+  <FormWrapper v-model="formData">
 
-  <q-btn-toggle spread no-caps v-model="formData.solo" toggle-color="primary" :options="[{label: 'Solo', value: true}, {label: 'S někým', value: false}]"/>
+    <q-btn-toggle spread no-caps v-model="formData.solo" toggle-color="primary" :options="[{label: 'Solo', value: true}, {label: 'S někým', value: false}]"/>
 
-  <div v-if="!formData.solo">
-    <q-input type="text" v-model="formData.secondPilot" label="Druhý pilot"/>
-    <q-checkbox v-model="formData.withInstructor" v-if="formData.secondPilot !== ''" label="Instruktor"/>
-    <!--            <q-input v-model="formData.picTime" label="PIC time"/>-->
-  </div>
+    {{ formData.copilot }}
 
-    </FormWrapper>
+    <div v-if="!formData.solo">
+      <ComboboxInput :options="copilots" v-model="formData.copilot" :key="formData.copilot" label="Druhy pilot" />
+
+      <q-checkbox v-model="formData.withInstructor" v-if="formData.copilot" label="Instruktor"/>
+      <!--            <q-input v-model="formData.picTime" label="PIC time"/>-->
+    </div>
+
+  </FormWrapper>
 </template>