app/pages/parameters/residence_areas/new.vue

<template>
  <LayoutContainer>
    <UiLoadingPanel v-if="pending" />
    <div v-else>
      <h2>Créer Nouvelle Résidence Area</h2>
      <UiForm
        ref="form"
        :model="ResidenceArea"
        :entity="residence_areas"
        :submitActions="submitActions"
      >
      <v-container :fluid="true" class="container">
          <v-row>
            <v-col cols="12" sm="6">
              <div>{{ $t('pleaseEnterYourNewSubdomain')}} :</div>
            </v-col>
          </v-row>
          <v-row>
            <v-col cols="12" sm="6">
              <UiInputText
                  v-model="residence_areas.label"
                  field="residence Areas"
                  type="string"
                  :rules="rules()"
              />
            </v-col>
          </v-row>
        </v-container>
      </UiForm>
    </div>
  </LayoutContainer>
</template>

<script setup lang="ts">
import { ref, onMounted, computed } from 'vue'
import {Ref} from "@vue/reactivity";
import { useEntityFetch } from '~/composables/data/useEntityFetch'
import {AnyJson} from "~/types/data";
import {SUBMIT_TYPE} from "~/types/enum/enums";
import ResidenceArea from '~/models/Billing/ResidenceArea'
import { useI18n } from 'vue-i18n'
import { useEntityManager } from '~/composables/data/useEntityManager'

const i18n = useI18n()

const { em } = useEntityManager()

const residence_areas: Ref<ResidenceArea> = ref(em.newInstance(ResidenceArea) as ResidenceArea)

const goBackRoute = { path: `/parameters`, query: { tab: 'residenceAreas' } }


const submitActions = computed(() => {
  let actions: AnyJson = {}
  actions[SUBMIT_TYPE.SAVE_AND_BACK] = goBackRoute
  return actions
})

const rules = () => [
  (label: string | null) => (label !== null && label.length > 0) || i18n.t('please_enter_a_value'),
]
</script>