创建Modal弹窗带默认按钮组件模板
vue
<template>
<div class="create-modal-pop">
<!-- 请更改根节点 class 名称 -->
<!-- ... -->
</div>
</template>
<script setup lang="tsx">
import type { CreateModalProps } from './interface';
import type { PageExpose } from '@erp/biz';
/**
* 入参
*/
const props = withDefaults(defineProps<CreateModalProps>(), {
// 默认值 TODO
// ...
});
/**
* 主动触发事件
*/
const emit = defineEmits(['ok', 'close', 'loading']);
// 其他.... TODO
/**
* 给Modal调用的
*/
defineExpose<PageExpose>({
/**
* 返回给调用方, 返回 false 表示不关闭弹窗,true | Record<string, any> 表示关闭弹窗,并返回值
*/
async getModel() {
// 确定逻辑 TODO
return true;
},
});
</script>
<style lang="scss" scoped>
.create-modal-pop {
// 请更改根节点 class 名称 TODO
// ...
}
</style>ts
/**
* @zh 弹窗入参声明
*/
export interface CreateModalProps {
// 请更改 props 名称,以 Props 结尾
// ....
}ts
import { pop } from '@erp/biz';
import type { CreateModalProps } from './interface';
/**
* @zh 创建弹窗 命名都为create{Xxxx}Pop TODO
* @returns
*/
export function createCreateModalPop(props: CreateModalProps) {
return pop.createModal(import('./create-modal.vue'), props, {
// 弹窗的配置 TODO
// title
// width
});
}