refactor: add closeTab

src/pages/05_quotation/QuotationForm.vue

@@ -46,6 +46,7 @@ import {
   EditButton,
   UndoButton,
   DeleteButton,
+  CancelButton,
 } from 'components/button';
 import ProductServiceForm from './ProductServiceForm.vue';
 import QuotationFormInfo from './QuotationFormInfo.vue';
@@ -210,6 +211,10 @@ const productServiceList = ref<
   Required<QuotationPayload['productServiceList'][number]>[]
 >([]);
 
+function closeTab() {
+  window.close();
+}
+
 async function assignToProductServiceList() {
   const ret = await productServiceStore.fetchProductGroup({
     page: 1,
@@ -873,24 +878,27 @@ async function searchEmployee(text: string) {
           <q-icon name="mdi-play-box-outline" size="xs" class="q-mr-xs" />
           {{ $t('general.view', { msg: $t('general.example') }) }}
         </q-btn>
-        <SaveButton
-          v-if="
-            quotationFormState.mode === 'create' ||
-            quotationFormState.mode === 'edit'
-          "
-          @click="
-            () => {
-              convertDataToFormSubmit();
-            }
-          "
-          solid
-        />
-        <EditButton
-          v-else
-          class="no-print"
-          @click="quotationFormState.mode = 'edit'"
-          solid
-        />
+        <div class="row" style="gap: var(--size-2)">
+          <CancelButton solid @click="closeTab()" />
+          <SaveButton
+            v-if="
+              quotationFormState.mode === 'create' ||
+              quotationFormState.mode === 'edit'
+            "
+            @click="
+              () => {
+                convertDataToFormSubmit();
+              }
+            "
+            solid
+          />
+          <EditButton
+            v-else
+            class="no-print"
+            @click="quotationFormState.mode = 'edit'"
+            solid
+          />
+        </div>
       </div>
     </footer>