@feedmepos/mf-order-setting 0.0.23 → 0.0.25

package/src/stores/restaurant/index.ts

@@ -12,13 +12,14 @@ import {
   FdoShopeeFoodSettings,
   type FdoAddress,
   type FdoProfile,
-  type FdoRestaurant
+  FdoRestaurant,
 } from '@feedmepos/core/entity'
 import { FdoExternalSetting, FdoGrabfoodSettings } from '@entity'
 import { FeatureFlag, Pos } from '@feedmepos/core'
 import { SvcConfig } from '@/api'
 import { remoteOrderApi } from '@/api/remoteOrder'
-import { useI18n } from '@feedmepos/mf-common'
+import { useI18n, useCoreStore} from '@feedmepos/mf-common'
+import { computed, ref, watch} from 'vue'
 
 
 export interface Profile extends FdoProfile {
@@ -42,10 +43,6 @@ export interface ExtendedRestaurant extends FdoRestaurant {
 }
 
 interface RestaurantState {
-  adminRestaurants: FdoRestaurant[]
-  managableRestaurants: ExtendedRestaurant[]
-  businessRestaurants: ExtendedRestaurant[]
-  currentRestaurantId: string
   restaurantSettings: { [restaurantId: string]: RestaurantSettingDoc }
 }
 
@@ -53,90 +50,114 @@ export declare function setRestaurantId(id?: string | null): void
 
 function initRestaurantState(): RestaurantState {
   return {
-    adminRestaurants: [],
-    managableRestaurants: [],
-    businessRestaurants: [],
-    currentRestaurantId: '',
     restaurantSettings: {}
   }
 }
 
-export const useRestaurantStore = defineStore('restaurant', {
-  state: () => {
-    return initRestaurantState()
-  },
-  getters: {
-    currentRestaurant: (state) =>
-      state.businessRestaurants.find((r) => r.id === state.currentRestaurantId),
-    currentRestaurantSetting: (state) => state.restaurantSettings[state.currentRestaurantId || '']
-  },
-  actions: {
-    async readRestaurantSetting(restaurantId: string) {
-      const restaurantSetting = await restaurantApi.readRestaurantSetting(restaurantId)
-      this.restaurantSettings = {
-        ...this.restaurantSettings,
-        [restaurantId]: restaurantSetting
-      }
-      return restaurantSetting
-    },
-    async selectRestaurant(restaurantId: string) {
-      await this.readRestaurantSetting(restaurantId)
-      this.currentRestaurantId = restaurantId
-      SvcConfig.setRestaurantId(restaurantId)
-      setRestaurantId(restaurantId)
-      FeatureFlag.setRestaurant(restaurantId || undefined)
-      localStorage.set('feedme_restaurant', restaurantId)
-    },
-    async updateServiceCharge(serviceCharge: FdoServiceChargeSetting) {
-      await restaurantApi.updateServiceCharge(serviceCharge)
-    },
-    async updateDineInSetting(setting: FdoRestaurantDineIn) {
-      await restaurantApi.updateDineInSetting(setting)
-    },
-    async updatePickupSetting(setting: FdoRestaurantPickup) {
-      await restaurantApi.updatePickupSetting(setting)
-    },
-
-    async updateInhouseDelivery(restaurantId: string, dto: FdoRestaurantInHouseDelivery) {
-      await remoteOrderApi.integratedDelivery.updateInhouse(restaurantId, dto)
-    },
-    async updateFeedmeDelivery(restaurantId: string, dto: FdoRestaurantFeedmeDelivery) {
-      return await remoteOrderApi.integratedDelivery.updateFeedme(restaurantId, dto)
-    },
-    async updateIntegratedFoodpandaDelivery(restaurantId: string, dto: FdoFoodpandaSettings) {
-      await remoteOrderApi.integratedDelivery.updateFoodpanda(restaurantId, dto)
-    },
-    async updateIntegratedGrabfoodDelivery(restaurantId: string, dto: FdoGrabfoodSettings) {
-      await remoteOrderApi.integratedDelivery.updateGrabfood(restaurantId, dto)
-    },
-    async updateIntegratedShopeefoodDelivery(restaurantId: string, dto: FdoShopeeFoodSettings) {
-      await remoteOrderApi.integratedDelivery.updateShopeefood(restaurantId, dto)
-    },
-    async updateExternalDelivery(restaurantId: string, dto: FdoExternalSetting) {
-      await remoteOrderApi.integratedDelivery.updateExternal(restaurantId, dto)
-    },
-    getRestaurantEPayment(dto?: FdoRestaurant | undefined): true | string {
-      const { t } = useI18n()
-      if (!dto) {
-        return 'getRestaurantEPayment - Invalid restaurant ';
-      }
-      const { payoutAccount, posVersion } = dto;
-      const validPosVersion =
-        !!posVersion &&
-        Pos.canUse({
-          feature: F_FEATURE.enum.qrEPayment,
-          posVersion
-        })
-
-      if (!validPosVersion)
-        return t('order.payoutPosVersion', { version: Pos.minVersionToUse(F_FEATURE.enum.qrEPayment) })
-      if (!payoutAccount || !payoutAccount.enable) {
-        return t('order.payoutAccountIsRequired')
-      }
-      if (payoutAccount.status !== F_PAYOUT_ACCOUNT_STATUS.enum.APPROVED) {
-        return t('order.payoutAccountIsRequired')
+export const useRestaurantStore = defineStore('restaurant', () =>  {
+  const CoreStore = useCoreStore()
+
+  const state = ref(initRestaurantState())
+  const currentRestaurant = ref<FdoRestaurant | undefined>(undefined)
+
+  watch(
+    () => CoreStore.currentRestaurant.value,
+    async () => {
+      if(CoreStore.currentRestaurant.value){
+        currentRestaurant.value = FdoRestaurant.parse(CoreStore.currentRestaurant.value)
       }
-      return true
     }
+  )
+ 
+  const currentRestaurantSetting = computed<RestaurantSettingDoc| undefined>(() => state.value.restaurantSettings[currentRestaurant.value?._id || ''])
+
+  async function readRestaurantSetting(restaurantId: string) {
+    const restaurantSetting = await restaurantApi.readRestaurantSetting(restaurantId)
+    state.value.restaurantSettings = {
+      ...state.value.restaurantSettings,
+      [restaurantId]: restaurantSetting
+    }
+    return restaurantSetting
+  }
+
+  async function selectRestaurant(restaurantId: string) {
+    await readRestaurantSetting(restaurantId)
+    SvcConfig.setRestaurantId(restaurantId)
+    setRestaurantId(restaurantId)
+    FeatureFlag.setRestaurant(restaurantId || undefined)
+    localStorage.set('feedme_restaurant', restaurantId)
+  }
+
+  async function updateServiceCharge(serviceCharge: FdoServiceChargeSetting) {
+    await restaurantApi.updateServiceCharge(serviceCharge)
+  }
+  async function updateDineInSetting(setting: FdoRestaurantDineIn) {
+    await restaurantApi.updateDineInSetting(setting)
+  }
+  async function updatePickupSetting(setting: FdoRestaurantPickup) {
+    await restaurantApi.updatePickupSetting(setting)
+  }
+
+  async function updateInhouseDelivery(restaurantId: string, dto: FdoRestaurantInHouseDelivery) {
+    await remoteOrderApi.integratedDelivery.updateInhouse(restaurantId, dto)
+  }
+  async function updateFeedmeDelivery(restaurantId: string, dto: FdoRestaurantFeedmeDelivery) {
+    return await remoteOrderApi.integratedDelivery.updateFeedme(restaurantId, dto)
+  }
+  async function updateIntegratedFoodpandaDelivery(restaurantId: string, dto: FdoFoodpandaSettings) {
+    await remoteOrderApi.integratedDelivery.updateFoodpanda(restaurantId, dto)
+  }
+  async function updateIntegratedGrabfoodDelivery(restaurantId: string, dto: FdoGrabfoodSettings) {
+    await remoteOrderApi.integratedDelivery.updateGrabfood(restaurantId, dto)
+  }
+  async function updateIntegratedShopeefoodDelivery(restaurantId: string, dto: FdoShopeeFoodSettings) {
+    await remoteOrderApi.integratedDelivery.updateShopeefood(restaurantId, dto)
+  }
+  async function updateExternalDelivery(restaurantId: string, dto: FdoExternalSetting) {
+    await remoteOrderApi.integratedDelivery.updateExternal(restaurantId, dto)
+  }
+  
+  function getRestaurantEPayment(): true | string {
+    const { t } = useI18n()
+    if (!currentRestaurant.value) {
+      return 'getRestaurantEPayment - Invalid restaurant ';
+    }
+    const payoutAccount = currentRestaurant.value.payoutAccount;
+    const posVersion = currentRestaurant.value.posVersion;
+
+    const validPosVersion =
+      !!posVersion &&
+      Pos.canUse({
+        feature: F_FEATURE.enum.qrEPayment,
+        posVersion
+      })
+
+    if (!validPosVersion)
+      return t('order.payoutPosVersion', { version: Pos.minVersionToUse(F_FEATURE.enum.qrEPayment) })
+    if (!payoutAccount || !payoutAccount.enable) {
+      return t('order.payoutAccountIsRequired')
+    }
+    if (payoutAccount.status !== F_PAYOUT_ACCOUNT_STATUS.enum.APPROVED) {
+      return t('order.payoutAccountIsRequired')
+    }
+    return true
+  }
+
+  return {
+    state: state.value,
+    currentRestaurant: currentRestaurant.value,
+    currentRestaurantSetting : currentRestaurantSetting.value,
+    readRestaurantSetting,
+    selectRestaurant,
+    updateServiceCharge,
+    updateDineInSetting,
+    updatePickupSetting,
+    updateInhouseDelivery,
+    updateFeedmeDelivery,
+    updateIntegratedFoodpandaDelivery,
+    updateIntegratedGrabfoodDelivery,
+    updateIntegratedShopeefoodDelivery,
+    updateExternalDelivery,
+    getRestaurantEPayment
   }
 })

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

@@ -0,0 +1,33 @@
+<template>
+  <div>
+    <FmSwitch
+      :model-value="v"
+      :label="t('order.displayPaxDialogDescription')"
+      label-placement="right"
+      @update:model-value="updateEnablePaxDialog"
+      class="mb-5"
+    />
+  </div>
+</template>
+<script setup lang="ts">
+import type { KioskDineInSettingForm } from '@/modules/order-setting/kiosk/interface'
+import { useI18n } from '@feedmepos/mf-common'
+import { computed } from 'vue'
+
+const { t } = useI18n()
+
+interface Props {
+  v: boolean
+}
+
+interface Emits {
+  (e: 'updateEnablePaxDialog', v: boolean): void
+}
+
+const props = defineProps<Props>()
+const emits = defineEmits<Emits>()
+
+function updateEnablePaxDialog(v: boolean) {
+  emits('updateEnablePaxDialog', v)
+}
+</script>

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

@@ -24,6 +24,14 @@
         @update:model-value="updateMenuItemSetting"
       />
     </div>
+    <div class="flex flex-col gap-2">
+      <span class="fm-typo-en-title-sm-600">{{ t('order.displayPaxDialogTitle') }}</span>
+      <KioskEnablePaxDialogSection
+        :key="'enable-pax-dialog-' + restaurantId"
+        :v="enablePaxDialog"
+        @update-enable-pax-dialog="updateEnablePaxDialogSetting"
+      />
+    </div>
     <div class="flex flex-col gap-2">
       <span class="fm-typo-en-title-sm-600">{{ t('order.acceptedPayment') }}</span>
       <span class="fm-typo-en-title-sm-400 font-bold">{{ t('order.configuration') }}</span>
@@ -70,6 +78,7 @@ import type {
 import { useLoading } from '@/composables/loading'
 import { useSnackbar } from '@feedmepos/ui-library'
 import { useI18n } from '@feedmepos/mf-common'
+import KioskEnablePaxDialogSection from './KioskEnablePaxDialogSection.vue'
 
 const { t } = useI18n()
 
@@ -107,6 +116,7 @@ const validKioskOrderSetting = computed<MfKioskOrderSetting | null>(() => {
             max: f.dineIn.displayStand.standSlotRange.max ?? 10
           },
           prefix: f.dineIn.displayStand.prefix ?? '',
+          enablePaxDialog: f.dineIn.displayStand.enablePaxDialog,
           submitOrderInstruction: {
             payAtCounter: f.dineIn.displayStand.submitOrderInstruction.payAtCounter ?? null,
             paid: f.dineIn.displayStand.submitOrderInstruction.paid ?? null
@@ -139,6 +149,7 @@ const validKioskOrderSetting = computed<MfKioskOrderSetting | null>(() => {
               max: displayStand.standSlotRange.max
             },
             prefix: displayStand.prefix ?? '',
+            enablePaxDialog: displayStand.enablePaxDialog,
             submitOrderInstruction: {
               payAtCounter: displayStand.submitOrderInstruction.payAtCounter ?? null,
               paid: displayStand.submitOrderInstruction.paid ?? null
@@ -163,6 +174,7 @@ const validKioskOrderSetting = computed<MfKioskOrderSetting | null>(() => {
           max: f.dineIn.displayStand.standSlotRange.max ?? 10
         },
         prefix: f.dineIn.displayStand.prefix ?? '',
+        enablePaxDialog: f.dineIn.displayStand.enablePaxDialog,
         submitOrderInstruction: {
           payAtCounter: f.dineIn.displayStand.submitOrderInstruction.payAtCounter ?? null,
           paid: f.dineIn.displayStand.submitOrderInstruction.paid ?? null
@@ -199,6 +211,20 @@ const allowEPayment = computed(() => {
     return paymentTypes.includes(F_ORDER_PAYMENT_TYPE.enum.ePayment);
 })
 
+async function updateEnablePaxDialogSetting(v: boolean) {
+  kioskOrderSettingForm.value.dineIn.displayStand.enablePaxDialog = v
+  kioskOrderSettingForm.value.dineIn.pickUp.enablePaxDialog = v
+}
+
+const enablePaxDialog = computed(() => {
+  return (
+    ((kioskOrderSettingForm.value.dineIn.displayStand.enabled &&
+      kioskOrderSettingForm.value.dineIn.displayStand.enablePaxDialog) ||
+      kioskOrderSettingForm.value.dineIn.pickUp.enablePaxDialog) ??
+    false
+  )
+})
+
 async function submitForm() {
   if (validKioskOrderSetting.value) {
     const kioskOrderSetting = validKioskOrderSetting.value

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

@@ -1,9 +1,6 @@
 <template>
   <div class="flex flex-col lg:flex-row md:flex-row sm:flex-row xs:flex-wrap justify-between">
-    <RestaurantSelector
-      :model-value="currentRestaurant?._id ?? undefined"
-      class="xs:order-2 xs:mb-3"
-    />
+    <RestaurantSelector class="xs:order-2 xs:mb-3" />
     <FmSearch
       v-model="searchKey"
       :placeholder="t('order.search')"
@@ -203,8 +200,7 @@ const { t } = useI18n()
 const { searchKey, filter } = useSearch()
 const { showSuccess } = useSnackbarFunctions()
 const restaurantStore = useRestaurantStore()
-const { currentRestaurant, currentBusiness, readRestaurants, changeRestaurant, sessionUser } =
-  useCoreStore()
+const { currentBusiness, readRestaurants, changeRestaurant, sessionUser } = useCoreStore()
 const menuStore = useMenuStore()
 const linkedCompanies = ref<LinkedDeliveryDoc[]>([])
 const deliveryCompanies = ref<DeliveryCompany[]>([])
@@ -231,6 +227,7 @@ export interface IntegratedDeliveryRow extends DeliveryRow {
 }
 
 const sideSheet = ref<boolean>(false)
+const currentRestaurant = computed(() => restaurantStore.currentRestaurant)
 const loading = computed(() => {
   return !currentRestaurant.value || loadingDpi.value
 })
@@ -380,7 +377,7 @@ async function updateInHouse({ key, setting }: IntegratedDeliveryRow) {
   }
 }
 
-async function updateExternalDelivery( {key, setting}: IntegratedDeliveryRow) {
+async function updateExternalDelivery({ key, setting }: IntegratedDeliveryRow) {
   clearComponentProps()
   const externalSetting = setting as FdoExternalSetting
 
@@ -487,7 +484,7 @@ const external = computed<FdoExternalSetting>(() => {
     ...deliveryData.initExternalDelivery(),
     ...externalSetting.value
   }
-}) 
+})
 const localDeliveryCompanies = computed<DeliveryRow[]>(() => {
   const res = filterLocalDeliveryCompanies(deliveryCompanies.value).map<DeliveryRow>((company) => {
     const { name, paymentTypeKey, key } = company
@@ -619,9 +616,9 @@ const integratedCompanies = computed<IntegratedDeliveryRow[]>(() => {
       key: AUTO_INTEGRATION_CLIENT.external,
       setting: external.value,
       catalog: '-',
-      paymentType: '-', 
-      status: [generateStatus(false, external.value.enable)],
-    },
+      paymentType: '-',
+      status: [generateStatus(false, external.value.enable)]
+    }
   ]
 })
 
@@ -828,7 +825,10 @@ async function updateInHouseSetting() {
 
 async function updateExternalDeliverySetting() {
   sideSheetIntegrated.value = false
-  await restaurantStore.updateExternalDelivery(currentRestaurant.value?._id ?? '', externalDoc.value)
+  await restaurantStore.updateExternalDelivery(
+    currentRestaurant.value?._id ?? '',
+    externalDoc.value
+  )
   const res = (await readRestaurants())?.find((res) => res._id === currentRestaurant.value?._id)
   if (!!res) {
     await changeRestaurant(res)

package/src/views/order-settings/delivery/inhouse/InHouseDelivery.vue

@@ -80,16 +80,16 @@ const inhouse = reactive<InhouseDialogData>(
   props.initialValue
     ? clone(props.initialValue)
     : {
-      enable: false,
-      catalogId: null,
-      term: '',
-      areas: [],
-      ignoreStock: false,
-      paymentTypes: [],
-      offlinePaymentTypes: [],
-      deliveryTime: null,
-      taxes: {}
-    }
+        enable: false,
+        catalogId: null,
+        term: '',
+        areas: [],
+        ignoreStock: false,
+        paymentTypes: [],
+        offlinePaymentTypes: [],
+        deliveryTime: null,
+        taxes: {}
+      }
 )
 
 const tax = computed(() => ItemTax.taxSetting())
@@ -230,12 +230,13 @@ const actualDeliveryTime = computed({
 </script>
 
 <template>
-  <FmSwitch 
-    :model-value="inhouse.enable" 
-    :label="t('order.activateDeliveryCompany', {company:'In house'})" 
+  <FmSwitch
+    :model-value="inhouse.enable"
+    :label="t('order.activateDeliveryCompany', { company: 'In house' })"
     label-placement="right"
     :sublabel="t('order.inhouseSwitchSublabel')"
-    @update:model-value="updateEnable" />
+    @update:model-value="updateEnable"
+  />
   <div v-if="inhouse.enable">
     <FmCard variant="outlined" class="p-5 mt-10">
       <div class="flex-grow fm-typo-en-title-sm-600 mb-3">{{ t('order.generalSetting') }}</div>
@@ -272,40 +273,39 @@ const actualDeliveryTime = computed({
     <FmCard variant="outlined" class="p-5 mt-10">
       <div class="flex-grow fm-typo-en-title-sm-600 mb-3">
         {{ t('order.taxSetting') }}
-        <span
-          class="text-fm-color-secondary-salmon fm-typo-en-body-sm-600"
-          v-if="!validPosVersion"
-        >
-          {{ t('order.taxSettingTerm', {validatePosVersion: minVersionForTax}) }}</span
+        <span class="text-fm-color-secondary-salmon fm-typo-en-body-sm-600" v-if="!validPosVersion">
+          {{ t('order.taxSettingTerm', { validatePosVersion: minVersionForTax }) }}</span
         >
       </div>
       <div class="mb-5">
-        <FmSwitch 
-          :model-value="hasInhouseDeliveryTax && validPosVersion" 
+        <FmSwitch
+          :model-value="hasInhouseDeliveryTax && validPosVersion"
           :disabled="!validPosVersion"
-          :label="t('order.inhouseDeliveryTaxLabel')" 
-          label-placement="right" 
+          :label="t('order.inhouseDeliveryTaxLabel')"
+          label-placement="right"
           :sublabel="t('order.inhouseDeliveryTaxSublabel')"
-          @update:model-value="toggleTax" />
+          @update:model-value="toggleTax"
+        />
       </div>
       <div v-if="hasInhouseDeliveryTax && validPosVersion">
         <div class="mb-5">
-          <TaxInput 
-            :disable="!validPosVersion" 
-            :model-value="taxSettings" 
+          <TaxInput
+            :disable="!validPosVersion"
+            :model-value="taxSettings"
             :tax-options="taxOptions"
             :title="`${tax.systemCode} ${t('order.inhouseDeliveryInputLabel')}`"
-            @update:model-value="(ev) => updateTax(ev)" 
+            @update:model-value="(ev) => updateTax(ev)"
           />
         </div>
         <div class="mb-5">
-          <FmRadioGroup 
-            :disabled="!validPosVersion" 
-            :model-value="taxInclusive" 
-            label-mark="required" 
+          <FmRadioGroup
+            :disabled="!validPosVersion"
+            :model-value="taxInclusive"
+            label-mark="required"
             inline
             :label="t('order.inhouseDeliveryTaxCalculation')"
-            @update:model-value="(ev) => updateTaxInclusive(ev as unknown as number)">
+            @update:model-value="(ev) => updateTaxInclusive(ev as unknown as number)"
+          >
             <div v-for="option in taxInclusiveOptions" :key="option.value">
               <FmRadio :value="option.value" :label="option.label" />
             </div>
@@ -315,8 +315,12 @@ const actualDeliveryTime = computed({
     </FmCard>
 
     <FmCard variant="outlined" class="p-5 mt-10">
-      <PaymentSidesheet :paymentTypes="inhouse.paymentTypes" :offlinePaymentTypes="inhouse.offlinePaymentTypes"
-        :allow-e-payment="restaurantStore.getRestaurantEPayment(currentRestaurant)" @update:payments="updatePayment" />
+      <PaymentSidesheet
+        :paymentTypes="inhouse.paymentTypes"
+        :offlinePaymentTypes="inhouse.offlinePaymentTypes"
+        :allow-e-payment="restaurantStore.getRestaurantEPayment()"
+        @update:payments="updatePayment"
+      />
     </FmCard>
 
     <FmCard variant="outlined" class="p-5 mt-10">