<template>
  <v-dialog :model-value="props.show" width="450">
    <v-card>
      <v-toolbar color="#769fdb" class="text-center">
        <v-toolbar-title>
          <v-icon color="#black" class="mr-2">mdi-alert</v-icon>
          Atenção!
        </v-toolbar-title>
      </v-toolbar>
      <v-card-text>
        <div class="text-body-1 font-weight-medium text-center">
          {{ message }}
        </div>
      </v-card-text>
      <v-card-actions class="justify-end">
        <v-btn
          v-if="props.showConfirm"
          variant="text"
          color="green"
          @click="$emit('close', true)"
          >Confirmar</v-btn
        >
        <v-btn variant="text" color="red" @click="$emit('close', false)"
          >Cancelar</v-btn
        >
      </v-card-actions>
    </v-card>
  </v-dialog>
</template>

<script lang="ts" setup>
import { defineProps } from "vue";

const props = defineProps({
  show: { type: Boolean, default: true },
  message: {
    type: String,
    required: true
  },
  showConfirm: {
    type: Boolean,
    default: false
  }
});
</script>
