109 lines
2.0 KiB
Vue
109 lines
2.0 KiB
Vue
<template>
|
|
<el-dialog
|
|
:destroy-on-close="true"
|
|
class="base-dialog"
|
|
:title="title"
|
|
:visible.sync="dialogVisible"
|
|
:width="width"
|
|
:fullscreen="false"
|
|
append-to-body
|
|
top="5vh"
|
|
:close-on-click-modal="false"
|
|
@open="$emit('open')"
|
|
@close="$emit('close')"
|
|
>
|
|
<slot></slot>
|
|
<span slot="footer" class="dialog-footer" v-if="footerShow">
|
|
<el-button @click="closeHandle">取 消</el-button>
|
|
<el-button v-if="resetting">重 置</el-button>
|
|
<el-button
|
|
type="primary"
|
|
v-if="!lookFlag"
|
|
:loading="loading"
|
|
@click="handleConfirmClick"
|
|
>提 交</el-button
|
|
>
|
|
</span>
|
|
</el-dialog>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
props: {
|
|
fullscreen: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
value: Boolean,
|
|
title: String,
|
|
lookFlag: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
loading: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
resetting: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
footerShow: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
width: {
|
|
type: String,
|
|
default: "90%",
|
|
},
|
|
},
|
|
data() {
|
|
return {};
|
|
},
|
|
computed: {
|
|
dialogVisible: {
|
|
get() {
|
|
return this.value;
|
|
},
|
|
set(val) {
|
|
this.$emit("input", val);
|
|
},
|
|
},
|
|
},
|
|
methods: {
|
|
closeHandle() {
|
|
this.dialogVisible = false;
|
|
this.$emit("close");
|
|
return
|
|
this.$confirm("是否关闭表单?", "提示", {
|
|
confirmButtonText: "关闭",
|
|
cancelButtonText: "取消",
|
|
type: "warning",
|
|
})
|
|
.then(() => {
|
|
this.dialogVisible = false;
|
|
this.$emit("close");
|
|
})
|
|
.catch(() => {
|
|
});
|
|
},
|
|
handleConfirmClick() {
|
|
this.$emit("confirm");
|
|
},
|
|
},
|
|
beforeDestroy() {
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
.base-dialog >>> .el-dialog__body {
|
|
max-height: 70vh;
|
|
overflow: auto;
|
|
}
|
|
::v-deep .el-dialog{
|
|
transition: all .8s;
|
|
}
|
|
</style>
|
|
<style>
|
|
|
|
</style>
|