viithiisys / spotlight-frontend

Download as
Browse Code ยป

Commit 0e3c6b828304cce2fdb795242d20985e04813bcc

Authored by Neeraj Sharma
1 parent 37f413ce84
Exists in admin

add create study fields

Showing 1 changed file with 168 additions and 114 deletions   Show diff stats
src/components/Profile.vue
Diff comments   View file @0e3c6b8
1 1 <template>
2 2 <main class="landing-page">
3   -
4   -
5   - <!-- profile -->
  3 + <!-- profile -->
6 4 <div class="popup-wrp" style="display: none">
7 5 <div class="overlay" @click="hideDialog"></div>
8   - <div class="popup-set" id="add-profile" style="display: none;width:700px">
9   -
  6 + <div
  7 + class="popup-set"
  8 + id="add-profile"
  9 + style="display: none; width: 700px"
  10 + >
10 11 <!-- header -->
11 12 <div class="popup-body">
12 13 <form class="popup-forms">
13 14 <div class="row">
14 15 <!-- input -->
15   - <img :src="templateImage" />
  16 + <img :src="templateImage" />
16 17 <!-- input -->
17   -
18   -
19   -
  18 +
20 19 <!-- input -->
21 20  
22 21 <!-- input -->
... ... @@ -32,7 +31,6 @@
32 31 </div> -->
33 32 <!-- input -->
34 33 </div>
35   -
36 34 </form>
37 35 </div>
38 36 <div class="clearfix"></div>
... ... @@ -63,10 +61,20 @@
63 61 <div class="collapse navbar-collapse" id="navbarsExample03">
64 62 <ul class="navbar-nav mr-auto">
65 63 <li class="nav-item active">
66   - <a class="nav-link" style="cursor:pointer" @click="listPage('/casestudy')">Case Study List</a>
  64 + <a
  65 + class="nav-link"
  66 + style="cursor: pointer"
  67 + @click="listPage('/casestudy')"
  68 + >Case Study List</a
  69 + >
67 70 </li>
68 71 <li class="nav-item active">
69   - <a class="nav-link" style="cursor:pointer" @click="listPage('/insight')">Create Insight</a>
  72 + <a
  73 + class="nav-link"
  74 + style="cursor: pointer"
  75 + @click="listPage('/insight')"
  76 + >Create Insight</a
  77 + >
70 78 </li>
71 79 </ul>
72 80 </div>
... ... @@ -130,8 +138,8 @@
130 138 />
131 139 </div>
132 140 </div>
133   - <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
134   - <!-- <div class="form-group floating-label">
  141 + <!-- <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
  142 + <div class="form-group floating-label">
135 143 <label for="lname" class="lname">Focus</label>
136 144 <input
137 145 type="text"
... ... @@ -140,7 +148,25 @@
140 148 placeholder=" "
141 149 v-model="caseStudy.caseStudyDetails.intro.focus"
142 150 />
143   - </div> -->
  151 + </div>
  152 + </div> -->
  153 +
  154 + <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
  155 + <div class="form-group floating-label">
  156 + <label for="lname" class="lname"> App logo</label>
  157 + <img
  158 + v-if="caseStudy.caseStudyDetails.intro.logoURL"
  159 + style="width: 40px; height: 40px"
  160 + :src="caseStudy.caseStudyDetails.intro.logoURL"
  161 + />
  162 + <input
  163 + @change="createImage('logo')"
  164 + type="file"
  165 + name="photso"
  166 + id="logo"
  167 + accept="image/*"
  168 + />
  169 + </div>
144 170 </div>
145 171 </div>
146 172 <!-- 1st row end -->
... ... @@ -165,33 +191,49 @@
165 191 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
166 192 <div class="form-group floating-label">
167 193 <label for="lname" class="lname">Platform</label>
168   - <input
  194 + <!-- <input
169 195 type="text"
170 196 class="form-control"
171 197 value=""
172 198 placeholder=" "
173 199 v-model="caseStudy.caseStudyDetails.intro.platForm"
174   - />
  200 + /> -->
  201 + <select
  202 + class="form-control"
  203 + v-model="selectPlatform"
  204 + @change="addInsight('platform')"
  205 + >
  206 + <option value="null">Select Insight Tag</option>
  207 + <option value="Ios">Ios</option>
  208 + <option value="Web">Web</option>
  209 + <option value="Android">Android</option>
  210 + </select>
