<template lang="pug">
  .modal
    .text.mt-4.mb-6.text-base Вы действительно хотите удалить медкарту?
    .flex.gap-x-3
      q-btn(
        label="Отменить",
        no-caps,
        outline,
        color="primary",
        padding="10px 24px",
        @click="changeShownRemoveModal(false)"
      )
      q-btn(
        label="Удалить",
        no-caps,
        outline,
        style="color: var(--border-red-color)",
        padding="10px 24px",
        @click="removeMedicalCard"
      )
</template>

<script>
export default {
  name: "MedicalRemoveModal",
  props: {
    changeShownRemoveModal: Function,
  },
  data() {
    return {};
  },
  methods: {
    removeMedicalCard() {
      this.changeShownRemoveModal(false);
      this.$store.dispatch("removeMedicalCardData");
    },
  },
};
</script>
<style scoped lang="sass">
.modal
  width: 350px
.text
  color: var(--font-grey-color)
</style>
