Add New SweetAlert & Notification Components

resources/assets/js/views/wizard/WizardCompanyInfoStep.vue

@@ -33,8 +33,8 @@
             </div>
 
             <sw-avatar
-              trigger="#logo-box"
               :preview-avatar="previewLogo"
+              trigger="#logo-box"
               @changed="onChange"
               @uploadHandler="onUploadHandler"
               @handleUploadError="onHandleUploadError"
@@ -156,7 +156,7 @@ const { required, maxLength } = require('vuelidate/lib/validators')
 
 export default {
   components: {
-    CloudUploadIcon
+    CloudUploadIcon,
   },
   data() {
     return {
@@ -197,12 +197,6 @@ export default {
       },
     },
   },
-  watch: {
-    country({ id }) {
-      this.companyData.country_id = id
-      return true
-    },
-  },
   computed: {
     companyNameError() {
       if (!this.$v.companyData.name.$error) {
@@ -241,12 +235,18 @@ export default {
       }
     },
   },
+  watch: {
+    country({ id }) {
+      this.companyData.country_id = id
+      return true
+    },
+  },
   mounted() {
     this.fetchCountries()
   },
   methods: {
     ...mapActions('company', ['setSelectedCompany']),
-
+    ...mapActions('notification', ['showNotification']),
     onUploadHandler(cropper) {
       this.previewLogo = cropper
         .getCroppedCanvas()
@@ -254,7 +254,10 @@ export default {
     },
 
     onHandleUploadError() {
-      window.toastr['error']('Oops! Something went wrong...')
+      this.showNotification({
+        type: 'error',
+        message: 'Oops! Something went wrong...',
+      })
     },
 
     onChange(file) {

resources/assets/js/views/wizard/WizardDatabaseStep.vue

@@ -21,7 +21,7 @@ import Mysql from './database/MysqlDatabase'
 import Pgsql from './database/PgsqlDatabase'
 import Sqlite from './database/SqliteDatabase'
 import Sqlsrv from './database/SqlsrvDatabase'
-
+import { mapActions } from 'vuex'
 export default {
   components: {
     Mysql,
@@ -44,6 +44,7 @@ export default {
     this.getDatabaseConfig(this.database_connection)
   },
   methods: {
+    ...mapActions('notification', ['showNotification']),
     async getDatabaseConfig(connection) {
       this.isLoading = this.isFetching = true
 
@@ -80,20 +81,28 @@ export default {
 
           this.$emit('next', 3)
 
-          window.toastr['success'](
-            this.$t('wizard.success.' + response.data.success)
-          )
+          this.showNotification({
+            type: 'success',
+            message: this.$t('wizard.success.' + response.data.success),
+          })
 
           return true
         } else if (response.data.error) {
-          window.toastr['error'](
-            this.$t('wizard.errors.' + response.data.error)
-          )
+          this.showNotification({
+            type: 'error',
+            message: this.$t('wizard.errors.' + response.data.error),
+          })
         } else if (response.data.error_message) {
-          window.toastr['error'](response.data.error_message)
+          this.showNotification({
+            type: 'error',
+            message: response.data.error_message,
+          })
         }
       } catch (e) {
-        window.toastr['error'](e.response.data.message)
+        this.showNotification({
+          type: 'error',
+          message: e.response.data.message,
+        })
       } finally {
         this.isLoading = this.isFetching = false
       }

resources/assets/js/views/wizard/WizardEmailConfigStep.vue

@@ -24,7 +24,7 @@ import Smtp from './mail-driver/SmtpMailDriver'
 import Mailgun from './mail-driver/MailgunMailDriver'
 import Ses from './mail-driver/SesMailDriver'
 import Basic from './mail-driver/BasicMailDriver'
-
+import { mapActions } from 'vuex'
 export default {
   components: {
     Smtp,
@@ -48,6 +48,7 @@ export default {
     this.getMailDrivers()
   },
   methods: {
+    ...mapActions('notification', ['showNotification']),
     async getMailDrivers() {
       this.isLoading = this.isFetching = true
 
@@ -67,19 +68,24 @@ export default {
         )
         if (response.data.success) {
           this.$emit('next', 4)
-          window.toastr['success'](
-            this.$t('wizard.success.' + response.data.success)
-          )
+          this.showNotification({
+            type: 'success',
+            message: this.$t('wizard.success.' + response.data.success),
+          })
         } else {
-          window.toastr['error'](
-            this.$t('wizard.errors.' + response.data.error)
-          )
+          this.showNotification({
+            type: 'error',
+            message: this.$t('wizard.errors.' + response.data.error),
+          })
         }
         this.isLoading = this.isFetching = false
         return true
       } catch (e) {
         this.isLoading = this.isFetching = false
-        window.toastr['error']('Something went wrong')
+        this.showNotification({
+          type: 'error',
+          message: 'Something went wrong',
+        })
       }
     },
   },

resources/assets/js/views/wizard/WizardPermissionStep.vue

@@ -75,14 +75,14 @@ export default {
         let self = this
 
         if (this.errors) {
-          swal({
+          this.$swal({
             title: this.$t('wizard.permissions.permission_confirm_title'),
             text: this.$t('wizard.permissions.permission_confirm_desc'),
             icon: 'warning',
-            buttons: true,
-            dangerMode: true,
-          }).then(async (willConfirm) => {
-            if (willConfirm) {
+            showCancelButton: true,
+            showConfirmButton: true,
+          }).then(async (result) => {
+            if (result.value) {
               self.isLoading = this.isFetching = false
             }
           })

resources/assets/js/views/wizard/WizardSettingsStep.vue

@@ -211,6 +211,7 @@ export default {
   },
   methods: {
     ...mapActions('company', ['updateCompanySettings', 'setSelectedCompany']),
+    ...mapActions('notification', ['showNotification']),
     ...mapActions([
       'fetchLanguages',
       'fetchCurrencies',
@@ -288,7 +289,10 @@ export default {
 
       if (response.data) {
         this.$emit('next', 'COMPLETED')
-        window.toastr['success']('Login Successful')
+        this.showNotification({
+          type: 'success',
+          message: 'Login Successful',
+        })
         this.$router.push('/admin/dashboard')
       }
     },

resources/assets/js/views/wizard/WizardUserProfileStep.vue

@@ -208,13 +208,17 @@ export default {
   },
   methods: {
     ...mapActions('user', ['uploadAvatar']),
+    ...mapActions('notification', ['showNotification']),
     onUploadHandler(cropper) {
       this.previewAvatar = cropper
         .getCroppedCanvas()
         .toDataURL(this.cropperOutputMime)
     },
     onHandleUploadError() {
-      window.toastr['error']('Oops! Something went wrong...')
+      this.showNotification({
+        type: 'error',
+        message: 'Oops! Something went wrong...',
+      })
     },
     onChange(file) {
       this.cropperOutputMime = file.type