80 lines
1.7 KiB
Vue
80 lines
1.7 KiB
Vue
<template>
|
|
<div>
|
|
<a-modal
|
|
v-model:visible="localValue"
|
|
:title="props.title"
|
|
centered
|
|
:z-index="props.zIndex"
|
|
:get-container="getModalContainer"
|
|
@ok="emits('ok')"
|
|
@cancel="emits('close')"
|
|
@close="emits('close')"
|
|
:maskClosable="false"
|
|
:width="props.width"
|
|
:ok-text="props.okText"
|
|
:cancel-text="props.cancelText"
|
|
:wrapClassName="props.wrapClassName"
|
|
:closable="props.closable"
|
|
:destroy-on-close="props.destroyOnClose"
|
|
>
|
|
<template v-if="props.customFooter" #footer> <slot name="footer" /></template>
|
|
<a-spin :spinning="props.loading">
|
|
<div class="overflow-y-auto py-2 px-1 relative max-h-[83vh]" id="body">
|
|
<slot />
|
|
</div>
|
|
</a-spin>
|
|
</a-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
//define emit
|
|
import { computed } from 'vue'
|
|
import { APP_Z_MODAL, getModalContainer } from '@/utils/zIndex'
|
|
|
|
const emits = defineEmits(['ok', 'close', 'update:visible'])
|
|
|
|
//define props
|
|
interface Prop {
|
|
visible: boolean
|
|
title?: string
|
|
okText?: string
|
|
width?: string
|
|
cancelText?: string
|
|
customFooter?: boolean
|
|
loading?: boolean
|
|
wrapClassName?: string
|
|
closable?: boolean
|
|
destroyOnClose?:boolean
|
|
zIndex?: number
|
|
}
|
|
|
|
const props = withDefaults(defineProps<Prop>(), {
|
|
visible: false,
|
|
cancelText: 'انصراف',
|
|
okText: 'ثبت',
|
|
customFooter: false,
|
|
loading: false,
|
|
wrapClassName: '',
|
|
closable: true,
|
|
zIndex: APP_Z_MODAL,
|
|
})
|
|
|
|
const localValue = computed({
|
|
get() {
|
|
return props.visible
|
|
},
|
|
|
|
set(value) {
|
|
emits('update:visible', value)
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style>
|
|
.ant-modal-content {
|
|
border-radius: 0.6rem;
|
|
padding-top: 0.5rem;
|
|
}
|
|
</style>
|