<template>
  <div class="text-center">
    <!-- <v-btn color="error" @click="dialog = !dialog">Show Dialog</v-btn> -->

    <v-overlay :value="dialog">
      <v-card>
        <v-card-title class="headline">{{headline}}</v-card-title>
        <v-card-text>{{text}}</v-card-text>
        <v-card-actions>
          <v-btn color="info" @click="dialog=false" tile depressed>back</v-btn>
          <v-spacer/>
          <v-btn color="error" @click="proceed()" tile depressed>confirm</v-btn>
        </v-card-actions>
      </v-card>
    </v-overlay>
  </div>
</template>

<script>
export default {
  props: {
    headline: {
      type: String
    },
    text: {
      type: String
    }
  },
  data() {
    return {
      dialog: false
    }
  },
  methods: {
    confirm() {}
  }
}
</script>