fix: flow after staking success

src/router/routes/lab.js

@@ -16,9 +16,7 @@ const labRoutes = [
         component: () => import(/* webpackChunkName */ "@/views/Dashboard/Lab"),
         beforeEnter: (to, from, next) => {
           // Set drawer buttons here to make it dynamic :)
-          if (!store.state.substrate.isServicesExist ||
-            store.state.substrate.labAccount.verificationStatus === "Unverified" &&
-            (store.state.substrate.labAccount.stakeStatus === "Unstaked" && store.state.substrate.labAccount.stakeAmount === "0")
+          if (!store.state.substrate.isServicesExist || store.state.substrate.labAccount.verificationStatus === "Unverified"
           ) {
             to.meta.drawerButtons = [
               { text: "Dashboard", active: true, disabled: false, route: { name: "lab-dashboard" } },

src/views/Dashboard/Lab/NavigationLayout.vue

@@ -38,7 +38,7 @@
       @status-wallet="({status, img}) => connectWalletResult(status, img)"
     ></WalletBinding>
 
-    <v-main class="main" v-if="(verificationStatus === 'Unverified' && computeStakingStatus) && isLabDashboard">
+    <v-main class="main" v-if="!allowDashboard && isLabDashboard">
       <router-view />
     </v-main>
 
@@ -141,11 +141,14 @@ export default {
     },
 
     computeStakingStatus() {
-      return this.labAccount?.stakeStatus === "Unstaked" && this.labAccount.unstakeAt === "0"
+      return this.labAccount?.stakeStatus === "Unstaked"
     },
 
-    verificationStatus() {
-      return this.labAccount?.verificationStatus
+    allowDashboard() {
+      if (this.isServicesExist)
+        if (this.labAccount?.stakeStatus === "Unstaked" && this.labAccount?.verificationStatus === "Unverified") return false
+        else return true
+      else return false
     }
   },
   watch: {

src/views/Dashboard/Lab/Registration/Services/index.vue

@@ -433,48 +433,39 @@ export default {
       }
     },
 
-    gotoDashboard() {
+    async gotoDashboard() {
+      await this.$store.dispatch("substrate/getLabAccount")
       this.$router.push({ name: "lab-dashboard" })
     },
 
-    async actionAlert() {
-      this.isSubmiting = true
-      const {labAccount} = await this.$store.dispatch("substrate/getLabAccount")
-
-      if (this.isLabExist && labAccount.verificationStatus === "Unverified") {
-        await sendEmailRegisteredLab(this.wallet.address)
-
-        await this.$store.dispatch("substrate/addAnyNotification", {
-          address: this.wallet.address,
-          dataAdd: {
-            message: "Congrats! You have been submitted your account verification.",
-            data: labAccount,
-            route: null,
-            params: null
-          },
-          role: "lab"
-        })
-
-        this.dialogAlert = true
-        this.isSubmiting = false
-      }
-
-      this.gotoDashboard()
-    },
-
     async handleStakeLab() {
+      this.isSubmiting = true
       this.stakeLoading = true
 
       try {
         await stakeLab(this.api, this.pair)
-
-        this.actionAlert()
-        await this.$store.dispatch("substrate/getLabAccount")
-        this.gotoDashboard()
+        const {labAccount} = await this.$store.dispatch("substrate/getLabAccount")
+
+        if (this.isLabExist && labAccount.verificationStatus === "Unverified") {
+          await sendEmailRegisteredLab(this.wallet.address)
+
+          this.$store.dispatch("substrate/addAnyNotification", {
+            address: this.wallet.address,
+            dataAdd: {
+              message: "Congrats! You have been submitted your account verification.",
+              data: labAccount,
+              route: null,
+              params: null
+            },
+            role: "lab"
+          })
+        }
+        this.dialogAlert = true
       } catch (error) {
         console.error(error)
       }
 
+      this.isSubmiting = false
       this.stakeLoading = false
     },
 

src/views/Dashboard/Lab/index.vue

@@ -24,8 +24,8 @@
 </style>
 
 <template>
-  <v-container :class="verificationStatus === 'Unverified' && computeStakingStatus ? 'center-all' : ''">
-    <v-container v-if="verificationStatus === 'Unverified' && computeStakingStatus">
+  <v-container :class="!allowDashboard ? 'center-all' : ''">
+    <v-container v-if="!allowDashboard">
       <h1 class="title-text-color">You don't have a lab account yet</h1>
       <v-btn color="primary" to="/lab/registration">
         {{ computeStakingStatus ? "Continue Registration" : "Register Now!" }}
@@ -39,15 +39,15 @@
               inline
               color="primary"
               :size="20"
-              v-if="labAccount && verificationStatus == 'Verified'"
+              v-if="labAccount && labAccount.verificationStatus == 'Verified'"
             >mdi-check-decagram</v-icon>
             <v-icon 
               inline
               color="yellow darken-2"
               :size="20"
               v-else
             >mdi-information</v-icon>
-            <b v-if="labAccount && verificationStatus == 'Unverified'">Your verification submission is being reviewed by DAOGenics</b>
+            <b v-if="labAccount && labAccount.verificationStatus == 'Unverified'">Your verification submission is being reviewed by DAOGenics</b>
             <b v-else>{{ computeVerificationStatus }}</b>
           </div>
         </v-card>
@@ -100,6 +100,7 @@ export default {
 
   computed: {
     ...mapState({
+      isServicesExist: (state) => state.substrate.isServicesExist,
       labAccount: (state) => state.substrate.labAccount
     }),
 
@@ -114,7 +115,14 @@ export default {
     },
 
     computeStakingStatus() {
-      return this.labAccount?.stakeStatus === "Unstaked" && this.labAccount.unstakeAt === "0"
+      return this.labAccount?.stakeStatus === "Unstaked"
+    },
+
+    allowDashboard() {
+      if (this.isServicesExist)
+        if (this.labAccount?.stakeStatus === "Unstaked" && this.labAccount?.verificationStatus === "Unverified") return false
+        else return true
+      else return false
     }
   }
 }