add customer-actions in mobile &...

src/components/BasicActionSheet.vue

@@ -50,6 +50,7 @@
     :closable="false"
     :destroy-on-close="true"
     :height="drawerHeight"
+    :z-index="ACTION_SHEET_Z_INDEX"
     class="basic-action-sheet"
   >
     <div class="basic-action-sheet__container">
@@ -95,6 +96,7 @@ import { computed } from 'vue'
 
 import BasicModal from '@/components/BasicModal.vue'
 import { ACTION_SHEET_HEIGHT } from '@/constants/actionSheet'
+import { ACTION_SHEET_Z_INDEX } from '@/constants/overlayZIndex'
 import { isMobile } from '@core/utils/is'
 
 interface Props {

src/components/BasicModal.vue

@@ -3,6 +3,7 @@
     <a-modal
       v-model:visible="localValue"
       :title="props.title"
+      :z-index="props.zIndex"
       centered
       @ok="emits('ok')"
       @cancel="emits('close')"
@@ -26,6 +27,8 @@
 </template>
 
 <script setup lang="ts">
+import { MODAL_ABOVE_ACTION_SHEET_Z_INDEX } from '@/constants/overlayZIndex'
+
 //define emit
 const emits = defineEmits(['ok', 'close', 'update:visible'])
 
@@ -40,6 +43,7 @@ interface Prop {
   confirmLoading?: boolean
   loading?: boolean
   wrapClassName?: string
+  zIndex?: number
 }
 
 const props = withDefaults(defineProps<Prop>(), {
@@ -49,7 +53,8 @@ const props = withDefaults(defineProps<Prop>(), {
   customFooter: false,
   confirmLoading: false,
   loading: false,
-  wrapClassName: ''
+  wrapClassName: '',
+  zIndex: MODAL_ABOVE_ACTION_SHEET_Z_INDEX
 })
 
 const localValue = computed({

src/components/mobile/MobileSheetHeader.vue

@@ -4,6 +4,9 @@
       <div v-if="showTitle" class="text-lg font-700 text-gray-900">
         <slot name="title">{{ title }}</slot>
       </div>
+      <div v-if="$slots.actions" class="flex flex-wrap items-center justify-end gap-2 pt-1">
+        <slot name="actions" />
+      </div>
       <div v-if="subtitle || $slots.subtitle" class="text-xs text-gray-500">
         <slot name="subtitle">{{ subtitle }}</slot>
       </div>