fix

src/abstraction/repository/authRepository.js

@@ -35,4 +35,10 @@ export default class AuthRepository {
             return response.data.data;
         }
     }
+    async verifyCode(data) {
+        let json = setData(data);
+        let response = await axios.post(url("verifyCode"), json);
+        console.log(response.data);
+        return getJson(response.data)
+    }
 }

src/abstraction/resources/authResource.js

@@ -10,4 +10,5 @@ export const setData = (data) => ({
   username: data.username,
   password: data.password,
   password_confirmation: data.password_confirmation,
+  code: data.code,
 });

src/components/Global/Modal/BasicModal.vue

@@ -7,7 +7,11 @@
     dark
   >
     <main-back height="100%" :is-modal="true">
-      <component :is="tag" @submit.prevent="$emit('submit')">
+      <component
+        :is="tag"
+        @submit.prevent="$emit('submit')"
+        :ref="tag == 'form' ? 'form' : null"
+      >
         <v-card class="wa__modal">
           <div class="wa__modal-header">
             <slot name="header" :modal="modal" :data="data" v-if="modal"></slot>
@@ -26,7 +30,6 @@
     </main-back>
   </v-dialog>
 </template>
- 
 
 <script>
 import { mapGetters } from "vuex";
@@ -93,4 +96,4 @@ export default {
   position: relative;
   height: 40px;
 }
-</style>
+</style>

src/components/Products/Add.vue

@@ -18,7 +18,9 @@
                 <div class="add__workout dark w-100 h-100">
                   <ImageCropper
                     label="manager image"
-                    :url.sync="form.thumbnail"
+                    :url="
+                      form.thumbnail ? form.thumbnail : `https://via.placeholder.com/1080`
+                    "
                     v-model="fileForm"
                     :stencilProps="{ aspectRatio: 1, checkImageOrigin: false }"
                   />

src/components/ProgramSeries/Modals/AddSeriesModal.vue

@@ -1,10 +1,5 @@
 <template>
-  <basic-modal
+  <basic-modal width="520" transition="slide-x-transition" tag="form" @submit="addSeries">
-    width="520"
-    transition="slide-x-transition"
-    tag="form"
-    @submit="addSeries"
-  >
     <template #header>
       <div class="close__modal">
         <v-icon class="WMi-cancel-1" large @click="$_closeModal()"></v-icon>
@@ -35,7 +30,8 @@
               ><v-text-field
                 dark
                 label="how many times in a week?"
-                class="no-error-msg mt-0 pt-0"
+                class="mt-0 pt-0"
+                :rules="[rules.required, rules.min]"
                 v-model="form.repeat"
               ></v-text-field>
             </v-col>
@@ -52,9 +48,7 @@
     </template>
     <template #footer>
       <v-spacer></v-spacer>
-      <div
+      <div class="d-flex justify-space-between align-items-center w-100 pb-10">
-        class="d-flex justify-space-between align-items-center w-100 pb-10"
-      >
         <RectangleButton
           class="btn__modal--cancel pl-0"
           text="cancel"
@@ -78,6 +72,7 @@
 <script>
 import { mapActions } from "vuex";
 import SectionTitle from "../../Global/Section/SectionTitle.vue";
+import toast from "@/utils/toast";
 export default {
   name: "modal_add_series",
   components: { SectionTitle },
@@ -86,18 +81,26 @@ export default {
   },
   data: () => ({
     form: {},
+    rules: {
+      required: (value) => !!value || "Required.",
+      min: (v) => v <= 7 || "The value of this field must be less than 7",
+    },
   }),
   methods: {
     ...mapActions("programSeries", ["addSeriesToProgram"]),
     async addSeries() {
-      let response = await this.addSeriesToProgram({
+      if (this.form.repeat <= 7) {
-        data: this.form,
+        let response = await this.addSeriesToProgram({
-        courseId: Number(this.programId),
+          data: this.form,
-      });
+          courseId: Number(this.programId),
-      if (response) {
+        });
-        this.$_closeModal();
+        if (response) {
+          this.$_closeModal();
+        }
+      } else {
+        toast.error("The information entered is incorrect", "Error");
       }
     },
   },
 };
-</script>
+</script>

src/router/url.js

@@ -6,6 +6,7 @@ const urls = {
   register: "auth/register",
   forgotPassword: "auth/forget-password",
   logout: "auth/logout",
+  verifyCode: "auth/verify-email",
   // programs
   indexProgram: "admin/courses",
   showProgram: "admin/courses/:course",

src/store/modules/auth/actions.js

@@ -25,7 +25,7 @@ export default {
         TokenStorage.removeToken();
         return true;
     },
-    async register({}, data) {
+    async register({ }, data) {
         let repository = new AuthRepository();
         const response = await repository.register(data);
         if (response) {
@@ -33,4 +33,12 @@ export default {
             return response;
         }
     },
+    async verifyEmail({ commit }, data) {
+        let repository = new AuthRepository();
+        const response = await repository.verifyCode(data);
+        if (response) {
+            setTokenHeader(commit, response);
+            return response;
+        }
+    },
 };

src/views/Register.vue

@@ -13,7 +13,7 @@
             <div class="auth__subtitle text-uppercase mb-2">
               please provide us this information
             </div>
-            <v-form @submit.prevent="doRegister">
+            <v-form @submit.prevent="doRegister" v-if="!verifyCodePage">
               <v-row>
                 <v-col cols="12">
                   <v-text-field
@@ -107,6 +107,42 @@
                 </v-col>
               </v-row>
             </v-form>
+            <v-form @submit.prevent="verifyEmailCode" v-else>
+              <div class="wa__register__form mt-14">
+                <v-row>
+                  <v-col cols="12" class="pb-0">
+                    <div>
+                      <v-text-field
+                        label="code"
+                        class="no-error-msg"
+                        dark
+                        v-model="form.code"
+                      ></v-text-field>
+                    </div>
+                  </v-col>
+                </v-row>
+                <v-row class="mt-4">
+                  <v-col cols="12">
+                    <RectangleButton
+                      class="w-100 custom-btn"
+                      text="send code"
+                      type="submit"
+                      height="25"
+                    />
+                  </v-col>
+                  <v-col cols="12" class="pt-0">
+                    <div>
+                      <RectangleButton
+                        class="w-100"
+                        text="return to register "
+                        icon="WMi-left-open"
+                        @click.native="toggleVerifyCodePage"
+                      />
+                    </div>
+                  </v-col>
+                </v-row>
+              </div>
+            </v-form>
           </v-col>
         </template>
       </auth-basic>
@@ -128,15 +164,24 @@ export default {
   data: () => ({
     showPassword: false,
     form: {},
+    verifyCodePage: false,
   }),
   methods: {
-    ...mapActions("auth", ["register"]),
+    ...mapActions("auth", ["register", "verifyEmail"]),
     async doRegister() {
       let response = await this.register(this.form);
       if (response) {
-        this.$router.push("/login");
+        this.toggleVerifyCodePage();
       }
     },
+    toggleVerifyCodePage() {
+      this.verifyCodePage = !this.verifyCodePage;
+    },
+    async verifyEmailCode() {
+      console.log(this.form);
+      await this.verifyEmail(this.form);
+      this.$router.push({ name: "dashboard" });
+    },
   },
 };
 </script>