feat: receipt view (#41)

* refactor: handle show form  receipt

* refactor: fetch receipt

* fix: i18n

* refactor: quotation receipt components

* refactor: by data Receipt

* refactor: delete  btn peview

* fix: wrong view condition

* rfactor: send Queery quotationId

* refactor: edit condition view

---------

Co-authored-by: Thanaphon Frappet <thanaphon@frappet.com>
Co-authored-by: puriphatt <puriphat@frappet.com>

src/pages/05_quotation/QuotationFormReceipt.vue

@@ -0,0 +1,52 @@
+<script lang="ts" setup>
+import { formatNumberDecimal } from 'stores/utils';
+import { dateFormatJS } from 'src/utils/datetime';
+
+withDefaults(
+  defineProps<{
+    payType: string;
+    amount: number;
+    date: string | Date;
+  }>(),
+  { payType: 'Full', amount: 0, date: () => new Date() },
+);
+</script>
+<template>
+  <section class="surface-1 rounded row">
+    <aside class="column col bordered-r q-py-md q-pl-md">
+      <span class="text-weight-medium text-body1">
+        {{ $t('quotation.receiptDialog.PaymentReceive') }}
+      </span>
+      <span class="app-text-muted-2 q-pt-md">
+        {{ $t('quotation.receiptDialog.paymentMethod') }}
+      </span>
+      <span class="row items-center">
+        {{ $t(`quotation.type.${payType}`) }}
+        <q-icon name="mdi-minus" class="q-px-xs" />
+        <article class="app-text-positive text-weight-medium">
+          {{ $t('quotation.receiptDialog.PaymentSuccess') }}
+        </article>
+        <article class="q-ml-auto text-weight-bold text-body1 q-pr-lg">
+          ฿ {{ formatNumberDecimal(amount, 2) }}
+        </article>
+      </span>
+    </aside>
+
+    <aside class="column col q-py-md text-right self-center q-px-md">
+      <span class="app-text-positive text-weight-bold text-body1">
+        {{ $t('quotation.receiptDialog.receiptIssued') }}
+      </span>
+      <div class="app-text-muted-2">
+        <q-icon name="mdi-calendar-blank-outline" />
+        {{
+          dateFormatJS({
+            date: date,
+            dayStyle: '2-digit',
+            monthStyle: '2-digit',
+          })
+        }}
+      </div>
+    </aside>
+  </section>
+</template>
+<style scoped></style>