viithiisys / spotlight-frontend

Download as
Browse Code ยป

Commit 08becbb241a0a965d86ca90b07577b52ddde5108

Authored by Digvijay Singh
1 parent 522f093f06
Exists in admin

new fiwld added

Showing 1 changed file with 5 additions and 4 deletions   Show diff stats
src/components/Profile.vue
Diff comments   View file @08becbb
1 <template> 1 <template>
2 <main class="landing-page"> 2 <main class="landing-page">
3 <!-- profile --> 3 <!-- profile -->
4 <div class="popup-wrp" style="display: none"> 4 <div class="popup-wrp" style="display: none">
5 <div class="overlay" @click="hideDialog"></div> 5 <div class="overlay" @click="hideDialog"></div>
6 <div 6 <div
7 class="popup-set" 7 class="popup-set"
8 id="add-profile" 8 id="add-profile"
9 style="display: none; width: 700px" 9 style="display: none; width: 700px"
10 > 10 >
11 <!-- header --> 11 <!-- header -->
12 <div class="popup-body"> 12 <div class="popup-body">
13 <form class="popup-forms"> 13 <form class="popup-forms">
14 <div class="row"> 14 <div class="row">
15 <!-- input --> 15 <!-- input -->
16 <img :src="templateImage" /> 16 <img :src="templateImage" />
17 <!-- input --> 17 <!-- input -->
18 18
19 <!-- input --> 19 <!-- input -->
20 20
21 <!-- input --> 21 <!-- input -->
22 <!-- <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 22 <!-- <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
23 <div class="form-group floating-label"> 23 <div class="form-group floating-label">
24 <select class="form-group"> 24 <select class="form-group">
25 <option @click="addSocialLink">Add another</option> 25 <option @click="addSocialLink">Add another</option>
26 </select> 26 </select>
27 <span class="select-arrow" 27 <span class="select-arrow"
28 ><img src="../assets/images/chevron-down.svg" 28 ><img src="../assets/images/chevron-down.svg"
29 /></span> 29 /></span>
30 </div> 30 </div>
31 </div> --> 31 </div> -->
32 <!-- input --> 32 <!-- input -->
33 </div> 33 </div>
34 </form> 34 </form>
35 </div> 35 </div>
36 <div class="clearfix"></div> 36 <div class="clearfix"></div>
37 </div> 37 </div>
38 <!-- add profile --> 38 <!-- add profile -->
39 </div> 39 </div>
40 <!-- profile --> 40 <!-- profile -->
41 <!-- profile --> 41 <!-- profile -->
42 <div class="container-fluid inner-wrp" style="background: transparent"> 42 <div class="container-fluid inner-wrp" style="background: transparent">
43 <nav class="navbar navbar-expand-sm spotLight-nav"> 43 <nav class="navbar navbar-expand-sm spotLight-nav">
44 <a class="navbar-brand" href="#" 44 <a class="navbar-brand" href="#"
45 ><img src="../assets/images/logo.png" 45 ><img src="../assets/images/logo.png"
46 /></a> 46 /></a>
47 <button 47 <button
48 class="navbar-toggler" 48 class="navbar-toggler"
49 type="button" 49 type="button"
50 data-toggle="collapse" 50 data-toggle="collapse"
51 data-target="#navbarsExample03" 51 data-target="#navbarsExample03"
52 aria-controls="navbarsExample03" 52 aria-controls="navbarsExample03"
53 aria-expanded="false" 53 aria-expanded="false"
54 aria-label="Toggle navigation" 54 aria-label="Toggle navigation"
55 > 55 >
56 <span class="navbar-toggler-icon"></span> 56 <span class="navbar-toggler-icon"></span>
57 <span class="navbar-toggler-icon"></span> 57 <span class="navbar-toggler-icon"></span>
58 <span class="navbar-toggler-icon"></span> 58 <span class="navbar-toggler-icon"></span>
59 </button> 59 </button>
60 60
61 <div class="collapse navbar-collapse" id="navbarsExample03"> 61 <div class="collapse navbar-collapse" id="navbarsExample03">
62 <ul class="navbar-nav mr-auto"> 62 <ul class="navbar-nav mr-auto">
63 <li class="nav-item active"> 63 <li class="nav-item active">
64 <a 64 <a
65 class="nav-link" 65 class="nav-link"
66 style="cursor: pointer" 66 style="cursor: pointer"
67 @click="listPage('/casestudy')" 67 @click="listPage('/casestudy')"
68 >Case Study List</a 68 >Case Study List</a
69 > 69 >
70 </li> 70 </li>
71 <li class="nav-item active"> 71 <li class="nav-item active">
72 <a 72 <a
73 class="nav-link" 73 class="nav-link"
74 style="cursor: pointer" 74 style="cursor: pointer"
75 @click="listPage('/insight')" 75 @click="listPage('/insight')"
76 >Create Insight</a 76 >Create Insight</a
77 > 77 >
78 </li> 78 </li>
79 </ul> 79 </ul>
80 </div> 80 </div>
81 <div class=""> 81 <div class="">
82 <a href="javascript:void(0);" @click="logout">Log Out </a> 82 <a href="javascript:void(0);" @click="logout">Log Out </a>
83 </div> 83 </div>
84 </nav> 84 </nav>
85 <!-- menu wrapper --> 85 <!-- menu wrapper -->
86 <div class="row profile-tab-spc-top"> 86 <div class="row profile-tab-spc-top">
87 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 87 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
88 <div class="user-profile"> 88 <div class="user-profile">
89 <div class="form-group floating-label"> 89 <div class="form-group floating-label">
90 <select 90 <select
91 class="form-control" 91 class="form-control"
92 v-model="userData" 92 v-model="userData"
93 v-on:change="selectUser(userData)" 93 v-on:change="selectUser(userData)"
94 :disabled="editMode" 94 :disabled="editMode"
95 > 95 >
96 <option value="null">Select User</option> 96 <option value="null">Select User</option>
97 <option v-for="(user, i) in userList" :key="i" :value="i"> 97 <option v-for="(user, i) in userList" :key="i" :value="i">
98 {{ user.name }} ({{ user.email }}) 98 {{ user.name }} ({{ user.email }})
99 </option> 99 </option>
100 </select> 100 </select>
101 </div> 101 </div>
102 </div> 102 </div>
103 </div> 103 </div>
104 </div> 104 </div>
105 105
106 <div class="row"> 106 <div class="row">
107 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 107 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
108 <ul class="navbar-nav mr-auto"> 108 <ul class="navbar-nav mr-auto">
109 <li class="nav-item active"> 109 <li class="nav-item active">
110 <h5 class="nav-link">Intro Screen Record</h5> 110 <h5 class="nav-link">Intro Screen Record</h5>
111 </li> 111 </li>
112 </ul> 112 </ul>
113 </div> 113 </div>
114 </div> 114 </div>
115 115
116 <div class="row"> 116 <div class="row">
117 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 117 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
118 <div class="form-group floating-label"> 118 <div class="form-group floating-label">
119 <label for="lname" class="lname">Select Intro Screen</label> 119 <label for="lname" class="lname">Select Intro Screen</label>
120 <select 120 <select
121 class="form-control" 121 class="form-control"
122 v-model="caseStudy.caseStudyDetails.intro.templateId" 122 v-model="caseStudy.caseStudyDetails.intro.templateId"
123 @change="changeIntroScreen()" 123 @change="changeIntroScreen()"
124 > 124 >
125 <option value="intro-1">Intro Screen 1</option> 125 <option value="intro-1">Intro Screen 1</option>
126 <option value="intro-2">Intro Screen 2</option> 126 <option value="intro-2">Intro Screen 2</option>
127 </select> 127 </select>
128 </div> 128 </div>
129 </div> 129 </div>
130 </div> 130 </div>
131 <!-- 1st row --> 131 <!-- 1st row -->
132 <div class="row"> 132 <div class="row">
133 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 133 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
134 <div class="form-group floating-label"> 134 <div class="form-group floating-label">
135 <label for="lname" class="lname">Case Study Name</label> 135 <label for="lname" class="lname">Case Study Name</label>
136 <input 136 <input
137 type="text" 137 type="text"
138 class="form-control" 138 class="form-control"
139 value="" 139 value=""
140 placeholder=" " 140 placeholder=" "
141 v-model="caseStudy.caseStudyDetails.intro.name" 141 v-model="caseStudy.caseStudyDetails.intro.name"
142 /> 142 />
143 </div> 143 </div>
144 </div> 144 </div>
145 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 145 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
146 <div class="form-group floating-label"> 146 <div class="form-group floating-label">
147 <label for="lname" class="lname">App Name</label> 147 <label for="lname" class="lname">App Name</label>
148 <input 148 <input
149 type="text" 149 type="text"
150 class="form-control" 150 class="form-control"
151 value="" 151 value=""
152 placeholder=" " 152 placeholder=" "
153 v-model="caseStudy.caseStudyDetails.intro.app" 153 v-model="caseStudy.caseStudyDetails.intro.app"
154 /> 154 />
155 </div> 155 </div>
156 </div> 156 </div>
157 <!-- <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 157 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4" v-if="caseStudy.caseStudyDetails.intro.templateId == 'intro-2'">
158 <div class="form-group floating-label"> 158 <div class="form-group floating-label">
159 <label for="lname" class="lname">Focus</label> 159 <label for="lname" class="lname">Designation</label>
160 <input 160 <input
161 type="text" 161 type="text"
162 class="form-control" 162 class="form-control"
163 value="" 163 value=""
164 placeholder=" " 164 placeholder=" "
165 v-model="caseStudy.caseStudyDetails.intro.focus" 165 v-model="caseStudy.caseStudyDetails.intro.designation"
166 /> 166 />
167 </div> 167 </div>
168 </div> --> 168 </div>
169 169
170 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 170 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
171 <div class="form-group floating-label"> 171 <div class="form-group floating-label">
172 <label for="lname" class="lname"> App logo</label> 172 <label for="lname" class="lname"> App logo</label>
173 <img 173 <img
174 v-if="caseStudy.caseStudyDetails.intro.logoURL" 174 v-if="caseStudy.caseStudyDetails.intro.logoURL"
175 style="width: 40px; height: 40px" 175 style="width: 40px; height: 40px"
176 :src="caseStudy.caseStudyDetails.intro.logoURL" 176 :src="caseStudy.caseStudyDetails.intro.logoURL"
177 /> 177 />
178 <input 178 <input
179 @change="createImage('logo')" 179 @change="createImage('logo')"
180 type="file" 180 type="file"
181 name="photso" 181 name="photso"
182 id="logo" 182 id="logo"
183 accept="image/*" 183 accept="image/*"
184 /> 184 />
185 </div> 185 </div>
186 </div> 186 </div>
187 </div> 187 </div>
188 <!-- 1st row end --> 188 <!-- 1st row end -->
189 189
190 <!-- 2nd row --> 190 <!-- 2nd row -->
191 <div class="row"> 191 <div class="row">
192 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 192 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
193 <div class="form-group floating-label"> 193 <div class="form-group floating-label">
194 <label for="lname" class="lname">Case Study Type</label> 194 <label for="lname" class="lname">Case Study Type</label>
195 <select 195 <select
196 class="form-control" 196 class="form-control"
197 v-model="caseStudy.caseStudyDetails.intro.type" 197 v-model="caseStudy.caseStudyDetails.intro.type"
198 > 198 >
199 <option value="null">Select Case Type</option> 199 <option value="null">Select Case Type</option>
200 <option value="Retake">Retake</option> 200 <option value="Retake">Retake</option>
201 <option value="Behind-the-scenes">Behind-the-scenes</option> 201 <option value="Behind-the-scenes">Behind-the-scenes</option>
202 <option value="Critique">Critique</option> 202 <option value="Critique">Critique</option>
203 <option value="Juxtapose">Juxtapose</option> 203 <option value="Juxtapose">Juxtapose</option>
204 </select> 204 </select>
205 </div> 205 </div>
206 </div> 206 </div>
207 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 207 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
208 <div class="form-group floating-label"> 208 <div class="form-group floating-label">
209 <label for="lname" class="lname">Platform</label> 209 <label for="lname" class="lname">Platform</label>
210 <!-- <input 210 <!-- <input
211 type="text" 211 type="text"
212 class="form-control" 212 class="form-control"
213 value="" 213 value=""
214 placeholder=" " 214 placeholder=" "
215 v-model="caseStudy.caseStudyDetails.intro.platForm" 215 v-model="caseStudy.caseStudyDetails.intro.platForm"
216 /> --> 216 /> -->
217 <select 217 <select
218 class="form-control" 218 class="form-control"
219 v-model="selectPlatform" 219 v-model="selectPlatform"
220 @change="addInsight('platform')" 220 @change="addInsight('platform')"
221 > 221 >
222 <option value="null">Select Insight Tag</option> 222 <option value="null">Select Insight Tag</option>
223 <option value="Ios">Ios</option> 223 <option value="Ios">Ios</option>
224 <option value="Web">Web</option> 224 <option value="Web">Web</option>
225 <option value="Android">Android</option> 225 <option value="Android">Android</option>
226 </select> 226 </select>
227 </div> 227 </div>
228 </div> 228 </div>
229 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 229 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
230 <div class="form-group floating-label"> 230 <div class="form-group floating-label">
231 <label for="lname" class="lname"></label> 231 <label for="lname" class="lname"></label>
232 <label for="lname" class="lname"></label> 232 <label for="lname" class="lname"></label>
233 <ul class="interests"> 233 <ul class="interests">
234 <!-- v-for="(interest, i) in caseStudy.caseStudyDetails 234 <!-- v-for="(interest, i) in caseStudy.caseStudyDetails
235 .insightTags" 235 .insightTags"
236 :key="i" --> 236 :key="i" -->
237 237
238 <li v-if="caseStudy.caseStudyDetails.intro.platForm"> 238 <li v-if="caseStudy.caseStudyDetails.intro.platForm">
239 <span>{{ caseStudy.caseStudyDetails.intro.platForm }}</span> 239 <span>{{ caseStudy.caseStudyDetails.intro.platForm }}</span>
240 <a 240 <a
241 href="javascript:void(0);" 241 href="javascript:void(0);"
242 @click="removeInsight(0, 'platform')" 242 @click="removeInsight(0, 'platform')"
243 class="cat-minus" 243 class="cat-minus"
244 ><img src="../assets/images/minus.svg" 244 ><img src="../assets/images/minus.svg"
245 /></a> 245 /></a>
246 </li> 246 </li>
247 </ul> 247 </ul>
248 </div> 248 </div>
249 </div> 249 </div>
250 </div> 250 </div>
251 <!-- 2nd row --> 251 <!-- 2nd row -->
252 <!-- 3rd row -->` 252 <!-- 3rd row -->`
253 <div class="row"> 253 <div class="row">
254 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 254 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
255 <div class="form-group floating-label"> 255 <div class="form-group floating-label">
256 <label for="lname" class="lname"></label> 256 <label for="lname" class="lname"></label>
257 <ul class="interests"> 257 <ul class="interests">
258 <li> 258 <li>
259 <input 259 <input
260 class="" 260 class=""
261 placeholder="Add Focus Areas" 261 placeholder="Add Focus Areas"
262 v-model="focusName" 262 v-model="focusName"
263 v-on:keyup.enter="addInsight('focus')" 263 v-on:keyup.enter="addInsight('focus')"
264 /> 264 />
265 <a href="javascript:void(0);" @click="addInsight('focus')" 265 <a href="javascript:void(0);" @click="addInsight('focus')"
266 ><img src="../assets/images/plus-circle.svg" 266 ><img src="../assets/images/plus-circle.svg"
267 /></a> 267 /></a>
268 </li> 268 </li>
269 269
270 <li 270 <li
271 v-for="(interest, i) in caseStudy.caseStudyDetails.focusAreas" 271 v-for="(interest, i) in caseStudy.caseStudyDetails.focusAreas"
272 :key="i" 272 :key="i"
273 > 273 >
274 <span>{{ interest }}</span> 274 <span>{{ interest }}</span>
275 <a 275 <a
276 href="javascript:void(0);" 276 href="javascript:void(0);"
277 @click="removeInsight(i, 'focus')" 277 @click="removeInsight(i, 'focus')"
278 class="cat-minus" 278 class="cat-minus"
279 ><img src="../assets/images/minus.svg" 279 ><img src="../assets/images/minus.svg"
280 /></a> 280 /></a>
281 </li> 281 </li>
282 </ul> 282 </ul>
283 </div> 283 </div>
284 </div> 284 </div>
285 285
286 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 286 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
287 <div class="form-group floating-label"> 287 <div class="form-group floating-label">
288 <label for="lname" class="lname">Select Insight Tags</label> 288 <label for="lname" class="lname">Select Insight Tags</label>
289 <select 289 <select
290 class="form-control" 290 class="form-control"
291 v-model="insightName" 291 v-model="insightName"
292 @change="addInsight('insight')" 292 @change="addInsight('insight')"
293 > 293 >
294 <option value="null">Select Insight Tag</option> 294 <option value="null">Select Insight Tag</option>
295 <option value="Design">Design</option> 295 <option value="Design">Design</option>
296 <option value="Product">Product</option> 296 <option value="Product">Product</option>
297 <option value="Marketing">Marketing</option> 297 <option value="Marketing">Marketing</option>
298 <option value="Pricing">Pricing</option> 298 <option value="Pricing">Pricing</option>
299 <option value="Psychology">Psychology</option> 299 <option value="Psychology">Psychology</option>
300 </select> 300 </select>
301 </div> 301 </div>
302 </div> 302 </div>
303 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 303 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
304 <div class="form-group floating-label"> 304 <div class="form-group floating-label">
305 <label for="lname" class="lname"></label> 305 <label for="lname" class="lname"></label>
306 <ul class="interests"> 306 <ul class="interests">
307 <li 307 <li
308 v-for="(interest, i) in caseStudy.caseStudyDetails.insightTags" 308 v-for="(interest, i) in caseStudy.caseStudyDetails.insightTags"
309 :key="i" 309 :key="i"
310 > 310 >
311 <span>{{ interest }}</span> 311 <span>{{ interest }}</span>
312 <a 312 <a
313 href="javascript:void(0);" 313 href="javascript:void(0);"
314 @click="removeInsight(i, 'insight')" 314 @click="removeInsight(i, 'insight')"
315 class="cat-minus" 315 class="cat-minus"
316 ><img src="../assets/images/minus.svg" 316 ><img src="../assets/images/minus.svg"
317 /></a> 317 /></a>
318 </li> 318 </li>
319 </ul> 319 </ul>
320 </div> 320 </div>
321 </div> 321 </div>
322 </div> 322 </div>
323 <!-- 3rd row end --> 323 <!-- 3rd row end -->
324 324
325 <!-- outdor --> 325 <!-- outdor -->
326 <div class="row profile-tab-spc-top"> 326 <div class="row profile-tab-spc-top">
327 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 327 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
328 <ul class="navbar-nav mr-auto"> 328 <ul class="navbar-nav mr-auto">
329 <li class="nav-item active"> 329 <li class="nav-item active">
330 <h5 class="nav-link">Outro Screen Record</h5> 330 <h5 class="nav-link">Outro Screen Record</h5>
331 </li> 331 </li>
332 </ul> 332 </ul>
333 </div> 333 </div>
334 </div> 334 </div>
335 335
336 <div class="row"> 336 <div class="row">
337 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 337 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
338 <div class="form-group floating-label"> 338 <div class="form-group floating-label">
339 <label for="lname" class="lname">Select Outro Screen</label> 339 <label for="lname" class="lname">Select Outro Screen</label>
340 <select 340 <select
341 class="form-control" 341 class="form-control"
342 v-model="caseStudy.caseStudyDetails.outro.templateId" 342 v-model="caseStudy.caseStudyDetails.outro.templateId"
343 343
344 > 344 >
345 <option value="outro-1">Outro Screen 1</option> 345 <option value="outro-1">Outro Screen 1</option>
346 <option value="outro-2">Outro Screen 2</option> 346 <option value="outro-2">Outro Screen 2</option>
347 </select> 347 </select>
348 </div> 348 </div>
349 </div> 349 </div>
350 </div> 350 </div>
351 351
352 <!-- 1st row --> 352 <!-- 1st row -->
353 <div class="row"> 353 <div class="row">
354 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 354 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
355 <div class="form-group floating-label"> 355 <div class="form-group floating-label">
356 <label for="lname" class="lname">Designer Name</label> 356 <label for="lname" class="lname">Designer Name</label>
357 <input 357 <input
358 type="text" 358 type="text"
359 class="form-control" 359 class="form-control"
360 value="" 360 value=""
361 placeholder=" " 361 placeholder=" "
362 v-model="caseStudy.caseStudyDetails.outro.designer" 362 v-model="caseStudy.caseStudyDetails.outro.designer"
363 /> 363 />
364 </div> 364 </div>
365 </div> 365 </div>
366 366
367 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 367 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
368 <div class="form-group floating-label"> 368 <div class="form-group floating-label">
369 <label for="lname" class="lname">Illustrations Name</label> 369 <label for="lname" class="lname">Illustrations Name</label>
370 <input 370 <input
371 type="text" 371 type="text"
372 class="form-control" 372 class="form-control"
373 value="" 373 value=""
374 placeholder=" " 374 placeholder=" "
375 v-model="caseStudy.caseStudyDetails.outro.illustrations" 375 v-model="caseStudy.caseStudyDetails.outro.illustrations"
376 /> 376 />
377 </div> 377 </div>
378 </div> 378 </div>
379 379
380 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 380 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
381 <div class="form-group floating-label"> 381 <div class="form-group floating-label">
382 <label for="lname" class="lname"> Author Image</label> 382 <label for="lname" class="lname"> Author Image</label>
383 <img 383 <img
384 v-if="caseStudy.caseStudyDetails.outro.authorImage[0]" 384 v-if="caseStudy.caseStudyDetails.outro.authorImage[0]"
385 style="width: 40px; height: 40px" 385 style="width: 40px; height: 40px"
386 :src="caseStudy.caseStudyDetails.outro.authorImage[0]" 386 :src="caseStudy.caseStudyDetails.outro.authorImage[0]"
387 /> 387 />
388 <input 388 <input
389 @change="createImage('outdor')" 389 @change="createImage('outdor')"
390 type="file" 390 type="file"
391 name="photos" 391 name="photos"
392 id="outdor" 392 id="outdor"
393 accept="image/*" 393 accept="image/*"
394 /> 394 />
395 </div> 395 </div>
396 </div> 396 </div>
397 </div> 397 </div>
398 <!-- 1st row --> 398 <!-- 1st row -->
399 <!-- outdoor ends --> 399 <!-- outdoor ends -->
400 400
401 <!-- outdor --> 401 <!-- outdor -->
402 <div class="row profile-tab-spc-top"> 402 <div class="row profile-tab-spc-top">
403 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 403 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
404 <ul class="navbar-nav mr-auto"> 404 <ul class="navbar-nav mr-auto">
405 <li class="nav-item active"> 405 <li class="nav-item active">
406 <h5 class="nav-link">Add SLides</h5> 406 <h5 class="nav-link">Add SLides</h5>
407 </li> 407 </li>
408 </ul> 408 </ul>
409 </div> 409 </div>
410 </div> 410 </div>
411 411
412 <!-- case study slides--> 412 <!-- case study slides-->
413 <div 413 <div
414 class="row profile-tab-spc-top" 414 class="row profile-tab-spc-top"
415 v-for="(slide, i) in caseStudy.slides" 415 v-for="(slide, i) in caseStudy.slides"
416 :key="i" 416 :key="i"
417 > 417 >
418 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 418 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
419 <ul class="navbar-nav mr-auto"> 419 <ul class="navbar-nav mr-auto">
420 <li class="nav-item active"> 420 <li class="nav-item active">
421 <p class="nav-link"> 421 <p class="nav-link">
422 <b>Screen {{ i + 1 }}</b> 422 <b>Screen {{ i + 1 }}</b>
423 <a 423 <a
424 style="cursor: pointer; color: red; font-size: 0.8rem" 424 style="cursor: pointer; color: red; font-size: 0.8rem"
425 @click="removeSlide(i)" 425 @click="removeSlide(i)"
426 > 426 >
427 Remove</a 427 Remove</a
428 > 428 >
429 <a 429 <a
430 style="cursor: pointer; color: blue; font-size: 0.8rem" 430 style="cursor: pointer; color: blue; font-size: 0.8rem"
431 @click="addProfileDialog(slide)" 431 @click="addProfileDialog(slide)"
432 > 432 >
433 View</a 433 View</a
434 > 434 >
435 </p> 435 </p>
436 </li> 436 </li>
437 <li class="nav-item active" v-if="slide.insight"> 437 <li class="nav-item active" v-if="slide.insight">
438 <div class="form-group floating-label"> 438 <div class="form-group floating-label">
439 <label for="lname" class="lname">Insight</label> 439 <label for="lname" class="lname">Insight</label>
440 <select 440 <select
441 class="form-control" 441 class="form-control"
442 v-model="insightId" 442 v-model="insightId"
443 v-on:change="insightSelected(slide)" 443 v-on:change="insightSelected(slide)"
444 > 444 >
445 <option value="null">Select Insight</option> 445 <option value="null">Select Insight</option>
446 <option 446 <option
447 v-for="(insight, i) in insightList" 447 v-for="(insight, i) in insightList"
448 :key="i" 448 :key="i"
449 :value="insight._id" 449 :value="insight._id"
450 > 450 >
451 {{ insight.title }} 451 {{ insight.title }}
452 </option> 452 </option>
453 </select> 453 </select>
454 </div> 454 </div>
455 </li> 455 </li>
456 </ul> 456 </ul>
457 </div> 457 </div>
458 458
459 <div class="row"> 459 <div class="row">
460 <div 460 <div
461 class="col-sm-4 col-md-4 col-lg-4 col-xl-4" 461 class="col-sm-4 col-md-4 col-lg-4 col-xl-4"
462 v-for="(field, j) in slide.metaData.fields" 462 v-for="(field, j) in slide.metaData.fields"
463 :key="j" 463 :key="j"
464 > 464 >
465 <div 465 <div
466 class="form-group floating-label" 466 class="form-group floating-label"
467 v-if="field.fieldType == 'text'" 467 v-if="field.fieldType == 'text'"
468 > 468 >
469 <label for="lname" class="lname">{{ field.displayName }}</label> 469 <label for="lname" class="lname">{{ field.displayName }}</label>
470 <input 470 <input
471 type="text" 471 type="text"
472 class="form-control" 472 class="form-control"
473 value="" 473 value=""
474 placeholder=" " 474 placeholder=" "
475 v-model="field.fieldValue" 475 v-model="field.fieldValue"
476 /> 476 />
477 </div> 477 </div>
478 <div 478 <div
479 class="form-group floating-label" 479 class="form-group floating-label"
480 v-if="field.fieldType == 'Number'" 480 v-if="field.fieldType == 'Number'"
481 > 481 >
482 <label for="lname" class="lname">{{ field.displayName }}</label> 482 <label for="lname" class="lname">{{ field.displayName }}</label>
483 <input 483 <input
484 type="text" 484 type="text"
485 class="form-control" 485 class="form-control"
486 value="" 486 value=""
487 placeholder=" " 487 placeholder=" "
488 v-model="field.fieldValue" 488 v-model="field.fieldValue"
489 /> 489 />
490 </div> 490 </div>
491 491
492 <div 492 <div
493 class="form-group floating-label" 493 class="form-group floating-label"
494 v-if="field.fieldType == 'image'" 494 v-if="field.fieldType == 'image'"
495 > 495 >
496 <label for="lname" class="lname"> {{ field.displayName }}</label> 496 <label for="lname" class="lname"> {{ field.displayName }}</label>
497 <img 497 <img
498 v-if="field.fieldValue" 498 v-if="field.fieldValue"
499 style="width: 40px; height: 40px" 499 style="width: 40px; height: 40px"
500 :src="field.fieldValue" 500 :src="field.fieldValue"
501 /> 501 />
502 <input 502 <input
503 @change="fieldcreateImage(i, j)" 503 @change="fieldcreateImage(i, j)"
504 type="file" 504 type="file"
505 name="photo" 505 name="photo"
506 :id="i + '' + j" 506 :id="i + '' + j"
507 accept="image/*" 507 accept="image/*"
508 /> 508 />
509 </div> 509 </div>
510 </div> 510 </div>
511 </div> 511 </div>
512 512
513 <div class="row"> 513 <div class="row">
514 <div 514 <div
515 515
516 v-for="(cum, j) in slide.metaData.comments" 516 v-for="(cum, j) in slide.metaData.comments"
517 :key="j" 517 :key="j"
518 > 518 >
519 <div class="form-group floating-label"> 519 <div class="form-group floating-label">
520 <label for="lname" class="lname">Comment Box {{ j + 1 }}</label> 520 <label for="lname" class="lname">Comment Box {{ j + 1 }}</label>
521 <input 521 <input
522 type="text" 522 type="text"
523 class="form-control" 523 class="form-control"
524 value="" 524 value=""
525 placeholder=" " 525 placeholder=" "
526 v-model="cum.comment" 526 v-model="cum.comment"
527 v-on:blur="updateComment(cum)" 527 v-on:blur="updateComment(cum)"
528 /> 528 />
529 </div> 529 </div>
530 </div> 530 </div>
531 </div> 531 </div>
532 </div> 532 </div>
533 533
534 <!-- 1st row --> 534 <!-- 1st row -->
535 <div class="row"> 535 <div class="row">
536 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 536 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
537 <div class="form-group floating-label"> 537 <div class="form-group floating-label">
538 <label for="lname" class="lname">Slides Name</label> 538 <label for="lname" class="lname">Slides Name</label>
539 <select 539 <select
540 class="form-control" 540 class="form-control"
541 v-model="slideId" 541 v-model="slideId"
542 v-on:change="slideSelected(slideId)" 542 v-on:change="slideSelected(slideId)"
543 > 543 >
544 <option value="null">Select Slide</option> 544 <option value="null">Select Slide</option>
545 <option v-for="(template, i) in templateList" :key="i" :value="i"> 545 <option v-for="(template, i) in templateList" :key="i" :value="i">
546 {{ template.name }} 546 {{ template.name }}
547 </option> 547 </option>
548 </select> 548 </select>
549 </div> 549 </div>
550 </div> 550 </div>
551 </div> 551 </div>
552 <!-- 1st row --> 552 <!-- 1st row -->
553 553
554 <!-- 1st row end --> 554 <!-- 1st row end -->
555 <!-- case study ends --> 555 <!-- case study ends -->
556 <div class="clearfix"></div> 556 <div class="clearfix"></div>
557 557
558 <!-- users land image --> 558 <!-- users land image -->
559 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4"> 559 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
560 <div class="form-layout signup-frm-spc"> 560 <div class="form-layout signup-frm-spc">
561 <form> 561 <form>
562 <a 562 <a
563 href="javascript:void(0);" 563 href="javascript:void(0);"
564 class="btn btn-lg sb-button" 564 class="btn btn-lg sb-button"
565 type="submit" 565 type="submit"
566 @click="submit" 566 @click="submit"
567 > 567 >
568 <img src="../assets/images/key.svg" /> submit 568 <img src="../assets/images/key.svg" /> submit
569 </a> 569 </a>
570 </form> 570 </form>
571 </div> 571 </div>
572 </div> 572 </div>
573 573
574 <!-- data wrp --> 574 <!-- data wrp -->
575 <!-- body wrapper --> 575 <!-- body wrapper -->
576 </div> 576 </div>
577 </main> 577 </main>
578 </template> 578 </template>
579 579
580 <script> 580 <script>
581 import Vue from "vue"; 581 import Vue from "vue";
582 import router from "../router"; 582 import router from "../router";
583 import $ from "jquery"; 583 import $ from "jquery";
584 import axios from "axios"; 584 import axios from "axios";
585 585
586 export default { 586 export default {
587 name: "Profile", 587 name: "Profile",
588 588
589 data() { 589 data() {
590 return { 590 return {
591 object: null, 591 object: null,
592 loggedinFlag: false, 592 loggedinFlag: false,
593 templateImage: null, 593 templateImage: null,
594 caseId: null, 594 caseId: null,
595 editMode: false, 595 editMode: false,
596 userData: null, 596 userData: null,
597 usertoken: null, 597 usertoken: null,
598 insightName: null, 598 insightName: null,
599 focusName: null, 599 focusName: null,
600 slideId: null, 600 slideId: null,
601 userList: [], 601 userList: [],
602 templateList: [], 602 templateList: [],
603 insightList: [], 603 insightList: [],
604 insightId: null, 604 insightId: null,
605 caseStudy: { 605 caseStudy: {
606 caseStudyDetails: { 606 caseStudyDetails: {
607 userId: [], 607 userId: [],
608 intro: { 608 intro: {
609 name: null, 609 name: null,
610 logoURL: null, 610 logoURL: null,
611 app: null, 611 app: null,
612 type: null, 612 type: null,
613 readTime: null, 613 readTime: null,
614 platForm: null, 614 platForm: null,
615 designation: null,
615 templateId: "intro-1", 616 templateId: "intro-1",
616 authors: [], 617 authors: [],
617 }, 618 },
618 outro: { 619 outro: {
619 authorImage: [], 620 authorImage: [],
620 authors: [], 621 authors: [],
621 designer: null, 622 designer: null,
622 templateId: "outro-1", 623 templateId: "outro-1",
623 illustrations: null, 624 illustrations: null,
624 }, 625 },
625 insightTags: [], 626 insightTags: [],
626 focusAreas: [], 627 focusAreas: [],
627 }, 628 },
628 slides: [], 629 slides: [],
629 }, 630 },
630 selectPlatform: "", 631 selectPlatform: "",
631 }; 632 };
632 }, 633 },
633 mounted() { 634 mounted() {
634 if (this.$route.fullPath.split("?").length == 2) { 635 if (this.$route.fullPath.split("?").length == 2) {
635 this.editMode = true; 636 this.editMode = true;
636 this.caseId = this.$route.fullPath.split("?")[1]; 637 this.caseId = this.$route.fullPath.split("?")[1];
637 var introData = localStorage.getItem("spotlight_caseStudy" + this.caseId); 638 var introData = localStorage.getItem("spotlight_caseStudy" + this.caseId);
638 if (introData) { 639 if (introData) {
639 introData = JSON.parse(introData); 640 introData = JSON.parse(introData);
640 console.log("introData", introData); 641 console.log("introData", introData);
641 if (introData.intro.focus) { 642 if (introData.intro.focus) {
642 delete introData.intro.focus; 643 delete introData.intro.focus;
643 } 644 }
644 this.caseStudy.caseStudyDetails.intro = introData.intro; 645 this.caseStudy.caseStudyDetails.intro = introData.intro;
645 this.caseStudy.caseStudyDetails.userId = introData.userId; 646 this.caseStudy.caseStudyDetails.userId = introData.userId;
646 this.caseStudy.caseStudyDetails.outro = introData.outro; 647 this.caseStudy.caseStudyDetails.outro = introData.outro;
647 this.caseStudy.caseStudyDetails.insightTags = introData.insightTags; 648 this.caseStudy.caseStudyDetails.insightTags = introData.insightTags;
648 this.caseStudy.caseStudyDetails.focusAreas = introData.focusAreas; 649 this.caseStudy.caseStudyDetails.focusAreas = introData.focusAreas;
649 this.selectPlatform = introData.intro.platForm; 650 this.selectPlatform = introData.intro.platForm;
650 console.log("this.selectPlatform", this.selectPlatform); 651 console.log("this.selectPlatform", this.selectPlatform);
651 } 652 }
652 } 653 }
653 var userdata = localStorage.getItem("spotlight_usertoken"); 654 var userdata = localStorage.getItem("spotlight_usertoken");
654 if (userdata) { 655 if (userdata) {
655 userdata = JSON.parse(userdata); 656 userdata = JSON.parse(userdata);
656 this.usertoken = userdata.token; 657 this.usertoken = userdata.token;
657 this.getUserList(); 658 this.getUserList();
658 this.getTemplateList(); 659 this.getTemplateList();
659 this.getInsightList(); 660 this.getInsightList();
660 // this.demo(); 661 // this.demo();
661 } 662 }
662 }, 663 },
663 methods: { 664 methods: {
664 demo() { 665 demo() {
665 var obj = { 666 var obj = {
666 responseMessage: "success", 667 responseMessage: "success",
667 callflowsDetails: { 668 callflowsDetails: {
668 metadata: { 669 metadata: {
669 "6f4f3ec8d8bd0d169a33cdeb49c005d4": { 670 "6f4f3ec8d8bd0d169a33cdeb49c005d4": {
670 name: "neeraj.sharma@viithiisys.com", 671 name: "neeraj.sharma@viithiisys.com",
671 pvt_type: "faxbox", 672 pvt_type: "faxbox",
672 }, 673 },
673 "1968018a933a6ce069b583f2dfe0d91b": { 674 "1968018a933a6ce069b583f2dfe0d91b": {
674 name: "Rohit Saini", 675 name: "Rohit Saini",
675 pvt_type: "user", 676 pvt_type: "user",
676 }, 677 },
677 "48f409d64c69b52dbe114b86ee4579ea": { 678 "48f409d64c69b52dbe114b86ee4579ea": {
678 name: "hello", 679 name: "hello",
679 pvt_type: "device", 680 pvt_type: "device",
680 }, 681 },
681 }, 682 },
682 patterns: [], 683 patterns: [],
683 numbers: ["+9876541023"], 684 numbers: ["+9876541023"],
684 id: "2360eb2f7dc04994382ab58fe48da46c", 685 id: "2360eb2f7dc04994382ab58fe48da46c",
685 ui_metadata: { 686 ui_metadata: {
686 ui: "monster-ui", 687 ui: "monster-ui",
687 origin: "callflows", 688 origin: "callflows",
688 version: "4.3-139", 689 version: "4.3-139",
689 }, 690 },
690 flow: { 691 flow: {
691 data: { 692 data: {
692 dial_strategy: "simultaneous", 693 dial_strategy: "simultaneous",
693 delay: 0, 694 delay: 0,
694 can_call_self: false, 695 can_call_self: false,
695 id: "48f409d64c69b52dbe114b86ee4579ea", 696 id: "48f409d64c69b52dbe114b86ee4579ea",
696 timeout: 20, 697 timeout: 20,
697 }, 698 },
698 children: { 699 children: {
699 _: { 700 _: {
700 data: { id: "6f4f3ec8d8bd0d169a33cdeb49c005d4" }, 701 data: { id: "6f4f3ec8d8bd0d169a33cdeb49c005d4" },
701 children: { 702 children: {
702 _: { 703 _: {
703 data: { 704 data: {
704 owner_id: "1968018a933a6ce069b583f2dfe0d91b", 705 owner_id: "1968018a933a6ce069b583f2dfe0d91b",
705 media: { fax_option: false }, 706 media: { fax_option: false },
706 }, 707 },
707 children: {}, 708 children: {},
708 module: "receive_fax", 709 module: "receive_fax",
709 }, 710 },
710 }, 711 },
711 module: "faxbox", 712 module: "faxbox",
712 }, 713 },
713 }, 714 },
714 module: "device", 715 module: "device",
715 }, 716 },
716 }, 717 },
717 }; 718 };
718 var string = JSON.stringify(obj); 719 var string = JSON.stringify(obj);
719 var count = string.match(/children/gi).length; 720 var count = string.match(/children/gi).length;
720 var array = []; 721 var array = [];
721 var name = []; 722 var name = [];
722 for (var i = 0; i < count - 1; i++) { 723 for (var i = 0; i < count - 1; i++) {
723 name = name + "children"; 724 name = name + "children";
724 var value = JSON.parse(string); 725 var value = JSON.parse(string);
725 // console.log("-1-",name); 726 // console.log("-1-",name);
726 console.log("-1-", value.callflowsDetails.flow[name]); 727 console.log("-1-", value.callflowsDetails.flow[name]);
727 console.log("-2-", value.callflowsDetails.flow[name]["_"][name]); 728 console.log("-2-", value.callflowsDetails.flow[name]["_"][name]);
728 console.log( 729 console.log(
729 "-3-", 730 "-3-",
730 value.callflowsDetails.flow[name]["_"][name]["_"][name] 731 value.callflowsDetails.flow[name]["_"][name]["_"][name]
731 ); 732 );
732 } 733 }
733 }, 734 },
734 changeIntroScreen(){ 735 changeIntroScreen(){
735 736
736 }, 737 },
737 selectUser(i) { 738 selectUser(i) {
738 this.userList[i]; 739 this.userList[i];
739 this.caseStudy.caseStudyDetails.intro.authors.push(this.userList[i].name); 740 this.caseStudy.caseStudyDetails.intro.authors.push(this.userList[i].name);
740 this.caseStudy.caseStudyDetails.outro.authors.push(this.userList[i].name); 741 this.caseStudy.caseStudyDetails.outro.authors.push(this.userList[i].name);
741 this.caseStudy.caseStudyDetails.userId.push(this.userList[i]._id); 742 this.caseStudy.caseStudyDetails.userId.push(this.userList[i]._id);
742 console.log("-", this.caseStudy); 743 console.log("-", this.caseStudy);
743 }, 744 },
744 745
745 logout() { 746 logout() {
746 this.$router.push("/"); 747 this.$router.push("/");
747 }, 748 },
748 addInsight(type) { 749 addInsight(type) {
749 if (type == "focus") { 750 if (type == "focus") {
750 this.caseStudy.caseStudyDetails.focusAreas.push(this.focusName); 751 this.caseStudy.caseStudyDetails.focusAreas.push(this.focusName);
751 this.focusName = null; 752 this.focusName = null;
752 } else if (type == "insight") { 753 } else if (type == "insight") {
753 this.caseStudy.caseStudyDetails.insightTags.push(this.insightName); 754 this.caseStudy.caseStudyDetails.insightTags.push(this.insightName);
754 this.insightName = null; 755 this.insightName = null;
755 } else if (type == "platform") { 756 } else if (type == "platform") {
756 this.caseStudy.caseStudyDetails.intro.platForm = this.selectPlatform; 757 this.caseStudy.caseStudyDetails.intro.platForm = this.selectPlatform;
757 // this.selectPlatform = null; 758 // this.selectPlatform = null;
758 } 759 }
759 }, 760 },
760 removeInsight(i, type) { 761 removeInsight(i, type) {
761 if (type == "focus") { 762 if (type == "focus") {
762 this.caseStudy.caseStudyDetails.focusAreas.splice(i, 1); 763 this.caseStudy.caseStudyDetails.focusAreas.splice(i, 1);
763 } else if (type == "insight") { 764 } else if (type == "insight") {
764 this.caseStudy.caseStudyDetails.insightTags.splice(i, 1); 765 this.caseStudy.caseStudyDetails.insightTags.splice(i, 1);
765 } else if (type == "platform") { 766 } else if (type == "platform") {
766 this.caseStudy.caseStudyDetails.intro.platForm = ""; 767 this.caseStudy.caseStudyDetails.intro.platForm = "";
767 this.selectPlatform = null; 768 this.selectPlatform = null;
768 } 769 }
769 }, 770 },
770 771
771 async slideSelected(i) { 772 async slideSelected(i) {
772 console.log("id is", this.templateList[i]); 773 console.log("id is", this.templateList[i]);
773 this.object = JSON.parse(JSON.stringify(this.templateList[i])); 774 this.object = JSON.parse(JSON.stringify(this.templateList[i]));
774 775
775 // var keys = Object.keys(this.templateList[i]); 776 // var keys = Object.keys(this.templateList[i]);
776 // keys.forEach(element => { 777 // keys.forEach(element => {
777 // obj[element] = this.templateList[i][element]; 778 // obj[element] = this.templateList[i][element];
778 // }); 779 // });
779 780
780 console.log("obj", this.object); 781 console.log("obj", this.object);
781 // slideMetadata = await this.getMeatda(this.templateList[i]._id); 782 // slideMetadata = await this.getMeatda(this.templateList[i]._id);
782 this.slideId = null; 783 this.slideId = null;
783 // this.templateList[i].metaData = slideMetadata.metaData; 784 // this.templateList[i].metaData = slideMetadata.metaData;
784 this.caseStudy.slides.push(this.object); 785 this.caseStudy.slides.push(this.object);
785 this.templateList[i].metaData.fields.forEach((fields_) => { 786 this.templateList[i].metaData.fields.forEach((fields_) => {
786 fields_.fieldValue == null; 787 fields_.fieldValue == null;
787 }); 788 });
788 if (this.templateList[i].metaData.comments) { 789 if (this.templateList[i].metaData.comments) {
789 this.templateList[i].metaData.comments.forEach((coments_) => { 790 this.templateList[i].metaData.comments.forEach((coments_) => {
790 coments_.comment == null; 791 coments_.comment == null;
791 }); 792 });
792 } 793 }
793 console.log("this.caseStudy.slides", this.caseStudy.slides); 794 console.log("this.caseStudy.slides", this.caseStudy.slides);
794 }, 795 },
795 async insightSelected(data) { 796 async insightSelected(data) {
796 // this.caseStudy.slides.push(this.templateList[i]); 797 // this.caseStudy.slides.push(this.templateList[i]);
797 798
798 console.log("data", data); 799 console.log("data", data);
799 data.insightId = this.insightId; 800 data.insightId = this.insightId;
800 // this.insightId = null; 801 // this.insightId = null;
801 }, 802 },
802 803
803 removeSlide(i) { 804 removeSlide(i) {
804 this.caseStudy.slides.splice(i, 1); 805 this.caseStudy.slides.splice(i, 1);
805 }, 806 },
806 807
807 createImage(type) { 808 createImage(type) {
808 var that = this; 809 var that = this;
809 console.log(document.getElementById(type)); 810 console.log(document.getElementById(type));
810 var file = document.getElementById(type).files[0]; 811 var file = document.getElementById(type).files[0];
811 console.log("file", file); 812 console.log("file", file);
812 var reader = new FileReader(); 813 var reader = new FileReader();
813 reader.onload = function (e) { 814 reader.onload = function (e) {
814 console.log("e.target.result ", e.target.result); 815 console.log("e.target.result ", e.target.result);
815 that.uploadImage(type, e.target.result); 816 that.uploadImage(type, e.target.result);
816 }; 817 };
817 reader.onerror = function (error) { 818 reader.onerror = function (error) {
818 alert(error); 819 alert(error);
819 }; 820 };
820 if (file) { 821 if (file) {
821 reader.readAsDataURL(file); 822 reader.readAsDataURL(file);
822 } 823 }
823 }, 824 },
824 uploadImage(type, base64) { 825 uploadImage(type, base64) {
825 console.log("type", type); 826 console.log("type", type);
826 var obj = { 827 var obj = {
827 image: base64, 828 image: base64,
828 }; 829 };
829 axios 830 axios
830 .post("/superAdmin/uploadImage", obj, { 831 .post("/superAdmin/uploadImage", obj, {
831 headers: { 832 headers: {
832 Authorization: "Bearer " + this.usertoken, 833 Authorization: "Bearer " + this.usertoken,
833 }, 834 },
834 }) 835 })
835 .then((response) => { 836 .then((response) => {
836 if (type == "logo") { 837 if (type == "logo") {
837 setTimeout( 838 setTimeout(
838 () => 839 () =>
839 (this.caseStudy.caseStudyDetails.intro.logoURL = 840 (this.caseStudy.caseStudyDetails.intro.logoURL =
840 response.data.data), 841 response.data.data),
841 99 842 99
842 ); 843 );
843 } else if (type == "outdor") { 844 } else if (type == "outdor") {
844 this.caseStudy.caseStudyDetails.outro.authorImage = []; 845 this.caseStudy.caseStudyDetails.outro.authorImage = [];
845 setTimeout( 846 setTimeout(
846 () => 847 () =>
847 this.caseStudy.caseStudyDetails.outro.authorImage.push( 848 this.caseStudy.caseStudyDetails.outro.authorImage.push(
848 response.data.data 849 response.data.data
849 ), 850 ),
850 99 851 99
851 ); 852 );
852 } 853 }
853 854
854 console.log(response.data.data); 855 console.log(response.data.data);
855 console.log(this.caseStudy); 856 console.log(this.caseStudy);
856 }) 857 })
857 .catch((error) => { 858 .catch((error) => {
858 if (error.response) { 859 if (error.response) {
859 this.$toaster.error(error.response.data.message); 860 this.$toaster.error(error.response.data.message);
860 } 861 }
861 }); 862 });
862 }, 863 },
863 864
864 fieldcreateImage(i, j) { 865 fieldcreateImage(i, j) {
865 console.log("i", i); 866 console.log("i", i);
866 console.log("j", j); 867 console.log("j", j);
867 var that = this; 868 var that = this;
868 var id = i + "" + j; 869 var id = i + "" + j;
869 console.log(document.getElementById(id)); 870 console.log(document.getElementById(id));
870 var file = document.getElementById(id).files[0]; 871 var file = document.getElementById(id).files[0];
871 // var file = document.querySelector("input[type=file]").files[0]; 872 // var file = document.querySelector("input[type=file]").files[0];
872 console.log("file", file); 873 console.log("file", file);
873 var reader = new FileReader(); 874 var reader = new FileReader();
874 reader.onload = function (e) { 875 reader.onload = function (e) {
875 // console.log("e.target.result ",e.target.result ) 876 // console.log("e.target.result ",e.target.result )
876 that.fielduploadImage(i, j, e.target.result); 877 that.fielduploadImage(i, j, e.target.result);
877 }; 878 };
878 reader.onerror = function (error) { 879 reader.onerror = function (error) {
879 alert(error); 880 alert(error);
880 }; 881 };
881 if (file) { 882 if (file) {
882 reader.readAsDataURL(file); 883 reader.readAsDataURL(file);
883 } 884 }
884 }, 885 },
885 fielduploadImage(i, j, base64) { 886 fielduploadImage(i, j, base64) {
886 var obj = { 887 var obj = {
887 image: base64, 888 image: base64,
888 }; 889 };
889 axios 890 axios
890 .post("/superAdmin/uploadImage", obj, { 891 .post("/superAdmin/uploadImage", obj, {
891 headers: { 892 headers: {
892 Authorization: "Bearer " + this.usertoken, 893 Authorization: "Bearer " + this.usertoken,
893 }, 894 },
894 }) 895 })
895 .then((response) => { 896 .then((response) => {
896 setTimeout( 897 setTimeout(
897 () => 898 () =>
898 (this.caseStudy.slides[i].metaData.fields[j].fieldValue = 899 (this.caseStudy.slides[i].metaData.fields[j].fieldValue =
899 response.data.data), 900 response.data.data),
900 10 901 10
901 ); 902 );
902 903
903 console.log(response.data.data); 904 console.log(response.data.data);
904 console.log(this.caseStudy); 905 console.log(this.caseStudy);
905 }) 906 })
906 .catch((error) => { 907 .catch((error) => {
907 if (error.response) { 908 if (error.response) {
908 this.$toaster.error(error.response.data.message); 909 this.$toaster.error(error.response.data.message);
909 } 910 }
910 }); 911 });
911 }, 912 },
912 913
913 getUserList() { 914 getUserList() {
914 axios 915 axios
915 .get("/superAdmin/users", { 916 .get("/superAdmin/users", {
916 headers: { 917 headers: {
917 Authorization: "Bearer " + this.usertoken, 918 Authorization: "Bearer " + this.usertoken,
918 }, 919 },
919 }) 920 })
920 .then((response) => { 921 .then((response) => {
921 response.data.data.forEach((element) => { 922 response.data.data.forEach((element) => {
922 if (element.name) { 923 if (element.name) {
923 this.userList.push(element); 924 this.userList.push(element);
924 } 925 }
925 }); 926 });
926 console.log("response", this.userList); 927 console.log("response", this.userList);
927 }) 928 })
928 .catch((error) => console.log(error)); 929 .catch((error) => console.log(error));
929 }, 930 },
930 931
931 getTemplateList() { 932 getTemplateList() {
932 axios 933 axios
933 .get("/superAdmin/templates", { 934 .get("/superAdmin/templates", {
934 headers: { 935 headers: {
935 Authorization: "Bearer " + this.usertoken, 936 Authorization: "Bearer " + this.usertoken,
936 }, 937 },
937 }) 938 })
938 .then((response) => { 939 .then((response) => {
939 response.data.data.forEach((temp) => { 940 response.data.data.forEach((temp) => {
940 if ( 941 if (
941 temp._id != "INTRO_oqkdMOVDrwRptsdWJ6Ye" && 942 temp._id != "INTRO_oqkdMOVDrwRptsdWJ6Ye" &&
942 temp._id != "OUTRO_oqkdMOVDrwRptsdWJ6Ye" 943 temp._id != "OUTRO_oqkdMOVDrwRptsdWJ6Ye"
943 ) { 944 ) {
944 if (temp.bounceBoard) { 945 if (temp.bounceBoard) {
945 for (var i = 0; i < temp.commentBox; i++) { 946 for (var i = 0; i < temp.commentBox; i++) {
946 temp.metaData.comments.push({ 947 temp.metaData.comments.push({
947 userId: null, 948 userId: null,
948 slideId: null, 949 slideId: null,
949 caseStudyId: null, 950 caseStudyId: null,
950 comment: null, 951 comment: null,
951 }); 952 });
952 } 953 }
953 } 954 }
954 this.templateList.push(temp); 955 this.templateList.push(temp);
955 } 956 }
956 }); 957 });
957 if (this.editMode) { 958 if (this.editMode) {
958 this.getSLideData(); 959 this.getSLideData();
959 } 960 }
960 console.log("templates", this.templateList); 961 console.log("templates", this.templateList);
961 }) 962 })
962 .catch((error) => console.log(error)); 963 .catch((error) => console.log(error));
963 }, 964 },
964 getInsightList() { 965 getInsightList() {
965 axios 966 axios
966 .get("/superAdmin/insight", { 967 .get("/superAdmin/insight", {
967 headers: { 968 headers: {
968 Authorization: "Bearer " + this.usertoken, 969 Authorization: "Bearer " + this.usertoken,
969 }, 970 },
970 }) 971 })
971 .then((response) => { 972 .then((response) => {
972 this.insightList = response.data.data; 973 this.insightList = response.data.data;
973 974
974 console.log("insight", response.data.data); 975 console.log("insight", response.data.data);
975 }) 976 })
976 .catch((error) => console.log(error)); 977 .catch((error) => console.log(error));
977 }, 978 },
978 979
979 getSLideData() { 980 getSLideData() {
980 axios 981 axios
981 .get("/superAdmin/caseStudySlides?caseStudyId=" + this.caseId, { 982 .get("/superAdmin/caseStudySlides?caseStudyId=" + this.caseId, {
982 headers: { 983 headers: {
983 Authorization: "Bearer " + this.usertoken, 984 Authorization: "Bearer " + this.usertoken,
984 }, 985 },
985 }) 986 })
986 .then((response) => { 987 .then((response) => {
987 var finalArray = []; 988 var finalArray = [];
988 console.log("1"); 989 console.log("1");
989 response.data.data.forEach((template_) => { 990 response.data.data.forEach((template_) => {
990 console.log("template_", template_); 991 console.log("template_", template_);
991 var keys = []; 992 var keys = [];
992 var i = this.templateList.findIndex( 993 var i = this.templateList.findIndex(
993 (temp_) => temp_._id == template_.templateId 994 (temp_) => temp_._id == template_.templateId
994 ); 995 );
995 var obj = { 996 var obj = {
996 _id: this.templateList[i]._id, 997 _id: this.templateList[i]._id,
997 bounceBoard: this.templateList[i].bounceBoard, 998 bounceBoard: this.templateList[i].bounceBoard,
998 insight: this.templateList[i].insight, 999 insight: this.templateList[i].insight,
999 slideId: template_._id, 1000 slideId: template_._id,
1000 // commentBox: this.templateList[i].commentBox, 1001 // commentBox: this.templateList[i].commentBox,
1001 metaData: { 1002 metaData: {
1002 fields: [], 1003 fields: [],
1003 comments: [], 1004 comments: [],
1004 }, 1005 },
1005 }; 1006 };
1006 console.log("2"); 1007 console.log("2");
1007 1008
1008 if (this.templateList[i].bounceBoard) { 1009 if (this.templateList[i].bounceBoard) {
1009 obj.commentBox = this.templateList[i].commentBox; 1010 obj.commentBox = this.templateList[i].commentBox;
1010 obj.metaData.comments = template_.comments; 1011 obj.metaData.comments = template_.comments;
1011 } 1012 }
1012 if (this.templateList[i].insight) { 1013 if (this.templateList[i].insight) {
1013 obj.insightId = template_.insightId; 1014 obj.insightId = template_.insightId;
1014 } 1015 }
1015 var fieldArray = []; 1016 var fieldArray = [];
1016 console.log("3"); 1017 console.log("3");
1017 1018
1018 this.templateList[i].metaData.fields.forEach((element) => { 1019 this.templateList[i].metaData.fields.forEach((element) => {
1019 var fieldobj = { 1020 var fieldobj = {
1020 fieldName: element.fieldName, 1021 fieldName: element.fieldName,
1021 displayName: element.displayName, 1022 displayName: element.displayName,
1022 fieldValue: template_.metaData[element.fieldName], 1023 fieldValue: template_.metaData[element.fieldName],
1023 fieldType: element.fieldType, 1024 fieldType: element.fieldType,
1024 }; 1025 };
1025 obj.metaData.fields.push(fieldobj); 1026 obj.metaData.fields.push(fieldobj);
1026 }); 1027 });
1027 console.log("4"); 1028 console.log("4");
1028 1029
1029 finalArray.push(obj); 1030 finalArray.push(obj);
1030 if (template_.insight) { 1031 if (template_.insight) {
1031 this.insightId = template_.insight._id; 1032 this.insightId = template_.insight._id;
1032 } 1033 }
1033 }); 1034 });
1034 console.log("5"); 1035 console.log("5");
1035 1036
1036 this.caseStudy.slides = finalArray; 1037 this.caseStudy.slides = finalArray;
1037 console.log("----", finalArray); 1038 console.log("----", finalArray);
1038 console.log(this.templateList, "getSLideData==>"); 1039 console.log(this.templateList, "getSLideData==>");
1039 }) 1040 })
1040 .catch((error) => console.log(error)); 1041 .catch((error) => console.log(error));
1041 }, 1042 },
1042 1043
1043 submit() { 1044 submit() {
1044 const latest = Object.create(this.caseStudy); 1045 const latest = Object.create(this.caseStudy);
1045 1046
1046 var slidArray = []; 1047 var slidArray = [];
1047 latest.slides.forEach((slides) => { 1048 latest.slides.forEach((slides) => {
1048 console.log("slides", slides); 1049 console.log("slides", slides);
1049 var slideData = {}; 1050 var slideData = {};
1050 slideData.templateId = slides._id; 1051 slideData.templateId = slides._id;
1051 slideData.bounceBoard = slides.bounceBoard; 1052 slideData.bounceBoard = slides.bounceBoard;
1052 slideData.insight = slides.insight; 1053 slideData.insight = slides.insight;
1053 if (slides.slideId) { 1054 if (slides.slideId) {
1054 slideData.slideId = slides.slideId; 1055 slideData.slideId = slides.slideId;
1055 } 1056 }
1056 if (slides.insightId) { 1057 if (slides.insightId) {
1057 slideData.insightId = slides.insightId; 1058 slideData.insightId = slides.insightId;
1058 } 1059 }
1059 if (slides.metaData.comments && slides.metaData.comments.length > 0) { 1060 if (slides.metaData.comments && slides.metaData.comments.length > 0) {
1060 slideData.comments = slides.metaData.comments; 1061 slideData.comments = slides.metaData.comments;
1061 // this.getSLideData(); 1062 // this.getSLideData();
1062 } 1063 }
1063 // var comments = []; 1064 // var comments = [];
1064 // if (slides.bounceBoard) { 1065 // if (slides.bounceBoard) {
1065 // slides.metaData.comments.forEach((element) => { 1066 // slides.metaData.comments.forEach((element) => {
1066 // comments.push(element.comment); 1067 // comments.push(element.comment);
1067 // }); 1068 // });
1068 // slideData.comments = comments; 1069 // slideData.comments = comments;
1069 // } 1070 // }
1070 1071
1071 slides.metaData.fields.forEach((fields_) => { 1072 slides.metaData.fields.forEach((fields_) => {
1072 slideData[fields_.fieldName] = fields_.fieldValue; 1073 slideData[fields_.fieldName] = fields_.fieldValue;
1073 }); 1074 });
1074 slidArray.push(slideData); 1075 slidArray.push(slideData);
1075 // delete slides.metaData.fields; 1076 // delete slides.metaData.fields;
1076 }); 1077 });
1077 1078
1078 console.log("slideData", slidArray); 1079 console.log("slideData", slidArray);
1079 if (this.editMode) { 1080 if (this.editMode) {
1080 this.updateProfile(slidArray); 1081 this.updateProfile(slidArray);
1081 } else { 1082 } else {
1082 this.saveProfile(slidArray); 1083 this.saveProfile(slidArray);
1083 } 1084 }
1084 }, 1085 },
1085 updateComment(cmnt) { 1086 updateComment(cmnt) {
1086 if (!cmnt._id) { 1087 if (!cmnt._id) {
1087 return; 1088 return;
1088 } 1089 }
1089 console.log("cmnts", cmnt); 1090 console.log("cmnts", cmnt);
1090 var obj = { 1091 var obj = {
1091 slideId: cmnt.slideId, 1092 slideId: cmnt.slideId,
1092 commentId: cmnt._id, 1093 commentId: cmnt._id,
1093 comment: cmnt.comment, 1094 comment: cmnt.comment,
1094 }; 1095 };
1095 axios 1096 axios
1096 .put("/superAdmin/comment", obj, { 1097 .put("/superAdmin/comment", obj, {
1097 headers: { 1098 headers: {
1098 Authorization: "Bearer " + this.usertoken, 1099 Authorization: "Bearer " + this.usertoken,
1099 }, 1100 },
1100 }) 1101 })
1101 .then((response) => { 1102 .then((response) => {
1102 console.log(response); 1103 console.log(response);
1103 }) 1104 })
1104 .catch((error) => {}); 1105 .catch((error) => {});
1105 }, 1106 },
1106 1107
1107 saveProfile(slides) { 1108 saveProfile(slides) {
1108 var obj = {}; 1109 var obj = {};
1109 obj.caseStudyDetails = this.caseStudy.caseStudyDetails; 1110 obj.caseStudyDetails = this.caseStudy.caseStudyDetails;
1110 obj.caseStudyDetails.intro.readTime = Math.round( 1111 obj.caseStudyDetails.intro.readTime = Math.round(
1111 slides.length / 3 1112 slides.length / 3
1112 ).toString(); 1113 ).toString();
1113 obj.slides = slides; 1114 obj.slides = slides;
1114 axios 1115 axios
1115 .post("/superAdmin/caseStudy", obj, { 1116 .post("/superAdmin/caseStudy", obj, {
1116 headers: { 1117 headers: {
1117 Authorization: "Bearer " + this.usertoken, 1118 Authorization: "Bearer " + this.usertoken,
1118 }, 1119 },
1119 }) 1120 })
1120 .then((response) => { 1121 .then((response) => {
1121 // this.userData = response.data.data; 1122 // this.userData = response.data.data;
1122 this.$toaster.success("Case Study Created"); 1123 this.$toaster.success("Case Study Created");
1123 this.$router.go(this.$router.currentRoute); 1124 this.$router.go(this.$router.currentRoute);
1124 1125
1125 console.log(response); 1126 console.log(response);
1126 }) 1127 })
1127 .catch((error) => { 1128 .catch((error) => {
1128 if (error.response) { 1129 if (error.response) {
1129 this.$toaster.error(error.response.data.message); 1130 this.$toaster.error(error.response.data.message);
1130 } 1131 }
1131 }); 1132 });
1132 }, 1133 },
1133 1134
1134 updateProfile(slides) { 1135 updateProfile(slides) {
1135 var obj = {}; 1136 var obj = {};
1136 (obj.caseStudyId = this.caseId), 1137 (obj.caseStudyId = this.caseId),
1137 (obj.caseStudyDetails = this.caseStudy.caseStudyDetails); 1138 (obj.caseStudyDetails = this.caseStudy.caseStudyDetails);
1138 obj.caseStudyDetails.intro.readTime = Math.round( 1139 obj.caseStudyDetails.intro.readTime = Math.round(
1139 slides.length / 3 1140 slides.length / 3
1140 ).toString(); 1141 ).toString();
1141 obj.slides = slides; 1142 obj.slides = slides;
1142 delete obj.caseStudyDetails.intro.focus; 1143 delete obj.caseStudyDetails.intro.focus;
1143 axios 1144 axios
1144 .put("/superAdmin/caseStudy", obj, { 1145 .put("/superAdmin/caseStudy", obj, {
1145 headers: { 1146 headers: {
1146 Authorization: "Bearer " + this.usertoken, 1147 Authorization: "Bearer " + this.usertoken,
1147 }, 1148 },
1148 }) 1149 })
1149 .then((response) => { 1150 .then((response) => {
1150 // this.userData = response.data.data; 1151 // this.userData = response.data.data;
1151 this.$toaster.success("Case Study Updated"); 1152 this.$toaster.success("Case Study Updated");
1152 this.$router.go(this.$router.currentRoute); 1153 this.$router.go(this.$router.currentRoute);
1153 1154
1154 console.log(response); 1155 console.log(response);
1155 }) 1156 })
1156 .catch((error) => { 1157 .catch((error) => {
1157 if (error.response) { 1158 if (error.response) {
1158 this.$toaster.error(error.response.data.message); 1159 this.$toaster.error(error.response.data.message);
1159 } 1160 }
1160 }); 1161 });
1161 }, 1162 },
1162 listPage(url) { 1163 listPage(url) {
1163 this.$router.push(url); 1164 this.$router.push(url);
1164 }, 1165 },
1165 1166
1166 addProfileDialog(slide) { 1167 addProfileDialog(slide) {
1167 console.log("slide", slide); 1168 console.log("slide", slide);
1168 this.templateImage = slide.templateImage; 1169 this.templateImage = slide.templateImage;
1169 $(".inner-wrp").addClass("body-blur"); 1170 $(".inner-wrp").addClass("body-blur");
1170 $("#add-social-links").hide(); 1171 $("#add-social-links").hide();
1171 $(".popup-wrp, #add-profile").show(); 1172 $(".popup-wrp, #add-profile").show();
1172 }, 1173 },
1173 1174
1174 closeDialog() { 1175 closeDialog() {
1175 this.templateImage = null; 1176 this.templateImage = null;
1176 $(".popup-wrp").hide(); 1177 $(".popup-wrp").hide();
1177 $(".inner-wrp").removeClass("body-blur"); 1178 $(".inner-wrp").removeClass("body-blur");
1178 // this.saveProfile(); 1179 // this.saveProfile();
1179 }, 1180 },
1180 hideDialog() { 1181 hideDialog() {
1181 this.templateImage = null; 1182 this.templateImage = null;
1182 $(".popup-wrp").hide(); 1183 $(".popup-wrp").hide();
1183 $(".inner-wrp").removeClass("body-blur"); 1184 $(".inner-wrp").removeClass("body-blur");
1184 }, 1185 },
1185 1186
1186 async getMeatda(tempId) { 1187 async getMeatda(tempId) {
1187 var obj = [ 1188 var obj = [
1188 { 1189 {
1189 tempId: "T1_RoeMG8130Xko1DvhC3Ou", 1190 tempId: "T1_RoeMG8130Xko1DvhC3Ou",
1190 metaData: { 1191 metaData: {
1191 fields: [ 1192 fields: [
1192 { 1193 {
1193 fieldName: "authorImage", 1194 fieldName: "authorImage",
1194 displayName: "Author Image", 1195 displayName: "Author Image",
1195 fieldValue: null, 1196 fieldValue: null,
1196 fieldType: "image", 1197 fieldType: "image",
1197 }, 1198 },
1198 { 1199 {
1199 fieldName: "mobileImage", 1200 fieldName: "mobileImage",
1200 displayName: "Mobile Image", 1201 displayName: "Mobile Image",
1201 fieldValue: null, 1202 fieldValue: null,
1202 fieldType: "image", 1203 fieldType: "image",
1203 }, 1204 },
1204 { 1205 {
1205 fieldName: "textBox", 1206 fieldName: "textBox",
1206 displayName: "Text Box", 1207 displayName: "Text Box",
1207 fieldValue: null, 1208 fieldValue: null,
1208 fieldType: "text", 1209 fieldType: "text",
1209 }, 1210 },
1210 ], 1211 ],
1211 }, 1212 },
1212 }, 1213 },
1213 { 1214 {
1214 tempId: "T2_ROsUOEy3vxsRAiQ72XdI", 1215 tempId: "T2_ROsUOEy3vxsRAiQ72XdI",
1215 metaData: { 1216 metaData: {
1216 fields: [ 1217 fields: [
1217 { 1218 {
1218 fieldName: "authorImage", 1219 fieldName: "authorImage",
1219 displayName: "Author Image", 1220 displayName: "Author Image",
1220 fieldValue: null, 1221 fieldValue: null,
1221 fieldType: "image", 1222 fieldType: "image",
1222 }, 1223 },
1223 ], 1224 ],
1224 comments: [{ comment: null }, { comment: null }, { comment: null }], 1225 comments: [{ comment: null }, { comment: null }, { comment: null }],
1225 }, 1226 },
1226 }, 1227 },
1227 { 1228 {
1228 tempId: "T3_cqNIf7tuqL4jyON63dA7", 1229 tempId: "T3_cqNIf7tuqL4jyON63dA7",
1229 metaData: { 1230 metaData: {
1230 fields: [ 1231 fields: [
1231 { 1232 {
1232 fieldName: "authorImage", 1233 fieldName: "authorImage",
1233 displayName: "Author Image", 1234 displayName: "Author Image",
1234 fieldValue: null, 1235 fieldValue: null,
1235 fieldType: "image", 1236 fieldType: "image",
1236 }, 1237 },
1237 { 1238 {
1238 fieldName: "mobileImage", 1239 fieldName: "mobileImage",
1239 displayName: "Mobile Image", 1240 displayName: "Mobile Image",
1240 fieldValue: null, 1241 fieldValue: null,
1241 fieldType: "image", 1242 fieldType: "image",
1242 }, 1243 },
1243 ], 1244 ],
1244 comments: [ 1245 comments: [
1245 { comment: null }, 1246 { comment: null },
1246 { comment: null }, 1247 { comment: null },
1247 { comment: null }, 1248 { comment: null },
1248 { comment: null }, 1249 { comment: null },
1249 ], 1250 ],
1250 }, 1251 },
1251 }, 1252 },
1252 ]; 1253 ];
1253 var i = obj.findIndex((obj_) => obj_.tempId == tempId); 1254 var i = obj.findIndex((obj_) => obj_.tempId == tempId);
1254 return obj[i]; 1255 return obj[i];
1255 }, 1256 },
1256 }, 1257 },
1257 }; 1258 };
1258 </script> 1259 </script>
1259 1260