公用的弹框
2019-05-20 本文已影响0人
蜗牛和曼巴
<template>
<div class="dialog">
<!-- 弹框 -->
<!-- :title="textMap"弹框 -->
<el-dialog
v-el-drag-dialog
:visible.sync="dialogFormVisible"
:before-close="handleCloseBindWarnStandard"
:title="title"
>
<div slot="footer" class="dialog-footer">
<el-button @click="handleCancel" type="danger">取消</el-button>
<el-button type="primary" @click="handleConfirm">确定</el-button>
</div>
</el-dialog>
<!-- 删除的弹框 -->
<el-dialog
v-el-drag-dialog
:visible.sync="dialogDelete"
:before-close="handleCloseBindWarnStandardDelete"
:title="DeleteTitle"
>
<h2>您确定删除吗?</h2>
<div slot="footer" class="dialog-footer">
<el-button @click="handleCancelDelete" type="danger">取消</el-button>
<el-button type="primary" @click="handleConfirmDelete">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import elDragDialog from "@/directive/el-drag-dialog";
export default {
directives: { elDragDialog },
props: {
dialogFormVisible: {
type: Boolean,
default: false
},
// 删除的弹框
dialogDelete: {
type: Boolean,
default: false
},
title: {
type: String,
default: ""
},
// 删除的弹框标题
DeleteTitle: {
type: String,
default: ""
}
},
data() {
return {
// dialogStatus: ""
};
},
watch: {},
methods: {
// 点击弹框下的取消
handleCancel() {
this.$emit("getCancel");
},
// 点击弹框下的确定
handleConfirm() {
this.$emit("getConfirm");
},
//关闭弹窗,不可以删这个方法。不用这个方法点击遮罩层关闭会报错
handleCloseBindWarnStandard() {
this.$emit("closeBindWarnStandard");
},
// 删除按钮弹窗点击弹框下的取消
handleCancelDelete() {
this.$emit("getCancelDelete");
},
// 删除按钮弹窗点击弹框下的确定
handleConfirmDelete() {
this.$emit("getConfirmDelete");
},
//删除按钮关闭弹窗,不可以删这个方法。不用这个方法点击遮罩层关闭会报错
handleCloseBindWarnStandardDelete() {
this.$emit("closeBindWarnStandardDelete");
}
}
};
</script>