2023-04-18 17:20:02 -04:00
|
|
|
import {onSelect} from '../services/dom';
|
|
|
|
import {Component} from './component';
|
2022-04-20 09:58:37 -04:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Custom equivalent of window.confirm() using our popup component.
|
|
|
|
* Is promise based so can be used like so:
|
|
|
|
* `const result = await dialog.show()`
|
|
|
|
*/
|
2022-11-16 08:04:22 -05:00
|
|
|
export class ConfirmDialog extends Component {
|
2022-04-20 09:58:37 -04:00
|
|
|
|
|
|
|
setup() {
|
|
|
|
this.container = this.$el;
|
|
|
|
this.confirmButton = this.$refs.confirm;
|
|
|
|
|
|
|
|
this.res = null;
|
|
|
|
|
|
|
|
onSelect(this.confirmButton, () => {
|
|
|
|
this.sendResult(true);
|
|
|
|
this.getPopup().hide();
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
show() {
|
|
|
|
this.getPopup().show(null, () => {
|
|
|
|
this.sendResult(false);
|
|
|
|
});
|
|
|
|
|
2023-04-19 10:20:04 -04:00
|
|
|
return new Promise(res => {
|
2023-04-18 17:20:02 -04:00
|
|
|
this.res = res;
|
2022-04-20 09:58:37 -04:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @returns {Popup}
|
|
|
|
*/
|
|
|
|
getPopup() {
|
2022-11-16 10:46:41 -05:00
|
|
|
return window.$components.firstOnElement(this.container, 'popup');
|
2022-04-20 09:58:37 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @param {Boolean} result
|
|
|
|
*/
|
|
|
|
sendResult(result) {
|
|
|
|
if (this.res) {
|
2023-04-18 17:20:02 -04:00
|
|
|
this.res(result);
|
2022-04-20 09:58:37 -04:00
|
|
|
this.res = null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-04-18 17:20:02 -04:00
|
|
|
}
|