fix: readonly, info code & createdAt

src/components/05_quotation/ProductItem.vue

@@ -60,7 +60,6 @@ const summaryPrice = defineModel<{
 const currentBtnOpen = ref<{ title: string; opened: boolean[] }[]>([
   { title: '', opened: [] },
 ]);
-const finalDiscount4Show = ref<string>(finalDiscount.value.toString());
 
 function calcPrice(c: (typeof rows.value)[number]) {
   return precisionRound(

src/pages/05_quotation/QuotationForm.vue

@@ -72,9 +72,9 @@ import { group } from 'node:console';
 import { precisionRound } from 'src/utils/arithmetic';
 import { useConfigStore } from 'src/stores/config';
 
-defineProps<{
-  readonly?: boolean;
-}>();
+// defineProps<{
+//   readonly?: boolean;
+// }>();
 
 type Node = {
   [key: string]: any;
@@ -558,7 +558,6 @@ onMounted(async () => {
       currentQuotationId.value,
       quotationFormState.value.mode,
     );
-
     await assignWorkerToSelectedWorker();
   }
   await assignToProductServiceList();
@@ -609,7 +608,10 @@ watch(
           <span class="text-caption text-regular app-text-muted">
             {{
               $t('quotation.processOn', {
-                msg: `${dateFormat(date, true)} ${dateFormat(date, true, true)}`,
+                msg:
+                  quotationFormState.mode === 'create'
+                    ? `${dateFormat(date, true)} ${dateFormat(date, true, true)}`
+                    : `${dateFormat(quotationFull?.createdAt, true)} ${dateFormat(quotationFull?.createdAt, true, true)}`,
               })
             }}
           </span>
@@ -822,8 +824,8 @@ watch(
         :class="{ 'full-height': $q.screen.gt.xs }"
       >
         <QuotationFormInfo
+          :quotation-no="quotationFull && quotationFull.code"
           v-model:urgent="quotationFormData.urgent"
-          v-model:quotation-no="quotationNo"
           v-model:actor="quotationFormData.actorName"
           v-model:work-name="quotationFormData.workName"
           v-model:contactor="quotationFormData.contactName"

src/pages/05_quotation/QuotationFormInfo.vue

@@ -5,7 +5,7 @@ import { selectFilterOptionRefMod } from 'src/stores/utils';
 import { onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import { formatNumberDecimal } from 'stores/utils';
+import { formatNumberDecimal, commaInput } from 'stores/utils';
 
 import { useConfigStore } from 'stores/config';
 import AppBox from 'components/app/AppBox.vue';
@@ -17,6 +17,7 @@ import { storeToRefs } from 'pinia';
 
 defineProps<{
   readonly?: boolean;
+  quotationNo?: string;
   data?: {
     total: number;
     discount: number;
@@ -34,7 +35,6 @@ const urgent = defineModel<boolean>('urgent', {
   required: true,
   default: false,
 });
-const quotationNo = defineModel<string>('quotationNo', { required: true });
 const actor = defineModel<string>('actor', { required: true });
 const workName = defineModel<string>('workName', { required: true });
 const contactor = defineModel<string>('contactor', { required: true });
@@ -71,7 +71,9 @@ const summaryPrice = defineModel<{
 
 const optionStore = useOptionStore();
 
-const finalDiscount = defineModel('finalDiscount', { default: 0 });
+const finalDiscount = defineModel<number>('finalDiscount', { default: 0 });
+const finalDiscount4Show = ref<string>(finalDiscount.value.toString());
+
 const payTypeOpion = ref([
   {
     value: 'Full',
@@ -180,6 +182,7 @@ watch(
         class="q-ml-auto"
         size="xs"
         :label="$t('general.urgent')"
+        :disable="readonly"
       />
     </div>
 
@@ -190,7 +193,7 @@ watch(
           :label="$t('general.itemNo', { msg: $t('quotation.title') })"
           :readonly
           :model-value="!quotationNo ? $t('general.generated') : quotationNo"
-          disable
+          :disable="!readonly"
           class="col-12"
           dense
           outlined
@@ -200,7 +203,7 @@ watch(
           :label="$t('quotation.actor')"
           :readonly
           v-model="actor"
-          disable
+          :disable="!readonly"
           class="col-12"
           dense
           outlined
@@ -503,13 +506,24 @@ watch(
       <div class="row">
         {{ $t('general.discountAfterVat') }}
         <q-input
+          :readonly
           dense
           outlined
           class="q-ml-auto price-tag"
           input-class="text-right"
           debounce="500"
-          :model-value="finalDiscount"
-          @update:model-value="(v) => (finalDiscount = Number(v))"
+          :model-value="commaInput(finalDiscount.toString() || '0')"
+          @update:model-value="
+            (v) => {
+              if (typeof v === 'string') finalDiscount4Show = commaInput(v);
+              const x = parseFloat(
+                finalDiscount4Show && typeof finalDiscount4Show === 'string'
+                  ? finalDiscount4Show.replace(/,/g, '')
+                  : '',
+              );
+              finalDiscount = x;
+            }
+          "
         />
         <!-- <span class="q-ml-auto">{{ data?.totalVatIncluded || 0 }} ฿</span> -->
       </div>