Commit 34a2a2609b12b678dfeeafe5a8e59707c9a0eb98

Authored by Amber Dev
1 parent de958fcfc5

added upload files option

src/Services/AllApiCalls.js
1 import GetApis from "@/Services/GetApis.js"; 1 import GetApis from "@/Services/GetApis.js";
2 import PutApis from "@/Services/PutApis.js"; 2 import PutApis from "@/Services/PutApis.js";
3 3
4 export default { 4 export default {
5 mixins: [GetApis, PutApis], 5 mixins: [GetApis, PutApis],
6 data() { 6 data() {
7 return { 7 return {
8 // UploadPdf.vue 8 // UploadPdf.vue
9 emptyPdf: '', 9 emptyPdf: '',
10 // UploadFiles.vue 10 // UploadFiles.vue
11 trigger: '', 11 trigger: '',
12 pptFile: "", 12 pptFile: "",
13 pptFileName: "", 13 pptFileName: "",
14 pdfFile: "", 14 pdfFile: "",
15 pdfFileName: "" 15 pdfFileName: ""
16 16
17 } 17 }
18 }, 18 },
19 methods: { 19 methods: {
20 /************************** METHODS USED FOR COMMON FILES *********************/ 20 /************************** METHODS USED FOR COMMON FILES *********************/
21 /* METHODS USED FOR UploadPdf.vue */ 21 /* METHODS USED FOR UploadPdf.vue */
22 pdfFileSelected(e, message) { 22 pdfFileSelected(e, message) {
23 if (message == "uploadPPT") { 23
24 this.pptFile = e.fileInBase64; 24 this.pdfFile = e.fileInBase64;
25 this.pptFileName = e.selectedFileName; 25 this.pdfFileName = e.selectedFileName;
26 this.trigger = e.trigger; 26 this.emptyPdf = e.emptyPdf;
27 console.log("ppt file - ", this.pptFile); 27
28 }
29 if (message == "uploadPDF") {
30 this.pdfFile = e.fileInBase64;
31 this.pdfFileName = e.selectedFileName;
32 this.emptyPdf = e.trigger;
33 console.log("pdf file - ", this.pdfFile);
34 }
35 }, 28 },
36 29
37 /* METHODS USED FOR UploadFiles.vue */ 30 /* METHODS USED FOR UploadFiles.vue */
38 fileSelected(e, message) { 31 fileSelected(e, message) {
39 if (message == "uploadPPT") { 32 if (message == "uploadPPT") {
40 this.pptFile = e.fileInBase64; 33 this.pptFile = e.fileInBase64;
41 this.pptFileName = e.selectedFileName; 34 this.pptFileName = e.selectedFileName;
42 this.trigger = e.trigger; 35 this.trigger = e.trigger;
43 console.log("ppt file - ", this.pptFile);
44 } 36 }
45 if (message == "uploadPDF") { 37 if (message == "uploadPDF") {
46 this.pdfFile = e.fileInBase64; 38 this.pdfFile = e.fileInBase64;
47 this.pdfFileName = e.selectedFileName; 39 this.pdfFileName = e.selectedFileName;
48 this.emptyPdf = e.trigger; 40 this.emptyPdf = e.trigger;
49 console.log("pdf file - ", this.pdfFile);
50 } 41 }
51 }, 42 },
52 43
53 44
54 }, 45 },
55 } 46 }
src/pages/Common/UploadFiles.vue
1 <template> 1 <template>
2 <div> 2 <div>
3 <v-text-field 3 <v-text-field
4 :label="label" 4 :label="label"
5 @click="clickInputTag" 5 @click="clickInputTag"
6 v-model="fileName" 6 v-model="fileName"
7 append-icon="attach_file" 7 append-icon="attach_file"
8 ></v-text-field> 8 ></v-text-field>
9 <input 9 <input
10 type="file" 10 type="file"
11 style="display: none" 11 style="display: none"
12 :id="id" 12 :id="id"
13 :ref="reference" 13 :ref="reference"
14 accept="image/*" 14 accept="image/*"
15 @change="convertToBase64()" 15 @change="convertToBase64()"
16 /> 16 />
17 </div> 17 </div>
18 </template> 18 </template>
19 <script > 19 <script >
20 export default { 20 export default {
21 props: ["label", "reference", "id", "trigger"], 21 props: ["label", "reference", "id", "trigger"],
22 data() { 22 data() {
23 return { 23 return {
24 fileToLoad: "", 24 fileToLoad: "",
25 fileName: "", 25 fileName: "",
26 fileInBase64: "" 26 fileInBase64: ""
27 }; 27 };
28 }, 28 },
29 methods: { 29 methods: {
30 clickInputTag() { 30 clickInputTag() {
31 document.getElementById(this.id).click(); 31 document.getElementById(this.id).click();
32 }, 32 },
33 convertToBase64(e) { 33 convertToBase64(e) {
34 //Read File 34 //Read File
35 var selectedFile = document.getElementById(this.id).files; 35 var selectedFile = document.getElementById(this.id).files;
36 //Check File is not Empty 36 //Check File is not Empty
37 37
38 if (selectedFile.length > 0) { 38 if (selectedFile.length > 0) {
39 // Select the very first file from list 39 // Select the very first file from list
40 this.fileToLoad = selectedFile[0]; 40 this.fileToLoad = selectedFile[0];
41 this.fileName = selectedFile[0].name; 41 this.fileName = selectedFile[0].name;
42 console.log("file name - ", this.fileName);
43 // FileReader function for read the file. 42 // FileReader function for read the file.
44 var fileReader = new FileReader(); 43 var fileReader = new FileReader();
45 // Onload of file read the file content 44 // Onload of file read the file content
46 let vm = this; 45 let vm = this;
47 fileReader.onload = function(fileLoadedEvent) { 46 fileReader.onload = function(fileLoadedEvent) {
48 vm.fileInBase64 = fileLoadedEvent.target.result; 47 vm.fileInBase64 = fileLoadedEvent.target.result;
49 // Print data in console
50 console.log(vm.fileInBase64);
51 48
52 var str = vm.fileInBase64; 49 var str = vm.fileInBase64;
53 const [baseUrl, requiredUrl] = str.split(/,/); 50 const [baseUrl, requiredUrl] = str.split(/,/);
54 console.log("required - ", requiredUrl);
55 51
56 let fileData = { 52 let fileData = {
57 fileName: this.fileName, 53 fileName: this.fileName,
58 fileInBase64: requiredUrl, 54 fileInBase64: requiredUrl,
59 trigger: "" 55 trigger: ""
60 }; 56 };
61 vm.$emit("fileSelected", fileData); 57 vm.$emit("fileSelected", fileData);
62 }; 58 };
63 59
64 // Convert data to base64 60 // Convert data to base64
65 fileReader.readAsDataURL(this.fileToLoad); 61 fileReader.readAsDataURL(this.fileToLoad);
66 } 62 }
67 }, 63 },
68 resetInput(params) { 64 resetInput(params) {
69 // RESET INPUT ELEMENT,fileName and selectedfile array 65 // RESET INPUT ELEMENT,fileName and selectedfile array
70
71 this.$refs[this.reference].type = "text";
72 this.$refs[this.reference].type = "file";
73 this.fileName = "";
74 this.fileToLoad = null; 66 this.fileToLoad = null;
67 this.fileName = null;
75 this.fileInBase64 = null; 68 this.fileInBase64 = null;
69 document.getElementById(this.id).type = "text";
70 document.getElementById(this.id).type = "file";
71
76 let fileData = { 72 let fileData = {
77 fileName: this.fileName, 73 fileName: this.fileName,
78 fileInBase64: this.fileInBase64, 74 fileInBase64: this.fileInBase64,
79 trigger: "" 75 trigger: ""
80 }; 76 };
81 this.$emit("fileSelected", fileData); 77 this.$emit("fileSelected", fileData);
82 console.log("its reset - ", fileData);
83 } 78 }
84 }, 79 },
85 watch: { 80 watch: {
86 respondToTrigger() { 81 respondToTrigger() {
87 if (this.respondToTrigger == "reset") { 82 if (this.respondToTrigger == "reset") {
88 console.log("Resets - ", this.trigger);
89 this.resetInput(); 83 this.resetInput();
90 } 84 }
91 } 85 }
92 }, 86 },
93 computed: { 87 computed: {
94 respondToTrigger: { 88 respondToTrigger: {
95 get() { 89 get() {
96 return this.trigger; 90 return this.trigger;
97 }, 91 },
98 set(newVal) {} 92 set(newVal) {}
99 // this.respondToTrigger = this.trigger; 93 // this.respondToTrigger = this.trigger;
100 } 94 }
101 } 95 }
src/pages/Common/UploadPdf.vue
1 <template> 1 <template>
2 <div> 2 <div>
3 <v-text-field 3 <v-text-field
4 :label="label" 4 :label="label"
5 @click="clickInputTag" 5 @click="clickInputTag"
6 v-model="fileName" 6 v-model="fileName"
7 append-icon="attach_file" 7 append-icon="attach_file"
8 ></v-text-field> 8 ></v-text-field>
9 <input 9 <input
10 type="file" 10 type="file"
11 style="display: none" 11 style="display: none"
12 :id="id" 12 :id="id"
13 :ref="reference" 13 :ref="reference"
14 accept="image/*" 14 accept="image/*"
15 @change="convertToBase64()" 15 @change="convertToBase64()"
16 /> 16 />
17 </div> 17 </div>
18 </template> 18 </template>
19 <script > 19 <script >
20 export default { 20 export default {
21 props: ["label", "reference", "id", "emptyPdf"], 21 props: ["label", "reference", "id", "emptyPdf"],
22 data() { 22 data() {
23 return { 23 return {
24 fileToLoad: "", 24 fileToLoad: "",
25 fileName: "", 25 fileName: "",
26 fileInBase64: "" 26 fileInBase64: ""
27 }; 27 };
28 }, 28 },
29 methods: { 29 methods: {
30 clickInputTag() { 30 clickInputTag() {
31 document.getElementById(this.id).click(); 31 document.getElementById(this.id).click();
32 }, 32 },
33 convertToBase64(e) { 33 convertToBase64(e) {
34 //Read File 34 //Read File
35 var selectedFile = document.getElementById(this.id).files; 35 var selectedFile = document.getElementById(this.id).files;
36 //Check File is not Empty 36 //Check File is not Empty
37 37
38 if (selectedFile.length > 0) { 38 if (selectedFile.length > 0) {
39 // Select the very first file from list 39 // Select the very first file from list
40 this.fileToLoad = selectedFile[0]; 40 this.fileToLoad = selectedFile[0];
41 this.fileName = selectedFile[0].name; 41 this.fileName = selectedFile[0].name;
42 console.log("file name - ", this.fileName); 42 // console.log("file name - ", this.fileName);
43 // FileReader function for read the file. 43 // FileReader function for read the file.
44 var fileReader = new FileReader(); 44 var fileReader = new FileReader();
45 // Onload of file read the file content 45 // Onload of file read the file content
46 let vm = this; 46 let vm = this;
47 fileReader.onload = function(fileLoadedEvent) { 47 fileReader.onload = function(fileLoadedEvent) {
48 vm.fileInBase64 = fileLoadedEvent.target.result; 48 vm.fileInBase64 = fileLoadedEvent.target.result;
49 // Print data in console 49 // Print data in console
50 console.log(vm.fileInBase64); 50 // console.log(vm.fileInBase64);
51 51
52 var str = vm.fileInBase64; 52 var str = vm.fileInBase64;
53 const [baseUrl, requiredUrl] = str.split(/,/); 53 const [baseUrl, requiredUrl] = str.split(/,/);
54 console.log("required - ", requiredUrl); 54 // console.log("required - ", requiredUrl);
55 55
56 let fileData = { 56 let fileData = {
57 fileName: this.fileName, 57 fileName: this.fileName,
58 fileInBase64: requiredUrl, 58 fileInBase64: requiredUrl,
59 trigger: "" 59 emptyPdf: ""
60 }; 60 };
61 vm.$emit("pdfFileSelected", fileData); 61 vm.$emit("pdfFileSelected", fileData);
62 }; 62 };
63 63
64 // Convert data to base64 64 // Convert data to base64
65 fileReader.readAsDataURL(this.fileToLoad); 65 fileReader.readAsDataURL(this.fileToLoad);
66 } 66 }
67 }, 67 },
68 resetInput(params) { 68 resetInput(params) {
69 // RESET INPUT ELEMENT,fileName and selectedfile array 69 // RESET INPUT ELEMENT,fileName and selectedfile array
70
71 this.$refs[this.reference].type = "text";
72 this.$refs[this.reference].type = "file";
73 this.fileName = "";
74 this.fileToLoad = null; 70 this.fileToLoad = null;
71 this.fileName = null;
75 this.fileInBase64 = null; 72 this.fileInBase64 = null;
73 document.getElementById(this.id).type = "text";
74 document.getElementById(this.id).type = "file";
75
76 let fileData = { 76 let fileData = {
77 fileName: this.fileName, 77 fileName: this.fileName,
78 fileInBase64: this.fileInBase64, 78 fileInBase64: this.fileInBase64,
79 trigger: "" 79 emptyPdf: ""
80 }; 80 };
81 this.$emit("pdfFileSelected", fileData); 81 this.$emit("pdfFileSelected", fileData);
82 console.log("its reset - ", fileData); 82 // console.log("its reset - ", fileData);
83 } 83 }
84 }, 84 },
85 watch: { 85 watch: {
86 respondToTrigger() { 86 respondToTrigger() {
87 if (this.respondToTrigger == "reset") { 87 if (this.respondToTrigger == "reset") {
88 console.log("Resets - ", this.emptyPdf); 88 // console.log("Reset pdf - ", this.emptyPdf);
89 this.resetInput(); 89 this.resetInput();
90 } 90 }
91 } 91 }
92 }, 92 },
93 computed: { 93 computed: {
94 respondToTrigger: { 94 respondToTrigger: {
95 get() { 95 get() {
96 return this.emptyPdf; 96 return this.emptyPdf;
97 }, 97 },
98 set(newVal) {} 98 set(newVal) {}
99 // this.respondToTrigger = this.trigger; 99 // this.respondToTrigger = this.trigger;
100 } 100 }
101 } 101 }
src/pages/Course/courseDetail.vue
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** Edit Chapter detail ****** --> 3 <!-- ****** Edit Chapter detail ****** -->
4 <v-dialog v-model="editCourseDetailDialog" max-width="1000px" scrollable> 4 <v-dialog v-model="editCourseDetailDialog" max-width="1000px" scrollable>
5 <v-card class="card-style pa-2" dark> 5 <v-card class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Chapter</label> 8 <label class="title text-xs-center">Edit Chapter</label>
9 <v-icon size="24" class="right" @click="editCourseDetailDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editCourseDetailDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-card-text> 12 <v-card-text>
13 <v-layout wrap> 13 <v-layout wrap>
14 <v-flex xs12 sm12> 14 <v-flex xs12 sm12>
15 <v-layout> 15 <v-layout>
16 <v-flex xs4 class="pt-4 subheading"> 16 <v-flex xs4 class="pt-4 subheading">
17 <label class="right">Select Class:</label> 17 <label class="right">Select Class:</label>
18 </v-flex> 18 </v-flex>
19 <v-flex xs8 sm6 class="ml-3"> 19 <v-flex xs8 sm6 class="ml-3">
20 <v-select 20 <v-select
21 small 21 small
22 :items="addclass" 22 :items="addclass"
23 label="Select Class" 23 label="Select Class"
24 v-model="editedCourse.classId" 24 v-model="editedCourse.classId"
25 item-text="classNum" 25 item-text="classNum"
26 item-value="_id" 26 item-value="_id"
27 name="Select Class" 27 name="Select Class"
28 @change="getCourses(editedCourse.classId)" 28 @change="getCourses(editedCourse.classId)"
29 class="mr-2" 29 class="mr-2"
30 required 30 required
31 ></v-select> 31 ></v-select>
32 </v-flex> 32 </v-flex>
33 </v-layout> 33 </v-layout>
34 </v-flex> 34 </v-flex>
35 <v-flex xs12 sm12> 35 <v-flex xs12 sm12>
36 <v-layout> 36 <v-layout>
37 <v-flex xs4 class="pt-4 subheading"> 37 <v-flex xs4 class="pt-4 subheading">
38 <label class="right">Select Course:</label> 38 <label class="right">Select Course:</label>
39 </v-flex> 39 </v-flex>
40 <v-flex xs8 sm6 class="ml-3"> 40 <v-flex xs8 sm6 class="ml-3">
41 <v-select 41 <v-select
42 :items="courseData" 42 :items="courseData"
43 label="Select Course" 43 label="Select Course"
44 v-model="editedCourse.courseId" 44 v-model="editedCourse.courseId"
45 item-text="courseName" 45 item-text="courseName"
46 item-value="_id" 46 item-value="_id"
47 required 47 required
48 class="ml-2" 48 class="ml-2"
49 ></v-select> 49 ></v-select>
50 </v-flex> 50 </v-flex>
51 </v-layout> 51 </v-layout>
52 </v-flex> 52 </v-flex>
53 </v-layout> 53 </v-layout>
54 <v-layout> 54 <v-layout>
55 <v-flex xs12 sm12 md11 lg11> 55 <v-flex xs12 sm12 md11 lg11>
56 <v-card-actions class="hidden-xs-only hidden-sm-only"> 56 <v-card-actions class="hidden-xs-only hidden-sm-only">
57 <v-spacer></v-spacer> 57 <v-spacer></v-spacer>
58 <v-btn round dark @click="save" :loading="editLoading" class="add-button mr-4">Save</v-btn> 58 <v-btn round dark @click="save" :loading="editLoading" class="add-button mr-4">Save</v-btn>
59 </v-card-actions> 59 </v-card-actions>
60 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 60 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
61 <v-spacer></v-spacer> 61 <v-spacer></v-spacer>
62 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 62 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
63 <v-spacer></v-spacer> 63 <v-spacer></v-spacer>
64 </v-card-actions> 64 </v-card-actions>
65 </v-flex> 65 </v-flex>
66 </v-layout> 66 </v-layout>
67 </v-card-text> 67 </v-card-text>
68 </v-card> 68 </v-card>
69 </v-dialog> 69 </v-dialog>
70 <!-- DIALOG BOX - EDIT CHAPTER--> 70 <!-- DIALOG BOX - EDIT CHAPTER-->
71 <v-dialog v-model="editChapterDetailDialog" max-width="1000px" scrollable> 71 <v-dialog v-model="editChapterDetailDialog" max-width="1000px" scrollable>
72 <v-card class="card-style pa-2" dark> 72 <v-card class="card-style pa-2" dark>
73 <v-layout> 73 <v-layout>
74 <v-flex xs12> 74 <v-flex xs12>
75 <label class="title text-xs-center">Edit Chapter</label> 75 <label class="title text-xs-center">Edit Chapter</label>
76 <v-icon 76 <v-icon
77 size="24" 77 size="24"
78 class="right" 78 class="right"
79 @click="editChapterDetailDialog = false; trigger = 'reset'; emptyPdf = 'reset' " 79 @click="editChapterDetailDialog = false; trigger = 'reset'; emptyPdf = 'reset' "
80 >cancel</v-icon> 80 >cancel</v-icon>
81 </v-flex> 81 </v-flex>
82 </v-layout> 82 </v-layout>
83 <v-card-text> 83 <v-card-text>
84 <v-layout wrap> 84 <v-layout wrap>
85 <!-- CHAPTER NAME --> 85 <!-- CHAPTER NAME -->
86 <v-flex xs12 sm12> 86 <v-flex xs12 sm12>
87 <v-layout> 87 <v-layout>
88 <v-flex xs4 class="pt-4 subheading"> 88 <v-flex xs4 class="pt-4 subheading">
89 <label class="right">Chapter Name:</label> 89 <label class="right">Chapter Name:</label>
90 </v-flex> 90 </v-flex>
91 <v-flex xs8 sm6 class="ml-3"> 91 <v-flex xs8 sm6 class="ml-3">
92 <v-text-field 92 <v-text-field
93 v-model="editChapter.chapterName" 93 v-model="editChapter.chapterName"
94 placeholder="fill your Title" 94 placeholder="fill your Title"
95 type="text" 95 type="text"
96 required 96 required
97 ></v-text-field> 97 ></v-text-field>
98 </v-flex> 98 </v-flex>
99 </v-layout> 99 </v-layout>
100 </v-flex> 100 </v-flex>
101 <!-- DESCRIPTION --> 101 <!-- DESCRIPTION -->
102 <v-flex xs12 sm12> 102 <v-flex xs12 sm12>
103 <v-layout> 103 <v-layout>
104 <v-flex xs4 class="pt-4 subheading"> 104 <v-flex xs4 class="pt-4 subheading">
105 <label class="right">Description:</label> 105 <label class="right">Description:</label>
106 </v-flex> 106 </v-flex>
107 <v-flex xs8 sm6 class="ml-3"> 107 <v-flex xs8 sm6 class="ml-3">
108 <v-text-field 108 <v-text-field
109 placeholder="fill your Description" 109 placeholder="fill your Description"
110 v-model="editChapter.description" 110 v-model="editChapter.description"
111 type="text" 111 type="text"
112 required 112 required
113 ></v-text-field> 113 ></v-text-field>
114 </v-flex> 114 </v-flex>
115 </v-layout> 115 </v-layout>
116 </v-flex> 116 </v-flex>
117 <!-- UPLOAD PPT --> 117 <!-- UPLOAD PPT -->
118 <v-flex xs12> 118 <v-flex xs12>
119 <v-layout> 119 <v-layout>
120 <v-flex xs4 class="pt-4 subheading"> 120 <v-flex xs4 class="pt-4 subheading">
121 <label class="right">Upload PPT:</label> 121 <label class="right">Upload PPT:</label>
122 </v-flex> 122 </v-flex>
123 <v-flex xs8 sm6 class="ml-3"> 123 <v-flex xs8 sm6 class="ml-3">
124 <UploadFiles 124 <UploadFiles
125 @fileSelected="fileSelected($event,'uploadPPT')" 125 @fileSelected="fileSelected($event,'uploadPPT')"
126 label="Add PPT" 126 label="Add PPT"
127 reference="EditPpt" 127 reference="EditPpt"
128 id="editPptInput" 128 id="editPptInput"
129 :trigger="trigger" 129 :trigger="trigger"
130 ></UploadFiles> 130 ></UploadFiles>
131 </v-flex> 131 </v-flex>
132 </v-layout> 132 </v-layout>
133 </v-flex> 133 </v-flex>
134 <!-- UPLOAD PDF --> 134 <!-- UPLOAD PDF -->
135 <v-flex xs12> 135 <v-flex xs12>
136 <v-layout> 136 <v-layout>
137 <v-flex xs4 class="pt-4 subheading"> 137 <v-flex xs4 class="pt-4 subheading">
138 <label class="right">Upload PDF:</label> 138 <label class="right">Upload PDF:</label>
139 </v-flex> 139 </v-flex>
140 <v-flex xs8 sm6 class="ml-3"> 140 <v-flex xs8 sm6 class="ml-3">
141 <UploadPdf 141 <UploadPdf
142 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 142 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
143 label="Add PDF" 143 label="Add PDF"
144 reference="editPdf" 144 reference="editPdf"
145 id="editPdfInput" 145 id="editPdfInput"
146 :trigger="emptyPdf" 146 :emptyPdf="emptyPdf"
147 ></UploadPdf> 147 ></UploadPdf>
148 </v-flex> 148 </v-flex>
149 </v-layout> 149 </v-layout>
150 </v-flex> 150 </v-flex>
151 </v-layout> 151 </v-layout>
152 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0"> 152 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0">
153 <v-layout 153 <v-layout
154 wrap 154 wrap
155 v-for="(editChapterPoint,index) in editChapter.chapterPoints" 155 v-for="(editChapterPoint,index) in editChapter.chapterPoints"
156 :key="index" 156 :key="index"
157 > 157 >
158 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 158 <v-flex xs12 sm12 md4 class="pt-4 subheading">
159 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 159 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
160 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 160 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
161 </v-flex> 161 </v-flex>
162 <v-layout> 162 <v-layout>
163 <v-flex xs10 sm10 sm5 md9 class="ml-3"> 163 <v-flex xs10 sm10 sm5 md9 class="ml-3">
164 <v-text-field :value="editChapterPoint" type="text" required></v-text-field> 164 <v-text-field :value="editChapterPoint" type="text" required></v-text-field>
165 </v-flex> 165 </v-flex>
166 <v-flex xs2 class="pt-4"> 166 <v-flex xs2 class="pt-4">
167 <v-icon @click="deleteUrl(index)">cancel</v-icon> 167 <v-icon @click="deleteUrl(index)">cancel</v-icon>
168 </v-flex> 168 </v-flex>
169 </v-layout> 169 </v-layout>
170 </v-layout> 170 </v-layout>
171 </v-flex>--> 171 </v-flex>-->
172 <v-flex xs12> 172 <v-flex xs12>
173 <div v-for="(updateImage,index) in updates" :key="index"> 173 <div v-for="(updateImage,index) in updates" :key="index">
174 <v-layout wrap> 174 <v-layout wrap>
175 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 175 <v-flex xs12 sm12 md4 class="pt-4 subheading">
176 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 176 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
177 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 177 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
178 </v-flex> 178 </v-flex>
179 <v-layout> 179 <v-layout>
180 <v-flex xs10 sm12 md9 class="ml-3"> 180 <v-flex xs10 sm12 md9 class="ml-3">
181 <v-text-field 181 <v-text-field
182 v-model="updateImage.value" 182 v-model="updateImage.value"
183 placeholder="Upload new Chapter Points" 183 placeholder="Upload new Chapter Points"
184 required 184 required
185 ></v-text-field> 185 ></v-text-field>
186 </v-flex> 186 </v-flex>
187 <v-flex xs2 class="pt-4"> 187 <v-flex xs2 class="pt-4">
188 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon> 188 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon>
189 <v-icon @click="update">add_circle</v-icon> 189 <v-icon @click="update">add_circle</v-icon>
190 </v-flex> 190 </v-flex>
191 </v-layout> 191 </v-layout>
192 </v-layout> 192 </v-layout>
193 </div> 193 </div>
194 </v-flex> 194 </v-flex>
195 <v-layout> 195 <v-layout>
196 <v-flex xs12 sm12 md11 lg11> 196 <v-flex xs12 sm12 md11 lg11>
197 <v-card-actions class="hidden-xs-only hidden-sm-only"> 197 <v-card-actions class="hidden-xs-only hidden-sm-only">
198 <v-spacer></v-spacer> 198 <v-spacer></v-spacer>
199 <v-btn 199 <v-btn
200 round 200 round
201 dark 201 dark
202 @click="saveChapter" 202 @click="saveChapter"
203 :loading="editLoading" 203 :loading="editLoading"
204 class="add-button mr-4" 204 class="add-button mr-4"
205 >Save</v-btn> 205 >Save</v-btn>
206 </v-card-actions> 206 </v-card-actions>
207 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 207 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
208 <v-spacer></v-spacer> 208 <v-spacer></v-spacer>
209 <v-btn 209 <v-btn
210 round 210 round
211 dark 211 dark
212 @click="saveChapter" 212 @click="saveChapter"
213 :loading="editLoading" 213 :loading="editLoading"
214 class="add-button" 214 class="add-button"
215 >Save</v-btn> 215 >Save</v-btn>
216 <v-spacer></v-spacer> 216 <v-spacer></v-spacer>
217 </v-card-actions> 217 </v-card-actions>
218 </v-flex> 218 </v-flex>
219 </v-layout> 219 </v-layout>
220 </v-card-text> 220 </v-card-text>
221 </v-card> 221 </v-card>
222 </v-dialog> 222 </v-dialog>
223 <!-- ADD NEW CHAPTER--> 223 <!-- ADD NEW CHAPTER-->
224 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable> 224 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable>
225 <v-card class="card-style pa-2" dark> 225 <v-card class="card-style pa-2" dark>
226 <v-layout> 226 <v-layout>
227 <v-flex xs12> 227 <v-flex xs12>
228 <label class="title text-xs-center">Add Chapter Detail</label> 228 <label class="title text-xs-center">Add Chapter Detail</label>
229 <v-icon 229 <v-icon
230 size="24" 230 size="24"
231 class="right" 231 class="right"
232 @click="addChapterDialog = false; trigger = 'reset'; emptyPdf = 'reset' " 232 @click="addChapterDialog = false; trigger = 'reset'; emptyPdf = 'reset' "
233 >cancel</v-icon> 233 >cancel</v-icon>
234 </v-flex> 234 </v-flex>
235 </v-layout> 235 </v-layout>
236 <v-card-text> 236 <v-card-text>
237 <v-layout wrap> 237 <v-layout wrap>
238 <v-flex xs12 sm12> 238 <v-flex xs12 sm12>
239 <v-layout> 239 <v-layout>
240 <v-flex xs4 class="pt-4 subheading"> 240 <v-flex xs4 class="pt-4 subheading">
241 <label class="right">Chapter Name:</label> 241 <label class="right">Chapter Name:</label>
242 </v-flex> 242 </v-flex>
243 <v-flex xs8 sm6 class="ml-3"> 243 <v-flex xs8 sm6 class="ml-3">
244 <v-text-field 244 <v-text-field
245 v-model="addChapterItem.chapterName" 245 v-model="addChapterItem.chapterName"
246 placeholder="fill your Title" 246 placeholder="fill your Title"
247 type="text" 247 type="text"
248 required 248 required
249 ></v-text-field> 249 ></v-text-field>
250 </v-flex> 250 </v-flex>
251 </v-layout> 251 </v-layout>
252 </v-flex> 252 </v-flex>
253 <v-flex xs12 sm12> 253 <v-flex xs12 sm12>
254 <v-layout> 254 <v-layout>
255 <v-flex xs4 class="pt-4 subheading"> 255 <v-flex xs4 class="pt-4 subheading">
256 <label class="right">Description:</label> 256 <label class="right">Description:</label>
257 </v-flex> 257 </v-flex>
258 <v-flex xs8 sm6 class="ml-3"> 258 <v-flex xs8 sm6 class="ml-3">
259 <v-text-field 259 <v-text-field
260 placeholder="fill your Description" 260 placeholder="fill your Description"
261 v-model="addChapterItem.description" 261 v-model="addChapterItem.description"
262 type="text" 262 type="text"
263 required 263 required
264 ></v-text-field> 264 ></v-text-field>
265 </v-flex> 265 </v-flex>
266 </v-layout> 266 </v-layout>
267 </v-flex> 267 </v-flex>
268 <!-- UPLOAD PPT --> 268 <!-- UPLOAD PPT -->
269 <v-flex xs12> 269 <v-flex xs12>
270 <v-layout> 270 <v-layout>
271 <v-flex xs4 class="pt-4 subheading"> 271 <v-flex xs4 class="pt-4 subheading">
272 <label class="right">Upload PPT:</label> 272 <label class="right">Upload PPT:</label>
273 </v-flex> 273 </v-flex>
274 <v-flex xs8 sm6 class="ml-3"> 274 <v-flex xs8 sm6 class="ml-3">
275 <UploadFiles 275 <UploadFiles
276 @fileSelected="fileSelected($event,'uploadPPT')" 276 @fileSelected="fileSelected($event,'uploadPPT')"
277 label="Add PPT" 277 label="Add PPT"
278 reference="newChapterPpt" 278 reference="newChapterPpt"
279 id="newChapterPptInput" 279 id="newChapterPptInput"
280 :trigger="trigger" 280 :trigger="trigger"
281 ></UploadFiles> 281 ></UploadFiles>
282 </v-flex> 282 </v-flex>
283 </v-layout> 283 </v-layout>
284 </v-flex> 284 </v-flex>
285 <!-- UPLOAD PDF --> 285 <!-- UPLOAD PDF -->
286 <v-flex xs12> 286 <v-flex xs12>
287 <v-layout> 287 <v-layout>
288 <v-flex xs4 class="pt-4 subheading"> 288 <v-flex xs4 class="pt-4 subheading">
289 <label class="right">Upload PDF:</label> 289 <label class="right">Upload PDF:</label>
290 </v-flex> 290 </v-flex>
291 <v-flex xs8 sm6 class="ml-3"> 291 <v-flex xs8 sm6 class="ml-3">
292 <UploadPdf 292 <UploadPdf
293 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 293 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
294 label="Add PDF" 294 label="Add PDF"
295 reference="newChapterPdf" 295 reference="newChapterPdf"
296 id="newChapterPdfInput" 296 id="newChapterPdfInput"
297 :trigger="emptyPdf" 297 :emptyPdf="emptyPdf"
298 ></UploadPdf> 298 ></UploadPdf>
299 </v-flex> 299 </v-flex>
300 </v-layout> 300 </v-layout>
301 </v-flex> 301 </v-flex>
302 </v-layout> 302 </v-layout>
303 <v-flex xs12> 303 <v-flex xs12>
304 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index"> 304 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index">
305 <v-layout> 305 <v-layout>
306 <v-flex xs4 class="pt-4 subheading"> 306 <v-flex xs4 class="pt-4 subheading">
307 <label class="right">Chapter Points:</label> 307 <label class="right">Chapter Points:</label>
308 </v-flex> 308 </v-flex>
309 <v-flex xs8 sm8 md6 class="ml-3"> 309 <v-flex xs8 sm8 md6 class="ml-3">
310 <v-text-field 310 <v-text-field
311 placeholder="fill your Chapter Points" 311 placeholder="fill your Chapter Points"
312 v-model="chapterPoints.value" 312 v-model="chapterPoints.value"
313 type="text" 313 type="text"
314 name="link" 314 name="link"
315 required 315 required
316 ></v-text-field> 316 ></v-text-field>
317 </v-flex> 317 </v-flex>
318 <v-flex xs2 class="pt-4"> 318 <v-flex xs2 class="pt-4">
319 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon> 319 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon>
320 <v-icon @click="addChapterPoint()">add_circle</v-icon> 320 <v-icon @click="addChapterPoint()">add_circle</v-icon>
321 </v-flex> 321 </v-flex>
322 </v-layout> 322 </v-layout>
323 </div> 323 </div>
324 </v-flex> 324 </v-flex>
325 <v-layout> 325 <v-layout>
326 <v-flex xs12 sm12 md11 lg11> 326 <v-flex xs12 sm12 md11 lg11>
327 <v-card-actions class="hidden-xs-only hidden-sm-only"> 327 <v-card-actions class="hidden-xs-only hidden-sm-only">
328 <v-spacer></v-spacer> 328 <v-spacer></v-spacer>
329 <v-btn 329 <v-btn
330 round 330 round
331 dark 331 dark
332 @click="submitChapter" 332 @click="submitChapter"
333 :loading="editLoading" 333 :loading="editLoading"
334 class="add-button mr-4" 334 class="add-button mr-4"
335 >Submit</v-btn> 335 >Submit</v-btn>
336 </v-card-actions> 336 </v-card-actions>
337 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 337 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
338 <v-spacer></v-spacer> 338 <v-spacer></v-spacer>
339 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 339 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
340 <v-spacer></v-spacer> 340 <v-spacer></v-spacer>
341 </v-card-actions> 341 </v-card-actions>
342 </v-flex> 342 </v-flex>
343 </v-layout> 343 </v-layout>
344 </v-card-text> 344 </v-card-text>
345 </v-card> 345 </v-card>
346 </v-dialog> 346 </v-dialog>
347 347
348 <!-- ****** PROFILE Gallery ****** --> 348 <!-- ****** PROFILE Gallery ****** -->
349 349
350 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable> 350 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable>
351 <v-card flat class="card-style pa-3" dark> 351 <v-card flat class="card-style pa-3" dark>
352 <v-layout> 352 <v-layout>
353 <v-flex xs12> 353 <v-flex xs12>
354 <label class="title text-xs-center">View Course Detail</label> 354 <label class="title text-xs-center">View Course Detail</label>
355 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon> 355 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon>
356 </v-flex> 356 </v-flex>
357 </v-layout> 357 </v-layout>
358 <v-card-text> 358 <v-card-text>
359 <v-container grid-list-md> 359 <v-container grid-list-md>
360 <v-layout wrap> 360 <v-layout wrap>
361 <v-flex xs12> 361 <v-flex xs12>
362 <v-layout> 362 <v-layout>
363 <v-flex xs4 sm6> 363 <v-flex xs4 sm6>
364 <h5 class="right my-1"> 364 <h5 class="right my-1">
365 <b>Chapter Name:</b> 365 <b>Chapter Name:</b>
366 </h5> 366 </h5>
367 </v-flex> 367 </v-flex>
368 <v-flex sm6 xs8> 368 <v-flex sm6 xs8>
369 <h5 class="my-1">{{ editedItem.chapterName }}</h5> 369 <h5 class="my-1">{{ editedItem.chapterName }}</h5>
370 </v-flex> 370 </v-flex>
371 </v-layout> 371 </v-layout>
372 <v-layout> 372 <v-layout>
373 <v-flex xs4 sm6> 373 <v-flex xs4 sm6>
374 <h5 class="right my-1"> 374 <h5 class="right my-1">
375 <b>Description:</b> 375 <b>Description:</b>
376 </h5> 376 </h5>
377 </v-flex> 377 </v-flex>
378 <v-flex sm6 xs8> 378 <v-flex sm6 xs8>
379 <h5 class="my-1">{{ editedItem.description }}</h5> 379 <h5 class="my-1">{{ editedItem.description }}</h5>
380 </v-flex> 380 </v-flex>
381 </v-layout> 381 </v-layout>
382 <v-layout> 382 <v-layout>
383 <v-flex xs5 sm6> 383 <v-flex xs5 sm6>
384 <h5 class="right my-1"> 384 <h5 class="right my-1">
385 <b>You Tube Link Url:</b> 385 <b>You Tube Link Url:</b>
386 </h5> 386 </h5>
387 </v-flex> 387 </v-flex>
388 <v-flex sm6 xs8> 388 <v-flex sm6 xs8>
389 <h5 class="my-1"> 389 <h5 class="my-1">
390 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint"> 390 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint">
391 <li>{{ chapterPoint}}</li> 391 <li>{{ chapterPoint}}</li>
392 </ul> 392 </ul>
393 </h5> 393 </h5>
394 </v-flex> 394 </v-flex>
395 </v-layout> 395 </v-layout>
396 </v-flex> 396 </v-flex>
397 </v-layout> 397 </v-layout>
398 </v-container> 398 </v-container>
399 </v-card-text> 399 </v-card-text>
400 </v-card> 400 </v-card>
401 </v-dialog> 401 </v-dialog>
402 402
403 <!-- ****** Course Detail TABLE ****** --> 403 <!-- ****** Course Detail TABLE ****** -->
404 404
405 <v-toolbar color="transparent" flat> 405 <v-toolbar color="transparent" flat>
406 <v-btn 406 <v-btn
407 fab 407 fab
408 dark 408 dark
409 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 409 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
410 small 410 small
411 @click="addCourseDetailDialog = true" 411 @click="addCourseDetailDialog = true"
412 > 412 >
413 <v-icon dark>add</v-icon> 413 <v-icon dark>add</v-icon>
414 </v-btn> 414 </v-btn>
415 <v-btn 415 <v-btn
416 round 416 round
417 class="open-dialog-button hidden-sm-only hidden-xs-only" 417 class="open-dialog-button hidden-sm-only hidden-xs-only"
418 dark 418 dark
419 @click="addCourseDetailDialog = true" 419 @click="addCourseDetailDialog = true"
420 > 420 >
421 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail 421 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail
422 </v-btn> 422 </v-btn>
423 <v-flex xs12 sm4 md2> 423 <v-flex xs12 sm4 md2>
424 <v-select 424 <v-select
425 small 425 small
426 :items="addclass" 426 :items="addclass"
427 label="Select Class" 427 label="Select Class"
428 v-model="getCourse.classId" 428 v-model="getCourse.classId"
429 item-text="classNum" 429 item-text="classNum"
430 item-value="_id" 430 item-value="_id"
431 name="Select Class" 431 name="Select Class"
432 @change="getCourses(getCourse.classId)" 432 @change="getCourses(getCourse.classId)"
433 class="mr-2" 433 class="mr-2"
434 required 434 required
435 ></v-select> 435 ></v-select>
436 </v-flex> 436 </v-flex>
437 <v-flex xs12 sm4 md2> 437 <v-flex xs12 sm4 md2>
438 <v-select 438 <v-select
439 :items="courseData" 439 :items="courseData"
440 label="Select Course" 440 label="Select Course"
441 v-model="getCourse.courseId" 441 v-model="getCourse.courseId"
442 item-text="courseName" 442 item-text="courseName"
443 item-value="_id" 443 item-value="_id"
444 required 444 required
445 class="ml-2" 445 class="ml-2"
446 @change="getCourseDetailsList(getCourse.courseId)" 446 @change="getCourseDetailsList(getCourse.courseId)"
447 ></v-select> 447 ></v-select>
448 </v-flex> 448 </v-flex>
449 <v-spacer></v-spacer> 449 <v-spacer></v-spacer>
450 <v-card-title class="body-1" v-show="show"> 450 <v-card-title class="body-1" v-show="show">
451 <v-btn icon large flat @click="displaySearch"> 451 <v-btn icon large flat @click="displaySearch">
452 <v-avatar size="27"> 452 <v-avatar size="27">
453 <img src="/static/icon/search.png" alt="icon" /> 453 <img src="/static/icon/search.png" alt="icon" />
454 </v-avatar> 454 </v-avatar>
455 </v-btn> 455 </v-btn>
456 </v-card-title> 456 </v-card-title>
457 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 457 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
458 <v-layout> 458 <v-layout>
459 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 459 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
460 <v-icon @click="closeSearch" color="error">close</v-icon> 460 <v-icon @click="closeSearch" color="error">close</v-icon>
461 </v-layout> 461 </v-layout>
462 </v-flex> 462 </v-flex>
463 </v-toolbar> 463 </v-toolbar>
464 <v-data-table 464 <v-data-table
465 :headers="headers" 465 :headers="headers"
466 :items="CourseDetailsList" 466 :items="CourseDetailsList"
467 :pagination.sync="pagination" 467 :pagination.sync="pagination"
468 :search="search" 468 :search="search"
469 item-key="_id" 469 item-key="_id"
470 > 470 >
471 <template slot="items" slot-scope="props"> 471 <template slot="items" slot-scope="props">
472 <tr class="tr" @click="courseTableRow(props.item._id)"> 472 <tr class="tr" @click="courseTableRow(props.item._id)">
473 <td class="td td-row">{{ props.index + 1}}</td> 473 <td class="td td-row">{{ props.index + 1}}</td>
474 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td> 474 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td>
475 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td> 475 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td>
476 <td class="td td-row text-xs-center"> 476 <td class="td td-row text-xs-center">
477 <div style="vertical-align: top;"> 477 <div style="vertical-align: top;">
478 <v-tooltip top> 478 <v-tooltip top>
479 <v-icon 479 <v-icon
480 slot="activator" 480 slot="activator"
481 style="cursor:pointer;font-size:22px;position: relative;top: -4px; " 481 style="cursor:pointer;font-size:22px;position: relative;top: -4px; "
482 class="mr-3" 482 class="mr-3"
483 @click="addChapters(props.item)" 483 @click="addChapters(props.item)"
484 >add_circle_outline</v-icon> 484 >add_circle_outline</v-icon>
485 <span>Add</span> 485 <span>Add</span>
486 </v-tooltip> 486 </v-tooltip>
487 <v-tooltip top> 487 <v-tooltip top>
488 <img 488 <img
489 slot="activator" 489 slot="activator"
490 style="cursor:pointer; width:25px; height:25px; " 490 style="cursor:pointer; width:25px; height:25px; "
491 class="mr-3" 491 class="mr-3"
492 @click="props.expanded = !props.expanded" 492 @click="props.expanded = !props.expanded"
493 src="/static/icon/view.png" 493 src="/static/icon/view.png"
494 /> 494 />
495 <span>View</span> 495 <span>View</span>
496 </v-tooltip> 496 </v-tooltip>
497 <v-tooltip top> 497 <v-tooltip top>
498 <img 498 <img
499 slot="activator" 499 slot="activator"
500 style="cursor:pointer; width:20px; height:18px; " 500 style="cursor:pointer; width:20px; height:18px; "
501 class="mr-3" 501 class="mr-3"
502 @click="editItem(props.item)" 502 @click="editItem(props.item)"
503 src="/static/icon/edit.png" 503 src="/static/icon/edit.png"
504 /> 504 />
505 <span>Edit</span> 505 <span>Edit</span>
506 </v-tooltip> 506 </v-tooltip>
507 <v-tooltip top> 507 <v-tooltip top>
508 <img 508 <img
509 slot="activator" 509 slot="activator"
510 style="cursor:pointer; width:20px; height:20px; " 510 style="cursor:pointer; width:20px; height:20px; "
511 class="mr-3" 511 class="mr-3"
512 @click="deleteItem(props.item)" 512 @click="deleteItem(props.item)"
513 src="/static/icon/delete.png" 513 src="/static/icon/delete.png"
514 /> 514 />
515 <span>Delete</span> 515 <span>Delete</span>
516 </v-tooltip> 516 </v-tooltip>
517 </div> 517 </div>
518 </td> 518 </td>
519 </tr> 519 </tr>
520 </template> 520 </template>
521 <template slot="expand"> 521 <template slot="expand">
522 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;"> 522 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;">
523 <template slot="items" slot-scope="props"> 523 <template slot="items" slot-scope="props">
524 <tr class="tr" @click="props.expanded = !props.expanded"> 524 <tr class="tr" @click="props.expanded = !props.expanded">
525 <td class="td td-row">{{ props.index + 1}}</td> 525 <td class="td td-row">{{ props.index + 1}}</td>
526 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td> 526 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td>
527 <td class="text-xs-center td td-row">{{ props.item.description }}</td> 527 <td class="text-xs-center td td-row">{{ props.item.description }}</td>
528 <td class="text-xs-center td td-row"> 528 <td class="text-xs-center td td-row">
529 <v-tooltip top> 529 <v-tooltip top>
530 <v-icon 530 <v-icon
531 slot="activator" 531 slot="activator"
532 style="cursor:pointer;font-size:22px;position: relative;top: -4px; " 532 style="cursor:pointer;font-size:22px;position: relative;top: -4px; "
533 class="mr-3" 533 class="mr-3"
534 @click="$router.push({name: 'Live Online Class', query: {chapterId: props.item._id, chapterName: props.item.chapterName, courseId: getCourse.courseId, classId: getCourse.classId }})" 534 @click="$router.push({name: 'Live Online Class', query: {chapterId: props.item._id, chapterName: props.item.chapterName, courseId: getCourse.courseId, classId: getCourse.classId }})"
535 >video_call</v-icon> 535 >video_call</v-icon>
536 <span>Live Session</span> 536 <span>Live Session</span>
537 </v-tooltip> 537 </v-tooltip>
538 <v-tooltip top> 538 <v-tooltip top>
539 <img 539 <img
540 slot="activator" 540 slot="activator"
541 style="cursor:pointer; width:25px; height:25px; " 541 style="cursor:pointer; width:25px; height:25px; "
542 class="mr-3" 542 class="mr-3"
543 @click="profile(props.item)" 543 @click="profile(props.item)"
544 src="/static/icon/view.png" 544 src="/static/icon/view.png"
545 /> 545 />
546 <span>View</span> 546 <span>View</span>
547 </v-tooltip> 547 </v-tooltip>
548 <v-tooltip top> 548 <v-tooltip top>
549 <img 549 <img
550 slot="activator" 550 slot="activator"
551 style="cursor:pointer; width:20px; height:18px; " 551 style="cursor:pointer; width:20px; height:18px; "
552 class="mr-3" 552 class="mr-3"
553 @click="editChapterItem(props.item)" 553 @click="editChapterItem(props.item)"
554 src="/static/icon/edit.png" 554 src="/static/icon/edit.png"
555 /> 555 />
556 <span>Edit</span> 556 <span>Edit</span>
557 </v-tooltip> 557 </v-tooltip>
558 <v-tooltip top> 558 <v-tooltip top>
559 <img 559 <img
560 slot="activator" 560 slot="activator"
561 style="cursor:pointer; width:20px; height:20px; " 561 style="cursor:pointer; width:20px; height:20px; "
562 class="mr-3" 562 class="mr-3"
563 @click="deleteChapters(props.item)" 563 @click="deleteChapters(props.item)"
564 src="/static/icon/delete.png" 564 src="/static/icon/delete.png"
565 /> 565 />
566 <span>Delete Chapter</span> 566 <span>Delete Chapter</span>
567 </v-tooltip> 567 </v-tooltip>
568 </td> 568 </td>
569 </tr> 569 </tr>
570 </template> 570 </template>
571 </v-data-table> 571 </v-data-table>
572 </template> 572 </template>
573 573
574 <v-alert 574 <v-alert
575 slot="no-results" 575 slot="no-results"
576 :value="true" 576 :value="true"
577 color="error" 577 color="error"
578 icon="warning" 578 icon="warning"
579 >Your search for "{{ search }}" found no results.</v-alert> 579 >Your search for "{{ search }}" found no results.</v-alert>
580 </v-data-table> 580 </v-data-table>
581 <!-- ****** ADD Course Detail ****** --> 581 <!-- ****** ADD Course Detail ****** -->
582 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent> 582 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent>
583 <v-card flat class="card-style pa-2" dark> 583 <v-card flat class="card-style pa-2" dark>
584 <v-layout> 584 <v-layout>
585 <v-flex xs12> 585 <v-flex xs12>
586 <label class="title text-xs-center">Add Course Details</label> 586 <label class="title text-xs-center">Add Course Details</label>
587 <v-icon 587 <v-icon
588 size="24" 588 size="24"
589 class="right" 589 class="right"
590 @click="addCourseDetailDialog = false; clear() ; trigger = 'reset' ; emptyPdf = 'reset' " 590 @click="addCourseDetailDialog = false; clear() ; trigger = 'reset' ; emptyPdf = 'reset' "
591 >cancel</v-icon> 591 >cancel</v-icon>
592 </v-flex> 592 </v-flex>
593 </v-layout> 593 </v-layout>
594 <v-form ref="form" v-model="valid" lazy-validation> 594 <v-form ref="form" v-model="valid" lazy-validation>
595 <v-container fluid> 595 <v-container fluid>
596 <v-flex xs12> 596 <v-flex xs12>
597 <v-layout> 597 <v-layout>
598 <v-flex xs4 class="pt-4 subheading"> 598 <v-flex xs4 class="pt-4 subheading">
599 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 599 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
600 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 600 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
601 </v-flex> 601 </v-flex>
602 <v-flex xs8 sm8 md7 class="ml-3"> 602 <v-flex xs8 sm8 md7 class="ml-3">
603 <v-select 603 <v-select
604 :items="addclass" 604 :items="addclass"
605 label="Select Class" 605 label="Select Class"
606 v-model="addCourseDetail.classId" 606 v-model="addCourseDetail.classId"
607 item-text="classNum" 607 item-text="classNum"
608 item-value="_id" 608 item-value="_id"
609 name="Select Class" 609 name="Select Class"
610 :rules="clsssRules" 610 :rules="clsssRules"
611 @change="getCourses(addCourseDetail.classId)" 611 @change="getCourses(addCourseDetail.classId)"
612 required 612 required
613 ></v-select> 613 ></v-select>
614 </v-flex> 614 </v-flex>
615 </v-layout> 615 </v-layout>
616 </v-flex> 616 </v-flex>
617 <v-flex xs12> 617 <v-flex xs12>
618 <v-layout> 618 <v-layout>
619 <v-flex xs4 class="pt-4 subheading"> 619 <v-flex xs4 class="pt-4 subheading">
620 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label> 620 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label>
621 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label> 621 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label>
622 </v-flex> 622 </v-flex>
623 <v-flex xs8 sm8 md7 class="ml-3"> 623 <v-flex xs8 sm8 md7 class="ml-3">
624 <v-select 624 <v-select
625 :items="courseData" 625 :items="courseData"
626 label="Select Course" 626 label="Select Course"
627 v-model="addCourseDetail.courseId" 627 v-model="addCourseDetail.courseId"
628 item-text="courseName" 628 item-text="courseName"
629 item-value="_id" 629 item-value="_id"
630 :rules="courseRules" 630 :rules="courseRules"
631 required 631 required
632 ></v-select> 632 ></v-select>
633 </v-flex> 633 </v-flex>
634 </v-layout> 634 </v-layout>
635 </v-flex> 635 </v-flex>
636 <v-flex xs12> 636 <v-flex xs12>
637 <v-layout> 637 <v-layout>
638 <v-flex xs4 class="pt-4 subheading"> 638 <v-flex xs4 class="pt-4 subheading">
639 <label class="right">Chapter Name:</label> 639 <label class="right">Chapter Name:</label>
640 </v-flex> 640 </v-flex>
641 <v-flex xs8 sm8 md7 class="ml-3"> 641 <v-flex xs8 sm8 md7 class="ml-3">
642 <v-text-field 642 <v-text-field
643 v-model="addCourseDetail.chapterName" 643 v-model="addCourseDetail.chapterName"
644 placeholder="fill your Title" 644 placeholder="fill your Title"
645 name="name" 645 name="name"
646 type="text" 646 type="text"
647 :rules="chapterNameRules" 647 :rules="chapterNameRules"
648 required 648 required
649 ></v-text-field> 649 ></v-text-field>
650 </v-flex> 650 </v-flex>
651 </v-layout> 651 </v-layout>
652 </v-flex> 652 </v-flex>
653 <!-- DESCRIPTION --> 653 <!-- DESCRIPTION -->
654 <v-flex xs12> 654 <v-flex xs12>
655 <v-layout> 655 <v-layout>
656 <v-flex xs4 class="pt-4 subheading"> 656 <v-flex xs4 class="pt-4 subheading">
657 <label class="right">Description:</label> 657 <label class="right">Description:</label>
658 </v-flex> 658 </v-flex>
659 <v-flex xs8 sm8 md7 class="ml-3"> 659 <v-flex xs8 sm8 md7 class="ml-3">
660 <v-text-field 660 <v-text-field
661 placeholder="fill your Description" 661 placeholder="fill your Description"
662 :rules="descriptionRules" 662 :rules="descriptionRules"
663 v-model="addCourseDetail.description" 663 v-model="addCourseDetail.description"
664 type="text" 664 type="text"
665 name="email" 665 name="email"
666 required 666 required
667 ></v-text-field> 667 ></v-text-field>
668 </v-flex> 668 </v-flex>
669 </v-layout> 669 </v-layout>
670 </v-flex> 670 </v-flex>
671 <!-- UPLOAD PPT --> 671 <!-- UPLOAD PPT -->
672 <v-flex xs12> 672 <v-flex xs12>
673 <v-layout> 673 <v-layout>
674 <v-flex xs4 class="pt-4 subheading"> 674 <v-flex xs4 class="pt-4 subheading">
675 <label class="right">Upload PPT:</label> 675 <label class="right">Upload PPT:</label>
676 </v-flex> 676 </v-flex>
677 <v-flex xs8 sm8 md7 class="ml-3"> 677 <v-flex xs8 sm8 md7 class="ml-3">
678 <UploadFiles 678 <UploadFiles
679 @fileSelected="fileSelected($event,'uploadPPT')" 679 @fileSelected="fileSelected($event,'uploadPPT')"
680 label="Add PPT" 680 label="Add PPT"
681 reference="newCoursePpt" 681 reference="newCoursePpt"
682 id="newCoursePptInput" 682 id="newCoursePptInput"
683 :trigger="trigger" 683 :trigger="trigger"
684 ></UploadFiles> 684 ></UploadFiles>
685 </v-flex> 685 </v-flex>
686 </v-layout> 686 </v-layout>
687 </v-flex> 687 </v-flex>
688 <!-- UPLOAD PDF --> 688 <!-- UPLOAD PDF -->
689 <v-flex xs12> 689 <v-flex xs12>
690 <v-layout> 690 <v-layout>
691 <v-flex xs4 class="pt-4 subheading"> 691 <v-flex xs4 class="pt-4 subheading">
692 <label class="right">Upload PDF:</label> 692 <label class="right">Upload PDF:</label>
693 </v-flex> 693 </v-flex>
694 <v-flex xs8 sm8 md7 class="ml-3"> 694 <v-flex xs8 sm8 md7 class="ml-3">
695 <UploadPdf 695 <UploadPdf
696 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 696 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
697 label="Add PDF" 697 label="Add PDF"
698 reference="newCoursePdf" 698 reference="newCoursePdf"
699 id="newCoursePdfInput" 699 id="newCoursePdfInput"
700 :trigger="emptyPdf" 700 :emptyPdf="emptyPdf"
701 ></UploadPdf> 701 ></UploadPdf>
702 </v-flex> 702 </v-flex>
703 </v-layout> 703 </v-layout>
704 </v-flex> 704 </v-flex>
705 <v-layout> 705 <v-layout>
706 <v-flex xs12> 706 <v-flex xs12>
707 <div v-for="(chapterPoints,index) in finds" :key="index"> 707 <div v-for="(chapterPoints,index) in finds" :key="index">
708 <v-layout> 708 <v-layout>
709 <v-flex xs4 class="pt-4 subheading"> 709 <v-flex xs4 class="pt-4 subheading">
710 <label class="right">Chapter Points:</label> 710 <label class="right">Chapter Points:</label>
711 </v-flex> 711 </v-flex>
712 <v-flex xs8 sm8 md6 class="ml-3"> 712 <v-flex xs8 sm8 md6 class="ml-3">
713 <v-text-field 713 <v-text-field
714 placeholder="fill your Chapter Points" 714 placeholder="fill your Chapter Points"
715 v-model="chapterPoints.value" 715 v-model="chapterPoints.value"
716 type="text" 716 type="text"
717 required 717 required
718 ></v-text-field> 718 ></v-text-field>
719 </v-flex> 719 </v-flex>
720 <v-flex xs2 class="pt-4"> 720 <v-flex xs2 class="pt-4">
721 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon> 721 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon>
722 <v-icon @click="addFind">add_circle</v-icon> 722 <v-icon @click="addFind">add_circle</v-icon>
723 </v-flex> 723 </v-flex>
724 </v-layout> 724 </v-layout>
725 </div> 725 </div>
726 </v-flex> 726 </v-flex>
727 </v-layout> 727 </v-layout>
728 <v-layout> 728 <v-layout>
729 <v-flex xs12 sm12> 729 <v-flex xs12 sm12>
730 <v-layout class="right"> 730 <v-layout class="right">
731 <v-btn 731 <v-btn @click="clear;" round dark class="clear-button">Clear</v-btn>
732 @click="clear;trigger = 'reset'; emptyPdf = 'reset';"
733 round
734 dark
735 class="clear-button"
736 >Clear</v-btn>
737 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 732 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
738 </v-layout> 733 </v-layout>
739 </v-flex> 734 </v-flex>
740 </v-layout> 735 </v-layout>
741 </v-container> 736 </v-container>
742 </v-form> 737 </v-form>
743 </v-card> 738 </v-card>
744 </v-dialog> 739 </v-dialog>
745 <v-snackbar 740 <v-snackbar
746 :timeout="timeout" 741 :timeout="timeout"
747 :top="y === 'top'" 742 :top="y === 'top'"
748 :right="x === 'right'" 743 :right="x === 'right'"
749 :vertical="mode === 'vertical'" 744 :vertical="mode === 'vertical'"
750 v-model="snackbar" 745 v-model="snackbar"
751 :color="color" 746 :color="color"
752 >{{ text }}</v-snackbar> 747 >{{ text }}</v-snackbar>
753 <div class="loader" v-if="showLoader"> 748 <div class="loader" v-if="showLoader">
754 <v-progress-circular indeterminate color="white"></v-progress-circular> 749 <v-progress-circular indeterminate color="white"></v-progress-circular>
755 </div> 750 </div>
756 </v-container> 751 </v-container>
757 </template> 752 </template>
758 753
759 <script> 754 <script>
760 import http from "@/Services/http.js"; 755 import http from "@/Services/http.js";
761 import UploadFiles from "@/pages/Common/UploadFiles.vue"; 756 import UploadFiles from "@/pages/Common/UploadFiles.vue";
762 import UploadPdf from "@/pages/Common/UploadPdf.vue"; 757 import UploadPdf from "@/pages/Common/UploadPdf.vue";
763 import AllApiCalls from "@/Services/AllApiCalls.js"; 758 import AllApiCalls from "@/Services/AllApiCalls.js";
764 759
765 export default { 760 export default {
766 mixins: [AllApiCalls], 761 mixins: [AllApiCalls],
767 components: { 762 components: {
768 UploadFiles, 763 UploadFiles,
769 UploadPdf 764 UploadPdf
770 }, 765 },
771 data: () => ({ 766 data: () => ({
772 snackbar: false, 767 snackbar: false,
773 y: "top", 768 y: "top",
774 x: "right", 769 x: "right",
775 mode: "", 770 mode: "",
776 timeout: 3000, 771 timeout: 3000,
777 text: "", 772 text: "",
778 loading: false, 773 loading: false,
779 color: "", 774 color: "",
780 date: null, 775 date: null,
781 search: "", 776 search: "",
782 show: true, 777 show: true,
783 addCourseDetailDialog: false, 778 addCourseDetailDialog: false,
784 showSearch: false, 779 showSearch: false,
785 showLoader: false, 780 showLoader: false,
786 editCourseDetailDialog: false, 781 editCourseDetailDialog: false,
787 editChapterDetailDialog: false, 782 editChapterDetailDialog: false,
788 viewProfileGallery: false, 783 viewProfileGallery: false,
789 valid: true, 784 valid: true,
790 editLoading: false, 785 editLoading: false,
791 addclass: [], 786 addclass: [],
792 courseData: [], 787 courseData: [],
793 addSection: [], 788 addSection: [],
794 getCourse: {}, 789 getCourse: {},
795 finds: [{ value: "" }], 790 finds: [{ value: "" }],
796 findsChapterPoint: [{ value: "" }], 791 findsChapterPoint: [{ value: "" }],
797 updates: [], 792 updates: [],
798 youTubeLink: {}, 793 youTubeLink: {},
799 addCourseDetail: { 794 addCourseDetail: {
800 chapters: [ 795 chapters: [
801 { 796 {
802 chapterName: "", 797 chapterName: "",
803 description: "", 798 description: "",
804 chapterPoints: [] 799 chapterPoints: []
805 } 800 }
806 ] 801 ]
807 }, 802 },
808 chapters: [], 803 chapters: [],
809 pagination: { 804 pagination: {
810 rowsPerPage: 10 805 rowsPerPage: 10
811 }, 806 },
812 editFiles: [], 807 editFiles: [],
813 files: [], 808 files: [],
814 courseData: [], 809 courseData: [],
815 token: "", 810 token: "",
816 courseId: "", 811 courseId: "",
817 clsssRules: [v => !!v || " Class is required"], 812 clsssRules: [v => !!v || " Class is required"],
818 courseRules: [v => !!v || " Course is required"], 813 courseRules: [v => !!v || " Course is required"],
819 chapterNameRules: [v => !!v || " Tilte is required"], 814 chapterNameRules: [v => !!v || " Tilte is required"],
820 descriptionRules: [v => !!v || " Description is required"], 815 descriptionRules: [v => !!v || " Description is required"],
821 headers: [ 816 headers: [
822 { 817 {
823 align: "", 818 align: "",
824 text: "No", 819 text: "No",
825 sortable: false, 820 sortable: false,
826 value: "index" 821 value: "index"
827 }, 822 },
828 { 823 {
829 text: "Class Name", 824 text: "Class Name",
830 value: "classNum", 825 value: "classNum",
831 sortable: false, 826 sortable: false,
832 align: "center" 827 align: "center"
833 }, 828 },
834 { 829 {
835 text: "Course Name", 830 text: "Course Name",
836 value: "courseName", 831 value: "courseName",
837 sortable: false, 832 sortable: false,
838 align: "center" 833 align: "center"
839 }, 834 },
840 { text: "Action", value: "", sortable: false, align: "center" } 835 { text: "Action", value: "", sortable: false, align: "center" }
841 ], 836 ],
842 CourseDetailsList: [], 837 CourseDetailsList: [],
843 editedIndex: -1, 838 editedIndex: -1,
844 editedItem: {}, 839 editedItem: {},
845 editedCourse: {}, 840 editedCourse: {},
846 editChapter: { 841 editChapter: {
847 chapterPoints: [] 842 chapterPoints: []
848 }, 843 },
849 index: "", 844 index: "",
850 addChapterItem: {}, 845 addChapterItem: {},
851 addChapterItemObj: {}, 846 addChapterItemObj: {},
852 addChapterDialog: false 847 addChapterDialog: false
853 }), 848 }),
854 methods: { 849 methods: {
855 getCourses(classId) { 850 getCourses(classId) {
856 this.showLoader = true; 851 this.showLoader = true;
857 http() 852 http()
858 .get("/getCourseesList", { 853 .get("/getCourseesList", {
859 params: { 854 params: {
860 classId: classId 855 classId: classId
861 } 856 }
862 }) 857 })
863 .then(response => { 858 .then(response => {
864 this.editChapter.courseId = ""; 859 this.editChapter.courseId = "";
865 this.courseData = response.data.data; 860 this.courseData = response.data.data;
866 // console.log("this.courseData", this.courseData); 861 // console.log("this.courseData", this.courseData);
867 this.showLoader = false; 862 this.showLoader = false;
868 }) 863 })
869 .catch(err => { 864 .catch(err => {
870 console.log("err====>", err); 865 console.log("err====>", err);
871 this.showLoader = false; 866 this.showLoader = false;
872 }); 867 });
873 }, 868 },
874 getCourseDetailsList() { 869 getCourseDetailsList() {
875 this.showLoader = true; 870 this.showLoader = true;
876 http() 871 http()
877 .get("/getParticularCourseDetail", { 872 .get("/getParticularCourseDetail", {
878 params: { 873 params: {
879 courseId: this.getCourse.courseId 874 courseId: this.getCourse.courseId
880 } 875 }
881 }) 876 })
882 .then(response => { 877 .then(response => {
883 this.CourseDetailsList = response.data.data; 878 this.CourseDetailsList = response.data.data;
884 if (response.data.data[0]) { 879 if (response.data.data[0]) {
885 this.chapters = response.data.data[0].chapters; 880 this.chapters = response.data.data[0].chapters;
886 console.log(" this.chapters - ", this.chapters); 881 console.log(" this.chapters - ", this.chapters);
887 } 882 }
888 // console.log("response.data.data", this.CourseDetailsList); 883 // console.log("response.data.data", this.CourseDetailsList);
889 this.showLoader = false; 884 this.showLoader = false;
890 }) 885 })
891 .catch(error => { 886 .catch(error => {
892 // console.log("err====>", err); 887 // console.log("err====>", err);
893 this.showLoader = false; 888 this.showLoader = false;
894 if (error.response.status === 401) { 889 if (error.response.status === 401) {
895 this.$router.replace({ path: "/" }); 890 this.$router.replace({ path: "/" });
896 this.$store.dispatch("setToken", null); 891 this.$store.dispatch("setToken", null);
897 this.$store.dispatch("Id", null); 892 this.$store.dispatch("Id", null);
898 } 893 }
899 }); 894 });
900 }, 895 },
901 courseTableRow(id) { 896 courseTableRow(id) {
902 // console.log("click7", id); 897 // console.log("click7", id);
903 this.courseId = id; 898 this.courseId = id;
904 }, 899 },
905 addChapters(item) { 900 addChapters(item) {
906 this.editedIndex = this.CourseDetailsList.indexOf(item); 901 this.editedIndex = this.CourseDetailsList.indexOf(item);
907 this.addChapterItemObj = Object.assign({}, item); 902 this.addChapterItemObj = Object.assign({}, item);
908 this.addChapterItem.courseDetailId = this.addChapterItemObj._id; 903 this.addChapterItem.courseDetailId = this.addChapterItemObj._id;
909 this.addChapterDialog = true; 904 this.addChapterDialog = true;
910 }, 905 },
911 submitChapter() { 906 submitChapter() {
912 this.addChapterItem.chapterPoints = []; 907 this.addChapterItem.chapterPoints = [];
913 for (let i = 0; i < this.findsChapterPoint.length; i++) { 908 for (let i = 0; i < this.findsChapterPoint.length; i++) {
914 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value); 909 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value);
915 } 910 }
916 // console.log("this.addChapterItem", this.addChapterItem); 911 // console.log("this.addChapterItem", this.addChapterItem);
917 this.loading = true; 912 this.loading = true;
918 http() 913 http()
919 .put("/addChapters", this.addChapterItem) 914 .put("/addChapters", this.addChapterItem)
920 .then(response => { 915 .then(response => {
921 this.addChapterDialog = false; 916 this.addChapterDialog = false;
922 this.loading = false; 917 this.loading = false;
923 this.snackbar = true; 918 this.snackbar = true;
924 this.text = response.data.message; 919 this.text = response.data.message;
925 this.color = "green"; 920 this.color = "green";
926 this.addChapterItem = {}; 921 this.addChapterItem = {};
927 this.removeChapterPoint(); 922 this.removeChapterPoint();
928 this.getCourseDetailsList(); 923 this.getCourseDetailsList();
929 }) 924 })
930 .catch(error => { 925 .catch(error => {
931 this.snackbar = true; 926 this.snackbar = true;
932 this.text = error.response.data.message; 927 this.text = error.response.data.message;
933 this.color = "error"; 928 this.color = "error";
934 this.loading = false; 929 this.loading = false;
935 }); 930 });
936 }, 931 },
937 profile(item) { 932 profile(item) {
938 this.editedIndex = this.chapters.indexOf(item); 933 this.editedIndex = this.chapters.indexOf(item);
939 this.editedItem = Object.assign({}, item); 934 this.editedItem = Object.assign({}, item);
940 this.viewProfileGallery = true; 935 this.viewProfileGallery = true;
941 }, 936 },
942 editItem(item) { 937 editItem(item) {
943 this.editedIndex = this.CourseDetailsList.indexOf(item); 938 this.editedIndex = this.CourseDetailsList.indexOf(item);
944 this.editedCourse = Object.assign({}, item); 939 this.editedCourse = Object.assign({}, item);
945 this.editCourseDetailDialog = true; 940 this.editCourseDetailDialog = true;
946 }, 941 },
947 editChapterItem(item) { 942 editChapterItem(item) {
948 this.editedIndex = this.chapters.indexOf(item); 943 this.editedIndex = this.chapters.indexOf(item);
949 this.editChapter = Object.assign({}, item); 944 this.editChapter = Object.assign({}, item);
950 this.updates = []; 945 this.updates = [];
951 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) { 946 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) {
952 this.updates.push({ value: this.editChapter.chapterPoints[i] }); 947 this.updates.push({ value: this.editChapter.chapterPoints[i] });
953 } 948 }
954 this.editChapterDetailDialog = true; 949 this.editChapterDetailDialog = true;
955 }, 950 },
956 deleteItem(item) { 951 deleteItem(item) {
957 let deleteGallery = { 952 let deleteGallery = {
958 courseDetailId: item._id 953 courseDetailId: item._id
959 }; 954 };
960 http() 955 http()
961 .delete( 956 .delete(
962 "/deleteCourseDetail", 957 "/deleteCourseDetail",
963 confirm("Are you sure you want to delete this?") && { 958 confirm("Are you sure you want to delete this?") && {
964 params: deleteGallery, 959 params: deleteGallery,
965 headers: { 960 headers: {
966 Authorization: "Bearer " + this.token 961 Authorization: "Bearer " + this.token
967 } 962 }
968 } 963 }
969 ) 964 )
970 .then(response => { 965 .then(response => {
971 this.snackbar = true; 966 this.snackbar = true;
972 this.text = "Successfully delete Course Details"; 967 this.text = "Successfully delete Course Details";
973 this.color = "green"; 968 this.color = "green";
974 this.getCourseDetailsList(); 969 this.getCourseDetailsList();
975 }) 970 })
976 .catch(error => { 971 .catch(error => {
977 // console.log(error); 972 // console.log(error);
978 this.snackbar = true; 973 this.snackbar = true;
979 this.text = error.response.data.message; 974 this.text = error.response.data.message;
980 this.color = "error"; 975 this.color = "error";
981 }); 976 });
982 }, 977 },
983 deleteChapters(item) { 978 deleteChapters(item) {
984 // console.log("item", item); 979 // console.log("item", item);
985 let deleteChapters = { 980 let deleteChapters = {
986 courseDetailId: this.courseId, 981 courseDetailId: this.courseId,
987 chapterId: item._id 982 chapterId: item._id
988 }; 983 };
989 http() 984 http()
990 .put( 985 .put(
991 "/deleteChapters", 986 "/deleteChapters",
992 confirm("Are you sure you want to delete this?") && deleteChapters 987 confirm("Are you sure you want to delete this?") && deleteChapters
993 ) 988 )
994 .then(response => { 989 .then(response => {
995 this.snackbar = true; 990 this.snackbar = true;
996 this.text = "Successfully delete Chapters"; 991 this.text = "Successfully delete Chapters";
997 this.color = "green"; 992 this.color = "green";
998 this.getCourseDetailsList(); 993 this.getCourseDetailsList();
999 }) 994 })
1000 .catch(error => { 995 .catch(error => {
1001 // console.log(error); 996 // console.log(error);
1002 this.snackbar = true; 997 this.snackbar = true;
1003 this.text = error.response.data.message; 998 this.text = error.response.data.message;
1004 this.color = "error"; 999 this.color = "error";
1005 }); 1000 });
1006 }, 1001 },
1007 close() { 1002 close() {
1008 this.editCourseDetailDialog = false; 1003 this.editCourseDetailDialog = false;
1009 }, 1004 },
1010 closeProfileGallery() { 1005 closeProfileGallery() {
1011 this.viewProfileGallery = false; 1006 this.viewProfileGallery = false;
1012 }, 1007 },
1013 submit() { 1008 submit() {
1014 let chapters = []; 1009 let chapters = [];
1015 var chapterPoints = []; 1010 var chapterPoints = [];
1016 for (let i = 0; i < this.finds.length; i++) { 1011 for (let i = 0; i < this.finds.length; i++) {
1017 chapterPoints.push(this.finds[i].value); 1012 chapterPoints.push(this.finds[i].value);
1018 // console.log("this.finds[i].value", this.finds[i].value); 1013 // console.log("this.finds[i].value", this.finds[i].value);
1019 chapters = [ 1014 chapters = [
1020 { 1015 {
1021 chapterName: this.addCourseDetail.chapterName, 1016 chapterName: this.addCourseDetail.chapterName,
1022 description: this.addCourseDetail.description, 1017 description: this.addCourseDetail.description,
1023 chapterPoints: chapterPoints, 1018 chapterPoints: chapterPoints,
1024 uploadPdf: this.pdfFile, 1019 uploadPdf: this.pdfFile,
1025 uploadPpt: this.pptFile 1020 uploadPpt: this.pptFile
1026 } 1021 }
1027 ]; 1022 ];
1028 } 1023 }
1029 if (this.$refs.form.validate()) { 1024 if (this.$refs.form.validate()) {
1030 // console.log("this.addCourseDetail", this.addCourseDetail); 1025 // console.log("this.addCourseDetail", this.addCourseDetail);
1031 var courseDetailsData = { 1026 var courseDetailsData = {
1032 classId: this.addCourseDetail.classId, 1027 classId: this.addCourseDetail.classId,
1033 courseId: this.addCourseDetail.courseId, 1028 courseId: this.addCourseDetail.courseId,
1034 chapters: chapters 1029 chapters: chapters
1035 }; 1030 };
1036 this.loading = true; 1031 this.loading = true;
1037 http() 1032 http()
1038 .post("/createCourseDetail", courseDetailsData) 1033 .post("/createCourseDetail", courseDetailsData)
1039 .then(response => { 1034 .then(response => {
1040 this.addCourseDetailDialog = false; 1035 this.addCourseDetailDialog = false;
1041 this.loading = false; 1036 this.loading = false;
1042 this.snackbar = true; 1037 this.snackbar = true;
1043 this.text = response.data.message; 1038 this.text = response.data.message;
1044 this.color = "green"; 1039 this.color = "green";
1045 this.clear(); 1040 this.clear();
1046 this.trigger = "reset"; 1041 this.trigger = "reset";
1047 this.emptyPdf = "reset"; 1042 this.emptyPdf = "reset";
1048 this.removeAddFind(); 1043 this.removeAddFind();
1049 }) 1044 })
1050 .catch(error => { 1045 .catch(error => {
1051 this.snackbar = true; 1046 this.snackbar = true;
1052 this.text = error.response.data.message; 1047 this.text = error.response.data.message;
1053 this.color = "error"; 1048 this.color = "error";
1054 this.loading = false; 1049 this.loading = false;
1055 }); 1050 });
1056 } 1051 }
1057 }, 1052 },
1058 clear() { 1053 clear() {
1059 this.$refs.form.reset(); 1054 this.$refs.form.reset();
1060 }, 1055 },
1061 saveChapter() { 1056 saveChapter() {
1062 this.editedItem.courseDetailId = this.editedItem._id; 1057 this.editedItem.courseDetailId = this.editedItem._id;
1063 // console.log("this.updates", this.updates); 1058 // console.log("this.updates", this.updates);
1064 var chapterPoints = []; 1059 var chapterPoints = [];
1065 for (let i = 0; i < this.updates.length; i++) { 1060 for (let i = 0; i < this.updates.length; i++) {
1066 console.log("this.updates[i]", this.updates[i]);
1067 chapterPoints.push(this.updates[i].value); 1061 chapterPoints.push(this.updates[i].value);
1068 } 1062 }
1069 var updateData = { 1063 var updateData = {
1070 courseDetailId: this.courseId, 1064 courseDetailId: this.courseId,
1071 chapterId: this.editChapter._id, 1065 chapterId: this.editChapter._id,
1072 chapterName: this.editChapter.chapterName, 1066 chapterName: this.editChapter.chapterName,
1073 description: this.editChapter.description, 1067 description: this.editChapter.description,
1074 chapterPoints: chapterPoints, 1068 chapterPoints: chapterPoints,
1075 uploadPdf: this.pdfFile, 1069 uploadPdf: this.pdfFile,
1076 uploadPpt: this.pptFile 1070 uploadPpt: this.pptFile
1077 }; 1071 };
1078 console.log("chapterPoints", updateData);
1079 this.editLoading = true; 1072 this.editLoading = true;
1080 http() 1073 http()
1081 .put("/updateChapters", updateData) 1074 .put("/updateChapters", updateData)
1082 .then(response => { 1075 .then(response => {
1083 this.editChapterDetailDialog = false; 1076 this.editChapterDetailDialog = false;
1084 this.snackbar = true; 1077 this.snackbar = true;
1085 this.text = response.data.message; 1078 this.text = response.data.message;
1086 this.color = "green"; 1079 this.color = "green";
1087 this.editLoading = false; 1080 this.editLoading = false;
1088 // this.removeUpdatePoints(); 1081 // this.removeUpdatePoints();
1089 this.trigger = "reset"; 1082 this.trigger = "reset";
1090 this.emptyPdf = "reset"; 1083 this.emptyPdf = "reset";
1091 this.getCourseDetailsList(); 1084 this.getCourseDetailsList();
1092 }) 1085 })
1093 .catch(error => { 1086 .catch(error => {
1094 this.editLoading = false; 1087 this.editLoading = false;
1095 this.snackbar = true; 1088 this.snackbar = true;
1096 this.text = error.response.data.message; 1089 this.text = error.response.data.message;
1097 this.color = "error"; 1090 this.color = "error";
1098 }); 1091 });
1099 }, 1092 },
1100 save() { 1093 save() {
1101 // console.log("utykgigiu", this.editedCourse);
1102 var updateData = { 1094 var updateData = {
1103 courseDetailId: this.editedCourse._id, 1095 courseDetailId: this.editedCourse._id,
1104 courseId: this.editedCourse.courseId, 1096 courseId: this.editedCourse.courseId,
1105 classId: this.editedCourse.classId 1097 classId: this.editedCourse.classId
1106 }; 1098 };
1107 this.editLoading = true; 1099 this.editLoading = true;
1108 http() 1100 http()
1109 .put("/updateCourseDetail", updateData) 1101 .put("/updateCourseDetail", updateData)
1110 .then(response => { 1102 .then(response => {
1111 this.getCourseDetailsList(); 1103 this.getCourseDetailsList();
1112 this.editCourseDetailDialog = false; 1104 this.editCourseDetailDialog = false;
1113 this.snackbar = true; 1105 this.snackbar = true;
1114 this.text = response.data.message; 1106 this.text = response.data.message;
1115 this.color = "green"; 1107 this.color = "green";
1116 this.editLoading = false; 1108 this.editLoading = false;
1117 // this.editChapterPointName = ""; 1109 // this.editChapterPointName = "";
1118 this.editFiles = []; 1110 this.editFiles = [];
1119 }) 1111 })
1120 .catch(error => { 1112 .catch(error => {
1121 this.editLoading = false; 1113 this.editLoading = false;
1122 this.snackbar = true; 1114 this.snackbar = true;
1123 this.text = error.response.data.message; 1115 this.text = error.response.data.message;
1124 this.color = "error"; 1116 this.color = "error";
1125 }); 1117 });
1126 }, 1118 },
1127 getAllClasses() { 1119 getAllClasses() {
1128 http() 1120 http()
1129 .get("/getClassesList", { 1121 .get("/getClassesList", {
1130 headers: { Authorization: "Bearer " + this.token } 1122 headers: { Authorization: "Bearer " + this.token }
1131 }) 1123 })
1132 .then(response => { 1124 .then(response => {
1133 this.addclass = response.data.data; 1125 this.addclass = response.data.data;
1134 }) 1126 })
1135 .catch(err => { 1127 .catch(err => {
1136 // console.log("err====>", err); 1128 // console.log("err====>", err);
1137 }); 1129 });
1138 }, 1130 },
1139 removeChapterPoint: function() { 1131 removeChapterPoint: function() {
1140 this.findsChapterPoint = [{ value: "" }]; 1132 this.findsChapterPoint = [{ value: "" }];
1141 }, 1133 },
1142 removeAddFind: function() { 1134 removeAddFind: function() {
1143 this.finds = [{ value: "" }]; 1135 this.finds = [{ value: "" }];
1144 }, 1136 },
1145 addFind: function() { 1137 addFind: function() {
1146 this.finds.push({ value: "" }); 1138 this.finds.push({ value: "" });
1147 }, 1139 },
1148 addChapterPoint: function() { 1140 addChapterPoint: function() {
1149 this.findsChapterPoint.push({ value: "" }); 1141 this.findsChapterPoint.push({ value: "" });
1150 console.log("this.findsChapterPoint", this.findsChapterPoint);
1151 }, 1142 },
1152 update: function() { 1143 update: function() {
1153 this.updates.push({ value: "" }); 1144 this.updates.push({ value: "" });
1154 }, 1145 },
1155 // removeUpdatePoints: function() { 1146 // removeUpdatePoints: function() {
1156 // this.updates = [{ value: "" }]; 1147 // this.updates = [{ value: "" }];
1157 // }, 1148 // },
1158 deleteFind: function(index) { 1149 deleteFind: function(index) {
1159 this.finds.splice(index, 1); 1150 this.finds.splice(index, 1);
1160 if (index === 0) this.addFind(); 1151 if (index === 0) this.addFind();
1161 }, 1152 },
1162 deleteChapterPoint: function(index) { 1153 deleteChapterPoint: function(index) {
1163 this.findsChapterPoint.splice(index, 1); 1154 this.findsChapterPoint.splice(index, 1);
1164 if (index === 0) this.addChapterPoint(); 1155 if (index === 0) this.addChapterPoint();
1165 }, 1156 },
1166 deleteUpdate: function(index) { 1157 deleteUpdate: function(index) {
1167 this.updates.splice(index, 1); 1158 this.updates.splice(index, 1);
1168 if (index === 0) this.update(); 1159 if (index === 0) this.update();
1169 }, 1160 },
1170 deleteUrl: function(index, youTubelinkId, id) { 1161 deleteUrl: function(index, youTubelinkId, id) {
1171 this.editChapter.chapterPoints.splice(index, 1); 1162 this.editChapter.chapterPoints.splice(index, 1);
1172 if (index === 0) this.update(); 1163 if (index === 0) this.update();
1173 }, 1164 },
1174 displaySearch() { 1165 displaySearch() {
1175 this.show = false; 1166 this.show = false;
1176 this.showSearch = true; 1167 this.showSearch = true;
1177 }, 1168 },
1178 closeSearch() { 1169 closeSearch() {
1179 this.showSearch = false; 1170 this.showSearch = false;
1180 this.show = true; 1171 this.show = true;
1181 this.search = ""; 1172 this.search = "";
1182 } 1173 }
1183 }, 1174 },
1184 mounted() { 1175 mounted() {
1185 this.token = this.$store.state.token; 1176 this.token = this.$store.state.token;
1186 this.getAllClasses(); 1177 this.getAllClasses();
1187 } 1178 }
1188 }; 1179 };
1189 </script> 1180 </script>