@feedmepos/mf-order-setting 0.0.33 → 0.0.35

package/src/stores/order-setting/mapper.ts

@@ -1,206 +1,268 @@
-import { OrderSettingsDto, OrderKioskDineIn, OrderKioskDineInSequenceDto, FdoOrderKioskDineInSequence, FdoEPaymentMethod } from "@entity";
-import type { MfKioskOrderSetting, MfKioskDineInSetting, MfDisplayStandSetting, KioskTakeawaySettingForm, MfKioskOrderSettingForm, MfKioskPaymentSetting, MfKioskSubmitOrderInstruction, KioskPickAtCounterSettingForm } from '@/modules/order-setting/kiosk/interface';
-import type { MfOrderSetting } from "@/modules/order-setting/interface";
-import type { OrderKioskSettings, OrderKioskPaymentSetting } from "@entity";
+import {
+  OrderSettingsDto,
+  OrderKioskDineIn,
+  OrderKioskDineInSequenceDto,
+  FdoOrderKioskDineInSequence,
+  FdoEPaymentMethod
+} from '@entity'
+import type {
+  MfKioskOrderSetting,
+  MfKioskDineInSetting,
+  MfDisplayStandSetting,
+  KioskTakeawaySettingForm,
+  MfKioskOrderSettingForm,
+  MfKioskPaymentSetting,
+  MfKioskSubmitOrderInstruction,
+  KioskPickAtCounterSettingForm
+} from '@/modules/order-setting/kiosk/interface'
+import type { MfOrderSetting } from '@/modules/order-setting/interface'
+import type { OrderKioskSettings, OrderKioskPaymentSetting } from '@entity'
 
 export const defaultDisplayStand: MfDisplayStandSetting = {
-    enabled: false,
-    prefix: null,
-    padDigit: 0,
-    standSlotRange: {
-        min: 1,
-        max: 10,
-    },
-    enablePaxDialog: false,
-    submitOrderInstruction: {
-        payAtCounter: null,
-        paid: null,
-    },
+  enabled: false,
+  prefix: null,
+  padDigit: 0,
+  standSlotRange: {
+    min: 1,
+    max: 10
+  },
+  enablePaxDialog: false,
+  submitOrderInstruction: {
+    payAtCounter: null,
+    paid: null
+  }
 }
 
 export const defaultTakeaway: KioskTakeawaySettingForm = {
-    enabled: false,
-    submitOrderInstruction: {
-        payAtCounter: null,
-        paid: null,
-    },
+  enabled: false,
+  submitOrderInstruction: {
+    payAtCounter: null,
+    paid: null
+  }
 }
 
 export const defaultPickUp: KioskPickAtCounterSettingForm = {
-    enabled: false,
-    submitOrderInstruction: {
-        payAtCounter: null,
-        paid: null,
-    },
-    enablePaxDialog: false,
+  enabled: false,
+  submitOrderInstruction: {
+    payAtCounter: null,
+    paid: null
+  },
+  enablePaxDialog: false
 }
 
 export const defaultKioskOrderSetting: MfKioskOrderSettingForm = {
-    dineIn: {
-        enabled: false,
-        pickUp: defaultPickUp,
-        sequenceNumber: FdoOrderKioskDineInSequence.parse({}),
-        displayStand: defaultDisplayStand,
-    },
-    takeaway: defaultTakeaway,
-    paymentSetting: {
-        paymentTypes: [],
-        offlinePaymentTypes: [],
-        ePaymentTypes: {
-            card: {
-                terminal: false,
-                nfc: false
-            },
-            eWallet: {
-                qrPay: false,
-                scanPay: false
-            }
-        },
-    },
-    menuItem: {
-        showAllOnly: false,
+  dineIn: {
+    enabled: false,
+    pickUp: defaultPickUp,
+    sequenceNumber: FdoOrderKioskDineInSequence.parse({}),
+    displayStand: defaultDisplayStand
+  },
+  takeaway: defaultTakeaway,
+  paymentSetting: {
+    paymentTypes: [],
+    offlinePaymentTypes: [],
+    ePaymentTypes: {
+      card: {
+        terminal: false,
+        nfc: false
+      },
+      eWallet: {
+        qrPay: false,
+        scanPay: false,
+        terminalScanPay: false,
+        terminalQrPay: false
+      }
     }
+  },
+  menuItem: {
+    showAllOnly: false
+  }
 }
 
 export const defaultSubmitOrderInstruction: MfKioskSubmitOrderInstruction = {
-    payAtCounter: null,
-    paid: null,
+  payAtCounter: null,
+  paid: null
 }
 
 const convertOrderSettingDto = (dto: OrderSettingsDto): MfOrderSetting => {
-    return {
-        kiosk: toKiosk(dto.kioskSettings, dto.sequenceSettings?.kioskDineIn),
-    };
+  return {
+    kiosk: toKiosk(dto.kioskSettings, dto.sequenceSettings?.kioskDineIn)
+  }
 }
 
-const toKiosk = (kioskOrderSettings: OrderKioskSettings, kioskDineInSeq?: OrderKioskDineInSequenceDto): MfKioskOrderSetting => {
-    return {
-        dineIn: toKioskDineInSetting(kioskDineInSeq ?? {
-            current: 0,
-            prefix: '#K',
-        }, kioskOrderSettings.dineIn ?? undefined),
-        takeaway: {
-            enabled: kioskOrderSettings?.canTakeaway ?? false,
-            submitOrderInstruction: kioskOrderSettings?.takeaway?.submitOrderInstruction ? {
-                payAtCounter: kioskOrderSettings.takeaway.submitOrderInstruction?.payAtCounter?.['en'] ?? null,
-                paid: kioskOrderSettings.takeaway.submitOrderInstruction?.paid?.['en'] ?? null,
-            } : defaultSubmitOrderInstruction,
-        },
-        paymentSetting: {
-            paymentTypes: kioskOrderSettings?.paymentSetting?.paymentTypes ?? [],
-            offlinePaymentTypes: kioskOrderSettings?.paymentSetting?.offlinePaymentTypes ?? [],
-            ePaymentTypes: kioskOrderSettings?.paymentSetting?.ePaymentTypes ?? FdoEPaymentMethod.parse({
-                card: {
-                    terminal: false,
-                    nfc: false
-                },
-                eWallet: {
-                    qrPay: false,
-                    scanPay: false
-                }
-            }),
-        },
-        menuItem: {
-            showAllOnly: kioskOrderSettings.menuItem?.showAllOnly ?? false,
-        }
+const toKiosk = (
+  kioskOrderSettings: OrderKioskSettings,
+  kioskDineInSeq?: OrderKioskDineInSequenceDto
+): MfKioskOrderSetting => {
+  return {
+    dineIn: toKioskDineInSetting(
+      kioskDineInSeq ?? {
+        current: 0,
+        prefix: '#K'
+      },
+      kioskOrderSettings.dineIn ?? undefined
+    ),
+    takeaway: {
+      enabled: kioskOrderSettings?.canTakeaway ?? false,
+      submitOrderInstruction: kioskOrderSettings?.takeaway?.submitOrderInstruction
+        ? {
+            payAtCounter:
+              kioskOrderSettings.takeaway.submitOrderInstruction?.payAtCounter?.['en'] ?? null,
+            paid: kioskOrderSettings.takeaway.submitOrderInstruction?.paid?.['en'] ?? null
+          }
+        : defaultSubmitOrderInstruction
+    },
+    paymentSetting: {
+      paymentTypes: kioskOrderSettings?.paymentSetting?.paymentTypes ?? [],
+      offlinePaymentTypes: kioskOrderSettings?.paymentSetting?.offlinePaymentTypes ?? [],
+      ePaymentTypes:
+        kioskOrderSettings?.paymentSetting?.ePaymentTypes ??
+        FdoEPaymentMethod.parse({
+          card: {
+            terminal: false,
+            nfc: false
+          },
+          eWallet: {
+            qrPay: false,
+            scanPay: false,
+            terminalScanPay: false,
+            terminalQrPay: false
+          }
+        })
+    },
+    menuItem: {
+      showAllOnly: kioskOrderSettings.menuItem?.showAllOnly ?? false
     }
+  }
 }
 
-const toKioskDineInSetting = (kioskDineInSeq: OrderKioskDineInSequenceDto, kioskDineInSetting?: OrderKioskDineIn): MfKioskDineInSetting => {
-    return {
-        enabled: !!kioskDineInSetting,
-        sequenceNumber: kioskDineInSeq,
-        pickUp: kioskDineInSetting?.pickUp ? {
-            ...kioskDineInSetting.pickUp,
-            submitOrderInstruction: kioskDineInSetting.pickUp.submitOrderInstruction ? {
-                payAtCounter: kioskDineInSetting.pickUp.submitOrderInstruction?.payAtCounter?.['en'] ?? null,
-                paid: kioskDineInSetting.pickUp.submitOrderInstruction?.paid?.['en'] ?? null,
-            } : defaultSubmitOrderInstruction,
-            enablePaxDialog: kioskDineInSetting.pickUp.enablePaxDialog ? kioskDineInSetting.pickUp.enablePaxDialog : false,
-        } : defaultPickUp,
-        displayStand: kioskDineInSetting?.displayStand ? {
-            enabled: kioskDineInSetting.displayStand.enabled,
-            standSlotRange: kioskDineInSetting.displayStand.standSlotRange,
-            prefix: kioskDineInSetting.displayStand.prefix,
-            padDigit: kioskDineInSetting.displayStand.padDigit,
-            enablePaxDialog: kioskDineInSetting.displayStand.enablePaxDialog ?? false,
-            submitOrderInstruction: kioskDineInSetting.displayStand.submitOrderInstruction ? {
-                payAtCounter: kioskDineInSetting.displayStand.submitOrderInstruction?.payAtCounter?.['en'] ?? null,
-                paid: kioskDineInSetting.displayStand.submitOrderInstruction?.paid?.['en'] ?? null,
-            } : defaultSubmitOrderInstruction,
-        } : defaultDisplayStand
-    }
+const toKioskDineInSetting = (
+  kioskDineInSeq: OrderKioskDineInSequenceDto,
+  kioskDineInSetting?: OrderKioskDineIn
+): MfKioskDineInSetting => {
+  return {
+    enabled: !!kioskDineInSetting,
+    sequenceNumber: kioskDineInSeq,
+    pickUp: kioskDineInSetting?.pickUp
+      ? {
+          ...kioskDineInSetting.pickUp,
+          submitOrderInstruction: kioskDineInSetting.pickUp.submitOrderInstruction
+            ? {
+                payAtCounter:
+                  kioskDineInSetting.pickUp.submitOrderInstruction?.payAtCounter?.['en'] ?? null,
+                paid: kioskDineInSetting.pickUp.submitOrderInstruction?.paid?.['en'] ?? null
+              }
+            : defaultSubmitOrderInstruction,
+          enablePaxDialog: kioskDineInSetting.pickUp.enablePaxDialog
+            ? kioskDineInSetting.pickUp.enablePaxDialog
+            : false
+        }
+      : defaultPickUp,
+    displayStand: kioskDineInSetting?.displayStand
+      ? {
+          enabled: kioskDineInSetting.displayStand.enabled,
+          standSlotRange: kioskDineInSetting.displayStand.standSlotRange,
+          prefix: kioskDineInSetting.displayStand.prefix,
+          padDigit: kioskDineInSetting.displayStand.padDigit,
+          enablePaxDialog: kioskDineInSetting.displayStand.enablePaxDialog ?? false,
+          submitOrderInstruction: kioskDineInSetting.displayStand.submitOrderInstruction
+            ? {
+                payAtCounter:
+                  kioskDineInSetting.displayStand.submitOrderInstruction?.payAtCounter?.['en'] ??
+                  null,
+                paid: kioskDineInSetting.displayStand.submitOrderInstruction?.paid?.['en'] ?? null
+              }
+            : defaultSubmitOrderInstruction
+        }
+      : defaultDisplayStand
+  }
 }
-const toOrderKioskSettingsDto = (kioskSetting: MfKioskOrderSetting): {
-    kioskSettings: OrderKioskSettings,
-    kioskDineIn?: OrderKioskDineInSequenceDto
+const toOrderKioskSettingsDto = (
+  kioskSetting: MfKioskOrderSetting
+): {
+  kioskSettings: OrderKioskSettings
+  kioskDineIn?: OrderKioskDineInSequenceDto
 } => {
-    const createDineInSettings = (dineInSetting: MfKioskDineInSetting): OrderKioskDineIn => ({
-        requiredSlot: !!dineInSetting.displayStand,
-        displayStand: {
-            ...dineInSetting.displayStand,
-            submitOrderInstruction: {
-                payAtCounter: dineInSetting.displayStand.submitOrderInstruction?.payAtCounter ? {
-                    en: dineInSetting.displayStand.submitOrderInstruction.payAtCounter,
-                } : null,
-                paid: dineInSetting.displayStand.submitOrderInstruction?.paid ? {
-                    en: dineInSetting.displayStand.submitOrderInstruction.paid,
-                } : null,
+  const createDineInSettings = (dineInSetting: MfKioskDineInSetting): OrderKioskDineIn => ({
+    requiredSlot: !!dineInSetting.displayStand,
+    displayStand: {
+      ...dineInSetting.displayStand,
+      submitOrderInstruction: {
+        payAtCounter: dineInSetting.displayStand.submitOrderInstruction?.payAtCounter
+          ? {
+              en: dineInSetting.displayStand.submitOrderInstruction.payAtCounter
             }
-        },
-        pickUp: {
-            ...dineInSetting.pickUp,
-            submitOrderInstruction: {
-                payAtCounter: dineInSetting.pickUp.submitOrderInstruction?.payAtCounter ? {
-                    en: dineInSetting.pickUp.submitOrderInstruction.payAtCounter,
-                } : null,
-                paid: dineInSetting.pickUp.submitOrderInstruction?.paid ? {
-                    en: dineInSetting.pickUp.submitOrderInstruction.paid,
-                } : null,
+          : null,
+        paid: dineInSetting.displayStand.submitOrderInstruction?.paid
+          ? {
+              en: dineInSetting.displayStand.submitOrderInstruction.paid
             }
-        }
-    })
-
-    const createKioskSettings = (dineIn?: OrderKioskDineIn): OrderKioskSettings => ({
-        canTakeaway: kioskSetting.takeaway.enabled,
-        dineIn,
-        menuItem: kioskSetting.menuItem,
-        paymentSetting: createPaymentSettings(kioskSetting.paymentSetting),
-        takeaway: kioskSetting.takeaway.submitOrderInstruction ? {
-            submitOrderInstruction: {
-                payAtCounter: kioskSetting.takeaway.submitOrderInstruction.payAtCounter ? {
-                    en: kioskSetting.takeaway.submitOrderInstruction.payAtCounter,
-                } : null,
-                paid: kioskSetting.takeaway.submitOrderInstruction.paid ? {
-                    en: kioskSetting.takeaway.submitOrderInstruction.paid,
-                } : null,
+          : null
+      }
+    },
+    pickUp: {
+      ...dineInSetting.pickUp,
+      submitOrderInstruction: {
+        payAtCounter: dineInSetting.pickUp.submitOrderInstruction?.payAtCounter
+          ? {
+              en: dineInSetting.pickUp.submitOrderInstruction.payAtCounter
             }
-        } : undefined
-    })
-
-    const createPaymentSettings = (paymentSetting: MfKioskPaymentSetting): OrderKioskPaymentSetting | undefined => {
-        return {
-            paymentTypes: paymentSetting.paymentTypes,
-            offlinePaymentTypes: paymentSetting.offlinePaymentTypes,
-            ePaymentTypes: paymentSetting.ePaymentTypes,
-        }
+          : null,
+        paid: dineInSetting.pickUp.submitOrderInstruction?.paid
+          ? {
+              en: dineInSetting.pickUp.submitOrderInstruction.paid
+            }
+          : null
+      }
     }
+  })
 
-    if (!kioskSetting.dineIn.enabled) {
-        return {
-            kioskSettings: createKioskSettings()
+  const createKioskSettings = (dineIn?: OrderKioskDineIn): OrderKioskSettings => ({
+    canTakeaway: kioskSetting.takeaway.enabled,
+    dineIn,
+    menuItem: kioskSetting.menuItem,
+    paymentSetting: createPaymentSettings(kioskSetting.paymentSetting),
+    takeaway: kioskSetting.takeaway.submitOrderInstruction
+      ? {
+          submitOrderInstruction: {
+            payAtCounter: kioskSetting.takeaway.submitOrderInstruction.payAtCounter
+              ? {
+                  en: kioskSetting.takeaway.submitOrderInstruction.payAtCounter
+                }
+              : null,
+            paid: kioskSetting.takeaway.submitOrderInstruction.paid
+              ? {
+                  en: kioskSetting.takeaway.submitOrderInstruction.paid
+                }
+              : null
+          }
         }
-    }
+      : undefined
+  })
 
+  const createPaymentSettings = (
+    paymentSetting: MfKioskPaymentSetting
+  ): OrderKioskPaymentSetting | undefined => {
     return {
-        kioskSettings: createKioskSettings(createDineInSettings(kioskSetting.dineIn)),
-        kioskDineIn: kioskSetting.dineIn.sequenceNumber,
+      paymentTypes: paymentSetting.paymentTypes,
+      offlinePaymentTypes: paymentSetting.offlinePaymentTypes,
+      ePaymentTypes: paymentSetting.ePaymentTypes
     }
-}
+  }
 
+  if (!kioskSetting.dineIn.enabled) {
+    return {
+      kioskSettings: createKioskSettings()
+    }
+  }
 
+  return {
+    kioskSettings: createKioskSettings(createDineInSettings(kioskSetting.dineIn)),
+    kioskDineIn: kioskSetting.dineIn.sequenceNumber
+  }
+}
 
 export const OrderSettingMapper = {
-    convertOrderSettingDto,
-    toOrderKioskSettingsDto,
-};
+  convertOrderSettingDto,
+  toOrderKioskSettingsDto
+}

package/src/views/kiosk/settings/KioskPaymentTypeSection.vue

@@ -87,6 +87,16 @@ const initializeCheckboxes = () => {
       eWalletPaymentCheckboxVal.value.push(F_ORDER_E_PAYMENT_TYPE.enum.SCANPAY)
       useEwallet.value = true
     }
+
+    if (props.ePaymentTypes.eWallet.terminalScanPay) {
+      eWalletPaymentCheckboxVal.value.push(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_SCAN_PAY)
+      useEwallet.value = true
+    }
+
+    if (props.ePaymentTypes.eWallet.terminalQrPay) {
+      eWalletPaymentCheckboxVal.value.push(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_QR_PAY)
+      useEwallet.value = true
+    }
   }
 }
 
@@ -148,7 +158,9 @@ const handleEPaymentCardUpdate = (ev: string) => {
     },
     eWallet: {
       qrPay: false,
-      scanPay: false
+      scanPay: false,
+      terminalScanPay: false,
+      terminalQrPay: false,
     }
   } as FdoEPaymentMethod
 
@@ -169,6 +181,12 @@ const handleEPaymentCardUpdate = (ev: string) => {
       if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.SCANPAY)) {
         ePaymentObj.eWallet.scanPay = true
       }
+      if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_SCAN_PAY)) {
+        ePaymentObj.eWallet.terminalScanPay = true
+      }
+      if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_QR_PAY)) {
+        ePaymentObj.eWallet.terminalQrPay = true
+      }
     }
   }
 
