You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
2.5 KiB
119 lines
2.5 KiB
<!-- -->
|
|
<template>
|
|
<div class="">
|
|
<el-dialog
|
|
:visible.sync="dialogShow"
|
|
width="30%"
|
|
:show-close="false"
|
|
:close-on-click-modal="false"
|
|
:close-on-press-escape="false"
|
|
>
|
|
<div slot="title" style="display: flex">
|
|
<img
|
|
style="width: 24px; height: 24px; margin-right: 10px"
|
|
src="~assets/images/Tips.png"
|
|
alt=""
|
|
/>
|
|
<div class="tipsTexe">
|
|
{{ tipsText }}
|
|
</div>
|
|
</div>
|
|
<div style="margin: 0px auto; width: 330px; height: 100%">
|
|
{{ contentText }}
|
|
</div>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button v-if="cancleBtnShow" size="small" type="info" @click="clickCancel">{{
|
|
cancelText
|
|
}}</el-button>
|
|
<el-button v-if="confirmBtnShow" size="small" type="primary" @click="clickConfirm">{{
|
|
confirmText
|
|
}}</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
//import引入的组件需要注入到对象中才能使用
|
|
components: {},
|
|
props: {
|
|
tipsText: {
|
|
type: String,
|
|
default: () => "提示",
|
|
},
|
|
contentText: {
|
|
type: String,
|
|
default: () => "",
|
|
},
|
|
cancelText: {
|
|
type: String,
|
|
default: () => "取消",
|
|
},
|
|
confirmText: {
|
|
type: String,
|
|
default: () => "确认",
|
|
},
|
|
cancleBtnShow:{
|
|
type: Boolean,
|
|
default: () => true,
|
|
},
|
|
confirmBtnShow:{
|
|
type: Boolean,
|
|
default: () => true,
|
|
},
|
|
|
|
},
|
|
data() {
|
|
//这里存放数据
|
|
return {
|
|
dialogShow: false,
|
|
};
|
|
},
|
|
//监听属性 类似于data概念
|
|
computed: {},
|
|
//监控data中的数据变化
|
|
watch: {},
|
|
//生命周期 - 创建完成（可以访问当前this实例）
|
|
created() {},
|
|
//方法集合
|
|
methods: {
|
|
// 确认
|
|
clickConfirm() {
|
|
this.dialogShow = false;
|
|
this.$emit("clickConfirm");
|
|
},
|
|
// 取消
|
|
clickCancel() {
|
|
this.dialogShow = false;
|
|
this.$emit("clickCancel");
|
|
},
|
|
},
|
|
//生命周期 - 挂载完成（可以访问DOM元素）
|
|
mounted() {},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
::v-deep {
|
|
.el-dialog{
|
|
|
|
border-radius: 4px;
|
|
}.el-button--info{
|
|
|
|
background: #F6F6F6;
|
|
border-color: #F6F6F6;
|
|
color: #999;
|
|
}
|
|
.el-dialog__footer {
|
|
padding: 10px 30px 20px 20px;
|
|
}
|
|
}
|
|
.tipsTexe{
|
|
|
|
height: 24px;
|
|
line-height: 24px;
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
|
|
}
|
|
</style>
|
|
|