Add ConfirmModal comp

This commit is contained in:
Tusooa Zhu 2022-02-09 15:50:25 -05:00 committed by tusooa
parent a0b886459b
commit 0684f19d1b
No known key found for this signature in database
GPG Key ID: 7B467EDE43A08224
2 changed files with 70 additions and 0 deletions

View File

@ -0,0 +1,42 @@
import DialogModal from '../dialog_modal/dialog_modal.vue'
/**
* This component emits the following events:
* cancelled, emitted when the action should not be performed;
* accepted, emitted when the action should be performed;
*
* The caller should close this dialog after receiving any of the two events.
*/
const ConfirmModal = {
components: {
DialogModal
},
data: {
},
props: {
showing: {
type: Boolean
},
title: {
type: String
},
cancelText: {
type: String
},
confirmText: {
type: String
}
},
computed: {
},
methods: {
onCancel () {
this.$emit('cancelled')
},
onAccept () {
this.$emit('accepted')
}
}
}
export default ConfirmModal

View File

@ -0,0 +1,28 @@
<template>
<dialog-modal
v-if="showing"
:onCancel="onCancel"
>
<template v-slot:header>
<span v-text="title"></span>
</template>
<slot></slot>
<template v-slot:footer>
<button
class="btn button-default"
v-text="confirmText"
@click.prevent="onAccept"
></button>
<button
class="btn button-default"
v-text="cancelText"
@click.prevent="onCancel"
></button>
</template>
</dialog-modal>
</template>
<script src="./confirm_modal.js"></script>