viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit ea5696f7775ee3686cef44eb51c2cd6df81ec353

Authored by Neeraj Sharma
1 parent c0b01ae20e
Exists in master and in 3 other branches amber-development, development, ui-design

solve bugs in progressCardReport

Showing 1 changed file with 2 additions and 2 deletions   Show diff stats
src/pages/Report/progressCardReport.vue
Diff comments   View file @ea5696f
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <!-- ****** Progress Card Report Table****** --> 3 <!-- ****** Progress Card Report Table****** -->
4 4
5 <v-card flat> 5 <v-card flat>
6 <v-card-actions> 6 <v-card-actions>
7 <v-layout> 7 <v-layout>
8 <h4 class="ml-2">Progress Card Report</h4> 8 <h4 class="ml-2">Progress Card Report</h4>
9 </v-layout> 9 </v-layout>
10 </v-card-actions> 10 </v-card-actions>
11 </v-card> 11 </v-card>
12 <v-card flat> 12 <v-card flat>
13 <v-form ref="form" v-model="valid" lazy-validation> 13 <v-form ref="form" v-model="valid" lazy-validation>
14 <v-flex xs12 sm12 lg12> 14 <v-flex xs12 sm12 lg12>
15 <v-layout wrap> 15 <v-layout wrap>
16 <v-flex xs12 sm12 lg3> 16 <v-flex xs12 sm12 lg3>
17 <v-layout> 17 <v-layout>
18 <v-flex xs3 sm6 lg2 class="subheading mt-4"> 18 <v-flex xs3 sm6 lg2 class="subheading mt-4">
19 <label class="right">Class:</label> 19 <label class="right">Class:</label>
20 </v-flex> 20 </v-flex>
21 <v-flex xs9 sm6 lg8 class="ml-2"> 21 <v-flex xs9 sm6 lg8 class="ml-2">
22 <v-select 22 <v-select
23 v-model="getReport.classId" 23 v-model="getReport.classId"
24 label="Select your class" 24 label="Select your class"
25 type="text" 25 type="text"
26 :items="classList" 26 :items="classList"
27 item-text="classNum" 27 item-text="classNum"
28 item-value="_id" 28 item-value="_id"
29 :rules="classRules" 29 :rules="classRules"
30 @change="getSections(getReport.classId)" 30 @change="getSections(getReport.classId)"
31 required 31 required
32 ></v-select> 32 ></v-select>
33 </v-flex> 33 </v-flex>
34 </v-layout> 34 </v-layout>
35 </v-flex> 35 </v-flex>
36 <v-flex xs12 sm12 lg3> 36 <v-flex xs12 sm12 lg3>
37 <v-layout> 37 <v-layout>
38 <v-flex xs3 sm6 lg2 class="subheading mt-4"> 38 <v-flex xs3 sm6 lg2 class="subheading mt-4">
39 <label class="right">Section:</label> 39 <label class="right">Section:</label>
40 </v-flex> 40 </v-flex>
41 <v-flex xs9 sm6 lg8 class="ml-2"> 41 <v-flex xs9 sm6 lg8 class="ml-2">
42 <v-select 42 <v-select
43 :items="addSection" 43 :items="addSection"
44 label="Select your Section" 44 label="Select your Section"
45 v-model="getReport.sectionId" 45 v-model="getReport.sectionId"
46 item-text="name" 46 item-text="name"
47 item-value="_id" 47 item-value="_id"
48 name="Select Section" 48 name="Select Section"
49 @change="getStudents" 49 @change="getStudents"
50 :rules="sectionRules" 50 :rules="sectionRules"
51 required 51 required
52 ></v-select> 52 ></v-select>
53 </v-flex> 53 </v-flex>
54 </v-layout> 54 </v-layout>
55 </v-flex> 55 </v-flex>
56 <v-flex xs12 sm12 lg3> 56 <v-flex xs12 sm12 lg3>
57 <v-layout> 57 <v-layout>
58 <v-flex xs3 sm6 lg2 class="subheading mt-4"> 58 <v-flex xs3 sm6 lg2 class="subheading mt-4">
59 <label class="right">Student:</label> 59 <label class="right">Student:</label>
60 </v-flex> 60 </v-flex>
61 <v-flex xs9 sm6 lg8 class="ml-2"> 61 <v-flex xs9 sm6 lg8 class="ml-2">
62 <v-select 62 <v-select
63 :items="getStudentsList" 63 :items="getStudentsList"
64 label="Select your student" 64 label="Select your student"
65 v-model="getReport.studentId" 65 v-model="getReport.studentId"
66 item-text="name" 66 item-text="name"
67 item-value="_id" 67 item-value="_id"
68 :rules="studentRules" 68 :rules="studentRules"
69 required 69 required
70 ></v-select> 70 ></v-select>
71 </v-flex> 71 </v-flex>
72 </v-layout> 72 </v-layout>
73 </v-flex> 73 </v-flex>
74 <v-flex xs12 sm12 lg3> 74 <v-flex xs12 sm12 lg3>
75 <v-btn 75 <v-btn
76 @click="getMarkReportList" 76 @click="getMarkReportList"
77 round 77 round
78 dark 78 dark
79 :loading="loading" 79 :loading="loading"
80 class="right mt-3" 80 class="right mt-3"
81 >Get Report</v-btn> 81 >Get Report</v-btn>
82 </v-flex> 82 </v-flex>
83 </v-layout> 83 </v-layout>
84 </v-flex> 84 </v-flex>
85 </v-form> 85 </v-form>
86 </v-card> 86 </v-card>
87 <v-container grid-list-md v-show="showReport"> 87 <v-container grid-list-md v-show="showReport">
88 <!-- {{ filterData }} --> 88 <!-- {{ filterData }} -->
89 <v-layout> 89 <v-layout>
90 <v-flex xs12 sm12 v-if="filterData != {}"> 90 <v-flex xs12 sm12 v-if="filterData != {}">
91 <v-btn class="grey" dark @click="print()"> 91 <v-btn class="grey" dark @click="print()">
92 Print 92 Print
93 <v-icon right dark>print</v-icon> 93 <v-icon right dark>print</v-icon>
94 </v-btn> 94 </v-btn>
95 </v-flex> 95 </v-flex>
96 </v-layout> 96 </v-layout>
97 <v-flex xs12 sm12 id="printMe"> 97 <v-flex xs12 sm12 id="printMe">
98 <v-layout wrap> 98 <v-layout wrap>
99 <!-- ****** TABLE DATA MARK ****** --> 99 <!-- ****** TABLE DATA MARK ****** -->
100 <v-flex xs12 sm12 md12> 100 <v-flex xs12 sm12 md12>
101 <v-card 101 <v-card
102 v-for="(value, id, index) in filterData" 102 v-for="(value, id, index) in filterData"
103 :key="index" 103 :key="index"
104 flat 104 flat
105 style="border: 1px solid lightgrey;margin-bottom:14px;padding:20px" 105 style="border: 1px solid lightgrey;margin-bottom:14px;padding:20px"
106 > 106 >
107 <!-- {{ value[index] }} --> 107 <!-- {{ value[index] }} -->
108 <v-layout> 108 <v-layout v-if="value[0] === 0">
109 <v-flex xs12 style="border-bottom: 1px solid #707478;padding-bottom:6px !important"> 109 <v-flex xs12 style="border-bottom: 1px solid #707478;padding-bottom:6px !important">
110 <img :src="userData.schoolLogoUrl" v-if="userData.schoolLogoUrl" width="100" /> 110 <img :src="userData.schoolLogoUrl" v-if="userData.schoolLogoUrl" width="100" />
111 <img src="/static/icon/user.png" v-else-if="!userData.schoolLogoUrl" width="100" /> 111 <img src="/static/icon/user.png" v-else-if="!userData.schoolLogoUrl" width="100" />
112 </v-flex> 112 </v-flex>
113 </v-layout> 113 </v-layout>
114 <v-layout style="padding-top:10px"> 114 <v-layout style="padding-top:10px" v-if="value[0] === 0">
115 <v-flex xs5> 115 <v-flex xs5>
116 <p style="margin:0px;margin-bottom:4px"> 116 <p style="margin:0px;margin-bottom:4px">
117 <span style="font-size:20px">{{ userData.name }}</span> 117 <span style="font-size:20px">{{ userData.name }}</span>
118 <br /> 118 <br />
119 <span style="font-size: 15px;color: #707478;">{{ userData.address }}</span> 119 <span style="font-size: 15px;color: #707478;">{{ userData.address }}</span>
120 </p> 120 </p>
121 <p 121 <p
122 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;" 122 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;"
123 >phone : {{ userData.mobile }}</p> 123 >phone : {{ userData.mobile }}</p>
124 <p 124 <p
125 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;" 125 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;"
126 >Email : {{ userData.email }}</p> 126 >Email : {{ userData.email }}</p>
127 </v-flex> 127 </v-flex>
128 <v-flex xs5> 128 <v-flex xs5>
129 <p 129 <p
130 style="font-size:20px;margin:0px;margin-bottom:4px;" 130 style="font-size:20px;margin:0px;margin-bottom:4px;"
131 >{{ value[0].studentId.name }}</p> 131 >{{ value[0].studentId.name }}</p>
132 <p 132 <p
133 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;" 133 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;"
134 >Class : {{ value[0].classId.classNum }}</p> 134 >Class : {{ value[0].classId.classNum }}</p>
135 <p 135 <p
136 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;" 136 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;"
137 >Roll NO : {{ value[0].studentId.rollNo }}</p> 137 >Roll NO : {{ value[0].studentId.rollNo }}</p>
138 <p 138 <p
139 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;" 139 style="font-size: 15px;color: #707478;margin:0px;margin-bottom:4px;"
140 >Section : {{ value[0].sectionId.name }}</p> 140 >Section : {{ value[0].sectionId.name }}</p>
141 </v-flex> 141 </v-flex>
142 <v-flex xs2> 142 <v-flex xs2>
143 <v-avatar size="100"> 143 <v-avatar size="100">
144 <img 144 <img
145 :src="value[0].studentId.profilePicUrl" 145 :src="value[0].studentId.profilePicUrl"
146 v-if="value[0].studentId.profilePicUrl" 146 v-if="value[0].studentId.profilePicUrl"
147 width="100px" 147 width="100px"
148 /> 148 />
149 <img 149 <img
150 src="/static/icon/user.png" 150 src="/static/icon/user.png"
151 v-else-if="!value[0].studentId.profilePicUrl" 151 v-else-if="!value[0].studentId.profilePicUrl"
152 width="100px" 152 width="100px"
153 /> 153 />
154 </v-avatar> 154 </v-avatar>
155 </v-flex> 155 </v-flex>
156 </v-layout> 156 </v-layout>
157 <v-card-title class="subheading">{{value[0].examId.examName}}</v-card-title> 157 <v-card-title class="subheading">{{value[0].examId.examName}}</v-card-title>
158 <table 158 <table
159 class="mb-5 tableRsponsive feeTypeTable" 159 class="mb-5 tableRsponsive feeTypeTable"
160 style="border: 1px solid lightgrey; 160 style="border: 1px solid lightgrey;
161 border-collapse: collapse;!important 161 border-collapse: collapse;!important
162 table-layout: auto !important; 162 table-layout: auto !important;
163 width: 100% !important;" 163 width: 100% !important;"
164 > 164 >
165 <thead style="border: 1px solid lightgrey !important;"> 165 <thead style="border: 1px solid lightgrey !important;">
166 <tr style="border: 1px solid lightgrey !important;padding:4px;"> 166 <tr style="border: 1px solid lightgrey !important;padding:4px;">
167 <td 167 <td
168 rowspan="2" 168 rowspan="2"
169 style="border: 1px solid lightgrey !important;padding: 10px;" 169 style="border: 1px solid lightgrey !important;padding: 10px;"
170 >Subject</td> 170 >Subject</td>
171 <!-- <template v-for="(exam,i) in value[index].studentsMarks"> 171 <!-- <template v-for="(exam,i) in value[index].studentsMarks">
172 <td 172 <td
173 colspan="2" 173 colspan="2"
174 style="border: 1px solid lightgrey !important;padding: 10px;" 174 style="border: 1px solid lightgrey !important;padding: 10px;"
175 >{{ exam.markDistributionId.distributionType }}</td> 175 >{{ exam.markDistributionId.distributionType }}</td>
176 </template>--> 176 </template>-->
177 <template v-for="values in value"> 177 <template v-for="values in value">
178 <td 178 <td
179 colspan="2" 179 colspan="2"
180 v-for="studentData in values.studentsMarks" 180 v-for="studentData in values.studentsMarks"
181 >{{ studentData.markDistributionId.distributionType }}</td> 181 >{{ studentData.markDistributionId.distributionType }}</td>
182 </template> 182 </template>
183 <!-- <td>{{value[0].studentsMarks[1].markDistributionId.distributionType}}</td> --> 183 <!-- <td>{{value[0].studentsMarks[1].markDistributionId.distributionType}}</td> -->
184 184
185 <td style="border: 1px solid lightgrey !important;padding: 10px;">Total</td> 185 <td style="border: 1px solid lightgrey !important;padding: 10px;">Total</td>
186 </tr> 186 </tr>
187 <tr 187 <tr
188 v-for="(subject, ind) in value" 188 v-for="(subject, ind) in value"
189 v-if="ind == 0" 189 v-if="ind == 0"
190 style="border: 1px solid lightgrey !important;" 190 style="border: 1px solid lightgrey !important;"
191 > 191 >
192 <template v-for="(exam, i) in subject.studentsMarks"> 192 <template v-for="(exam, i) in subject.studentsMarks">
193 <td style="border: 1px solid lightgrey !important;padding: 10px;">Mark</td> 193 <td style="border: 1px solid lightgrey !important;padding: 10px;">Mark</td>
194 <td style="border: 1px solid lightgrey !important;padding: 10px;">Highest Mark</td> 194 <td style="border: 1px solid lightgrey !important;padding: 10px;">Highest Mark</td>
195 </template> 195 </template>
196 <td style="border: 1px solid lightgrey !important;padding: 10px;">Mark</td> 196 <td style="border: 1px solid lightgrey !important;padding: 10px;">Mark</td>
197 </tr> 197 </tr>
198 </thead> 198 </thead>
199 <tbody style="border: 1px solid lightgrey !important;"> 199 <tbody style="border: 1px solid lightgrey !important;">
200 <tr v-for="subject in value" style="border: 1px solid lightgrey !important;"> 200 <tr v-for="subject in value" style="border: 1px solid lightgrey !important;">
201 <td 201 <td
202 style="border: 1px solid lightgrey !important;padding: 10px;" 202 style="border: 1px solid lightgrey !important;padding: 10px;"
203 >{{subject.subjectName}}</td> 203 >{{subject.subjectName}}</td>
204 <template v-for="(exam, i) in subject.studentsMarks"> 204 <template v-for="(exam, i) in subject.studentsMarks">
205 <td 205 <td
206 style="border: 1px solid lightgrey !important;padding: 10px;" 206 style="border: 1px solid lightgrey !important;padding: 10px;"
207 >{{exam.marksScored}}</td> 207 >{{exam.marksScored}}</td>
208 <td 208 <td
209 style="border: 1px solid lightgrey !important;padding: 10px;" 209 style="border: 1px solid lightgrey !important;padding: 10px;"
210 >{{exam.markDistributionId.markValue}}</td> 210 >{{exam.markDistributionId.markValue}}</td>
211 </template> 211 </template>
212 <td 212 <td
213 style="border: 1px solid lightgrey !important;padding: 10px;" 213 style="border: 1px solid lightgrey !important;padding: 10px;"
214 >{{subject.totalMarks}}</td> 214 >{{subject.totalMarks}}</td>
215 </tr> 215 </tr>
216 </tbody> 216 </tbody>
217 <!-- <tfoot> 217 <!-- <tfoot>
218 <tr> 218 <tr>
219 <td colspan="4"> 219 <td colspan="4">
220 <span class="right subheding">Total Amount (RS) :</span> 220 <span class="right subheding">Total Amount (RS) :</span>
221 </td> 221 </td>
222 <td>{{ feeType.subTotal }}</td> 222 <td>{{ feeType.subTotal }}</td>
223 </tr> 223 </tr>
224 <tr> 224 <tr>
225 <td colspan="4"> 225 <td colspan="4">
226 <span class="right subheding">Paid (RS) :</span> 226 <span class="right subheding">Paid (RS) :</span>
227 </td> 227 </td>
228 <td>{{ feeType.totalPaidAmount ? feeType.totalPaidAmount : 0 }}</td> 228 <td>{{ feeType.totalPaidAmount ? feeType.totalPaidAmount : 0 }}</td>
229 </tr> 229 </tr>
230 <tr> 230 <tr>
231 <td colspan="4"> 231 <td colspan="4">
232 <span class="right subheding">Balance (RS) :</span> 232 <span class="right subheding">Balance (RS) :</span>
233 </td> 233 </td>
234 <td>{{ feeType.totalPaidAmount ? feeType.subTotal - feeType.totalPaidAmount : feeType.subTotal }}</td> 234 <td>{{ feeType.totalPaidAmount ? feeType.subTotal - feeType.totalPaidAmount : feeType.subTotal }}</td>
235 </tr> 235 </tr>
236 </tfoot>--> 236 </tfoot>-->
237 </table> 237 </table>
238 </v-card> 238 </v-card>
239 </v-flex> 239 </v-flex>
240 </v-layout> 240 </v-layout>
241 </v-flex> 241 </v-flex>
242 </v-container> 242 </v-container>
243 <div class="loader" v-if="showLoader"> 243 <div class="loader" v-if="showLoader">
244 <v-progress-circular indeterminate color="white"></v-progress-circular> 244 <v-progress-circular indeterminate color="white"></v-progress-circular>
245 </div> 245 </div>
246 </v-app> 246 </v-app>
247 </template> 247 </template>
248 248
249 <script> 249 <script>
250 import http from "@/Services/http.js"; 250 import http from "@/Services/http.js";
251 import moment from "moment"; 251 import moment from "moment";
252 import _ from "underscore"; 252 import _ from "underscore";
253 253
254 export default { 254 export default {
255 data: () => ({ 255 data: () => ({
256 showLoader: false, 256 showLoader: false,
257 markData: [], 257 markData: [],
258 token: "", 258 token: "",
259 markDistributions: [], 259 markDistributions: [],
260 markParticularDistributionData: [], 260 markParticularDistributionData: [],
261 loading: false, 261 loading: false,
262 valid: true, 262 valid: true,
263 loading: false, 263 loading: false,
264 showReport: false, 264 showReport: false,
265 addSection: [], 265 addSection: [],
266 filterData: [], 266 filterData: [],
267 getStudentsList: [], 267 getStudentsList: [],
268 classRules: [v => !!v || "Class is required"], 268 classRules: [v => !!v || "Class is required"],
269 sectionRules: [v => !!v || "Class is required"], 269 sectionRules: [v => !!v || "Class is required"],
270 studentRules: [v => !!v || "Student is required"], 270 studentRules: [v => !!v || "Student is required"],
271 getReport: {}, 271 getReport: {},
272 classList: [], 272 classList: [],
273 output: null, 273 output: null,
274 userData: {} 274 userData: {}
275 }), 275 }),
276 mounted() { 276 mounted() {
277 this.token = this.$store.state.token; 277 this.token = this.$store.state.token;
278 this.getClass(); 278 this.getClass();
279 this.getUserData(); 279 this.getUserData();
280 }, 280 },
281 methods: { 281 methods: {
282 clear() { 282 clear() {
283 this.$refs.form.reset(); 283 this.$refs.form.reset();
284 }, 284 },
285 getClass() { 285 getClass() {
286 this.showLoader = true; 286 this.showLoader = true;
287 http() 287 http()
288 .get("/getClassesList", { 288 .get("/getClassesList", {
289 headers: { Authorization: "Bearer " + this.token } 289 headers: { Authorization: "Bearer " + this.token }
290 }) 290 })
291 .then(response => { 291 .then(response => {
292 this.classList = response.data.data; 292 this.classList = response.data.data;
293 this.showLoader = false; 293 this.showLoader = false;
294 }) 294 })
295 .catch(error => { 295 .catch(error => {
296 this.showLoader = false; 296 this.showLoader = false;
297 // console.log("err====>", err); 297 // console.log("err====>", err);
298 }); 298 });
299 }, 299 },
300 getSections(_id) { 300 getSections(_id) {
301 this.showLoader = true; 301 this.showLoader = true;
302 http() 302 http()
303 .get( 303 .get(
304 "/getSectionsList", 304 "/getSectionsList",
305 { params: { classId: _id } }, 305 { params: { classId: _id } },
306 { 306 {
307 headers: { Authorization: "Bearer " + this.token } 307 headers: { Authorization: "Bearer " + this.token }
308 } 308 }
309 ) 309 )
310 .then(response => { 310 .then(response => {
311 this.addSection = response.data.data; 311 this.addSection = response.data.data;
312 this.showLoader = false; 312 this.showLoader = false;
313 }) 313 })
314 .catch(err => { 314 .catch(err => {
315 this.showLoader = false; 315 this.showLoader = false;
316 // console.log("err====>", err); 316 // console.log("err====>", err);
317 }); 317 });
318 }, 318 },
319 getStudents() { 319 getStudents() {
320 this.showLoader = true; 320 this.showLoader = true;
321 http() 321 http()
322 .get("/getStudentWithClass", { 322 .get("/getStudentWithClass", {
323 params: { 323 params: {
324 classId: this.getReport.classId, 324 classId: this.getReport.classId,
325 sectionId: this.getReport.sectionId 325 sectionId: this.getReport.sectionId
326 } 326 }
327 }) 327 })
328 .then(response => { 328 .then(response => {
329 this.getStudentsList = response.data.data; 329 this.getStudentsList = response.data.data;
330 this.showLoader = false; 330 this.showLoader = false;
331 // console.log("getSectionsList=====>", response.data.data); 331 // console.log("getSectionsList=====>", response.data.data);
332 }) 332 })
333 .catch(error => { 333 .catch(error => {
334 console.log("err====>", error); 334 console.log("err====>", error);
335 this.showLoader = false; 335 this.showLoader = false;
336 }); 336 });
337 }, 337 },
338 getMarkReportList() { 338 getMarkReportList() {
339 // this.showLoader = true; 339 // this.showLoader = true;
340 this.showReport = true; 340 this.showReport = true;
341 http() 341 http()
342 .get("/getParticularMark", { 342 .get("/getParticularMark", {
343 params: { studentId: this.getReport.studentId }, 343 params: { studentId: this.getReport.studentId },
344 headers: { Authorization: "Bearer " + this.token } 344 headers: { Authorization: "Bearer " + this.token }
345 }) 345 })
346 .then(response => { 346 .then(response => {
347 this.showLoader = false; 347 this.showLoader = false;
348 let newData = response.data.data; 348 let newData = response.data.data;
349 // console.log("response", newData); 349 // console.log("response", newData);
350 for (var i = 0; i < newData.length; i++) { 350 for (var i = 0; i < newData.length; i++) {
351 newData[i].examination = newData[i].examId._id; 351 newData[i].examination = newData[i].examId._id;
352 // console.log("newData[i].examination", newData[i].examination); 352 // console.log("newData[i].examination", newData[i].examination);
353 } 353 }
354 this.filterData = _.groupBy(newData, ["examination"]); 354 this.filterData = _.groupBy(newData, ["examination"]);
355 for (let data in this.filterData) { 355 for (let data in this.filterData) {
356 // console.log("data+++++++++++++++++++++++++++++++++++", data); 356 // console.log("data+++++++++++++++++++++++++++++++++++", data);
357 357
358 for (let item in this.filterData[data]) { 358 for (let item in this.filterData[data]) {
359 console.log( 359 console.log(
360 "filterData[data]==========================>", 360 "filterData[data]==========================>",
361 this.filterData[data] 361 this.filterData[data]
362 ); 362 );
363 console.log("filterData[item]==========================>", item); 363 console.log("filterData[item]==========================>", item);
364 var totalMarks = 0; 364 var totalMarks = 0;
365 for ( 365 for (
366 let i = 0; 366 let i = 0;
367 i < this.filterData[data][item].studentsMarks.length; 367 i < this.filterData[data][item].studentsMarks.length;
368 i++ 368 i++
369 ) { 369 ) {
370 totalMarks += this.filterData[data][item].studentsMarks[i] 370 totalMarks += this.filterData[data][item].studentsMarks[i]
371 .marksScored; 371 .marksScored;
372 } 372 }
373 this.filterData[data][item].totalMarks = totalMarks; 373 this.filterData[data][item].totalMarks = totalMarks;
374 // var total = 0; 374 // var total = 0;
375 // total += this.filterData[data][item].totalMarks ; 375 // total += this.filterData[data][item].totalMarks ;
376 // console.log("total", total); 376 // console.log("total", total);
377 } 377 }
378 } 378 }
379 }) 379 })
380 .catch(error => { 380 .catch(error => {
381 // console.log("err====>", err); 381 // console.log("err====>", err);
382 this.showLoader = false; 382 this.showLoader = false;
383 this.snackbar = true; 383 this.snackbar = true;
384 this.text = error.response.data.message; 384 this.text = error.response.data.message;
385 if (error.response.status === 401) { 385 if (error.response.status === 401) {
386 this.$router.replace({ path: "/" }); 386 this.$router.replace({ path: "/" });
387 this.$store.dispatch("setToken", null); 387 this.$store.dispatch("setToken", null);
388 this.$store.dispatch("Id", null); 388 this.$store.dispatch("Id", null);
389 } 389 }
390 }); 390 });
391 }, 391 },
392 print() { 392 print() {
393 // Pass the element id here 393 // Pass the element id here
394 this.$htmlToPaper("printMe"); 394 this.$htmlToPaper("printMe");
395 }, 395 },
396 getUserData() { 396 getUserData() {
397 http() 397 http()
398 .get("/getParticularUserDetail") 398 .get("/getParticularUserDetail")
399 .then(response => { 399 .then(response => {
400 this.userData = response.data.data; 400 this.userData = response.data.data;
401 }) 401 })
402 .catch(error => { 402 .catch(error => {
403 if (error.response.status === 401) { 403 if (error.response.status === 401) {
404 this.$router.replace({ path: "/" }); 404 this.$router.replace({ path: "/" });
405 this.$store.dispatch("setToken", null); 405 this.$store.dispatch("setToken", null);
406 this.$store.dispatch("Id", null); 406 this.$store.dispatch("Id", null);
407 } 407 }
408 }); 408 });
409 } 409 }
410 } 410 }
411 }; 411 };
412 </script> 412 </script>
413 413
414 <style scoped> 414 <style scoped>
415 table { 415 table {
416 border-collapse: collapse; 416 border-collapse: collapse;
417 border: 1px solid #e2e7eb; 417 border: 1px solid #e2e7eb;
418 } 418 }
419 419
420 th, 420 th,
421 td { 421 td {
422 border: 1px solid #e2e7eb; 422 border: 1px solid #e2e7eb;
423 padding: 10px; 423 padding: 10px;
424 text-align: center; 424 text-align: center;
425 } 425 }
426 table.feeTypeTable { 426 table.feeTypeTable {
427 table-layout: auto !important; 427 table-layout: auto !important;
428 width: 100% !important; 428 width: 100% !important;
429 } 429 }
430 .bg-sky { 430 .bg-sky {
431 background-color: #98b2cc !important; 431 background-color: #98b2cc !important;
432 } 432 }
433 .bg-sky-light { 433 .bg-sky-light {
434 background-color: #89a0b8; 434 background-color: #89a0b8;
435 } 435 }
436 .bg-purple { 436 .bg-purple {
437 background-color: #9583ac; 437 background-color: #9583ac;
438 } 438 }
439 .bg-skyDark { 439 .bg-skyDark {
440 background-color: #956785; 440 background-color: #956785;
441 } 441 }
442 @media screen and (max-width: 380px) { 442 @media screen and (max-width: 380px) {
443 .tableRsponsive { 443 .tableRsponsive {
444 display: block; 444 display: block;
445 position: relative; 445 position: relative;
446 overflow: scroll; 446 overflow: scroll;
447 } 447 }
448 } 448 }
449 </style> s 449 </style> s