perf: refs #8061 filter autonomy

src/components/CreateNewCityForm.vue

@@ -47,11 +47,13 @@ const onDataSaved = (...args) => {
                     :label="t('Name')"
                     v-model="data.name"
                     :rules="validate('city.name')"
+                    required
                 />
                 <VnSelectProvince
                     :province-selected="$props.provinceSelected"
                     :country-fk="$props.countryFk"
                     v-model="data.provinceFk"
+                    required
                 />
             </VnRow>
         </template>

src/components/CreateNewPostcodeForm.vue

@@ -174,6 +174,7 @@ async function onProvinceCreated(data) {
                     v-model="data.code"
                     :rules="validate('postcode.code')"
                     clearable
+                    required
                 />
                 <VnSelectDialog
                     :label="t('City')"
@@ -188,6 +189,7 @@ async function onProvinceCreated(data) {
                     :acls="[{ model: 'Town', props: '*', accessType: 'WRITE' }]"
                     :emit-value="false"
                     :clearable="true"
+                    required
                 >
                     <template #option="{ itemProps, opt }">
                         <QItem v-bind="itemProps">
@@ -220,8 +222,10 @@ async function onProvinceCreated(data) {
                     v-model="data.provinceFk"
                     @on-province-fetched="handleProvinces"
                     @on-province-created="onProvinceCreated"
+                    required
                 />
                 <VnSelect
+                    required
                     :label="t('Country')"
                     @update:options="handleCountries"
                     :options="countriesOptions"

src/components/CreateNewProvinceForm.vue

@@ -2,7 +2,6 @@
 import { computed, reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import FetchData from 'components/FetchData.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInput from 'src/components/common/VnInput.vue';
@@ -21,15 +20,11 @@ const $props = defineProps({
         type: Number,
         default: null,
     },
-    provinces: {
-        type: Array,
-        default: () => [],
-    },
 });
-const autonomiesOptions = ref([]);
+const autonomiesRef = ref([]);
 
 const onDataSaved = (dataSaved, requestResponse) => {
-    requestResponse.autonomy = autonomiesOptions.value.find(
+    requestResponse.autonomy = autonomiesRef.value.opts.find(
         (autonomy) => autonomy.id == requestResponse.autonomyFk
     );
     emit('onDataSaved', dataSaved, requestResponse);
@@ -43,16 +38,6 @@ const where = computed(() => {
 </script>
 
 <template>
-    <FetchData
-        @on-fetch="(data) => (autonomiesOptions = data)"
-        auto-load
-        :filter="{
-            where,
-        }"
-        url="Autonomies/location"
-        :sort-by="['name ASC']"
-        :limit="30"
-    />
     <FormModelPopup
         :title="t('New province')"
         :subtitle="t('Please, ensure you put the correct data!')"
@@ -67,10 +52,17 @@ const where = computed(() => {
                     :label="t('Name')"
                     v-model="data.name"
                     :rules="validate('province.name')"
+                    required
                 />
                 <VnSelect
+                    required
+                    ref="autonomiesRef"
+                    auto-load
+                    :where="where"
+                    url="Autonomies/location"
+                    :sort-by="['name ASC']"
+                    :limit="30"
                     :label="t('Autonomy')"
-                    :options="autonomiesOptions"
                     hide-selected
                     option-label="name"
                     option-value="id"