viithiisys / spotlight-frontend

Download as
Browse Code ยป

Commit 7b1cf58ce7e17672a878ec68a9abc4a48ad01410

Authored by Digvijay Singh
1 parent 4490fe7f65
Exists in admin

insight url

Showing 1 changed file with 19 additions and 4 deletions   Show diff stats
src/components/Insight.vue
Diff comments   View file @7b1cf58
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <!-- profile --> 3 <!-- profile -->
4 <div class="container-fluid inner-wrp" style="background: transparent"> 4 <div class="container-fluid inner-wrp" style="background: transparent">
5 <nav class="navbar navbar-expand-sm spotLight-nav"> 5 <nav class="navbar navbar-expand-sm spotLight-nav">
6 <a class="navbar-brand" href="#" 6 <a class="navbar-brand" href="#"
7 ><img src="../assets/images/logo.png" 7 ><img src="../assets/images/logo.png"
8 /></a> 8 /></a>
9 <button 9 <button
10 class="navbar-toggler" 10 class="navbar-toggler"
11 type="button" 11 type="button"
12 data-toggle="collapse" 12 data-toggle="collapse"
13 data-target="#navbarsExample03" 13 data-target="#navbarsExample03"
14 aria-controls="navbarsExample03" 14 aria-controls="navbarsExample03"
15 aria-expanded="false" 15 aria-expanded="false"
16 aria-label="Toggle navigation" 16 aria-label="Toggle navigation"
17 > 17 >
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 <span class="navbar-toggler-icon"></span> 20 <span class="navbar-toggler-icon"></span>
21 </button> 21 </button>
22 22
23 <div class="collapse navbar-collapse" id="navbarsExample03"> 23 <div class="collapse navbar-collapse" id="navbarsExample03">
24 <ul class="navbar-nav mr-auto"> 24 <ul class="navbar-nav mr-auto">
25 <li class="nav-item active"> 25 <li class="nav-item active">
26 <a 26 <a
27 class="nav-link" 27 class="nav-link"
28 @click="create('/profile')" 28 @click="create('/profile')"
29 style="cursor: pointer" 29 style="cursor: pointer"
30 >Create Case Study</a 30 >Create Case Study</a
31 > 31 >
32 </li> 32 </li>
33 <li class="nav-item active"> 33 <li class="nav-item active">
34 <a 34 <a
35 class="nav-link" 35 class="nav-link"
36 @click="create('/casestudy')" 36 @click="create('/casestudy')"
37 style="cursor: pointer" 37 style="cursor: pointer"
38 >Case Study List</a 38 >Case Study List</a
39 > 39 >
40 </li> 40 </li>
41 </ul> 41 </ul>
42 </div> 42 </div>
43 <div class=""> 43 <div class="">
44 <a href="javascript:void(0);" @click="logout">Log Out </a> 44 <a href="javascript:void(0);" @click="logout">Log Out </a>
45 </div> 45 </div>
46 </nav> 46 </nav>
47 <!-- menu wrapper --> 47 <!-- menu wrapper -->
48 <!-- <div class="row profile-tab-spc-top"> 48 <!-- <div class="row profile-tab-spc-top">
49 <div class="col-sm-3 col-md-3 col-lg-3 col-xl-3"> 49 <div class="col-sm-3 col-md-3 col-lg-3 col-xl-3">
50 <div class="user-profile"> 50 <div class="user-profile">
51 <div class="form-group floating-label"> 51 <div class="form-group floating-label">
52 <select 52 <select
53 class="form-control" 53 class="form-control"
54 v-model="userData" 54 v-model="userData"
55 v-on:change="selectUser(userData)" 55 v-on:change="selectUser(userData)"
56 > 56 >
57 <option value="null">Select User</option> 57 <option value="null">Select User</option>
58 <option v-for="(user, i) in userList" :key="i" :value="i"> 58 <option v-for="(user, i) in userList" :key="i" :value="i">
59 {{ user.name }} ({{ user.email }}) 59 {{ user.name }} ({{ user.email }})
60 </option> 60 </option>
61 </select> 61 </select>
62 </div> 62 </div>
63 </div> 63 </div>
64 </div> 64 </div>
65 </div> --> 65 </div> -->
66 66
67 <!-- 1st row --> 67 <!-- 1st row -->
68 <div class="row"> 68 <div class="row">
69 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 69 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
70 <div class="form-group floating-label"> 70 <div class="form-group floating-label">
71 <label for="lname" class="lname">Case Study Type</label> 71 <label for="lname" class="lname">Case Study Type</label>
72 <select 72 <select
73 class="form-control" 73 class="form-control"
74 v-model="userData.tag" 74 v-model="userData.tag"
75 > 75 >
76 <option value="null">Select Case Type</option> 76 <option value="null">Select Case Type</option>
77 <option value="Retake">Retake</option> 77 <option value="Design">Design</option>
78 <option value="Behind-the-scenes">Behind-the-scenes</option> 78 <option value="Product">Product</option>
79 <option value="Critique">Critique</option> 79 <option value="Marketing">Marketing</option>
80 <option value="Juxtapose">Juxtapose</option> 80 <option value="Pricing">Pricing</option>
81 <option value="Psychology">Psychology</option>
81 </select> 82 </select>
82 </div> 83 </div>
83 </div> 84 </div>
84 <div class="col-sm-6 col-md-6 col-lg-6 col-xl-6"> 85 <div class="col-sm-6 col-md-6 col-lg-6 col-xl-6">
85 <div class="form-group floating-label"> 86 <div class="form-group floating-label">
86 <label for="lname" class="lname">Title</label> 87 <label for="lname" class="lname">Title</label>
87 <input 88 <input
88 type="text" 89 type="text"
89 class="form-control" 90 class="form-control"
90 value="" 91 value=""
91 placeholder=" " 92 placeholder=" "
92 v-model="userData.title" 93 v-model="userData.title"
93 /> 94 />
94 </div> 95 </div>
95 </div> 96 </div>
96 97
97 98
98 </div> 99 </div>
99 <!-- 1st row --> 100 <!-- 1st row -->
100 <!-- 2nd row --> 101 <!-- 2nd row -->
101 <div class="row"> 102 <div class="row">
102 <div class="col-sm-8 col-md-8 col-lg-8 col-xl-8"> 103 <div class="col-sm-8 col-md-8 col-lg-8 col-xl-8">
103 <div class="form-group floating-label"> 104 <div class="form-group floating-label">
104 <label for="lname" class="lname">Description</label> 105 <label for="lname" class="lname">Description</label>
105 <input 106 <input
106 type="text" 107 type="text"
107 class="form-control" 108 class="form-control"
108 value="" 109 value=""
109 placeholder=" " 110 placeholder=" "
110 v-model="userData.description" 111 v-model="userData.description"
111 /> 112 />
112 </div> 113 </div>
113 </div> 114 </div>
114 115
116
117 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
118 <div class="form-group floating-label">
119 <label for="lname" class="lname">Reading Url</label>
120 <input
121 type="text"
122 class="form-control"
123 value=""
124 placeholder=" "
125 v-model="userData.furtherReading[0]"
126 />
127 </div>
128 </div>
129
115 130
116 </div> 131 </div>
117 <!-- 2nd row --> 132 <!-- 2nd row -->
118 <!-- 3rd row --> 133 <!-- 3rd row -->
119 <div class="row"> 134 <div class="row">
120 <div class="form-layout signup-frm-spc" style="margin-top:10px"> 135 <div class="form-layout signup-frm-spc" style="margin-top:10px">
121 <form> 136 <form>
122 <a 137 <a
123 href="javascript:void(0);" 138 href="javascript:void(0);"
124 class="btn btn-lg sb-button" 139 class="btn btn-lg sb-button"
125 type="submit" 140 type="submit"
126 @click="submit" 141 @click="submit"
127 > 142 >
128 <img src="../assets/images/key.svg" /> submit 143 <img src="../assets/images/key.svg" /> submit
129 </a> 144 </a>
130 </form> 145 </form>
131 </div> 146 </div>
132 147
133 148
134 </div> 149 </div>
135 <!-- 3rd row --> 150 <!-- 3rd row -->
136 151
137 <div class="row"> 152 <div class="row">
138 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 153 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
139 <ul class="navbar-nav mr-auto"> 154 <ul class="navbar-nav mr-auto">
140 <li class="nav-item active"> 155 <li class="nav-item active">
141 <h5 class="nav-link"> 156 <h5 class="nav-link">
142 <span style="cursor: pointer">Insight List</span> 157 <span style="cursor: pointer">Insight List</span>
143 </h5> 158 </h5>
144 </li> 159 </li>
145 </ul> 160 </ul>
146 </div> 161 </div>
147 </div> 162 </div>
148 <div class="row"> 163 <div class="row">
149 <table> 164 <table>
150 <tr> 165 <tr>
151 <th>Id</th> 166 <th>Id</th>
152 <th>Tag</th> 167 <th>Tag</th>
153 <th>Title</th> 168 <th>Title</th>
154 <th>Action</th> 169 <th>Action</th>
155 </tr> 170 </tr>
156 <tr v-for="(insight, j) in insightList" :key="j"> 171 <tr v-for="(insight, j) in insightList" :key="j">
157 <td>{{ insight._id }}</td> 172 <td>{{ insight._id }}</td>
158 <td>{{ insight.tag }}</td> 173 <td>{{ insight.tag }}</td>
159 <td>{{ insight.title }}</td> 174 <td>{{ insight.title }}</td>
160 <td><a style="cursor: pointer">Delete</a></td> 175 <td><a style="cursor: pointer">Delete</a></td>
161 </tr> 176 </tr>
162 </table> 177 </table>
163 </div> 178 </div>
164 <!-- 1st row --> 179 <!-- 1st row -->
165 </div> 180 </div>
166 </main> 181 </main>
167 </template> 182 </template>
168 183
169 <script> 184 <script>
170 import Vue from "vue"; 185 import Vue from "vue";
171 import router from "../router"; 186 import router from "../router";
172 import $ from "jquery"; 187 import $ from "jquery";
173 import axios from "axios"; 188 import axios from "axios";
174 189
175 export default { 190 export default {
176 name: "Insight", 191 name: "Insight",
177 192
178 data() { 193 data() {
179 return { 194 return {
180 loggedinFlag: false, 195 loggedinFlag: false,
181 usertoken: null, 196 usertoken: null,
182 userData: { 197 userData: {
183 tag: null, 198 tag: null,
184 title: null, 199 title: null,
185 description: 200 description:
186 null, 201 null,
187 furtherReading: [], 202 furtherReading: [],
188 }, 203 },
189 insightList: [], 204 insightList: [],
190 }; 205 };
191 }, 206 },
192 mounted() { 207 mounted() {
193 var userdata = localStorage.getItem("spotlight_usertoken"); 208 var userdata = localStorage.getItem("spotlight_usertoken");
194 if (userdata) { 209 if (userdata) {
195 userdata = JSON.parse(userdata); 210 userdata = JSON.parse(userdata);
196 this.usertoken = userdata.token; 211 this.usertoken = userdata.token;
197 this.getInsight(); 212 this.getInsight();
198 } 213 }
199 }, 214 },
200 methods: { 215 methods: {
201 getInsight() { 216 getInsight() {
202 axios 217 axios
203 .get("/superAdmin/insight", { 218 .get("/superAdmin/insight", {
204 headers: { 219 headers: {
205 Authorization: "Bearer " + this.usertoken, 220 Authorization: "Bearer " + this.usertoken,
206 }, 221 },
207 }) 222 })
208 .then((response) => { 223 .then((response) => {
209 this.insightList = response.data.data; 224 this.insightList = response.data.data;
210 console.log("response", response.data.data); 225 console.log("response", response.data.data);
211 }) 226 })
212 .catch((error) => console.log(error)); 227 .catch((error) => console.log(error));
213 }, 228 },
214 submit() { 229 submit() {
215 axios 230 axios
216 .post("/superAdmin/insight", this.userData, { 231 .post("/superAdmin/insight", this.userData, {
217 headers: { 232 headers: {
218 Authorization: "Bearer " + this.usertoken, 233 Authorization: "Bearer " + this.usertoken,
219 }, 234 },
220 }) 235 })
221 .then((response) => { 236 .then((response) => {
222 // this.userData = response.data.data; 237 // this.userData = response.data.data;
223 this.$toaster.success("Insight Created"); 238 this.$toaster.success("Insight Created");
224 this.$router.go(this.$router.currentRoute) 239 this.$router.go(this.$router.currentRoute)
225 240
226 console.log(response); 241 console.log(response);
227 }) 242 })
228 .catch((error) => { 243 .catch((error) => {
229 if (error.response) { 244 if (error.response) {
230 this.$toaster.error(error.response.data.message); 245 this.$toaster.error(error.response.data.message);
231 } 246 }
232 }); 247 });
233 }, 248 },
234 create(url) { 249 create(url) {
235 this.$router.push(url); 250 this.$router.push(url);
236 }, 251 },
237 logout() { 252 logout() {
238 this.$router.push("/"); 253 this.$router.push("/");
239 }, 254 },
240 }, 255 },
241 }; 256 };
242 </script> 257 </script>
243 <style> 258 <style>
244 .light-font-weight { 259 .light-font-weight {
245 font-weight: 300 !important; 260 font-weight: 300 !important;
246 } 261 }
247 262
248 table { 263 table {
249 font-family: arial, sans-serif; 264 font-family: arial, sans-serif;
250 border-collapse: collapse; 265 border-collapse: collapse;
251 width: 100%; 266 width: 100%;
252 } 267 }
253 268
254 td, 269 td,
255 th { 270 th {
256 border: 1px solid #000; 271 border: 1px solid #000;
257 text-align: left; 272 text-align: left;
258 padding: 8px; 273 padding: 8px;
259 } 274 }
260 275
261 tr:nth-child(even) { 276 tr:nth-child(even) {
262 background-color: #dddddd; 277 background-color: #dddddd;
263 } 278 }
264 </style> 279 </style>
265 280