fix

src/views/Auth/ForgotPassword.vue

@@ -0,0 +1,70 @@
+<template>
+  <v-form ref="form">
+    <v-container grid-list-xs>
+      <v-layout row wrap class="justify-center">
+        <v-flex xs12 md3 sm3 class="WM-WidthScreen-SM WM-WidthScreen-XS">
+          <material-card color="black" title="Login Page">
+            <v-layout row wrap class="px-3">
+              <v-flex xs12 md12 sm12>
+                <v-text-field
+                  v-model="form.cell_number"
+                  name="cellnumber"
+                  label="Cell Number"
+                  color="black"
+                  :rules="[rules.required, rules.cellNumberCounter]"
+                  mask="#### ### ####"
+                ></v-text-field>
+              </v-flex>
+            </v-layout>
+            <v-layout row wrap class="px-3">
+              <v-flex xs12 md6 sm6 class="text-md-left text-sm-center text-xs-center">
+                <v-btn
+                  class="WM-CyanBlueGradient-BG"
+                  style="padding:10px 60px"
+                  @click="handleSubmit"
+                >
+                  <v-icon class="white--text mr-2 caption">fas fa-sign-in-alt</v-icon>
+                  <span class="white--text">Send</span>
+                </v-btn>
+              </v-flex>
+              <v-flex xs12 md6 sm6 class="text-md-right text-sm-center text-xs-center">
+                <router-link class="black--text" :to="{name: 'Login'}">
+                  <v-btn class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Black">
+                    <v-icon class="black--text mr-2 caption">fas fa-sign-in-alt</v-icon>
+                    <span class="black--text">Login</span>
+                  </v-btn>
+                </router-link>
+              </v-flex>
+            </v-layout>
+          </material-card>
+        </v-flex>
+      </v-layout>
+    </v-container>
+  </v-form>
+</template>
+<script>
+import { mapActions, mapMutations } from "vuex";
+import { ApiService } from "@/services";
+import { urls } from "@/config/urls";
+export default {
+  data() {
+    return {
+      form :{
+        cell_number: ""
+      },
+      rules: {
+        required: value => !!value || "Required.",
+        cellNumberCounter: value => (value && value.length == 11) || "must 11 characters"
+      }
+    };
+  },
+  methods: {
+    ...mapActions("auth", ["forgotPassword"]),
+    async handleSubmit() {
+      if (this.$refs.form.validate()) { 
+        this.forgotPassword({form : this.form});
+      }
+    }
+  }
+};
+</script>