viithiisys / spotlight-frontend

Download as
Browse Code »

Commit d974d32288001d8f71e2a69dc4192a8a3d6efe51

Authored by Digvijay Singh
1 parent 052b5bc331
Exists in master and in 1 other branch admin

changes

Showing 7 changed files with 14 additions and 7 deletions   Show diff stats
1 { 1 {
2 "domain": "dev-j6rr4vlx.auth0.com", 2 "domain": "heidelbergs.auth0.com",
3 "clientId": "DwzaizqwauDUMX5OQigO9zVETJqIThST" 3 "clientId": "fZVVARsPjVsMVS9Uj2WJnMBYXizNNLwa"
4 } 4 }
5 5
src/assets/images/check-circle.png
Diff comments   View file @d974d32

392 Bytes
src/assets/images/password-reload.png
Diff comments   View file @d974d32

381 Bytes
src/assets/images/spotlight-icon.png
Diff comments   View file @d974d32

4.83 KB
src/components/ChangePassword.vue
Diff comments   View file @d974d32
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <div class="container-fluid main-wrp"> 3 <div class="container-fluid main-wrp">
4 <nav class="navbar navbar-expand-sm spotLight-nav"> 4 <nav class="navbar navbar-expand-sm spotLight-nav">
5 <a class="navbar-brand" href="#" 5 <a class="navbar-brand" href="#"
6 ><img src="../assets/images/logo.png" 6 ><img src="../assets/images/logo.png"
7 /></a> 7 /></a>
8 <button 8 <button
9 class="navbar-toggler" 9 class="navbar-toggler"
10 type="button" 10 type="button"
11 data-toggle="collapse" 11 data-toggle="collapse"
12 data-target="#navbarsExample03" 12 data-target="#navbarsExample03"
13 aria-controls="navbarsExample03" 13 aria-controls="navbarsExample03"
14 aria-expanded="false" 14 aria-expanded="false"
15 aria-label="Toggle navigation" 15 aria-label="Toggle navigation"
16 > 16 >
17 <span class="navbar-toggler-icon"></span> 17 <span class="navbar-toggler-icon"></span>
18 <span class="navbar-toggler-icon"></span> 18 <span class="navbar-toggler-icon"></span>
19 <span class="navbar-toggler-icon"></span> 19 <span class="navbar-toggler-icon"></span>
20 </button> 20 </button>
21 21
22 <div class="collapse navbar-collapse" id="navbarsExample03"> 22 <div class="collapse navbar-collapse" id="navbarsExample03">
23 <ul class="navbar-nav mr-auto"> 23 <ul class="navbar-nav mr-auto">
24 <li class="nav-item active"> 24 <li class="nav-item active">
25 <a class="nav-link" href="#">About</a> 25 <a class="nav-link" href="#">About</a>
26 </li> 26 </li>
27 <li class="nav-item"> 27 <li class="nav-item">
28 <a class="nav-link" href="#">Masterclass</a> 28 <a class="nav-link" href="#">Masterclass</a>
29 </li> 29 </li>
30 <li class="nav-item"> 30 <li class="nav-item">
31 <a class="nav-link" href="#">Stories</a> 31 <a class="nav-link" href="#">Stories</a>
32 </li> 32 </li>
33 <li class="nav-item spotLight-img"> 33 <li class="nav-item spotLight-img">
34 <a class="nav-link" href="#" 34 <a class="nav-link" href="#"
35 ><img src="../assets/images/SPOTLight.svg" 35 ><img src="../assets/images/SPOTLight.svg"
36 /></a> 36 /></a>
37 </li> 37 </li>
38 <li class="nav-item"> 38 <li class="nav-item">
39 <a class="nav-link" href="#">Library</a> 39 <a class="nav-link" href="#">Library</a>
40 </li> 40 </li>
41 </ul> 41 </ul>
42 </div> 42 </div>
43 </nav> 43 </nav>
44 <!-- menu wrapper --> 44 <!-- menu wrapper -->
45 <div class="sign-wrp"> 45 <div class="sign-wrp">
46 <div class="row col-reverse"> 46 <div class="row col-reverse">
47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div> 47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div>
48 <!-- users land image --> 48 <!-- users land image -->
49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp"> 49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp">
50 <h1 class="welcome-hd-back"> 50 <h1 class="welcome-hd-back">
51 Welcome <br /> 51 Welcome <br />
52 back 52 back
53 </h1> 53 </h1>
54 </div> 54 </div>
55 <!-- users land image --> 55 <!-- users land image -->
56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
57 <div class="form-layout signup-frm-spc"> 57 <div class="form-layout signup-frm-spc">
58 <form> 58 <form>
59 <!-- <h5>SignUp Using</h5> --> 59 <!-- <h5>SignUp Using</h5> -->
60 <div class="social-login" style="visibility: hidden"> 60 <div class="social-login" style="visibility: hidden">
61 <ul> 61 <ul>
62 <li> 62 <li>
63 <a href="#"><img src="../assets/images/google.svg" /></a> 63 <a href="#"><img src="../assets/images/google.svg" /></a>
64 </li> 64 </li>
65 <li> 65 <li>
66 <a href="#"><img src="../assets/images/linkdin.svg" /></a> 66 <a href="#"><img src="../assets/images/linkdin.svg" /></a>
67 </li> 67 </li>
68 <li> 68 <li>
69 <a href="#"><img src="../assets/images/twitter.svg" /></a> 69 <a href="#"><img src="../assets/images/twitter.svg" /></a>
70 </li> 70 </li>
71 </ul> 71 </ul>
72 </div> 72 </div>
73 <h5> 73 <h5>
74 Setup a new password. Please enter the OTP shared to {{email}} to confirm 74 Setup a new password. Please enter the OTP shared to {{email}} to confirm
75 your email address 75 your email address
76 </h5> 76 </h5>
77 <div class="fill-form"> 77 <div class="fill-form">
78 <label for="inputEmail" class="sr-only">OTP</label> 78 <label for="inputEmail" class="sr-only">OTP</label>
79 <input 79 <input
80 type="text" 80 type="text"
81 id="inputEmail" 81 id="inputEmail"
82 class="form-control" 82 class="form-control"
83 placeholder="Your OTP" 83 placeholder="Your OTP"
84 v-model="otp" 84 v-model="otp"
85 autocomplete="off" 85 autocomplete="off"
86 86
87 /> 87 />
88 <label for="inputEmail" class="sr-only">New Password</label> 88 <label for="inputEmail" class="sr-only">New Password</label>
89 <input 89 <input
90 type="password" 90 type="password"
91 id="inputEmail" 91 id="inputEmail"
92 class="form-control" 92 class="form-control"
93 placeholder="Your New Password" 93 placeholder="Your New Password"
94 v-model="password" 94 v-model="password"
95 autocomplete="off" 95 autocomplete="off"
96 96
97 /> 97 />
98 <!-- <label for="inputPassword" class="sr-only">Password</label> 98 <!-- <label for="inputPassword" class="sr-only">Password</label>
99 <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> --> 99 <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> -->
100 100
101 <a href="javascript:void(0);" class="btn btn-lg sb-button" @click="changePassword"> 101 <a href="javascript:void(0);" class="btn btn-lg sb-button" @click="changePassword">
102 <img src="../assets/images/user-plus.svg" />Change Password 102 <img src="../assets/images/password-reload.png" />Update Password
103 </a> 103 </a>
104 <p class="forget-pass">Didn’t Get the OTP? <a @click="ResendEmail">Resend</a></p> 104 <p class="forget-pass">Didn’t Get the OTP? <a @click="ResendEmail">Resend</a></p>
105 <!-- <h3>Didn’t Get the OTP?<a @click="goToLogin">Login</a></h3> --> 105 <!-- <h3>Didn’t Get the OTP?<a @click="goToLogin">Login</a></h3> -->
106 </div> 106 </div>
107 </form> 107 </form>
108 </div> 108 </div>
109 </div> 109 </div>
110 <!-- sign up --> 110 <!-- sign up -->
111 </div> 111 </div>
112 </div> 112 </div>
113 <!-- body wrapper --> 113 <!-- body wrapper -->
114 </div> 114 </div>
115 </main> 115 </main>
116 </template> 116 </template>
117 117
118 <script> 118 <script>
119 import Vue from "vue"; 119 import Vue from "vue";
120 import router from "../router"; 120 import router from "../router";
121 import axios from "axios"; 121 import axios from "axios";
122 122
123 export default { 123 export default {
124 name: "ChangePassword", 124 name: "ChangePassword",
125 125
126 data() { 126 data() {
127 return { 127 return {
128 email:null, 128 email:null,
129 otp:null, 129 otp:null,
130 password:null, 130 password:null,
131 }; 131 };
132 }, 132 },
133 mounted() { 133 mounted() {
134 this.email = localStorage.getItem("spotlight_email"); 134 this.email = localStorage.getItem("spotlight_email");
135 console.log("this.$route.params.flag",this.$route.params.flag) 135 console.log("this.$route.params.flag",this.$route.params.flag)
136 if(this.$route.params.flag == true){ 136 if(this.$route.params.flag == true){
137 this.ResendEmail(false); 137 this.ResendEmail(false);
138 } 138 }
139 139
140 }, 140 },
141 methods: { 141 methods: {
142 goToLogin() { 142 goToLogin() {
143 this.$router.push("/"); 143 this.$router.push("/");
144 }, 144 },
145 changePassword(){ 145 changePassword(){
146 axios 146 axios
147 .post("/resetPassword", {'email':this.email,'otp':this.otp,'newPassword':this.password}) 147 .post("/resetPassword", {'email':this.email,'otp':this.otp,'newPassword':this.password})
148 .then((response) => { 148 .then((response) => {
149 console.log("resetPassword- response",response) 149 console.log("resetPassword- response",response)
150 this.$toaster.success(response.data.message) 150 this.$toaster.success(response.data.message)
151 if(response.data.status == "success"){ 151 if(response.data.status == "success"){
152 this.$router.push("/"); 152 this.$router.push("/");
153 } 153 }
154 }) 154 })
155 .catch( (error) =>{ 155 .catch( (error) =>{
156 if (error.response) { 156 if (error.response) {
157 this.$toaster.error(error.response.data.message) 157 this.$toaster.error(error.response.data.message)
158 } 158 }
159 }); 159 });
160 160
161 }, 161 },
162 ResendEmail(){ 162 ResendEmail(){
163 axios 163 axios
164 .post("/forgotPassword", {'email':this.email,'otp':true}) 164 .post("/forgotPassword", {'email':this.email,'otp':true})
165 .then((response) => { 165 .then((response) => {
166 console.log("forgotPassword- response",response) 166 console.log("forgotPassword- response",response)
167 this.$toaster.success(response.data.message) 167 this.$toaster.success(response.data.message)
168 }) 168 })
169 .catch( (error) =>{ 169 .catch( (error) =>{
170 if (error.response) { 170 if (error.response) {
171 this.$toaster.error(error.response.data.message) 171 this.$toaster.error(error.response.data.message)
172 } 172 }
173 }); 173 });
174 } 174 }
175 }, 175 },
176 }; 176 };
177 </script> 177 </script>
178 178
src/components/LandingPage.vue
Diff comments   View file @d974d32
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <div class="container-fluid main-wrp"> 3 <div class="container-fluid main-wrp">
4 <nav class="navbar navbar-expand-sm spotLight-nav"> 4 <nav class="navbar navbar-expand-sm spotLight-nav">
5 <a class="navbar-brand" href="#" 5 <a class="navbar-brand" href="#"
6 ><img src="../assets/images/logo.png" 6 ><img src="../assets/images/logo.png"
7 /></a> 7 /></a>
8 <button 8 <button
9 class="navbar-toggler" 9 class="navbar-toggler"
10 type="button" 10 type="button"
11 data-toggle="collapse" 11 data-toggle="collapse"
12 data-target="#navbarsExample03" 12 data-target="#navbarsExample03"
13 aria-controls="navbarsExample03" 13 aria-controls="navbarsExample03"
14 aria-expanded="false" 14 aria-expanded="false"
15 aria-label="Toggle navigation" 15 aria-label="Toggle navigation"
16 > 16 >
17 <span class="navbar-toggler-icon"></span> 17 <span class="navbar-toggler-icon"></span>
18 <span class="navbar-toggler-icon"></span> 18 <span class="navbar-toggler-icon"></span>
19 <span class="navbar-toggler-icon"></span> 19 <span class="navbar-toggler-icon"></span>
20 </button> 20 </button>
21 21
22 <div class="collapse navbar-collapse" id="navbarsExample03"> 22 <div class="collapse navbar-collapse" id="navbarsExample03">
23 <ul class="navbar-nav mr-auto"> 23 <ul class="navbar-nav mr-auto">
24 <li class="nav-item active"> 24 <li class="nav-item active">
25 <a class="nav-link" href="#">About</a> 25 <a class="nav-link" href="#">About</a>
26 </li> 26 </li>
27 <li class="nav-item"> 27 <li class="nav-item">
28 <a class="nav-link" href="#">Masterclass</a> 28 <a class="nav-link" href="#">Masterclass</a>
29 </li> 29 </li>
30 <li class="nav-item"> 30 <li class="nav-item">
31 <a class="nav-link" href="#">Stories</a> 31 <a class="nav-link" href="#">Stories</a>
32 </li> 32 </li>
33 <li class="nav-item spotLight-img"> 33 <li class="nav-item spotLight-img">
34 <a class="nav-link" href="#" 34 <a class="nav-link" href="#"
35 ><img src="../assets/images/SPOTLight.svg" 35 ><img src="../assets/images/SPOTLight.svg"
36 /></a> 36 /></a>
37 </li> 37 </li>
38 <li class="nav-item"> 38 <li class="nav-item">
39 <a class="nav-link" href="#">Library</a> 39 <a class="nav-link" href="#">Library</a>
40 </li> 40 </li>
41 </ul> 41 </ul>
42 </div> 42 </div>
43 </nav> 43 </nav>
44 <!-- menu wrapper --> 44 <!-- menu wrapper -->
45 <div class="sign-wrp"> 45 <div class="sign-wrp">
46 <div class="row col-reverse"> 46 <div class="row col-reverse">
47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div> 47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div>
48 <!-- users land image --> 48 <!-- users land image -->
49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp"> 49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp">
50 <h1 class="welcome-hd-back"> 50 <h1 class="welcome-hd-back">
51 Welcome <br /> 51 Welcome <br />
52 back 52 back
53 </h1> 53 </h1>
54 </div> 54 </div>
55 <!-- users land image --> 55 <!-- users land image -->
56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
57 <div class="form-layout signup-frm-spc"> 57 <div class="form-layout signup-frm-spc">
58 <form> 58 <form>
59 <h5>LogIn using</h5> 59 <h5>LogIn using</h5>
60 <div class="social-login"> 60 <div class="social-login">
61 <ul> 61 <ul>
62 <li> 62 <li>
63 <a @click="login"><img src="../assets/images/google.svg" /></a> 63 <a @click="login"><img src="../assets/images/google.svg" /></a>
64 </li> 64 </li>
65 <li> 65 <li>
66 <a href="#"><img src="../assets/images/linkdin.svg" /></a> 66 <a @click="login"><img src="../assets/images/linkdin.svg" /></a>
67 </li> 67 </li>
68 <li> 68 <li>
69 <a href="#"><img src="../assets/images/twitter.svg" /></a> 69 <a @click="login"><img src="../assets/images/twitter.svg" /></a>
70 </li> 70 </li>
71 </ul> 71 </ul>
72 </div> 72 </div>
73 <h5>or LogIn with email</h5> 73 <h5>or LogIn with email</h5>
74 <div class="fill-form"> 74 <div class="fill-form">
75 <label for="inputEmail" class="sr-only">Email address</label> 75 <label for="inputEmail" class="sr-only">Email address</label>
76 <input 76 <input
77 type="email" 77 type="email"
78 id="inputEmail" 78 id="inputEmail"
79 class="form-control" 79 class="form-control"
80 placeholder="Your Email ID" 80 placeholder="Your Email ID"
81 v-model="userData.email" 81 v-model="userData.email"
82 /> 82 />
83 <label for="inputPassword" class="sr-only">Password</label> 83 <label for="inputPassword" class="sr-only">Password</label>
84 <input 84 <input
85 type="password" 85 type="password"
86 id="inputPassword" 86 id="inputPassword"
87 class="form-control" 87 class="form-control"
88 placeholder="Password" 88 placeholder="Password"
89 v-model="userData.password" 89 v-model="userData.password"
90 /> 90 />
91 91
92 <a href="javascript:void(0);" class="btn btn-lg sb-button" type="submit" @click="loginWIthEmail"> 92 <a href="javascript:void(0);" class="btn btn-lg sb-button" type="submit" @click="loginWIthEmail">
93 <img src="../assets/images/key.svg" /> Log In to your account 93 <img src="../assets/images/key.svg" /> Log In to your account
94 </a> 94 </a>
95 <p class="forget-pass"> 95 <p class="forget-pass light-font-weight">
96 Forgot Password? <a @click="goToReset">Reset</a> 96 Forgot Password? <a @click="goToReset">Reset</a>
97 </p> 97 </p>
98 <h3>Don’t have an account? <a @click="goToSignUp">SignUp</a></h3> 98 <h3>Don’t have an account? <a @click="goToSignUp">SignUp</a></h3>
99 </div> 99 </div>
100 </form> 100 </form>
101 </div> 101 </div>
102 </div> 102 </div>
103 <!-- sign up --> 103 <!-- sign up -->
104 </div> </div> 104 </div> </div>
105 <!-- body wrapper --> 105 <!-- body wrapper -->
106 </div> 106 </div>
107 </main> 107 </main>
108 </template> 108 </template>
109 109
110 <script> 110 <script>
111 111
112 import Vue from "vue"; 112 import Vue from "vue";
113 import router from "../router"; 113 import router from "../router";
114 import $ from "jquery"; 114 import $ from "jquery";
115 import axios from "axios"; 115 import axios from "axios";
116 116
117 export default { 117 export default {
118 name: "LandingPage", 118 name: "LandingPage",
119 119
120 data() { 120 data() {
121 return { 121 return {
122 loggedinFlag: false, 122 loggedinFlag: false,
123 userData:{}, 123 userData:{},
124 }; 124 };
125 }, 125 },
126 mounted() { 126 mounted() {
127 this.$auth.logout(); 127 this.$auth.logout();
128 localStorage.removeItem("spotlight_usertoken"); 128 localStorage.removeItem("spotlight_usertoken");
129 localStorage.removeItem("spotlight_email"); 129 localStorage.removeItem("spotlight_email");
130 }, 130 },
131 methods: { 131 methods: {
132 login() { 132 login() {
133 this.$auth.loginWithRedirect(); 133 this.$auth.loginWithRedirect();
134 }, 134 },
135 goToSignUp(){ 135 goToSignUp(){
136 this.$router.push("/signup"); 136 this.$router.push("/signup");
137 }, 137 },
138 goToReset() { 138 goToReset() {
139 this.$router.push("/reset"); 139 this.$router.push("/reset");
140 }, 140 },
141 loginWIthEmail(){ 141 loginWIthEmail(){
142 axios 142 axios
143 .post("/login", this.userData) 143 .post("/login", this.userData)
144 .then((response) => { 144 .then((response) => {
145 console.log("login- response",response) 145 console.log("login- response",response)
146 this.$toaster.success(response.data.message) 146 this.$toaster.success(response.data.message)
147 if(response.data.status == 'success'){ 147 if(response.data.status == 'success'){
148 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data)) 148 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data))
149 this.$router.push("/profile"); 149 this.$router.push("/profile");
150 } 150 }
151 }) 151 })
152 .catch( (error) =>{ 152 .catch( (error) =>{
153 if (error.response) { 153 if (error.response) {
154 this.$toaster.error(error.response.data.message) 154 this.$toaster.error(error.response.data.message)
155 if(error.response.data.message == 'Email Not Verified'){ 155 if(error.response.data.message == 'Email Not Verified'){
156 localStorage.setItem('spotlight_email', this.userData.email); 156 localStorage.setItem('spotlight_email', this.userData.email);
157 this.$router.push({ name: 'Otp', params: { flag: true }}); 157 this.$router.push({ name: 'Otp', params: { flag: true }});
158 } 158 }
159 } 159 }
160 }); 160 });
161 } 161 }
162 }, 162 },
163 }; 163 };
164 </script> 164 </script>
165 <style>
166 .light-font-weight {
167 font-weight: 400 !important;
168 }
169
170
171 </style>
165 172
src/components/Otp.vue
Diff comments   View file @d974d32
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <div class="container-fluid main-wrp"> 3 <div class="container-fluid main-wrp">
4 <nav class="navbar navbar-expand-sm spotLight-nav"> 4 <nav class="navbar navbar-expand-sm spotLight-nav">
5 <a class="navbar-brand" href="#" 5 <a class="navbar-brand" href="#"
6 ><img src="../assets/images/logo.png" 6 ><img src="../assets/images/logo.png"
7 /></a> 7 /></a>
8 <button 8 <button
9 class="navbar-toggler" 9 class="navbar-toggler"
10 type="button" 10 type="button"
11 data-toggle="collapse" 11 data-toggle="collapse"
12 data-target="#navbarsExample03" 12 data-target="#navbarsExample03"
13 aria-controls="navbarsExample03" 13 aria-controls="navbarsExample03"
14 aria-expanded="false" 14 aria-expanded="false"
15 aria-label="Toggle navigation" 15 aria-label="Toggle navigation"
16 > 16 >
17 <span class="navbar-toggler-icon"></span> 17 <span class="navbar-toggler-icon"></span>
18 <span class="navbar-toggler-icon"></span> 18 <span class="navbar-toggler-icon"></span>
19 <span class="navbar-toggler-icon"></span> 19 <span class="navbar-toggler-icon"></span>
20 </button> 20 </button>
21 21
22 <div class="collapse navbar-collapse" id="navbarsExample03"> 22 <div class="collapse navbar-collapse" id="navbarsExample03">
23 <ul class="navbar-nav mr-auto"> 23 <ul class="navbar-nav mr-auto">
24 <li class="nav-item active"> 24 <li class="nav-item active">
25 <a class="nav-link" href="#">About</a> 25 <a class="nav-link" href="#">About</a>
26 </li> 26 </li>
27 <li class="nav-item"> 27 <li class="nav-item">
28 <a class="nav-link" href="#">Masterclass</a> 28 <a class="nav-link" href="#">Masterclass</a>
29 </li> 29 </li>
30 <li class="nav-item"> 30 <li class="nav-item">
31 <a class="nav-link" href="#">Stories</a> 31 <a class="nav-link" href="#">Stories</a>
32 </li> 32 </li>
33 <li class="nav-item spotLight-img"> 33 <li class="nav-item spotLight-img">
34 <a class="nav-link" href="#" 34 <a class="nav-link" href="#"
35 ><img src="../assets/images/SPOTLight.svg" 35 ><img src="../assets/images/SPOTLight.svg"
36 /></a> 36 /></a>
37 </li> 37 </li>
38 <li class="nav-item"> 38 <li class="nav-item">
39 <a class="nav-link" href="#">Library</a> 39 <a class="nav-link" href="#">Library</a>
40 </li> 40 </li>
41 </ul> 41 </ul>
42 </div> 42 </div>
43 </nav> 43 </nav>
44 <!-- menu wrapper --> 44 <!-- menu wrapper -->
45 <div class="sign-wrp"> 45 <div class="sign-wrp">
46 <div class="row col-reverse"> 46 <div class="row col-reverse">
47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div> 47 <div class="col-sm-3 col-md-1 col-lg-1 col-xl-3"></div>
48 <!-- users land image --> 48 <!-- users land image -->
49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp"> 49 <div class="col-sm-5 col-md-6 col-lg-7 col-xl-4 wc-spc-lf-tp">
50 <h1 class="welcome-hd-back"> 50 <h1 class="welcome-hd-back">
51 Welcome <br /> 51 Welcome <br />
52 back 52 back
53 </h1> 53 </h1>
54 </div> 54 </div>
55 <!-- users land image --> 55 <!-- users land image -->
56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 56 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
57 <div class="form-layout signup-frm-spc"> 57 <div class="form-layout signup-frm-spc">
58 <form> 58 <form>
59 <!-- <h5>SignUp Using</h5> --> 59 <!-- <h5>SignUp Using</h5> -->
60 <div class="social-login" style="visibility: hidden"> 60 <div class="social-login" style="visibility: hidden">
61 <ul> 61 <ul>
62 <li> 62 <li>
63 <a href="#"><img src="../assets/images/google.svg" /></a> 63 <a href="#"><img src="../assets/images/google.svg" /></a>
64 </li> 64 </li>
65 <li> 65 <li>
66 <a href="#"><img src="../assets/images/linkdin.svg" /></a> 66 <a href="#"><img src="../assets/images/linkdin.svg" /></a>
67 </li> 67 </li>
68 <li> 68 <li>
69 <a href="#"><img src="../assets/images/twitter.svg" /></a> 69 <a href="#"><img src="../assets/images/twitter.svg" /></a>
70 </li> 70 </li>
71 </ul> 71 </ul>
72 </div> 72 </div>
73 <h5> 73 <h5>
74 Please enter the OTP shared to {{email}} to confirm 74 Please enter the OTP shared to {{email}} to confirm
75 your email address 75 your email address
76 </h5> 76 </h5>
77 <div class="fill-form"> 77 <div class="fill-form">
78 <label for="inputEmail" class="sr-only">OTP</label> 78 <label for="inputEmail" class="sr-only">OTP</label>
79 <input 79 <input
80 type="text" 80 type="text"
81 id="inputEmail" 81 id="inputEmail"
82 class="form-control" 82 class="form-control"
83 placeholder="Your OTP" 83 placeholder="Your OTP"
84 v-model="otp" 84 v-model="otp"
85 85
86 /> 86 />
87 <!-- <label for="inputPassword" class="sr-only">Password</label> 87 <!-- <label for="inputPassword" class="sr-only">Password</label>
88 <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> --> 88 <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> -->
89 89
90 <a href="javascript:void(0);" class="btn btn-lg sb-button" @click="verifyOtp"> 90 <a href="javascript:void(0);" class="btn btn-lg sb-button" @click="verifyOtp">
91 <img src="../assets/images/user-plus.svg" /> Verify Email 91 <img src="../assets/images/check-circle.png" /> Verify Email
92 Address 92 Address
93 </a> 93 </a>
94 <p class="forget-pass">Didn’t Get the OTP? <a @click="ResendEmail(true)">Resend</a></p> 94 <p class="forget-pass">Didn’t Get the OTP? <a @click="ResendEmail(true)">Resend</a></p>
95 <!-- <h3>Didn’t Get the OTP?<a @click="goToLogin">Login</a></h3> --> 95 <!-- <h3>Didn’t Get the OTP?<a @click="goToLogin">Login</a></h3> -->
96 </div> 96 </div>
97 </form> 97 </form>
98 </div> 98 </div>
99 </div> 99 </div>
100 <!-- sign up --> 100 <!-- sign up -->
101 </div> 101 </div>
102 </div> 102 </div>
103 <!-- body wrapper --> 103 <!-- body wrapper -->
104 </div> 104 </div>
105 </main> 105 </main>
106 </template> 106 </template>
107 107
108 <script> 108 <script>
109 import Vue from "vue"; 109 import Vue from "vue";
110 import router from "../router"; 110 import router from "../router";
111 import axios from "axios"; 111 import axios from "axios";
112 112
113 export default { 113 export default {
114 name: "Otp", 114 name: "Otp",
115 115
116 data() { 116 data() {
117 return { 117 return {
118 email:null, 118 email:null,
119 otp:null, 119 otp:null,
120 }; 120 };
121 }, 121 },
122 mounted() { 122 mounted() {
123 this.email = localStorage.getItem("spotlight_email"); 123 this.email = localStorage.getItem("spotlight_email");
124 console.log("this.$route.params.flag",this.$route.params.flag) 124 console.log("this.$route.params.flag",this.$route.params.flag)
125 if(this.$route.params.flag == true){ 125 if(this.$route.params.flag == true){
126 this.ResendEmail(false); 126 this.ResendEmail(false);
127 } 127 }
128 128
129 }, 129 },
130 methods: { 130 methods: {
131 goToLogin() { 131 goToLogin() {
132 this.$router.push("/"); 132 this.$router.push("/");
133 }, 133 },
134 verifyOtp(){ 134 verifyOtp(){
135 axios 135 axios
136 .get(`/verifyEmail?email=${this.email}&otp=${this.otp}`, this.userData) 136 .get(`/verifyEmail?email=${this.email}&otp=${this.otp}`, this.userData)
137 .then((response) => { 137 .then((response) => {
138 console.log("otp response",response); 138 console.log("otp response",response);
139 this.$toaster.success(response.data.message) 139 this.$toaster.success(response.data.message)
140 if(response.data.status == 'success'){ 140 if(response.data.status == 'success'){
141 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data)) 141 localStorage.setItem('spotlight_usertoken', JSON.stringify(response.data.data))
142 this.$router.push("/profile"); 142 this.$router.push("/profile");
143 } 143 }
144 }) 144 })
145 .catch( (error) =>{ 145 .catch( (error) =>{
146 if (error.response) { 146 if (error.response) {
147 this.$toaster.error(error.response.data.message) 147 this.$toaster.error(error.response.data.message)
148 } 148 }
149 }); 149 });
150 150
151 }, 151 },
152 ResendEmail(req){ 152 ResendEmail(req){
153 axios 153 axios
154 .post("/forgotPassword", {'email':this.email,'forgotPassword':false}) 154 .post("/forgotPassword", {'email':this.email,'forgotPassword':false})
155 .then((response) => { 155 .then((response) => {
156 console.log("forgotPassword- response",response) 156 console.log("forgotPassword- response",response)
157 if(req){ 157 if(req){
158 this.$toaster.success(response.data.message) 158 this.$toaster.success(response.data.message)
159 } 159 }
160 }) 160 })
161 .catch( (error) =>{ 161 .catch( (error) =>{
162 if (error.response) { 162 if (error.response) {
163 this.$toaster.error(error.response.data.message) 163 this.$toaster.error(error.response.data.message)
164 } 164 }
165 }); 165 });
166 } 166 }
167 }, 167 },
168 }; 168 };
169 </script> 169 </script>
170 170