SimpleConfirmModal.vue

<template>
  <div v-if="visible" class="modal">
    <div>
      <div>{{ message }}</div>

      <div>
        <button class="button-secondary" @click="cancel">Cancel</button>
        <button class="button-primary" @click="confirm">Confirm</button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    visible: Boolean,
    message: {
      type: String,
      default: 'Are you sure?',
    },
  },
  methods: {
    cancel() {
      this.$emit('close')
    },
    confirm() {
      this.$emit('confirm')
    },
  },
}
</script>