@@ -183,7 +201,9 @@ const handleEPaymentEWalletUpdate = () => {
     },
     eWallet: {
       qrPay: false,
-      scanPay: false
+      scanPay: false,
+      terminalScanPay: false,
+      terminalQrPay: false,
     }
   } as FdoEPaymentMethod
 
@@ -205,6 +225,14 @@ const handleEPaymentEWalletUpdate = () => {
     if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.SCANPAY)) {
       ePaymentObj.eWallet.scanPay = true
     }
+
+    if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_SCAN_PAY)) {
+      ePaymentObj.eWallet.terminalScanPay = true
+    }
+
+    if (eWalletPaymentCheckboxVal.value.includes(F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_QR_PAY)) {
+      ePaymentObj.eWallet.terminalQrPay = true
+    }
   }
 
   emits('update:ePaymentTypes', ePaymentObj)
@@ -342,6 +370,18 @@ onMounted(() => {
               :value="F_ORDER_E_PAYMENT_TYPE.enum.SCANPAY"
               @update:model-value="handleEPaymentEWalletUpdate"
             />
+            <FmCheckbox
+              v-model="eWalletPaymentCheckboxVal"
+              :label="t('order.terminalScanPay')"
+              :value="F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_SCAN_PAY"
+              @update:model-value="handleEPaymentEWalletUpdate"
+            />
+            <FmCheckbox
+              v-model="eWalletPaymentCheckboxVal"
+              :label="t('order.terminalQrPay')"
+              :value="F_ORDER_E_PAYMENT_TYPE.enum.TERMINAL_QR_PAY"
+              @update:model-value="handleEPaymentEWalletUpdate"
+            />
           </div>
         </div>
       </FmCardSection>

package/src/views/order-settings/delivery/DeliverySetting.vue

@@ -89,7 +89,7 @@
       @update:model-value="handleModelValueUpdateExternal"
     />
 
-    <template #side-sheet-footer v-if="feedmeValidate !== false">
+    <template #side-sheet-footer v-if="canSave">
       <div class="flex gap-8 items-center justify-start">
         <FmButton
           variant="primary"
@@ -555,18 +555,7 @@ function hasPurchaseFeature(deliveryType: string) {
 
 const canUseAutoDeliveryIntegration = (client: string) => {
   const hasFeature = hasPurchaseFeature(client)
-  if (typeof hasFeature === 'string') {
-    return hasFeature
-  }
-  switch (client) {
-    case 'deliveroo':
-      return (
-        currentCountry.value === F_COUNTRY.enum.SG ||
-        `${t('order.autoIntegrationCountryNotSupport')}`
-      )
-    default:
-      return true
-  }
+  return hasFeature
 }
 
 const integratedCompanies = computed<IntegratedDeliveryRow[]>(() => {
@@ -818,7 +807,7 @@ async function createOrUpdateManualDeliveryDoc({
   company: DeliveryCompany
   data: FdoLinkedDelivery
 }): Promise<LinkedDeliveryDoc | undefined> {
-  const { paymentTypeKey, catalogId, rounding } = data
+  const { paymentTypeKey, catalogId, rounding, useCustomOrderNumber } = data
   let newDoc: LinkedDeliveryDoc
 
   if (doc) {
@@ -826,14 +815,16 @@ async function createOrUpdateManualDeliveryDoc({
       ...doc,
       paymentTypeKey,
       catalogId,
-      rounding
+      rounding,
+      useCustomOrderNumber
     })
   } else {
     newDoc = await remoteOrderApi.createDeliveryCompany({
       ...company,
       paymentTypeKey,
       catalogId,
-      rounding
+      rounding,
+      useCustomOrderNumber
     })
   }
 
@@ -986,6 +977,10 @@ function handleModelValueUpdateExternal(v: any) {
 }
 
 const feedmeValidate = ref<boolean | null>(null)
+const canSave = computed(() => {
+  return !feedMeComponentProps.value?.key || feedmeValidate.value !== false
+})
+
 function handleValidationResult(v: boolean) {
   feedmeValidate.value = v
 }

package/src/views/order-settings/delivery/components/ManualIntegratedDeliverySetting.vue

@@ -4,7 +4,7 @@ import type { DeliveryCompany } from '../delivery'
 import { F_PAYMENT_NAME, type FdoLinkedDelivery } from '@feedmepos/core/entity'
 import { useI18n } from '@feedmepos/mf-common'
 
-const { t } = useI18n() 
+const { t } = useI18n()
 
 interface LocalDeliverySettingData extends FdoLinkedDelivery {
   active: boolean
@@ -107,6 +107,13 @@ function updateRounding(rounding: boolean) {
   }))
 }
 
+function updateCustomOrderNumber(useCustomOrderNumber: boolean) {
+  emitChange((oldV) => ({
+    ...oldV,
+    useCustomOrderNumber
+  }))
+}
+
 function updateCatalog(catalogId: string | null) {
   emitChange((oldV) => ({
     ...oldV,
@@ -120,9 +127,9 @@ function updateCatalog(catalogId: string | null) {
     <FmSwitch
       :model-value="data.active"
       value="first"
-      :label="t('order.activateIntegration', {integrationType: t('order.manual')})"
+      :label="t('order.activateIntegration', { integrationType: t('order.manual') })"
       label-placement="right"
-      :sublabel="t('order.integrationDescription', {name: data.name})"
+      :sublabel="t('order.integrationDescription', { name: data.name })"
       @update:model-value="updateActive"
     />
   </div>
@@ -147,12 +154,22 @@ function updateCatalog(catalogId: string | null) {
       </div>
 
       <div class="flex-grow fm-typo-en-title-sm-600 mb-3 mt-7">{{ t('order.orderSetting') }}</div>
-      <FmCheckbox
-        :model-value="data.rounding as boolean"
-        value=""
-        :label="t('order.billRounding')"
-        @update:model-value="updateRounding"
-      />
+      <div>
+        <FmCheckbox
+          :model-value="data.rounding as boolean"
+          value=""
+          :label="t('order.billRounding')"
+          @update:model-value="updateRounding"
+        />
+      </div>
+      <div>
+        <FmCheckbox
+          :model-value="data.useCustomOrderNumber ?? false"
+          value=""
+          :label="t('order.customOrderNumber')"
+          @update:model-value="updateCustomOrderNumber"
+        />
+      </div>
     </FmCard>
   </div>
 </template>