diff options
author | Daniel Baumann <daniel@debian.org> | 2024-11-26 09:28:28 +0100 |
---|---|---|
committer | Daniel Baumann <daniel@debian.org> | 2024-11-26 12:25:58 +0100 |
commit | a1882b67c41fe9901a0cd8059b5cc78a5beadec0 (patch) | |
tree | 2a24507c67aa99a15416707b2f7e645142230ed8 /src/components/Confirm.vue | |
parent | Initial commit. (diff) | |
download | uptime-kuma-upstream.tar.xz uptime-kuma-upstream.zip |
Adding upstream version 2.0.0~beta.0+dfsg.upstream/2.0.0_beta.0+dfsgupstream
Signed-off-by: Daniel Baumann <daniel@debian.org>
Diffstat (limited to 'src/components/Confirm.vue')
-rw-r--r-- | src/components/Confirm.vue | 84 |
1 files changed, 84 insertions, 0 deletions
diff --git a/src/components/Confirm.vue b/src/components/Confirm.vue new file mode 100644 index 0000000..e855b67 --- /dev/null +++ b/src/components/Confirm.vue @@ -0,0 +1,84 @@ +<template> + <div ref="modal" class="modal fade" tabindex="-1"> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header"> + <h5 id="exampleModalLabel" class="modal-title"> + {{ title || $t("Confirm") }} + </h5> + <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" /> + </div> + <div class="modal-body"> + <slot /> + </div> + <div class="modal-footer"> + <button type="button" class="btn" :class="btnStyle" data-bs-dismiss="modal" @click="yes"> + {{ yesText }} + </button> + <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" @click="no"> + {{ noText }} + </button> + </div> + </div> + </div> + </div> +</template> + +<script> +import { Modal } from "bootstrap"; + +export default { + props: { + /** Style of button */ + btnStyle: { + type: String, + default: "btn-primary", + }, + /** Text to use as yes */ + yesText: { + type: String, + default: "Yes", // TODO: No idea what to translate this + }, + /** Text to use as no */ + noText: { + type: String, + default: "No", + }, + /** Title to show on modal. Defaults to translated version of "Config" */ + title: { + type: String, + default: null, + } + }, + emits: [ "yes", "no" ], + data: () => ({ + modal: null, + }), + mounted() { + this.modal = new Modal(this.$refs.modal); + }, + methods: { + /** + * Show the confirm dialog + * @returns {void} + */ + show() { + this.modal.show(); + }, + /** + * @fires string "yes" Notify the parent when Yes is pressed + * @returns {void} + */ + yes() { + this.$emit("yes"); + }, + /** + * @fires string "no" Notify the parent when No is pressed + * @returns {void} + */ + no() { + this.$emit("no"); + } + }, +}; +</script> |