Files
dvcp_v2_webapp/ui/packages/layout/AiDialogBtn.vue
2023-02-03 15:19:34 +08:00

52 lines
1.1 KiB
Vue

<template>
<section class="AiDialogBtn">
<div @click="dialog=true">
<slot v-if="$scopedSlots.btn" name="btn"/>
<el-button v-else type="text">{{ text }}</el-button>
</div>
<ai-dialog :visible.sync="dialog" :title="dialogTitle" :width="width" :customFooter="needFooter" v-on="$listeners"
@onConfirm="handleConfirm" v-bind="$attrs">
<slot/>
<template #footer>
<el-button @click="dialog=false">关闭</el-button>
</template>
</ai-dialog>
</section>
</template>
<script>
export default {
name: "AiDialogBtn",
props: {
text: {default: "点击弹窗"},
dialogTitle: {default: "展示信息"},
customFooter: {default: true},
width: {default: "1200px"},
submit: {default: null}
},
computed: {
needFooter: v => v.customFooter && !v.submit
},
data() {
return {
dialog: false
}
},
methods: {
handleConfirm() {
if (!this.submit) {
this.dialog = false
this.$emit('onConfirm')
} else {
this.submit?.()?.then(() => this.dialog = false)
}
}
}
}
</script>
<style lang="scss" scoped>
.AiDialogBtn {
}
</style>