105 lines
2.4 KiB
Vue
105 lines
2.4 KiB
Vue
<script setup>
|
|
import {onMounted, reactive} from "vue";
|
|
import FormWrapper from "components/FormWrapper.vue";
|
|
import {setDefaultData} from "src/composables/form/formHandling";
|
|
import {isNumber, isRequired, maxLength, minLength} from "src/composables/form/rules";
|
|
import {commonProps} from "src/composables/inputs";
|
|
import ComboboxInput from "components/inputs/ComboboxInput.vue";
|
|
|
|
const props = defineProps({
|
|
defaultValues: {
|
|
type: Object,
|
|
required: false,
|
|
default: () => ({})
|
|
},
|
|
isRequestPending: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false,
|
|
},
|
|
organizations: {
|
|
type: Array,
|
|
required: true,
|
|
}
|
|
});
|
|
|
|
const formData = reactive({
|
|
id: null,
|
|
callSign: "",
|
|
model: "",
|
|
seats: null,
|
|
manufacturer: "",
|
|
description: "",
|
|
organization: null,
|
|
isPublic: false
|
|
});
|
|
|
|
const rules = {
|
|
callSign: [isRequired, minLength(4), maxLength(8)],
|
|
seats: [isRequired, isNumber]
|
|
};
|
|
|
|
onMounted(() => {
|
|
if (Object.keys(props.defaultValues).length > 0) {
|
|
setDefaultData(formData, props.defaultValues);
|
|
if (props.defaultValues.organization) {
|
|
formData.organization = {id: props.defaultValues.organization.id, name: props.defaultValues.organization.name};
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<FormWrapper v-model="formData" :is-request-pending="props.isRequestPending">
|
|
<q-img :src="props.defaultValues.photoUrl" v-if="props.defaultValues.photoUrl"/>
|
|
|
|
<q-input
|
|
type="text"
|
|
:rules="rules.callSign"
|
|
v-model="formData.callSign"
|
|
label="Volací značka"
|
|
v-bind="commonProps"
|
|
/>
|
|
|
|
<q-input
|
|
type="number"
|
|
v-model.number="formData.seats"
|
|
label="Počet míst (včetně pilota)"
|
|
min="1"
|
|
:rules="rules.seats"
|
|
v-bind="commonProps"
|
|
/>
|
|
|
|
<ComboboxInput
|
|
:options="organizations"
|
|
label="Organizace"
|
|
v-model="formData.organization"
|
|
v-bind="commonProps"
|
|
hint="Vyber provozovatele letadla. Tím se stane dostupné i pro ostatní členy vybrané organizace."
|
|
/>
|
|
|
|
<q-input
|
|
type="text"
|
|
v-model="formData.manufacturer"
|
|
label="Výrobce"
|
|
v-bind="commonProps"
|
|
/>
|
|
<q-input
|
|
type="text"
|
|
v-model="formData.model"
|
|
label="Model"
|
|
v-bind="commonProps"
|
|
/>
|
|
|
|
<q-input
|
|
type="textarea"
|
|
v-model="formData.description"
|
|
label="Popis"
|
|
v-bind="commonProps"
|
|
/>
|
|
|
|
<q-checkbox v-model="formData.isPublic" label="Veřejné?" v-bind="commonProps"/>
|
|
|
|
</FormWrapper>
|
|
</template>
|