refactor:edit ui dialog

src/components/upload-file/UploadFileGroup.vue

@@ -30,6 +30,7 @@ const currentIndex = ref<number>(-1);
 const statusOcr = ref<boolean>(false);
 
 const props = defineProps<{
+  showTitle?: boolean;
   ocr?: (
     group: any,
     file: File,
@@ -180,6 +181,18 @@ defineEmits<{
 </script>
 
 <template>
+  <div v-if="!!showTitle" class="col-11 q-pb-sm text-weight-bold text-body1">
+    <q-icon
+      flat
+      size="xs"
+      class="q-pa-sm rounded q-mr-xs"
+      color="info"
+      name="mdi-account-outline"
+      style="background-color: var(--surface-3)"
+    />
+    {{ $t('general.upload', { msg: $t('general.attachment') }) }}
+  </div>
+
   <div
     class="relative-position full-width row no-wrap wrapper"
     style="height: 250px"

src/pages/05_quotation/QuotationForm.vue

@@ -778,36 +778,9 @@ onMounted(async () => {
             />
           </div>
         </div>
-        <div
-          class="col full-height rounded scroll row q-py-md q-pl-md q-pr-sm"
-          v-if="$q.screen.gt.sm"
-        >
-          <SideMenu
-            :menu="[
-              {
-                name: $t('form.customerInformation'),
-                anchor: 'form-information',
-              },
-              {
-                name: $t('customerBranch.tab.business'),
-                anchor: 'form-business',
-              },
-              {
-                name: $t('form.address'),
-                anchor: 'form-address',
-              },
-            ]"
-            background="transparent"
-            :active="{
-              background: 'hsla(var(--blue-6-hsl) / .2)',
-              foreground: 'var(--blue-6)',
-            }"
-            scroll-element="#branch-form"
-          />
-        </div>
 
         <div
-          class="col-12 col-md-10 full-height q-col-gutter-sm"
+          class="col-12 full-height q-col-gutter-sm q-py-md q-pl-md q-pr-sm"
           :class="{
             'q-py-md q-pr-md ': $q.screen.gt.sm,
             'q-py-md q-px-lg': !$q.screen.gt.sm,
@@ -823,6 +796,7 @@ onMounted(async () => {
               formDataEmployee.alienReferencNumber
             "
             v-model:document-expire-date="formDataEmployee.documentExpireDate"
+            class="q-mb-md"
           />
 
           <FormPerson
@@ -834,7 +808,7 @@ onMounted(async () => {
             separator
             hideNameEn
             title="personnel.form.personalInformation"
-            class="q-mb-xl"
+            class="q-mb-md"
             v-model:prefix-name="formDataEmployee.namePrefix"
             v-model:first-name="formDataEmployee.firstName"
             v-model:mid-name="formDataEmployee.middleName"
@@ -845,6 +819,7 @@ onMounted(async () => {
           />
 
           <UploadFileGroup
+            show-title
             v-model:current-id="currentFromDataEmployee.id"
             v-model="currentFromDataEmployee.file"
             hide-action