feat: menu agencies (#65)

* feat: agencies => add agencies menu

---------

Co-authored-by: Methapon Metanipat <methapon@frappet.com>

src/components/07_agencies-management/FormBasicInfoAgencies.vue

@@ -0,0 +1,73 @@
+<script lang="ts" setup>
+import SelectInput from '../shared/SelectInput.vue';
+import useOptionStore from 'src/stores/options';
+
+const optionStore = useOptionStore();
+
+defineProps<{
+  dense?: boolean;
+  outlined?: boolean;
+  readonly?: boolean;
+  onDrawer?: boolean;
+}>();
+
+const group = defineModel('group', { default: '' });
+const name = defineModel('name', { default: '' });
+const nameEn = defineModel('nameEn', { default: '' });
+</script>
+<template>
+  <div class="row col-12">
+    <div class="col-12 q-pb-sm row items-center">
+      <q-icon
+        flat
+        size="xs"
+        class="q-pa-sm rounded q-mr-sm"
+        color="info"
+        name="mdi-office-building-outline"
+        style="background-color: var(--surface-3)"
+      />
+      <span class="text-body1 text-weight-bold">
+        {{ $t(`form.field.basicInformation`) }}
+      </span>
+    </div>
+
+    <div class="col-12 row q-col-gutter-sm">
+      <SelectInput
+        :disable="!readonly && onDrawer"
+        :readonly="readonly"
+        for="input-agencies-code"
+        :label="$t('agencies.group')"
+        option-label="value"
+        :option="optionStore.globalOption?.agenciesType"
+        v-model="group"
+      />
+      <q-input
+        for="input-agencies-name"
+        dense
+        outlined
+        :readonly="readonly"
+        hide-bottom-space
+        class="col"
+        :label="$t('agencies.name')"
+        v-model="name"
+        :rules="[(val: string) => !!val || $t('form.error.required')]"
+      />
+      <q-input
+        for="input-agencies-name-en"
+        dense
+        outlined
+        :readonly="readonly"
+        hide-bottom-space
+        class="col"
+        :label="'Agencies Name'"
+        v-model="nameEn"
+        :rules="[
+          (val: string) => !!val || $t('form.error.required'),
+          (val: string) =>
+            /^[A-Za-z0-9.,' -]+$/.test(val) || $t('form.error.letterOnly'),
+        ]"
+      />
+    </div>
+  </div>
+</template>
+<style scoped></style>