From 167bde258af6c3ee1f90583137fbf3d8d84d3cab Mon Sep 17 00:00:00 2001
From: vicent <vicent@verdnatura.es>
Date: Tue, 20 Dec 2022 12:02:17 +0100
Subject: [PATCH] feat: add Confirm component

---
 src/components/common/Confirm.vue | 49 +++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 src/components/common/Confirm.vue

diff --git a/src/components/common/Confirm.vue b/src/components/common/Confirm.vue
new file mode 100644
index 000000000..bd261f7b4
--- /dev/null
+++ b/src/components/common/Confirm.vue
@@ -0,0 +1,49 @@
+<script setup>
+import { ref } from 'vue';
+import { useDialogPluginComponent } from 'quasar';
+import { useI18n } from 'vue-i18n';
+
+const $props = defineProps({
+    question: {
+        type: String,
+        default: '',
+    },
+    message: {
+        type: String,
+        default: '',
+    },
+});
+
+defineEmits(['confirm', ...useDialogPluginComponent.emits]);
+
+const { dialogRef, onDialogOK } = useDialogPluginComponent();
+const { t } = useI18n();
+
+const question = ref($props.question);
+const message = ref($props.question);
+const isLoading = ref(false);
+</script>
+<template>
+    <q-dialog ref="dialogRef" persistent>
+        <q-card class="q-pa-sm">
+            <q-card-section class="row items-center q-pb-none">
+                <span class="text-h6 text-grey">{{ message }}</span>
+                <q-space />
+                <q-btn icon="close" flat round dense v-close-popup />
+            </q-card-section>
+            <q-card-section class="row items-center">
+                {{ question }}
+            </q-card-section>
+            <q-card-actions align="right">
+                <q-btn :label="t('globals.cancel')" color="primary" flat v-close-popup />
+                <q-btn :label="t('globals.confirm')" color="primary" :loading="isLoading" @click="onDialogOK" />
+            </q-card-actions>
+        </q-card>
+    </q-dialog>
+</template>
+
+<style lang="scss" scoped>
+.q-card {
+    min-width: 350px;
+}
+</style>