feat: add dialog action.loading prop

Author: davidstackio

playground/app.vue

@@ -21,7 +21,11 @@ const clickDialog = () => {
   dialog.value.title = 'This is a dialog!'
   dialog.value.message = 'It can have fun messages.'
   dialog.value.action.function = () => {
-    dialog.value.show = false
+    dialog.value.action.loading = true
+    setTimeout(() => {
+      dialog.value.action.loading = false
+      dialog.value.show = false
+    }, 2000)
   }
   dialog.value.show = true
 }

src/runtime/components/app/AppDialog.vue

@@ -29,6 +29,8 @@ const dialog = useDialog()
 
         <v-btn
           :color="dialog.action.buttonColor || 'secondary'"
+          :loading="dialog.action.loading"
+          :disabled="dialog.action.loading"
           variant="flat"
           @click="dialog.action.function"
         >

src/runtime/composables/dialog.ts

@@ -9,6 +9,7 @@ export interface Dialog {
     function: (() => Promise<void>) | (() => void) | null
     buttonText: string
     buttonColor: string
+    loading: boolean
   }
   closeButtonText: string
 }
@@ -21,6 +22,7 @@ export const dialogInitialState: Dialog = {
     function: null,
     buttonText: 'Confirm',
     buttonColor: '',
+    loading: false,
   },
   closeButtonText: 'Cancel',
 }