Files
hoppscotch/packages/hoppscotch-app/components/http/ReqChangeConfirmModal.vue
Nivedin efbd165c5c feat: unsaved change popup (#2239)
Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>
Co-authored-by: liyasthomas <liyascthomas@gmail.com>
2022-04-13 20:52:44 +05:30

60 lines
1.1 KiB
Vue

<template>
<SmartModal
v-if="show"
dialog
:title="$t('modal.confirm')"
aria-modal="true"
@close="hideModal"
>
<template #body>
<div class="flex flex-col px-2">
<label>
{{ t("confirm.request_change") }}
</label>
</div>
</template>
<template #footer>
<span>
<ButtonPrimary
v-focus
:label="t('action.save')"
@click.native="saveApiChange"
/>
<ButtonSecondary
:label="t('action.dont_save')"
@click.native="discardApiChange"
/>
</span>
<ButtonSecondary :label="t('action.cancel')" @click.native="hideModal" />
</template>
</SmartModal>
</template>
<script setup lang="ts">
import { useI18n } from "~/helpers/utils/composables"
const t = useI18n()
defineProps<{
show: Boolean
}>()
const emit = defineEmits<{
(e: "save-change"): void
(e: "discard-change"): void
(e: "hide-modal"): void
}>()
const saveApiChange = () => {
emit("save-change")
}
const discardApiChange = () => {
emit("discard-change")
}
const hideModal = () => {
emit("hide-modal")
}
</script>