48
48
title : { type : String , required : true } ,
49
49
saveButtonLabel : { type : String , required : false , default : CV . i18n ( "common.save" ) } ,
50
50
saveButtonVisibility : { type : Boolean , required : false , default : true } ,
51
+ saveButtonDisabled : { type : Boolean , required : false , default : false } ,
51
52
cancelButtonLabel : { type : String , required : false , default : CV . i18n ( "common.cancel" ) } ,
52
53
cancelButtonVisibility : { type : Boolean , required : false , default : true } ,
54
+ cancelButtonDisabled : { type : Boolean , required : false , default : false } ,
53
55
dialogType : { type : String , required : false , default : "success" } ,
54
56
testId : { type : String , default : 'cly-vue-confirm-dialog-test-id' , required : false } ,
55
57
alignCenter : { type : Boolean , default : true }
76
78
} ,
77
79
customClass : function ( ) {
78
80
return this . alignCenter ? "el-dialog--centered" : "" ;
79
- }
81
+ } ,
80
82
} ,
81
83
methods : {
84
+ buttonStyle : function ( disabled ) {
85
+ return disabled ? { opacity : 0.5 } : { } ;
86
+ } ,
82
87
confirmClicked : function ( ) {
83
88
this . $emit ( "confirm" ) ;
84
89
} ,
91
96
<template v-for="(_, name) in forwardedSlots" v-slot:[name]="slotData">\
92
97
<slot :name="name"/>\
93
98
</template>\
94
- <template v-slot:footer><div class="cly-vue-formdialog__buttons is-single-step bu-is-justify-content-flex-end bu-is-flex">\
95
- <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-cancel-button\'" @click="cancelClicked" type="secondary" v-if="cancelButtonVisibility">{{cancelLabel}}</el-button>\
96
- <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-save-button\'" @click="confirmClicked" type="success" v-if="confirmStyle==\'success\' && saveButtonVisibility" >{{saveLabel}}</el-button>\
97
- <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-warning-button\'" @click="confirmClicked" type="warning" v-else-if="confirmStyle==\'warning\' && saveButtonVisibility" >{{saveLabel}}</el-button>\
98
- <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-danger-button\'" @click="confirmClicked" type="danger" v-else-if="saveButtonVisibility" >{{saveLabel}}</el-button>\
99
- </div></template>\
99
+ <template v-slot:footer>\
100
+ <slot name="footer">\
101
+ <div class="cly-vue-formdialog__buttons is-single-step bu-is-justify-content-flex-end bu-is-flex">\
102
+ <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-cancel-button\'" @click="cancelClicked" type="secondary" :disabled="cancelButtonDisabled" :style="buttonStyle(cancelButtonDisabled)" v-if="cancelButtonVisibility">{{cancelLabel}}</el-button>\
103
+ <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-save-button\'" @click="confirmClicked" type="success" :disabled="saveButtonDisabled" :style="buttonStyle(saveButtonDisabled)" v-if="confirmStyle==\'success\' && saveButtonVisibility" >{{saveLabel}}</el-button>\
104
+ <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-warning-button\'" @click="confirmClicked" type="warning" :disabled="saveButtonDisabled" :style="buttonStyle(saveButtonDisabled)" v-else-if="confirmStyle==\'warning\' && saveButtonVisibility" >{{saveLabel}}</el-button>\
105
+ <el-button size="small" :data-test-id="testId + \'-cly-confirm-dialog-danger-button\'" @click="confirmClicked" type="danger" :disabled="saveButtonDisabled" :style="buttonStyle(saveButtonDisabled)" v-else-if="saveButtonVisibility" >{{saveLabel}}</el-button>\
106
+ </div>\
107
+ </slot>\
108
+ </template>\
100
109
</el-dialog>'
101
110
} ) ) ;
102
111
261
270
countlyVue . mixins . hasFormDialogs = hasFormDialogsMixin ;
262
271
263
272
264
- } ( window . countlyVue = window . countlyVue || { } ) ) ;
273
+ } ( window . countlyVue = window . countlyVue || { } ) ) ;
0 commit comments