<template>
|
<el-drawer v-model="visible" v-bind="$attrs" :width="props.width" :draggable="true">
|
<slot/>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="onReset()" icon="RefreshRight">重置</el-button>
|
<el-button @click="onClose()" icon="Close" type="danger">取消</el-button>
|
<el-button type="primary" @click="onSubmit()" icon="DocumentAdd">
|
提交
|
</el-button>
|
</div>
|
</template>
|
</el-drawer>
|
</template>
|
|
<script setup>
|
|
import {context} from '@/hooks';
|
|
const {useForceUpdate} = context;
|
|
const props = defineProps({
|
width: {
|
type: Number,
|
default: 750
|
},
|
subSubmit: {
|
type: Function,
|
default: () => {
|
}
|
},
|
subReset: {
|
type: Function,
|
default: () => {
|
}
|
},
|
subClose: {
|
type: Function,
|
default: () => {
|
}
|
},
|
});
|
|
const [$props, forceUpdate] = useForceUpdate(props);
|
|
const $forceUpdate = forceUpdate;
|
|
const visible = ref(false);
|
|
const onClose = async () => {
|
props.subClose();
|
visible.value = false;
|
}
|
|
const subReset = async () => {
|
await props.onReset();
|
}
|
|
const subSubmit = async () => {
|
await props.onSubmit();
|
visible.value = false;
|
}
|
|
const onOpen = async () => {
|
visible.value = true;
|
};
|
|
/**
|
* 暴露给父组件的参数和方法 (外部需要什么,都可以从这里暴露出去)
|
*/
|
defineExpose({
|
onOpen,
|
$forceUpdate
|
});
|
|
</script>
|
|
<style lang='scss' scoped>
|
</style>
|