175 211 </div>
176 212 </div>
177   -
178 213 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
179 214 <div class="form-group floating-label">
180   - <label for="lname" class="lname"> App logo</label>
181   - <img v-if="caseStudy.caseStudyDetails.intro.logoURL" style="width:40px;height: 40px;" :src="caseStudy.caseStudyDetails.intro.logoURL"
182   - />
183   - <input
184   - @change="createImage('logo')"
185   - type="file"
186   - name="photso"
187   - id="logo"
188   - accept="image/*"
189   - />
  215 + <label for="lname" class="lname"></label>
  216 + <label for="lname" class="lname"></label>
  217 + <ul class="interests">
  218 + <!-- v-for="(interest, i) in caseStudy.caseStudyDetails
  219 + .insightTags"
  220 + :key="i" -->
  221 +
  222 + <li v-if="caseStudy.caseStudyDetails.intro.platForm">
  223 + <span>{{ caseStudy.caseStudyDetails.intro.platForm }}</span>
  224 + <a
  225 + href="javascript:void(0);"
  226 + @click="removeInsight(0, 'platform')"
  227 + class="cat-minus"
  228 + ><img src="../assets/images/minus.svg"
  229 + /></a>
  230 + </li>
  231 + </ul>
190 232 </div>
191 233 </div>
192 234 </div>
193 235 <!-- 2nd row -->
194   - <!-- 3rd row -->
  236 + <!-- 3rd row -->`
195 237 <div class="row">
196 238 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
197 239 <div class="form-group floating-label">
... ... @@ -202,8 +244,7 @@
202 244 class=""
203 245 placeholder="Add Focus Areas"
204 246 v-model="focusName"
205   - v-on:keyup.enter="addInsight('focus')"
206   -
  247 + v-on:keyup.enter="addInsight('focus')"
207 248 />
208 249 <a href="javascript:void(0);" @click="addInsight('focus')"
209 250 ><img src="../assets/images/plus-circle.svg"
... ... @@ -307,8 +348,11 @@
307 348 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
308 349 <div class="form-group floating-label">
309 350 <label for="lname" class="lname"> Author Image</label>
310   - <img v-if="caseStudy.caseStudyDetails.outro.authorImage[0]" style="width:40px;height: 40px;" :src="caseStudy.caseStudyDetails.outro.authorImage[0]"
311   - />
  351 + <img
  352 + v-if="caseStudy.caseStudyDetails.outro.authorImage[0]"
  353 + style="width: 40px; height: 40px"
  354 + :src="caseStudy.caseStudyDetails.outro.authorImage[0]"
  355 + />
312 356 <input
313 357 @change="createImage('outdor')"
314 358 type="file"
... ... @@ -333,8 +377,6 @@
333 377 </div>
334 378 </div>
335 379  
336   -
337   -
338 380 <!-- case study slides-->
339 381 <div
340 382 class="row profile-tab-spc-top"
... ... @@ -360,28 +402,27 @@
360 402 >
361 403 </p>
362 404 </li>
363   - <li class="nav-item active" v-if="slide.insight">
  405 + <li class="nav-item active" v-if="slide.insight">
364 406 <div class="form-group floating-label">
365   - <label for="lname" class="lname">Insight</label>
366   - <select
367   - class="form-control"
368   - v-model="insightId"
369   - v-on:change="insightSelected(slide)"
370   - >
371   - <option value="null">Select Insight</option>
372   - <option v-for="(insight, i) in insightList" :key="i" :value="insight._id">
373   - {{ insight.title }}
374   - </option>
375   - </select>
376   - </div>
  407 + <label for="lname" class="lname">Insight</label>
  408 + <select
  409 + class="form-control"
  410 + v-model="insightId"
  411 + v-on:change="insightSelected(slide)"
  412 + >
  413 + <option value="null">Select Insight</option>
  414 + <option
  415 + v-for="(insight, i) in insightList"
  416 + :key="i"
  417 + :value="insight._id"
  418 + >
  419 + {{ insight.title }}
  420 + </option>
  421 + </select>
  422 + </div>
377 423 </li>
378 424 </ul>
379 425 </div>
380   -
381   -
382   -
383   -
384   -
385 426  
386 427 <div class="row">
387 428 <div
... ... @@ -408,8 +449,11 @@
408 449 v-if="field.fieldType == 'image'"
409 450 >
410 451 <label for="lname" class="lname"> {{ field.displayName }}</label>
411   - <img v-if="field.fieldValue" style="width:40px;height: 40px;" :src="field.fieldValue"
412   - />
  452 + <img
  453 + v-if="field.fieldValue"
  454 + style="width: 40px; height: 40px"
  455 + :src="field.fieldValue"
  456 + />
413 457 <input
414 458 @change="fieldcreateImage(i, j)"
415 459 type="file"
... ... @@ -435,15 +479,13 @@
435 479 value=""
436 480 placeholder=" "
437 481 v-model="cum.comment"
438   - v-on:blur="updateComment(cum)"
  482 + v-on:blur="updateComment(cum)"
439 483 />
440 484 </div>
441 485 </div>
442 486 </div>
443   -
444 487 </div>
445 488  
446   -
447 489 <!-- 1st row -->
448 490 <div class="row">
449 491 <div class="col-sm-4 col-md-4 col-lg-4 col-xl-4">
... ... @@ -501,9 +543,9 @@ export default {
501 543  
502 544 data() {
503 545 return {
504   - object:null,
  546 + object: null,
505 547 loggedinFlag: false,
506   - templateImage:null,
  548 + templateImage: null,
507 549 caseId: null,
508 550 editMode: false,
509 551 userData: null,
... ... @@ -514,7 +556,7 @@ export default {
514 556 userList: [],
515 557 templateList: [],
516 558 insightList: [],
517   - insightId:null,
  559 + insightId: null,
518 560 caseStudy: {
519 561 caseStudyDetails: {
520 562 userId: [],
... ... @@ -538,6 +580,7 @@ export default {
538 580 },
539 581 slides: [],
540 582 },
  583 + selectPlatform: "",
541 584 };
542 585 },
543 586 mounted() {
... ... @@ -548,7 +591,7 @@ export default {
548 591 if (introData) {
549 592 introData = JSON.parse(introData);
550 593 console.log("introData", introData);
551   - if(introData.intro.focus){
  594 + if (introData.intro.focus) {
552 595 delete introData.intro.focus;
553 596 }
554 597 this.caseStudy.caseStudyDetails.intro = introData.intro;
... ... @@ -556,6 +599,8 @@ export default {
556 599 this.caseStudy.caseStudyDetails.outro = introData.outro;
557 600 this.caseStudy.caseStudyDetails.insightTags = introData.insightTags;
558 601 this.caseStudy.caseStudyDetails.focusAreas = introData.focusAreas;
  602 + this.selectPlatform = introData.intro.platForm;
  603 + console.log("this.selectPlatform", this.selectPlatform);
559 604 }
560 605 }
561 606 var userdata = localStorage.getItem("spotlight_usertoken");
... ... @@ -586,6 +631,9 @@ export default {
586 631 } else if (type == "insight") {
587 632 this.caseStudy.caseStudyDetails.insightTags.push(this.insightName);
588 633 this.insightName = null;
  634 + } else if (type == "platform") {
  635 + this.caseStudy.caseStudyDetails.intro.platForm = this.selectPlatform;
  636 + // this.selectPlatform = null;
589 637 }
590 638 },
591 639 removeInsight(i, type) {
... ... @@ -593,39 +641,40 @@ export default {
593 641 this.caseStudy.caseStudyDetails.focusAreas.splice(i, 1);
594 642 } else if (type == "insight") {
595 643 this.caseStudy.caseStudyDetails.insightTags.splice(i, 1);
  644 + } else if (type == "platform") {
  645 + this.caseStudy.caseStudyDetails.intro.platForm = "";
  646 + this.selectPlatform = null;
596 647 }
597 648 },
598 649  
599 650 async slideSelected(i) {
600 651 console.log("id is", this.templateList[i]);
601 652 this.object = JSON.parse(JSON.stringify(this.templateList[i]));
602   -
  653 +
603 654 // var keys = Object.keys(this.templateList[i]);
604 655 // keys.forEach(element => {
605   - // obj[element] = this.templateList[i][element];
  656 + // obj[element] = this.templateList[i][element];
606 657 // });
607 658  
608   - console.log("obj", this.object)
  659 + console.log("obj", this.object);
609 660 // slideMetadata = await this.getMeatda(this.templateList[i]._id);
610 661 this.slideId = null;
611 662 // this.templateList[i].metaData = slideMetadata.metaData;
612   - this.caseStudy.slides.push( this.object);
613   - this.templateList[i].metaData.fields.forEach(fields_ => {
614   - fields_.fieldValue == null
  663 + this.caseStudy.slides.push(this.object);
  664 + this.templateList[i].metaData.fields.forEach((fields_) => {
  665 + fields_.fieldValue == null;
  666 + });
  667 + if (this.templateList[i].metaData.comments) {
  668 + this.templateList[i].metaData.comments.forEach((coments_) => {
  669 + coments_.comment == null;
615 670 });
616   - if(this.templateList[i].metaData.comments){
617   - this.templateList[i].metaData.comments.forEach(coments_ => {
618   - coments_.comment == null
619   - });
620   -
621   - }
  671 + }
622 672 console.log("this.caseStudy.slides", this.caseStudy.slides);
623 673 },
624 674 async insightSelected(data) {
625   -
626 675 // this.caseStudy.slides.push(this.templateList[i]);
627   -
628   - console.log("data",data);
  676 +
  677 + console.log("data", data);
629 678 data.insightId = this.insightId;
630 679 // this.insightId = null;
631 680 },
... ... @@ -664,14 +713,21 @@ export default {
664 713 })
665 714 .then((response) => {
666 715 if (type == "logo") {
667   -
668   - setTimeout(() => this.caseStudy.caseStudyDetails.intro.logoURL = response.data.data, 99);
  716 + setTimeout(
  717 + () =>
  718 + (this.caseStudy.caseStudyDetails.intro.logoURL =
  719 + response.data.data),
  720 + 99
  721 + );
669 722 } else if (type == "outdor") {
670 723 this.caseStudy.caseStudyDetails.outro.authorImage = [];
671   - setTimeout(() => this.caseStudy.caseStudyDetails.outro.authorImage.push(
672   - response.data.data
673   - ), 99);
674   -
  724 + setTimeout(
  725 + () =>
  726 + this.caseStudy.caseStudyDetails.outro.authorImage.push(
  727 + response.data.data
  728 + ),
  729 + 99
  730 + );
675 731 }
676 732  
677 733 console.log(response.data.data);
... ... @@ -716,10 +772,13 @@ export default {
716 772 },
717 773 })
718 774 .then((response) => {
719   - setTimeout(() => this.caseStudy.slides[i].metaData.fields[j].fieldValue =
720   - response.data.data, 10);
  775 + setTimeout(
  776 + () =>
  777 + (this.caseStudy.slides[i].metaData.fields[j].fieldValue =
  778 + response.data.data),
  779 + 10
  780 + );
721 781  
722   -
723 782 console.log(response.data.data);
724 783 console.log(this.caseStudy);
725 784 })
... ... @@ -790,7 +849,7 @@ export default {
790 849 })
791 850 .then((response) => {
792 851 this.insightList = response.data.data;
793   -
  852 +
794 853 console.log("insight", response.data.data);
795 854 })
796 855 .catch((error) => console.log(error));
... ... @@ -806,7 +865,7 @@ export default {
806 865 .then((response) => {
807 866 var finalArray = [];
808 867 response.data.data.forEach((template_) => {
809   - console.log("template_",template_)
  868 + console.log("template_", template_);
810 869 var keys = [];
811 870 var i = this.templateList.findIndex(
812 871 (temp_) => temp_._id == template_.templateId
... ... @@ -815,7 +874,7 @@ export default {
815 874 _id: this.templateList[i]._id,
816 875 bounceBoard: this.templateList[i].bounceBoard,
817 876 insight: this.templateList[i].insight,
818   - slideId:template_._id,
  877 + slideId: template_._id,
819 878 // commentBox: this.templateList[i].commentBox,
820 879 metaData: {
821 880 fields: [],
... ... @@ -840,6 +899,7 @@ export default {
840 899 obj.metaData.fields.push(fieldobj);
841 900 });
842 901 finalArray.push(obj);
  902 + this.insightId = template_.insight._id;
843 903 });
844 904 this.caseStudy.slides = finalArray;
845 905 console.log("----", finalArray);
... ... @@ -858,13 +918,11 @@ export default {
858 918 slideData.templateId = slides._id;
859 919 slideData.bounceBoard = slides.bounceBoard;
860 920 slideData.insight = slides.insight;
861   - if(slides.slideId){
  921 + if (slides.slideId) {
862 922 slideData.slideId = slides.slideId;
863   -
864 923 }
865   - if(slides.insightId){
  924 + if (slides.insightId) {
866 925 slideData.insightId = slides.insightId;
867   -
868 926 }
869 927 if (slides.metaData.comments && slides.metaData.comments.length > 0) {
870 928 slideData.comments = slides.metaData.comments;
... ... @@ -888,19 +946,19 @@ export default {
888 946 console.log("slideData", slidArray);
889 947 if (this.editMode) {
890 948 this.updateProfile(slidArray);
891   - }else{
  949 + } else {
892 950 this.saveProfile(slidArray);
893 951 }
894 952 },
895   - updateComment(cmnt){
896   - if(!cmnt._id){
  953 + updateComment(cmnt) {
  954 + if (!cmnt._id) {
897 955 return;
898 956 }
899   - console.log("cmnts",cmnt);
  957 + console.log("cmnts", cmnt);
900 958 var obj = {
901   - 'slideId':cmnt.slideId,
902   - 'commentId':cmnt._id,
903   - 'comment':cmnt.comment
  959 + slideId: cmnt.slideId,
  960 + commentId: cmnt._id,
  961 + comment: cmnt.comment,
904 962 };
905 963 axios
906 964 .put("/superAdmin/comment", obj, {
... ... @@ -909,12 +967,9 @@ export default {
909 967 },
910 968 })
911 969 .then((response) => {
912   -
913 970 console.log(response);
914 971 })
915   - .catch((error) => {
916   -
917   - });
  972 + .catch((error) => {});
918 973 },
919 974  
920 975 saveProfile(slides) {
... ... @@ -933,7 +988,7 @@ export default {
933 988 .then((response) => {
934 989 // this.userData = response.data.data;
935 990 this.$toaster.success("Case Study Created");
936   - this.$router.go(this.$router.currentRoute)
  991 + this.$router.go(this.$router.currentRoute);
937 992  
938 993 console.log(response);
939 994 })
... ... @@ -943,16 +998,16 @@ export default {
943 998 }
944 999 });
945 1000 },
946   -
  1001 +
947 1002 updateProfile(slides) {
948 1003 var obj = {};
949   - obj.caseStudyId = this.caseId,
950   - obj.caseStudyDetails = this.caseStudy.caseStudyDetails;
  1004 + (obj.caseStudyId = this.caseId),
  1005 + (obj.caseStudyDetails = this.caseStudy.caseStudyDetails);
951 1006 obj.caseStudyDetails.intro.readTime = Math.round(
952 1007 slides.length / 3
953 1008 ).toString();
954 1009 obj.slides = slides;
955   - delete obj.caseStudyDetails.intro.focus;
  1010 + delete obj.caseStudyDetails.intro.focus;
956 1011 axios
957 1012 .put("/superAdmin/caseStudy", obj, {
958 1013 headers: {
... ... @@ -962,8 +1017,7 @@ export default {
962 1017 .then((response) => {
963 1018 // this.userData = response.data.data;
964 1019 this.$toaster.success("Case Study Updated");
965   - this.$router.go(this.$router.currentRoute)
966   -
  1020 + this.$router.go(this.$router.currentRoute);
967 1021  
968 1022 console.log(response);
969 1023 })
... ... @@ -973,12 +1027,12 @@ export default {
973 1027 }
974 1028 });
975 1029 },
976   - listPage(url){
977   - this.$router.push(url);
  1030 + listPage(url) {
  1031 + this.$router.push(url);
978 1032 },
979 1033  
980 1034 addProfileDialog(slide) {
981   - console.log("slide",slide)
  1035 + console.log("slide", slide);
982 1036 this.templateImage = slide.templateImage;
983 1037 $(".inner-wrp").addClass("body-blur");
984 1038 $("#add-social-links").hide();
... ...