wrap message box buttons

This commit is contained in:
Mutasem 2021-07-29 13:42:05 +02:00
parent 05ae9aa1b8
commit f645e0248b
2 changed files with 47 additions and 6 deletions

View file

@ -98,9 +98,6 @@ export const genericHelpers = mixins(showMessage).extend({
cancelButtonText, cancelButtonText,
type, type,
dangerouslyUseHTMLString: true, dangerouslyUseHTMLString: true,
roundButton: true,
confirmButtonClass: 'force-medium',
cancelButtonClass: 'force-medium force-outline',
}); });
return true; return true;
} catch (e) { } catch (e) {

View file

@ -88,6 +88,7 @@ import {
N8nIconButton, N8nIconButton,
N8nButton, N8nButton,
} from 'n8n-design-system'; } from 'n8n-design-system';
import { ElMessageBoxOptions } from "element-ui/types/message-box";
Vue.use(Fragment.Plugin); Vue.use(Fragment.Plugin);
@ -176,8 +177,51 @@ Vue.use(Loading.directive);
Vue.prototype.$loading = Loading.service; Vue.prototype.$loading = Loading.service;
Vue.prototype.$msgbox = MessageBox; Vue.prototype.$msgbox = MessageBox;
Vue.prototype.$alert = MessageBox.alert;
Vue.prototype.$confirm = MessageBox.confirm; Vue.prototype.$alert = async (message: string, configOrTitle: string | ElMessageBoxOptions | undefined, config: ElMessageBoxOptions | undefined) => {
Vue.prototype.$prompt = MessageBox.prompt; let temp = config || (typeof configOrTitle === 'object' ? configOrTitle : {});
temp = {
...temp,
roundButton: true,
cancelButtonClass: 'btn--cancel',
confirmButtonClass: 'btn--confirm',
};
if (typeof configOrTitle === 'string') {
return await MessageBox.alert(message, configOrTitle, temp);
}
return await MessageBox.alert(message, temp);
};
Vue.prototype.$confirm = async (message: string, configOrTitle: string | ElMessageBoxOptions | undefined, config: ElMessageBoxOptions | undefined) => {
let temp = config || (typeof configOrTitle === 'object' ? configOrTitle : {});
temp = {
...temp,
roundButton: true,
cancelButtonClass: 'btn--cancel',
confirmButtonClass: 'btn--confirm',
};
if (typeof configOrTitle === 'string') {
return await MessageBox.confirm(message, configOrTitle, temp);
}
return await MessageBox.confirm(message, temp);
};
Vue.prototype.$prompt = async (message: string, configOrTitle: string | ElMessageBoxOptions | undefined, config: ElMessageBoxOptions | undefined) => {
let temp = config || (typeof configOrTitle === 'object' ? configOrTitle : {});
temp = {
...temp,
roundButton: true,
cancelButtonClass: 'btn--cancel',
confirmButtonClass: 'btn--confirm',
};
if (typeof configOrTitle === 'string') {
return await MessageBox.prompt(message, configOrTitle, temp);
}
return await MessageBox.prompt(message, temp);
};
Vue.prototype.$notify = Notification; Vue.prototype.$notify = Notification;
Vue.prototype.$message = Message; Vue.prototype.$message = Message;