viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 81d876b5d6f46695162c5e164d2b8cefb447ac23

Authored by Shikha Mishra
1 parent 0e46192a00
Exists in master and in 3 other branches amber-development, development, ui-design

salary invoice detailss

Showing 4 changed files with 1259 additions and 230 deletions   Show diff stats
src/pages/Account/invoice.vue
Diff comments   View file @81d876b
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** PROFILE VIEW SECTION DATA ****** --> 3 <!-- ****** Edit INVOICE ****** -->
4 <!-- <v-dialog v-model="dialog1" max-width="600px"> 4 <v-dialog v-model="editInvoiceDialog">
5 <v-card> 5 <v-card flat class="text-xs-center white--text">
6 <v-flex align-center justify-center layout text-xs-center> 6 <v-layout>
7 <v-avatar size="50px" style="position:absolute; top:20px;"> 7 <v-flex xs12 class="card-styles pa-2">
8 <img src="/static/icon/user.png" /> 8 <label class="title text-xs-center">Edit Invoice</label>
9 </v-avatar> 9 <v-icon size="24" class="right white--text" @click="editInvoiceDialog = false">cancel</v-icon>
10 </v-flex>
11 </v-layout>
12 <v-flex xs12 sm12>
13 <v-container fluid grid-list-md>
14 <v-layout wrap>
15 <v-flex xs12 sm12 md5>
16 <v-card flat>
17 <v-toolbar dark class="card-styles" flat>
18 <v-spacer></v-spacer>
19 <h3>Invoice</h3>
20 <v-spacer></v-spacer>
21 </v-toolbar>
22 <v-form ref="form" v-model="valid" lazy-validation class="py-4">
23 <v-layout>
24 <v-flex xs4 class="pt-4 subheading">
25 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
26 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
27 </v-flex>
28 <v-flex xs6 class="ml-3">
29 <v-select
30 :items="addclass"
31 label="Select Class"
32 v-model="invoiceData.classId"
33 item-text="classNum"
34 item-value="_id"
35 :rules="classRules"
36 @change="getAllStudents()"
37 required
38 ></v-select>
39 </v-flex>
40 </v-layout>
41 <v-layout>
42 <v-flex xs4 class="pt-4 subheading">
43 <label class="right hidden-xs-only hidden-sm-only">Select Student:</label>
44 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Student:</label>
45 </v-flex>
46 <v-flex xs6 class="ml-3">
47 <v-select
48 :items="studentList"
49 label="Select Student"
50 v-model="invoiceData.studentId"
51 item-text="name"
52 item-value="_id"
53 :rules="inchargeRules"
54 @change="selectAllStudent()"
55 required
56 ></v-select>
57 </v-flex>
58 </v-layout>
59 <v-layout>
60 <v-flex xs4 class="pt-4 subheading">
61 <label class="right">Date:</label>
62 </v-flex>
63 <v-flex xs6 class="ml-3">
64 <v-menu
65 ref="menu1"
66 :close-on-content-click="false"
67 v-model="menu1"
68 :nudge-right="40"
69 lazy
70 :return-value.sync="invoiceData.date"
71 transition="scale-transition"
72 offset-y
73 full-width
74 min-width="290px"
75 >
76 <v-text-field
77 slot="activator"
78 :rules="dateRules"
79 v-model="invoiceData.date"
80 placeholder="Select date"
81 ></v-text-field>
82 <v-date-picker
83 v-model="invoiceData.date"
84 @input="$refs.menu1.save(invoiceData.date)"
85 ></v-date-picker>
86 </v-menu>
87 </v-flex>
88 </v-layout>
89 <v-layout>
90 <v-flex xs4 class="pt-4 subheading">
91 <label class="right hidden-xs-only hidden-sm-only">Payment Status:</label>
92 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Payment:</label>
93 </v-flex>
94 <v-flex xs6 class="ml-3">
95 <v-select
96 :items="paymentStatus"
97 v-model="invoiceData.paymentStatus"
98 item-text="name"
99 item-value="value"
100 label="Select Payment Status"
101 @change="getPayMethodList"
102 :rules="paymentStatusRules"
103 required
104 ></v-select>
105 </v-flex>
106 </v-layout>
107 <v-layout v-show="showPayMethods">
108 <v-flex xs4 class="pt-4 subheading">
109 <label class="right">Payment Method:</label>
110 </v-flex>
111 <v-flex xs6 class="ml-3">
112 <v-select
113 :items="paymentMethods"
114 v-model="invoiceData.paymentMethod"
115 label="Select Payment Method"
116 required
117 ></v-select>
118 </v-flex>
119 </v-layout>
120 <v-layout>
121 <v-flex xs12 sm11>
122 <v-card-actions>
123 <v-spacer></v-spacer>
124 <v-btn
125 @click="update"
126 round
127 dark
128 :loading="loading"
129 class="add-button"
130 >Update</v-btn>
131 </v-card-actions>
132 </v-flex>
133 </v-layout>
134 </v-form>
135 </v-card>
136 </v-flex>
137 <v-flex xs12 sm12 md7>
138 <v-card>
139 <v-toolbar dark class="card-styles" flat>
140 <v-spacer></v-spacer>
141 <h3>Fee Type List</h3>
142 <v-spacer></v-spacer>
143 </v-toolbar>
144 <v-layout>
145 <v-flex xs4 sm2 class="mt-4 hidden-xs-only hidden-sm-only">
146 <label class="right title">Fee Type:</label>
147 </v-flex>
148 <v-flex xs8 sm4>
149 <v-select
150 :items="feeTypes"
151 :rules="feeTypeRules"
152 v-model="invoiceData.feeTypeName"
153 item-text="feeType"
154 item-value="feeType"
155 label="Select Fee Type"
156 ></v-select>
157 </v-flex>
158 <v-flex xs4 sm6>
159 <v-btn
160 color="open-dialog-button"
161 round
162 dark
163 class="right mt-3"
164 @click="selectFeeType"
165 >ADD</v-btn>
166 </v-flex>
167 </v-layout>
168 <table class="feeTypeTable tableRsponsive">
169 <tr class="info white--text">
170 <th>#</th>
171 <th>Fee Type</th>
172 <th>Amount</th>
173 <th>Discount(%)</th>
174 <th>Subtotal</th>
175 <th>Paid Amount</th>
176 <th>Action</th>
177 </tr>
178 <tr
179 v-show="showFeeType"
180 v-for="(invoiceData, index) in feeTypeData"
181 :key="index"
182 v-on:keyup="getAmmountDetails(feeType)"
183 >
184 <td style="width:40px" class="tdFeeType">{{ index + 1 }}</td>
185 <td style="width:120px" class="tdFeeType">
186 <v-text-field
187 :rules="feeTypeNameRules"
188 placeholder="fill your Fee Type"
189 v-model="invoiceData.feeTypeName"
190 ></v-text-field>
191 </td>
192 <td>
193 <v-text-field
194 :rules="amountRules"
195 placeholder="fill your Amount"
196 v-model="invoiceData.amount"
197 type="number"
198 ></v-text-field>
199 </td>
200 <td class="tdFeeType">
201 <v-text-field
202 :rules="discountRules"
203 placeholder="fill your Discount"
204 v-model="invoiceData.discount"
205 type="number"
206 ></v-text-field>
207 </td>
208 <td class="tdFeeType">{{ invoiceData.subTotal }}</td>
209 <td class="tdFeeType" v-if="invoiceData.paymentStatus === 'NOT_PAID'">
210 <v-text-field
211 placeholder="fill your Paid Amount"
212 v-model="invoiceData.paidAmount"
213 type="number"
214 :rules="paymentRules"
215 :disabled="disabled"
216 ></v-text-field>
217 </td>
218 <td class="tdFeeType" v-if="invoiceData.paymentStatus == ''">
219 <v-text-field
220 placeholder="fill your Paid Amount"
221 v-model="invoiceData.paidAmount"
222 type="number"
223 :rules="paymentRules"
224 :disabled="disabled"
225 ></v-text-field>
226 </td>
227 <td
228 class="tdFeeType"
229 v-if="invoiceData.paymentStatus != 'NOT_PAID' && invoiceData.paymentStatus != ''"
230 >
231 <v-text-field
232 placeholder="fill your Paid Amount"
233 v-model="invoiceData.paidAmount"
234 :rules="paymentRules"
235 type="number"
236 ></v-text-field>
237 </td>
238 <td class="tdFeeType">
239 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
240 </td>
241 </tr>
242 <tfoot>
243 <tr>
244 <td colspan="2" class="tdFeeType">Total:</td>
245 <td class="tdFeeType" :rules="amountRules">{{ invoiceData.amount }}</td>
246 <td class="tdFeeType" :rules="discountRules">{{ invoiceData.discount }}</td>
247 <td class="tdFeeType" :rules="subtotalRules">{{ invoiceData.subTotal }}</td>
248 <td class="tdFeeType" :rules="paidAmountRules">{{ invoiceData.paidAmount }}</td>
249 <td class="tdFeeType">
250 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
251 </td>
252 </tr>
253 </tfoot>
254 </table>
255 </v-card>
256 </v-flex>
257 </v-layout>
258 </v-container>
10 </v-flex> 259 </v-flex>
11 <v-card-text> 260 </v-card>
12 <v-container grid-list-md> 261 </v-dialog>
262
263 <!-- ****PAYMENT INVOICE DIALOG -->
264 <v-dialog v-model="paymentInvoiceDialog">
265 <v-card flat class="text-xs-center white--text">
266 <v-layout>
267 <v-flex xs12 class="card-styles pa-2">
268 <label class="title text-xs-center">Payment Template</label>
269 <v-icon size="24" class="right white--text" @click="paymentInvoiceDialog = false">cancel</v-icon>
270 </v-flex>
271 </v-layout>
272 <v-flex xs12 sm12>
273 <v-container fluid grid-list-md>
13 <v-layout wrap> 274 <v-layout wrap>
14 <v-flex> 275 <v-flex xs12 sm12 md5>
15 <br /> 276 <v-card flat>
16 <br /> 277 <v-toolbar dark class="card-styles" flat>
17 <v-layout> 278 <v-spacer></v-spacer>
18 <v-flex xs5 sm6> 279 <h3>Profile</h3>
19 <h5 class="right my-1"> 280 <v-spacer></v-spacer>
20 <b>Class Name:</b> 281 </v-toolbar>
21 </h5> 282 <v-card-text>
22 </v-flex> 283 <v-container>
23 <v-flex sm6 xs8> 284 <v-layout wrap>
24 </v-flex> 285 <v-flex xs12>
25 </v-layout> 286 <v-layout>
26 <v-layout> 287 <v-flex
27 <v-flex xs5 sm6> 288 xs12
28 <h5 class="right my-1"> 289 class="text-xs-center text-sm-center text-md-center text-lg-center"
29 <b>Name:</b> 290 >
30 </h5> 291 <v-avatar size="80px">
31 </v-flex> 292 <img src="/static/icon/user.png" v-if="!invoiceList.profilePicUrl" />
32 <v-flex sm6 xs8> 293 <img
33 <h5 class="my-1">{{ editedItem.name }}</h5> 294 :src="invoiceList.profilePicUrl"
34 </v-flex> 295 v-else-if="invoiceList.profilePicUrl"
35 </v-layout> 296 />
36 <v-layout> 297 </v-avatar>
37 <v-flex xs5 sm6> 298 </v-flex>
38 <h5 class="right my-1"> 299 </v-layout>
39 <b>Class Incharge:</b> 300 <v-layout>
40 </h5> 301 <v-flex xs12 sm12>
41 </v-flex> 302 <h3 class="text-xs-center">
42 <v-flex sm6 xs8> 303 <!-- <b>{{ invoiceList.studentId.name }}</b> -->
43 <h5 class="my-1">{{ editedItem.name }}</h5> 304 </h3>
44 </v-flex> 305 <p class="text-xs-center grey--text">Student</p>
45 </v-layout> 306 </v-flex>
46 <v-layout> 307 </v-layout>
47 <v-flex xs5 sm6> 308 <v-layout style="border: 1px solid lightgrey;">
48 <h5 class="right my-1"> 309 <v-flex xs6 sm6 class="pa-0">
49 <b>Session:</b> 310 <h4 class="right">
50 </h5> 311 <b>Roll No :</b>
51 </v-flex> 312 </h4>
52 <v-flex sm6 xs8> 313 </v-flex>
53 <h5 class="my-1">{{ editedItem.paymentStatus }}</h5> 314 <v-flex sm6 xs6 class="pa-0">
54 </v-flex> 315 <!-- <h4>{{ invoiceList.studentId.rollNo }}</h4> -->
55 </v-layout> 316 </v-flex>
317 </v-layout>
318 <v-layout style="border: 1px solid lightgrey;">
319 <v-flex xs6 sm6 class="pa-0">
320 <h4 class="right">
321 <b>Class :</b>
322 </h4>
323 </v-flex>
324 <v-flex sm6 xs6 class="pa-0">
325 <!-- <h4>{{ invoiceList.classId.classNum }}</h4> -->
326 </v-flex>
327 </v-layout>
328 <!-- <v-layout style="border: 1px solid lightgrey;">
329 <v-flex xs6 sm6 class="pa-0">
330 <h4 class="right">
331 <b>Section :</b>
332 </h4>
333 </v-flex>
334 <v-flex sm6 xs6 class="pa-0">
335 <h4>{{ invoiceList.sectionId.name }}</h4>
336 </v-flex>
337 </v-layout>-->
338 </v-flex>
339 </v-layout>
340 </v-container>
341 </v-card-text>
342 </v-card>
343 <v-flex>
344 <v-card>
345 <v-flex xs12 sm12 md12 style="padding-top: 1%;">
346 <v-card flat>
347 <v-toolbar dark class="card-styles" flat>
348 <v-spacer></v-spacer>
349 <h3>Invoice</h3>
350 <v-spacer></v-spacer>
351 </v-toolbar>
352 </v-card>
353 <v-layout>
354 <v-flex xs12>
355 <v-layout>
356 <v-flex xs4 class="pt-4 subheading">
357 <label class="right">Payment Method:</label>
358 </v-flex>
359 <v-flex xs6 class="ml-3">
360 <v-select
361 :items="paymentMethods"
362 v-model="invoiceList.paymentMethod"
363 label="Select Payment Method"
364 required
365 ></v-select>
366 </v-flex>
367 </v-layout>
368 <v-card-actions>
369 <v-spacer class="hidden-xs-only"></v-spacer>
370 <v-btn
371 color="open-dialog-button"
372 dark
373 class="right mt-3"
374 @click="save"
375 >Add Payment</v-btn>
376 </v-card-actions>
377 </v-flex>
378 </v-layout>
379 </v-flex>
380 </v-card>
381 </v-flex>
382 </v-flex>
383 <v-flex xs12 sm12 md7>
384 <v-card>
385 <v-toolbar dark class="card-styles" flat>
386 <v-spacer></v-spacer>
387 <h3>Fee Type List</h3>
388 <v-spacer></v-spacer>
389 </v-toolbar>
390 <table class="feeTypeTable tableRsponsive">
391 <tr class="info white--text">
392 <th>#</th>
393 <th>Fee Type</th>
394 <th>Amount</th>
395 <th>Discount(%)</th>
396 <th>Subtotal</th>
397 <th>Paid Amount</th>
398 <th>Action</th>
399 </tr>
400 <tr
401 v-show="showFeeType"
402 v-for="(feeType, index) in feeTypeData"
403 :key="index"
404 v-on:keyup="getAmmountDetails(feeType)"
405 >
406 <td style="width:40px" class="tdFeeType">{{ index + 1 }}</td>
407 <td style="width:120px" class="tdFeeType">{{ feeType.feeTypeName }}</td>
408 <td class="tdFeeType">
409 <v-text-field
410 placeholder="fill your Amount"
411 v-model="feeType.amount"
412 type="number"
413 ></v-text-field>
414 </td>
415 <td class="tdFeeType">
416 <v-text-field
417 placeholder="fill your Discount"
418 v-model="feeType.discount"
419 type="number"
420 ></v-text-field>
421 </td>
422 <td class="tdFeeType">{{ feeType.subTotal }}</td>
423 <td class="tdFeeType" v-if="invoiceData.paymentStatus === 'NOT_PAID'">
424 <v-text-field
425 placeholder="fill your Paid Amount"
426 v-model="feeType.paidAmount"
427 type="number"
428 :disabled="disabled"
429 ></v-text-field>
430 </td>
431 <td class="tdFeeType" v-if="invoiceData.paymentStatus == ''">
432 <v-text-field
433 placeholder="fill your Paid Amount"
434 v-model="feeType.paidAmount"
435 type="number"
436 :disabled="disabled"
437 ></v-text-field>
438 </td>
439 <td
440 class="tdFeeType"
441 v-if="invoiceData.paymentStatus != 'NOT_PAID' && invoiceData.paymentStatus != ''"
442 >
443 <v-text-field
444 placeholder="fill your Paid Amount"
445 v-model="feeType.paidAmount"
446 type="number"
447 ></v-text-field>
448 </td>
449 <td class="tdFeeType">
450 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
451 </td>
452 </tr>
453 <tfoot>
454 <tr>
455 <td colspan="2" class="tdFeeType">Total:</td>
456 <td class="tdFeeType">{{ feeType.amount }}</td>
457 <td class="tdFeeType">{{ feeType.discount }}</td>
458 <td class="tdFeeType">{{ feeType.subTotal }}</td>
459 <td class="tdFeeType">{{ feeType.paidAmount }}</td>
460 <td class="tdFeeType">
461 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
462 </td>
463 </tr>
464 </tfoot>
465 </table>
466 </v-card>
56 </v-flex> 467 </v-flex>
57 </v-layout> 468 </v-layout>
58 </v-container> 469 </v-container>
59 </v-card-text> 470 </v-flex>
471 </v-card>
472 </v-dialog>
473
474 <!-- ****** PROFILE VIEW SECTION DATA ****** -->
475 <v-dialog v-model="dialog1" max-width="800px">
476 <v-card flat class="text-xs-center white--text">
477 <v-layout>
478 <v-flex xs12 class="card-style pa-2">
479 <label class="title text-xs-center">View Payments</label>
480 <v-icon size="24" class="right" color="white" @click="dialog1 = false">cancel</v-icon>
481 </v-flex>
482 </v-layout>
483 <v-data-table
484 :headers="headersProfile"
485 :items="invoiceList"
486 :pagination.sync="pagination"
487 :search="search"
488 >
489 <template slot="items" slot-scope="props">
490 <tr class="tr">
491 <td class="td td-row">{{ props.index + 1 }}</td>
492 <td class="text-xs-center td td-row">{{ dates(props.item.date) }}</td>
493 <td class="text-xs-center td td-row">{{ props.item.paymentMethod }}</td>
494 <td class="text-xs-center td td-row">{{ props.item.totalAmount }}</td>
495 <td class="text-xs-center td td-row">{{ feeType.discount}}</td>
496
497 <td class="text-xs-center td td-row">
498 <router-link
499 :to="{ name:'View Payment Invoice',params: { viewPaymentInvoiceId:props.item._id } }"
500 >
501 <v-tooltip top>
502 <img
503 slot="activator"
504 style="cursor:pointer; width:25px; height:25px; "
505 class="mr-3"
506 src="/static/icon/view.png"
507 />
508 <span>View</span>
509 </v-tooltip>
510 </router-link>
511 <v-tooltip top>
512 <img
513 slot="activator"
514 style="cursor:pointer;width:20px; height:20px; "
515 class="mr-3"
516 @click="deleteItem(props.item)"
517 src="/static/icon/delete.png"
518 />
519 <span>Delete</span>
520 </v-tooltip>
521 </td>
522 </tr>
523 </template>
524 <v-alert
525 slot="no-results"
526 :value="true"
527 color="error"
528 icon="warning"
529 >Your search for "{{ search }}" found no results.</v-alert>
530 </v-data-table>
531 <!-- <table class="feeTypeTable tableRsponsive">
532 <tr style="color: black">
533 <th>#</th>
534 <th>Date</th>
535 <th>Paid By</th>
536 <th>Payment Amount</th>
537 <th>Weaver</th>
538 <th>Action</th>
539 </tr>
540 <tr>
541 <td style="width:40px" class="tdFeeType">{{ index + 1 }}</td>
542 <td style="width:120px" class="tdFeeType">{{dates( editedItem.date) }}</td>
543 <td style="width:120px" class="tdFeeType">{{ editedItem.paymentMethod }}</td>
544 <td style="width:120px" class="tdFeeType">{{ editedItem.totalAmount }}</td>
545 <td style="width:120px" class="tdFeeType">{{ editedItem.discount}}</td>
546 <td class="text-xs-center td td-row">
547 <router-link
548 :to="{ name:'View Payment Invoice',params: { viewPaymentInvoiceId:editedItem._id } }"
549 >
550 <v-tooltip top>
551 <img
552 slot="activator"
553 style="cursor:pointer; width:25px; height:25px; "
554 class="mr-3"
555 src="/static/icon/view.png"
556 />
557 <span>View</span>
558 </v-tooltip>
559 </router-link>
560 <v-tooltip top>
561 <img
562 slot="activator"
563 style="cursor:pointer;width:20px; height:20px; "
564 class="mr-3"
565 @click="deleteItem(props.item)"
566 src="/static/icon/delete.png"
567 />
568 <span>Delete</span>
569 </v-tooltip>
570 </td>
571 </tr>
572 </table>-->
60 </v-card> 573 </v-card>
61 </v-dialog>--> 574 </v-dialog>
62 <!-- ****** Invoice Table ****** --> 575 <!-- ****** Invoice Table ****** -->
63 576
64 <v-toolbar color="transparent" flat> 577 <v-toolbar color="transparent" flat>
65 <v-btn 578 <v-btn
66 fab 579 fab
67 dark 580 dark
68 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 581 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
69 small 582 small
70 @click="addInvoiceDialog = true" 583 @click="addInvoiceDialog = true"
71 > 584 >
72 <v-icon dark>add</v-icon> 585 <v-icon dark>add</v-icon>
73 </v-btn> 586 </v-btn>
74 <v-btn 587 <v-btn
75 round 588 round
76 class="open-dialog-button hidden-sm-only hidden-xs-only" 589 class="open-dialog-button hidden-sm-only hidden-xs-only"
77 dark 590 dark
78 @click="addInvoiceDialog = true" 591 @click="addInvoiceDialog = true"
79 > 592 >
80 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Invoice 593 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Invoice
81 </v-btn> 594 </v-btn>
82 <v-spacer></v-spacer> 595 <v-spacer></v-spacer>
83 <v-card-title class="body-1" v-show="show"> 596 <v-card-title class="body-1" v-show="show">
84 <v-btn icon large flat @click="displaySearch"> 597 <v-btn icon large flat @click="displaySearch">
85 <v-avatar size="27"> 598 <v-avatar size="27">
86 <img src="/static/icon/search.png" alt="icon" /> 599 <img src="/static/icon/search.png" alt="icon" />
87 </v-avatar> 600 </v-avatar>
88 </v-btn> 601 </v-btn>
89 </v-card-title> 602 </v-card-title>
90 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 603 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
91 <v-layout> 604 <v-layout>
92 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 605 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
93 <v-icon @click="closeSearch" color="error">close</v-icon> 606 <v-icon @click="closeSearch" color="error">close</v-icon>
94 </v-layout> 607 </v-layout>
95 </v-flex> 608 </v-flex>
96 </v-toolbar> 609 </v-toolbar>
97 <v-data-table 610 <v-data-table
98 :headers="headers" 611 :headers="headers"
99 :items="invoiceList" 612 :items="invoiceList"
100 :pagination.sync="pagination" 613 :pagination.sync="pagination"
101 :search="search" 614 :search="search"
102 > 615 >
103 <template slot="items" slot-scope="props"> 616 <template slot="items" slot-scope="props">
104 <tr class="tr"> 617 <tr class="tr">
105 <td class="td td-row">{{ props.index + 1 }}</td> 618 <td class="td td-row">{{ props.index + 1 }}</td>
106 <!-- <td class="text-xs-center td td-row">{{ props.item.studentId.name }}</td> --> 619 <td class="text-xs-center td td-row">{{ props.item.studentId.name }}</td>
107 <td class="text-xs-center td td-row">{{ props.item.classId.classNum }}</td> 620 <td class="text-xs-center td td-row">{{ props.item.classId.classNum }}</td>
108 <td class="text-xs-center td td-row">{{ props.item.totalAmount }}</td> 621 <td class="text-xs-center td td-row">{{ props.item.totalAmount }}</td>
109 <td 622 <td
110 class="text-xs-center td td-row" 623 class="text-xs-center td td-row"
111 >{{ props.item.totalAmount - props.item.totalSubTotal }}</td> 624 >{{ props.item.totalAmount - props.item.totalSubTotal }}</td>
112 <td 625 <td
113 class="text-xs-center td td-row" 626 class="text-xs-center td td-row"
114 >{{ props.item.totalPaidAmount ? props.item.totalPaidAmount : 0}}</td> 627 >{{ props.item.totalPaidAmount ? props.item.totalPaidAmount : 0}}</td>
115 <td 628 <td
116 class="text-xs-center td td-row" 629 class="text-xs-center td td-row"
117 >{{ props.item.totalPaidAmount ? props.item.totalSubTotal - props.item.totalPaidAmount : props.item.totalSubTotal }}</td> 630 >{{ props.item.totalPaidAmount ? props.item.totalSubTotal - props.item.totalPaidAmount : props.item.totalSubTotal }}</td>
118 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'NOT_PAID'"> 631 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'NOT_PAID'">
119 <span 632 <span
120 class="red lighten-1 py-1 px-2 white--text paymentStatus" 633 class="red lighten-1 py-1 px-2 white--text paymentStatus"
121 >{{ props.item.paymentStatus }}</span> 634 >{{ props.item.paymentStatus }}</span>
122 </td> 635 </td>
123 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'FULLY_PAID'"> 636 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'FULLY_PAID'">
124 <span 637 <span
125 class="green lighten-1 py-1 px-2 white--text paymentStatus" 638 class="green lighten-1 py-1 px-2 white--text paymentStatus"
126 >{{ props.item.paymentStatus }}</span> 639 >{{ props.item.paymentStatus }}</span>
127 </td> 640 </td>
128 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'PARTIALLY_PAID'"> 641 <td class="text-xs-center td td-row" v-if="props.item.paymentStatus === 'PARTIALLY_PAID'">
129 <span 642 <span
130 class="yellow darken-3 py-1 px-2 white--text paymentStatus" 643 class="yellow darken-3 py-1 px-2 white--text paymentStatus"
131 >{{ props.item.paymentStatus }}</span> 644 >{{ props.item.paymentStatus }}</span>
132 </td> 645 </td>
133 <td class="text-xs-center td td-row">{{ dates(props.item.date) }}</td> 646 <td class="text-xs-center td td-row">{{ dates(props.item.date) }}</td>
134 <td class="text-xs-center td td-row"> 647 <td class="text-xs-center td td-row">
135 <router-link :to="{ name:'View Invoice',params: { viewInvoiceId:props.item._id } }"> 648 <router-link :to="{ name:'View Invoice',params: { viewInvoiceId:props.item._id } }">
136 <v-tooltip top> 649 <v-tooltip top>
137 <img 650 <img
138 slot="activator" 651 slot="activator"
139 style="cursor:pointer; width:25px; height:25px; " 652 style="cursor:pointer; width:25px; height:25px; "
140 class="mr-3" 653 class="mr-3"
141 src="/static/icon/view.png" 654 src="/static/icon/view.png"
142 /> 655 />
143 <span>View</span> 656 <span>View</span>
144 </v-tooltip> 657 </v-tooltip>
145 </router-link> 658 </router-link>
146 <span v-if="props.item.paymentStatus === 'NOT_PAID'"> 659 <span v-if="props.item.paymentStatus === 'NOT_PAID'">
147 <router-link :to="{ name:'EditInvoice',params: { invoiceid:props.item._id }}" exact> 660 <v-tooltip top>
148 <v-tooltip top> 661 <img
149 <img 662 slot="activator"
150 slot="activator" 663 style="cursor:pointer; width:20px; height:18px; "
151 style="cursor:pointer; width:20px; height:18px; " 664 class="mr-3"
152 class="mr-3" 665 @click="editItem(props.item)"
153 src="/static/icon/edit.png" 666 src="/static/icon/edit.png"
154 /> 667 />
155 <span>Edit</span> 668 <span>Edit</span>
156 </v-tooltip> 669 </v-tooltip>
157 </router-link>
158 <v-tooltip top> 670 <v-tooltip top>
159 <img 671 <img
160 slot="activator" 672 slot="activator"
161 style="cursor:pointer;width:20px; height:20px; " 673 style="cursor:pointer;width:20px; height:20px; "
162 class="mr-3" 674 class="mr-3"
163 @click="deleteItem(props.item)" 675 @click="deleteItem(props.item)"
164 src="/static/icon/delete.png" 676 src="/static/icon/delete.png"
165 /> 677 />
166 <span>Delete</span> 678 <span>Delete</span>
167 </v-tooltip> 679 </v-tooltip>
680 <v-tooltip top>
681 <img
682 slot="activator"
683 style="cursor:pointer; width:20px; height:18px; "
684 class="mr-3"
685 @click="paymentItem(props.item)"
686 src="/static/schoolIcons/Account.png"
687 />
688 <span>Payment</span>
689 </v-tooltip>
168 </span> 690 </span>
691 <span v-if="props.item.paymentStatus === 'PARTIALLY_PAID'">
692 <v-tooltip top>
693 <img
694 slot="activator"
695 style="cursor:pointer; width:20px; height:18px; "
696 class="mr-3"
697 @click="paymentItem(props.item)"
698 src="/static/schoolIcons/Account.png"
699 />
700 <span>Payment</span>
701 </v-tooltip>
702 </span>
703 <v-tooltip top>
704 <img
705 slot="activator"
706 style="cursor:pointer; width:19px; height:19px;"
707 class="mr-3"
708 @click="profile(props.item)"
709 src="/static/icon/eye1.png"
710 />
711 <span>View Payment</span>
712 </v-tooltip>
169 </td> 713 </td>
170 </tr> 714 </tr>
171 </template> 715 </template>
172 <v-alert 716 <v-alert
173 slot="no-results" 717 slot="no-results"
174 :value="true" 718 :value="true"
175 color="error" 719 color="error"
176 icon="warning" 720 icon="warning"
177 >Your search for "{{ search }}" found no results.</v-alert> 721 >Your search for "{{ search }}" found no results.</v-alert>
178 </v-data-table> 722 </v-data-table>
179 <!-- ****** ADD INVOICE ****** --> 723 <!-- ****** ADD INVOICE ****** -->
180 <v-dialog v-model="addInvoiceDialog" max-width> 724 <v-snackbar
725 :timeout="timeout"
726 :top="y === 'top'"
727 :right="x === 'right'"
728 :vertical="mode === 'vertical'"
729 v-model="snackbar"
730 :color="color"
731 >{{ text }}</v-snackbar>
732 <v-dialog v-model="addInvoiceDialog">
181 <v-card flat class="text-xs-center white--text"> 733 <v-card flat class="text-xs-center white--text">
182 <v-layout> 734 <v-layout>
183 <v-flex xs12 class="card-styles pa-2"> 735 <v-flex xs12 class="card-styles pa-2">
184 <label class="title text-xs-center ">Add Invoice</label> 736 <label class="title text-xs-center">Add Invoice</label>
185 <v-icon size="24" class="right white--text" @click="addInvoiceDialog = false">cancel</v-icon> 737 <v-icon size="24" class="right white--text" @click="addInvoiceDialog = false">cancel</v-icon>
186 </v-flex> 738 </v-flex>
187 </v-layout> 739 </v-layout>
188 <v-flex xs12 sm12> 740 <v-flex xs12 sm12>
189 <v-container fluid grid-list-md> 741 <v-container fluid grid-list-md>
190 <v-layout wrap> 742 <v-layout wrap>
191 <v-flex xs12 sm12 md5> 743 <v-flex xs12 sm12 md5>
192 <v-card flat> 744 <v-card flat>
193 <v-toolbar dark class="card-styles" flat> 745 <v-toolbar dark class="card-styles" flat>
194 <v-spacer></v-spacer> 746 <v-spacer></v-spacer>
195 <h3>Invoice</h3> 747 <h3>Invoice</h3>
196 <v-spacer></v-spacer> 748 <v-spacer></v-spacer>
197 </v-toolbar> 749 </v-toolbar>
198 <v-form ref="form" v-model="valid" lazy-validation class="py-4"> 750 <v-form ref="form" v-model="valid" lazy-validation class="py-4">
199 <v-layout> 751 <v-layout>
200 <v-flex xs4 class="pt-4 subheading"> 752 <v-flex xs4 class="pt-4 subheading">
201 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 753 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
202 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 754 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
203 </v-flex> 755 </v-flex>
204 <v-flex xs6 class="ml-3"> 756 <v-flex xs6 class="ml-3">
205 <v-select 757 <v-select
206 :items="addclass" 758 :items="addclass"
207 label="Select Class" 759 label="Select Class"
208 v-model="invoiceData.classNum" 760 v-model="invoiceData.classNum"
209 item-text="classNum" 761 item-text="classNum"
210 item-value="_id" 762 item-value="_id"
211 @change="getAllStudents()" 763 @change="getAllStudents()"
212 :rules="classRules" 764 :rules="classRules"
213 required 765 required
214 ></v-select> 766 ></v-select>
215 </v-flex> 767 </v-flex>
216 </v-layout> 768 </v-layout>
217 <v-layout> 769 <v-layout>
218 <v-flex xs4 class="pt-4 subheading"> 770 <v-flex xs4 class="pt-4 subheading">
219 <label class="right hidden-xs-only hidden-sm-only">Select Student:</label> 771 <label class="right hidden-xs-only hidden-sm-only">Select Student:</label>
220 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Student:</label> 772 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Student:</label>
221 </v-flex> 773 </v-flex>
222 <v-flex xs6 class="ml-3"> 774 <v-flex xs6 class="ml-3">
223 <v-select 775 <v-select
224 :items="studentList" 776 :items="studentList"
225 label="Select Student" 777 label="Select Student"
226 v-model="invoiceData.studentId" 778 v-model="invoiceData.studentId"
227 item-text="name" 779 item-text="name"
228 item-value="_id" 780 item-value="_id"
229 :rules="inchargeRules" 781 :rules="inchargeRules"
230 @change="selectAllStudent()" 782 @change="selectAllStudent()"
231 required 783 required
232 ></v-select> 784 ></v-select>
233 </v-flex> 785 </v-flex>
234 </v-layout> 786 </v-layout>
235 <v-layout> 787 <v-layout>
236 <v-flex xs4 class="pt-4 subheading"> 788 <v-flex xs4 class="pt-4 subheading">
237 <label class="right">Date:</label> 789 <label class="right">Date:</label>
238 </v-flex> 790 </v-flex>
239 <v-flex xs6 class="ml-3"> 791 <v-flex xs6 class="ml-3">
240 <v-menu 792 <v-menu
241 ref="menu1" 793 ref="menu1"
242 :close-on-content-click="false" 794 :close-on-content-click="false"
243 v-model="menu1" 795 v-model="menu1"
244 :nudge-right="40" 796 :nudge-right="40"
245 lazy 797 lazy
246 :return-value.sync="invoiceData.date" 798 :return-value.sync="invoiceData.date"
247 transition="scale-transition" 799 transition="scale-transition"
248 offset-y 800 offset-y
249 full-width 801 full-width
250 min-width="290px" 802 min-width="290px"
251 > 803 >
252 <v-text-field 804 <v-text-field
253 slot="activator" 805 slot="activator"
254 :rules="dateRules" 806 :rules="dateRules"
255 v-model="invoiceData.date" 807 v-model="invoiceData.date"
256 placeholder="Select date" 808 placeholder="Select date"
257 ></v-text-field> 809 ></v-text-field>
258 <v-date-picker 810 <v-date-picker
259 v-model="invoiceData.date" 811 v-model="invoiceData.date"
260 @input="$refs.menu1.save(invoiceData.date)" 812 @input="$refs.menu1.save(invoiceData.date)"
261 ></v-date-picker> 813 ></v-date-picker>
262 </v-menu> 814 </v-menu>
263 </v-flex> 815 </v-flex>
264 </v-layout> 816 </v-layout>
265 <v-layout> 817 <v-layout>
266 <v-flex xs4 class="pt-4 subheading"> 818 <v-flex xs4 class="pt-4 subheading">
267 <label class="right hidden-xs-only hidden-sm-only">Payment Status:</label> 819 <label class="right hidden-xs-only hidden-sm-only">Payment Status:</label>
268 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Payment:</label> 820 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Payment:</label>
269 </v-flex> 821 </v-flex>
270 <v-flex xs6 class="ml-3"> 822 <v-flex xs6 class="ml-3">
271 <v-select 823 <v-select
272 :items="paymentStatus" 824 :items="paymentStatus"
273 v-model="invoiceData.paymentStatus" 825 v-model="invoiceData.paymentStatus"
274 item-text="name" 826 item-text="name"
275 item-value="value" 827 item-value="value"
276 label="Select Payment Status" 828 label="Select Payment Status"
277 @change="getPayMethodList" 829 @change="getPayMethodList"
278 :rules="paymentStatusRules" 830 :rules="paymentStatusRules"
279 required 831 required
280 ></v-select> 832 ></v-select>
281 </v-flex> 833 </v-flex>
282 </v-layout> 834 </v-layout>
283 <v-layout v-show="showPayMethods"> 835 <v-layout v-show="showPayMethods">
284 <v-flex xs4 class="pt-4 subheading"> 836 <v-flex xs4 class="pt-4 subheading">
285 <label class="right">Payment Method:</label> 837 <label class="right">Payment Method:</label>
286 </v-flex> 838 </v-flex>
287 <v-flex xs6 class="ml-3"> 839 <v-flex xs6 class="ml-3">
288 <v-select 840 <v-select
289 :items="paymentMethods" 841 :items="paymentMethods"
290 v-model="invoiceData.paymentMethod" 842 v-model="invoiceData.paymentMethod"
291 label="Select Payment Method" 843 label="Select Payment Method"
292 required 844 required
293 ></v-select> 845 ></v-select>
294 </v-flex> 846 </v-flex>
295 </v-layout> 847 </v-layout>
296 <v-layout> 848 <v-layout>
297 <v-flex xs12 sm11> 849 <v-flex xs12 sm11>
298 <v-card-actions> 850 <v-card-actions>
299 <v-spacer></v-spacer> 851 <v-spacer></v-spacer>
300 <v-btn @click="clear" round dark class="clear-button">clear</v-btn> 852 <v-btn @click="clear" round dark class="clear-button">clear</v-btn>
301 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 853 <v-btn
854 @click="submit"
855 round
856 dark
857 :loading="loading"
858 class="add-button"
859 >Add</v-btn>
302 </v-card-actions> 860 </v-card-actions>
303 </v-flex> 861 </v-flex>
304 </v-layout> 862 </v-layout>
305 </v-form> 863 </v-form>
306 </v-card> 864 </v-card>
307 </v-flex> 865 </v-flex>
308 <v-flex xs12 sm12 md7> 866 <v-flex xs12 sm12 md7>
309 <v-card> 867 <v-card>
310 <v-toolbar dark class="card-styles " flat> 868 <v-toolbar dark class="card-styles" flat>
311 <v-spacer></v-spacer> 869 <v-spacer></v-spacer>
312 <h3>Fee Type List</h3> 870 <h3>Fee Type List</h3>
313 <v-spacer></v-spacer> 871 <v-spacer></v-spacer>
314 </v-toolbar> 872 </v-toolbar>
315 <v-layout> 873 <v-layout>
316 <v-flex xs4 sm2 class="mt-4 hidden-xs-only hidden-sm-only"> 874 <v-flex xs4 sm2 class="mt-4 hidden-xs-only hidden-sm-only">
317 <label class="right title ">Fee Type:</label> 875 <label class="right title">Fee Type:</label>
318 </v-flex> 876 </v-flex>
319 <v-flex xs8 sm4> 877 <v-flex xs8 sm4>
320 <v-select 878 <v-select
321 :items="feeTypes" 879 :items="feeTypes"
322 v-model="feeType.feeTypeName" 880 v-model="feeType.feeTypeName"
323 item-text="feeType" 881 item-text="feeType"
324 item-value="feeType" 882 item-value="feeType"
325 label="Select Fee Type" 883 label="Select Fee Type"
884 :rules="feeTypeRules"
885 required
326 ></v-select> 886 ></v-select>
327 </v-flex> 887 </v-flex>
328 <v-flex xs4 sm6> 888 <v-flex xs4 sm6>
329 <v-btn color="open-dialog-button" round dark class="right mt-3" @click="selectFeeType">ADD</v-btn> 889 <v-btn
890 color="open-dialog-button"
891 round
892 dark
893 class="right mt-3"
894 @click="selectFeeType"
895 >ADD</v-btn>
330 </v-flex> 896 </v-flex>
331 </v-layout> 897 </v-layout>
332 <table class="feeTypeTable tableRsponsive"> 898 <table class="feeTypeTable tableRsponsive">
333 <tr class="info white--text"> 899 <tr class="info white--text">
334 <th>#</th> 900 <th>#</th>
335 <th>Fee Type</th> 901 <th>Fee Type</th>
336 <th>Amount</th> 902 <th>Amount</th>
337 <th>Discount(%)</th> 903 <th>Discount(%)</th>
338 <th>Subtotal</th> 904 <th>Subtotal</th>
339 <th>Paid Amount</th> 905 <th>Paid Amount</th>
340 <th>Action</th> 906 <th>Action</th>
341 </tr> 907 </tr>
342 <tr 908 <tr
343 v-show="showFeeType" 909 v-show="showFeeType"
344 v-for="(feeType, index) in feeTypeData" 910 v-for="(feeType, index) in feeTypeData"
345 :key="index" 911 :key="index"
346 v-on:keyup="getAmmountDetails(feeType)" 912 v-on:keyup="getAmmountDetails(feeType)"
347 > 913 >
348 <td style="width:40px" class="tdFeeType">{{ index + 1 }}</td> 914 <td style="width:40px" class="tdFeeType">{{ index + 1 }}</td>
349 <td style="width:120px" class="tdFeeType">{{ feeType.feeTypeName }}</td> 915 <td
916 style="width:120px"
917 class="tdFeeType"
918 :rules="feeTypeNameRules"
919 >{{ feeType.feeTypeName }}</td>
350 <td class="tdFeeType"> 920 <td class="tdFeeType">
351 <v-text-field 921 <v-text-field
352 placeholder="fill your Amount" 922 placeholder="fill your Amount"
353 v-model="feeType.amount" 923 v-model="feeType.amount"
354 type="number" 924 type="number"
925 :rules="amountRules"
926 required
355 ></v-text-field> 927 ></v-text-field>
356 </td> 928 </td>
357 <td class="tdFeeType"> 929 <td class="tdFeeType">
358 <v-text-field 930 <v-text-field
359 placeholder="fill your Discount" 931 placeholder="fill your Discount"
360 v-model="feeType.discount" 932 v-model="feeType.discount"
361 type="number" 933 type="number"
934 :rules="discountRules"
935 required
362 ></v-text-field> 936 ></v-text-field>
363 </td> 937 </td>
364 <td class="tdFeeType">{{ feeType.subTotal }}</td> 938 <td class="tdFeeType" :rules="subtotalRules">{{ feeType.subTotal }}</td>
365 <!-- <td class="tdFeeType" v-if="invoiceData.paymentStatus === 'NOT_PAID'"> 939 <td class="tdFeeType" v-if="invoiceData.paymentStatus === 'NOT_PAID'">
366 <v-text-field 940 <v-text-field
367 placeholder="fill your Paid Amount" 941 placeholder="fill your Paid Amount"
368 v-model="feeType.paidAmount" 942 v-model="feeType.paidAmount"
369 type="number" 943 type="number"
370 :disabled="disabled" 944 :disabled="disabled"
945 :rules="paymentRules"
946 required
371 ></v-text-field> 947 ></v-text-field>
372 </td> --> 948 </td>
373 <td class="tdFeeType" v-if="invoiceData.paymentStatus == ''"> 949 <td class="tdFeeType" v-if="invoiceData.paymentStatus == ''">
374 <v-text-field 950 <v-text-field
375 placeholder="fill your Paid Amount" 951 placeholder="fill your Paid Amount"
376 v-model="feeType.paidAmount" 952 v-model="feeType.paidAmount"
377 type="number" 953 type="number"
378 :disabled="disabled" 954 :disabled="disabled"
955 :rules="paymentRules"
956 required
379 ></v-text-field> 957 ></v-text-field>
380 </td> 958 </td>
381 <td 959 <td
382 class="tdFeeType" 960 class="tdFeeType"
383 v-if="invoiceData.paymentStatus != 'NOT_PAID' && invoiceData.paymentStatus != ''" 961 v-if="invoiceData.paymentStatus != 'NOT_PAID' && invoiceData.paymentStatus != ''"
384 > 962 >
385 <v-text-field 963 <v-text-field
386 placeholder="fill your Paid Amount" 964 placeholder="fill your Paid Amount"
387 v-model="feeType.paidAmount" 965 v-model="feeType.paidAmount"
388 type="number" 966 type="number"
967 :rules="paymentRules"
968 required
389 ></v-text-field> 969 ></v-text-field>
390 </td> 970 </td>
391 <td class="tdFeeType"> 971 <td class="tdFeeType">
392 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon> 972 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
393 </td> 973 </td>
394 </tr> 974 </tr>
395 <tfoot> 975 <tfoot>
396 <tr> 976 <tr>
397 <td colspan="2" class="tdFeeType">Total:</td> 977 <td colspan="2" class="tdFeeType">Total:</td>
398 <td class="tdFeeType">{{ feeType.amount }}</td> 978 <td class="tdFeeType" :rules="amountRules">{{ feeType.amount }}</td>
399 <td class="tdFeeType">{{ feeType.discount }}</td> 979 <td class="tdFeeType" :rules="discountRules">{{ feeType.discount }}</td>
400 <td class="tdFeeType">{{ feeType.subTotal }}</td> 980 <td class="tdFeeType" :rules="subtotalRules">{{ feeType.subTotal }}</td>
401 <td class="tdFeeType">{{ feeType.paidAmount }}</td> 981 <td class="tdFeeType" :rules="paidAmountRules">{{ feeType.paidAmount }}</td>
982 <td class="tdFeeType">
983 <v-icon color="error" @click="deleteSelectFee(index)">delete</v-icon>
984 </td>
402 </tr> 985 </tr>
403 </tfoot> 986 </tfoot>
404 </table> 987 </table>
405 </v-card> 988 </v-card>
406 </v-flex> 989 </v-flex>
407 </v-layout> 990 </v-layout>
408 </v-container> 991 </v-container>
409 </v-flex> 992 </v-flex>
410 </v-card> 993 </v-card>
411 </v-dialog> 994 </v-dialog>
412 <div class="loader" v-if="showLoader"> 995 <div class="loader" v-if="showLoader">
413 <v-progress-circular indeterminate color="white"></v-progress-circular> 996 <v-progress-circular indeterminate color="white"></v-progress-circular>
414 </div> 997 </div>
415 </v-container> 998 </v-container>
416 </template> 999 </template>
417 1000
418 <script> 1001 <script>
419 import http from "@/Services/http.js"; 1002 import http from "@/Services/http.js";
420 import moment from "moment"; 1003 import moment from "moment";
421 1004
422 export default { 1005 export default {
423 data: () => ({ 1006 data: () => ({
424 snackbar: false, 1007 snackbar: false,
425 showPayMethods: false, 1008 showPayMethods: false,
426 y: "top", 1009 y: "top",
427 x: "right", 1010 x: "right",
428 mode: "", 1011 mode: "",
429 timeout: 5000, 1012 timeout: 5000,
430 text: "", 1013 text: "",
431 color: "", 1014 color: "",
432 show: true, 1015 show: true,
433 showSearch: false, 1016 showSearch: false,
434 showLoader: false, 1017 showLoader: false,
435 loading: false, 1018 loading: false,
436 date: null, 1019 date: null,
437 search: "", 1020 search: "",
438 dialog: false, 1021 dialog: false,
439 dialog1: false, 1022 dialog1: false,
440 valid: true, 1023 valid: true,
441 validEdit: true, 1024 validEdit: true,
442 isActive: true, 1025 isActive: true,
443 newActive: false, 1026 newActive: false,
444 showFeeType: false, 1027 showFeeType: false,
445 addInvoiceDialog: false, 1028 addInvoiceDialog: false,
1029 editInvoiceDialog: false,
1030 paymentInvoiceDialog: false,
446 disabled: true, 1031 disabled: true,
447 details: [], 1032 details: [],
448 feeTypes: [], 1033 feeTypes: [],
1034 invoiceData: [],
1035 invoiceList: [
1036 {
1037 studentId: {
1038 name: "",
1039 rollNo: "",
1040 },
1041 classId: {
1042 classNum: ""
1043 }
1044 }
1045 ],
449 menu1: false, 1046 menu1: false,
450 paymentMethods: ["Cash", "Cheque"], 1047 paymentMethods: ["Cash", "Cheque"],
451 feeType: { 1048 feeType: {
452 amount: "0.00", 1049 amount: "0.00",
453 discount: "0.00", 1050 discount: "0.00",
454 paidAmount: 0.0, 1051 paidAmount: 0.0,
455 subTotal: "0.00", 1052 subTotal: "0.00",
456 feeTypeName: "" 1053 feeTypeName: ""
457 }, 1054 },
1055 invoiceData: {
1056 amount: "0.00",
1057 discount: "0.00",
1058 paidAmount: 0.0,
1059 subTotal: "0.00",
1060 feeTypeName: ""
1061 },
458 feeTypeData: [], 1062 feeTypeData: [],
459 pagination: { 1063 pagination: {
460 rowsPerPage: 10 1064 rowsPerPage: 10
461 }, 1065 },
462 classRules: [v => !!v || " Class Name is required"], 1066 classRules: [v => !!v || " Class Name is required"],
463 inchargeRules: [v => !!v || "Student Name is required"], 1067 inchargeRules: [v => !!v || "Student Name is required"],
464 dateRules: [v => !!v || " Date is required"], 1068 dateRules: [v => !!v || " Date is required"],
465 paymentStatusRules: [v => !!v || "Payment Status is required"], 1069 paymentStatusRules: [v => !!v || "Payment Status is required"],
466 paymentMethodsRules: [v => !!v || "payment Method is required"], 1070 paymentMethodsRules: [v => !!v || "payment Method is required"],
1071 feeTypeRules: [v => !!v || "Fee Type is required"],
1072 feeTypeNameRules: [v => !!v || "Fee Type Name is required"],
1073 amountRules: [v => !!v || "Amount is required"],
1074 discountRules: [v => !!v || "Discount is required"],
1075 subtotalRules: [v => !!v || "Subtotal is required"],
1076 paymentRules: [v => !!v || "Payment is required"],
1077 paidAmountRules: [v => !!v || "Paid Amount is required"],
467 headers: [ 1078 headers: [
468 { 1079 {
469 text: "No", 1080 text: "No",
470 align: "", 1081 align: "",
471 sortable: false, 1082 sortable: false,
472 value: "No" 1083 value: "No"
473 }, 1084 },
474 // { 1085 {
475 // text: "Student", 1086 text: "Student",
476 // value: "student", 1087 value: "name",
477 // sortable: false, 1088 sortable: false,
478 // align: "center" 1089 align: "center"
479 // }, 1090 },
480 { text: "Class", value: "class", sortable: false, align: "center" }, 1091 { text: "Class", value: "class", sortable: false, align: "center" },
481 { text: "Total", value: "subtotal", sortable: false, align: "center" }, 1092 { text: "Total", value: "subtotal", sortable: false, align: "center" },
482 { text: "Discount", value: "discount", sortable: false, align: "center" }, 1093 { text: "Discount", value: "discount", sortable: false, align: "center" },
483 { 1094 {
484 text: "Paid Amount", 1095 text: "Paid Amount",
485 value: "paidAmount", 1096 value: "paidAmount",
486 sortable: false, 1097 sortable: false,
487 align: "center" 1098 align: "center"
488 }, 1099 },
489 { 1100 {
490 text: "Balance", 1101 text: "Balance",
491 value: "Balance", 1102 value: "Balance",
492 sortable: false, 1103 sortable: false,
493 align: "center" 1104 align: "center"
494 }, 1105 },
495 { 1106 {
496 text: "Status", 1107 text: "Status",
497 value: "paymentStatus", 1108 value: "paymentStatus",
498 sortable: false, 1109 sortable: false,
499 align: "center" 1110 align: "center"
500 }, 1111 },
501 { 1112 {
502 text: "Date", 1113 text: "Date",
503 value: "date", 1114 value: "date",
504 sortable: false, 1115 sortable: false,
505 align: "center" 1116 align: "center"
506 }, 1117 },
507 { text: "Action", value: "", sortable: false, align: "center" } 1118 { text: "Action", value: "", sortable: false, align: "center" }
508 ], 1119 ],
509 invoiceList: [], 1120 headersProfile: [
1121 {
1122 text: "No",
1123 align: "",
1124 sortable: false,
1125 value: "No"
1126 },
1127 {
1128 text: "Date",
1129 value: "date",
1130 sortable: false,
1131 align: "center"
1132 },
1133 {
1134 text: "Paid By",
1135 value: "paymentMethod",
1136 sortable: false,
1137 align: "center"
1138 },
1139 {
1140 text: "Payment Amount",
1141 value: "paidAmount",
1142 sortable: false,
1143 align: "center"
1144 },
1145 { text: "Weaver", value: "discount", sortable: false, align: "center" },
1146 // {
1147 // text: "Fine",
1148 // value: "fine",
1149 // sortable: false,
1150 // align: "center"
1151 // },
1152 { text: "Action", value: "", sortable: false, align: "center" }
1153 ],
1154 studentId: {
1155 name: ""
1156 },
510 token: "", 1157 token: "",
511 editedItem: {}, 1158 editedItem: {},
512 invoiceData: { 1159 invoiceData: {
513 paymentStatus: "", 1160 paymentStatus: "",
514 students: [] 1161 students: []
515 }, 1162 },
516 addclass: [], 1163 addclass: [],
517 studentList: [], 1164 studentList: [],
518 paymentStatus: [ 1165 paymentStatus: [
519 { 1166 {
520 name: "Not Paid", 1167 name: "Not Paid",
521 value: "NOT_PAID" 1168 value: "NOT_PAID"
522 }, 1169 },
523 { 1170 {
524 name: "Partially Paid", 1171 name: "Partially Paid",
525 value: "PARTIALLY_PAID" 1172 value: "PARTIALLY_PAID"
526 }, 1173 },
527 { 1174 {
528 name: "Fully Paid", 1175 name: "Fully Paid",
529 value: "FULLY_PAID" 1176 value: "FULLY_PAID"
530 } 1177 }
531 ] 1178 ]
532 }), 1179 }),
533 methods: { 1180 methods: {
534 save(date) { 1181 save(date) {
535 this.$refs.menu1.save(date); 1182 this.$refs.menu1.save(date);
536 }, 1183 },
537 dates: function(date) { 1184 dates: function(date) {
538 return moment(date).format("MMMM DD, YYYY"); 1185 return moment(date).format("MMMM DD, YYYY");
539 }, 1186 },
540 // profile(item) { 1187 profile(item) {
541 // this.editedIndex = this.InvoiceList.indexOf(item); 1188 this.editedIndex = this.invoiceList.indexOf(item);
542 // this.editedItem = Object.assign({}, item); 1189 this.editedItem = Object.assign({}, item);
543 // this.dialog1 = true; 1190 this.dialog1 = true;
544 // }, 1191 },
1192 editItem(item) {
1193 this.editedIndex = this.invoiceList.indexOf(item);
1194 this.invoiceData = Object.assign({}, item);
1195 this.editInvoiceDialog = true;
1196 },
1197 paymentItem(item) {
1198 this.editedIndex = this.invoiceList.indexOf(item);
1199 this.invoiceList = Object.assign({}, item);
1200 this.paymentInvoiceDialog = true;
1201 },
545 deleteItem(item) { 1202 deleteItem(item) {
546 let deleteInvoice = { 1203 let deleteInvoice = {
547 invoiceId: item._id 1204 invoiceId: item._id
548 }; 1205 };
549 http() 1206 http()
550 .delete( 1207 .delete(
551 "/deleteInvoice", 1208 "/deleteInvoice",
552 confirm("Are you sure you want to delete this?") && { 1209 confirm("Are you sure you want to delete this?") && {
553 params: deleteInvoice 1210 params: deleteInvoice
554 } 1211 }
555 ) 1212 )
556 .then(response => { 1213 .then(response => {
557 this.snackbar = true; 1214 this.snackbar = true;
558 this.text = "Successfully delete Existing Invoice"; 1215 this.text = "Successfully delete Existing Invoice";
559 this.color = "green"; 1216 this.color = "green";
1217 this.dialog1 = false;
560 this.getInvoiceList(); 1218 this.getInvoiceList();
561 }) 1219 })
562 .catch(error => { 1220 .catch(error => {
563 // console.log(error); 1221 // console.log(error);
564 }); 1222 });
565 }, 1223 },
566 close() { 1224 close() {
567 this.dialog = false; 1225 this.dialog = false;
568 }, 1226 },
569 // totalAmount() { 1227 // totalAmount() {
570 // // console.log("this.feeType.paidAmount ", this.feeType.paidAmount); 1228 // // console.log("this.feeType.paidAmount ", this.feeType.paidAmount);
571 // // console.log( 1229 // // console.log(
572 // // "this.feeType.subTotalAAAAAAAAAAAAAAA ", 1230 // // "this.feeType.subTotalAAAAAAAAAAAAAAA ",
573 // // this.feeType.subTotal 1231 // // this.feeType.subTotal
574 // // ); 1232 // // );
575 1233
576 // if (this.feeType.paidAmount < this.feeType.subTotal) { 1234 // if (this.feeType.paidAmount < this.feeType.subTotal) {
577 // console.log("this.feeType.subTotalBBBBBBBBBBB ", this.feeType.subTotal); 1235 // console.log("this.feeType.subTotalBBBBBBBBBBB ", this.feeType.subTotal);
578 1236
579 // this.feeType.paidAmount = this.feeType.subTotal; 1237 // this.feeType.paidAmount = this.feeType.subTotal;
580 // console.log( 1238 // console.log(
581 // "this.feeType.paidAmount BBBBBBBBBBB", 1239 // "this.feeType.paidAmount BBBBBBBBBBB",
582 // this.feeType.paidAmount 1240 // this.feeType.paidAmount
583 // ); 1241 // );
584 // } 1242 // }
585 // }, 1243 // },
586 submit() { 1244 submit() {
587 let feeTypeId = ""; 1245 let feeTypeId = "";
588 for (let i = 0; i < this.feeTypes.length; i++) { 1246 for (let i = 0; i < this.feeTypes.length; i++) {
589 if (this.feeTypes[i].feeType === this.feeType.feeTypeName) { 1247 if (this.feeTypes[i].feeType === this.feeType.feeTypeName) {
590 feeTypeId = this.feeTypes[i]._id; 1248 feeTypeId = this.feeTypes[i]._id;
591 } 1249 }
592 } 1250 }
593 // if (this.$refs.form.validate()) { 1251 // if (this.$refs.form.validate()) {
594 let invoiceData = { 1252 let invoiceData = {
595 classId: this.invoiceData.classNum, 1253 classId: this.invoiceData.classNum,
596 students: this.invoiceData.students, 1254 students: this.invoiceData.students,
597 date: this.invoiceData.date, 1255 date: this.invoiceData.date,
598 paymentStatus: this.invoiceData.paymentStatus, 1256 paymentStatus: this.invoiceData.paymentStatus,
599 paymentMethod: this.invoiceData.paymentMethod, 1257 paymentMethod: this.invoiceData.paymentMethod,
600 feeType: this.feeTypeData, 1258 feeType: this.feeTypeData,
601 totalAmount: this.feeType.amount, 1259 totalAmount: this.feeType.amount,
602 totalDiscount: this.feeType.discount, 1260 totalDiscount: this.feeType.discount,
603 totalSubTotal: this.feeType.subTotal, 1261 totalSubTotal: this.feeType.subTotal,
604 totalPaidAmount: this.feeType.paidAmount 1262 totalPaidAmount: this.feeType.paidAmount
605 }; 1263 };
606 console.log("invoiceData",invoiceData) 1264 console.log("invoiceData", invoiceData);
607 // if (invoiceData.paymentStatus == "NOT_PAID") { 1265 if (invoiceData.paymentStatus == "NOT_PAID") {
608 // delete invoiceData.totalPaidAmount; 1266 delete invoiceData.totalPaidAmount;
609 // } 1267 }
610 http() 1268 http()
611 .post("/createInvoice", invoiceData) 1269 .post("/createInvoice", invoiceData)
612 .then(response => { 1270 .then(response => {
613 this.getInvoiceList(); 1271 this.getInvoiceList();
614 this.snackbar = true; 1272 this.snackbar = true;
615 this.text = "New Invoice added successfully"; 1273 this.text = "New Invoice added successfully";
616 this.color = "green"; 1274 this.color = "green";
617 this.clear(); 1275 this.clear();
618 this.feeTypeData = []; 1276 this.feeTypeData = [];
619 if (this.feeTypeData.length == 0) { 1277 if (this.feeTypeData.length == 0) {
620 this.feeType = { 1278 this.feeType = {
621 amount: "0.00", 1279 amount: "0.00",
622 discount: "0.00", 1280 discount: "0.00",
623 paidAmount: "0.00", 1281 paidAmount: "0.00",
624 subTotal: "0.00", 1282 subTotal: "0.00",
625 feeTypeList: "" 1283 feeTypeList: ""
626 }; 1284 };
627 } 1285 }
628 this.loading = false; 1286 this.loading = false;
629 this.addInvoiceDialog = false; 1287 this.addInvoiceDialog = false;
630 }) 1288 })
631 .catch(error => { 1289 .catch(error => {
632 this.snackbar = true; 1290 this.snackbar = true;
633 this.text = error.response.data.errors[0].messages[0]; 1291 this.text = error.response.data.errors[0].messages[0];
634 this.color = "error"; 1292 this.color = "error";
635 this.loading = false; 1293 this.loading = false;
636 }); 1294 });
637 // } 1295 // }
638 }, 1296 },
1297 update() {
1298 var updatePayment = {
1299 invoiceId: this.invoiceData._id,
1300 totalPaidAmount: this.invoiceData.paidAmount
1301 };
1302 http()
1303 .put("/updateInvoice", updatePayment, {
1304 headers: {
1305 Authorization: "Bearer " + this.token
1306 }
1307 })
1308 .then(response => {
1309 this.getInvoiceList();
1310 this.snackbar = true;
1311 this.text = response.data.message;
1312 this.color = "green";
1313 this.editInvoiceDialog = false;
1314 })
1315 .catch(error => {
1316 console.log("error", error);
1317 this.snackbar = true;
1318 this.color = "red";
1319 });
1320 },
639 clear() { 1321 clear() {
640 this.$refs.form.reset(); 1322 this.$refs.form.reset();
641 }, 1323 },
642 getInvoiceList() { 1324 getInvoiceList() {
643 this.showLoader = true; 1325 this.showLoader = true;
644 http() 1326 http()
645 .get("/getInvoicesList", { 1327 .get("/getInvoicesList", {
646 params: { schoolId: this.$store.state.schoolId }, 1328 params: { schoolId: this.$store.state.schoolId },
647 headers: { Authorization: "Bearer " + this.token } 1329 headers: { Authorization: "Bearer " + this.token }
648 }) 1330 })
649 .then(response => { 1331 .then(response => {
650 this.invoiceList = response.data.data; 1332 this.invoiceList = response.data.data;
651 this.showLoader = false; 1333 this.showLoader = false;
652 }) 1334 })
653 .catch(error => { 1335 .catch(error => {
654 // console.log("err====>", err); 1336 // console.log("err====>", err);
655 this.showLoader = false; 1337 this.showLoader = false;
656 if (error.response.status === 401) { 1338 if (error.response.status === 401) {
657 this.$router.replace({ path: "/" }); 1339 this.$router.replace({ path: "/" });
658 this.$store.dispatch("setToken", null); 1340 this.$store.dispatch("setToken", null);
659 this.$store.dispatch("Id", null); 1341 this.$store.dispatch("Id", null);
660 } 1342 }
661 }); 1343 });
662 }, 1344 },
663 selectFeeType() { 1345 selectFeeType() {
664 this.showFeeType = true; 1346 this.showFeeType = true;
665 this.feeTypeData.push({ feeTypeName: this.feeType.feeTypeName }); 1347 this.feeTypeData.push({ feeTypeName: this.feeType.feeTypeName });
666 }, 1348 },
667 deleteSelectFee: function(index) { 1349 deleteSelectFee: function(index) {
668 this.feeTypeData.splice(index, 1); 1350 this.feeTypeData.splice(index, 1);
669 for (let i = 0; i < this.feeTypeData.length; i++) { 1351 for (let i = 0; i < this.feeTypeData.length; i++) {
670 this.feeType = this.feeTypeData[i]; 1352 this.feeType = this.feeTypeData[i];
671 } 1353 }
672 if (this.feeTypeData.length == 0) { 1354 if (this.feeTypeData.length == 0) {
673 this.feeType = { 1355 this.feeType = {
674 amount: "0.00", 1356 amount: "0.00",
675 discount: "0.00", 1357 discount: "0.00",
676 paidAmount: "0.00", 1358 paidAmount: "0.00",
677 subTotal: "0.00", 1359 subTotal: "0.00",
678 feeTypeName: "" 1360 feeTypeName: ""
679 }; 1361 };
680 } 1362 }
681 }, 1363 },
682 getAllClasses() { 1364 getAllClasses() {
683 http() 1365 http()
684 .get("/getClassesList", { 1366 .get("/getClassesList", {
685 params: { schoolId: this.$store.state.schoolId }, 1367 params: { schoolId: this.$store.state.schoolId },
686 headers: { Authorization: "Bearer " + this.token } 1368 headers: { Authorization: "Bearer " + this.token }
687 }) 1369 })
688 .then(response => { 1370 .then(response => {
689 this.addclass = response.data.data; 1371 this.addclass = response.data.data;
690 }) 1372 })
691 .catch(err => { 1373 .catch(err => {
692 // console.log("err====>", err); 1374 // console.log("err====>", err);
693 // this.$router.replace({ path: "/" }); 1375 // this.$router.replace({ path: "/" });
694 }); 1376 });
695 }, 1377 },
696 getAllStudents() { 1378 getAllStudents() {
697 this.showLoader = true; 1379 this.showLoader = true;
698 http() 1380 http()
699 .get("/getStudentsList", { 1381 .get("/getStudentsList", {
700 params: { 1382 params: {
701 classId: this.invoiceData.classNum, 1383 classId: this.invoiceData.classNum,
702 schoolId: this.$store.state.schoolId 1384 schoolId: this.$store.state.schoolId
703 }, 1385 },
704 headers: { Authorization: "Bearer " + this.token } 1386 headers: { Authorization: "Bearer " + this.token }
705 }) 1387 })
706 .then(response => { 1388 .then(response => {
707 response.data.data.unshift({ 1389 response.data.data.unshift({
708 name: "Select All", 1390 name: "Select All",
709 _id: "Select All" 1391 _id: "Select All"
710 }); 1392 });
711 this.studentList = response.data.data; 1393 this.studentList = response.data.data;
712 this.showLoader = false; 1394 this.showLoader = false;
713 }) 1395 })
714 .catch(err => { 1396 .catch(err => {
715 this.showLoader = false; 1397 this.showLoader = false;
716 // console.log("err====>", err); 1398 // console.log("err====>", err);
717 // this.$router.replace({ path: "/" }); 1399 // this.$router.replace({ path: "/" });
718 }); 1400 });
719 }, 1401 },
720 getfeeType() { 1402 getfeeType() {
721 http() 1403 http()
722 .get("/getFeesList", { 1404 .get("/getFeesList", {
723 params: { 1405 params: {
724 schoolId: this.$store.state.schoolId 1406 schoolId: this.$store.state.schoolId
725 }, 1407 },
726 headers: { Authorization: "Bearer " + this.token } 1408 headers: { Authorization: "Bearer " + this.token }
727 }) 1409 })
728 .then(response => { 1410 .then(response => {
729 this.feeTypes = response.data.data; 1411 this.feeTypes = response.data.data;
730 }) 1412 })
731 .catch(err => { 1413 .catch(err => {
732 // console.log("err====>", err); 1414 // console.log("err====>", err);
733 // this.$router.replace({ path: "/" }); 1415 // this.$router.replace({ path: "/" });
734 }); 1416 });
735 }, 1417 },
1418 getPaymentDetails(feeTyp) {
1419 let feeType = {
1420 date: "",
1421 paymentMethod: "",
1422 totalAmount: "",
1423 discount: ""
1424 };
1425 },
736 getAmmountDetails(feeTyp) { 1426 getAmmountDetails(feeTyp) {
737 let feeType = { 1427 let feeType = {
738 amount: "", 1428 amount: "",
739 discount: "", 1429 discount: "",
740 subTotal: "", 1430 subTotal: "",
741 subParticularTotal: "", 1431 subParticularTotal: "",
742 paidAmount: "" 1432 paidAmount: ""
743 }; 1433 };
744 for (let i = 0; i < this.feeTypeData.length; i++) { 1434 for (let i = 0; i < this.feeTypeData.length; i++) {
745 // *********** AMOUNT *********** 1435 // *********** AMOUNT ***********
746 1436
747 feeType.amount = 1437 feeType.amount =
748 Number(feeType.amount) + Number(this.feeTypeData[i].amount); 1438 Number(feeType.amount) + Number(this.feeTypeData[i].amount);
749 // console.log("feeType.amount ", feeType.amount); 1439 // console.log("feeType.amount ", feeType.amount);
750 this.feeType.amount = feeType.amount; 1440 this.feeType.amount = feeType.amount;
751 this.feeType.subTotal = feeType.amount; 1441 this.feeType.subTotal = feeType.amount;
752 this.feeTypeData[i].subTotal = this.feeTypeData[i].amount; 1442 this.feeTypeData[i].subTotal = this.feeTypeData[i].amount;
753 1443
754 // *********** DISCOUNT *********** 1444 // *********** DISCOUNT ***********
755 1445
756 if (this.feeTypeData[i].discount) { 1446 if (this.feeTypeData[i].discount) {
757 feeType.discount = 1447 feeType.discount =
758 Number(feeType.discount) + Number(this.feeTypeData[i].discount); 1448 Number(feeType.discount) + Number(this.feeTypeData[i].discount);
759 // console.log("feeType.discount", feeType.discount); 1449 // console.log("feeType.discount", feeType.discount);
760 this.feeType.discount = feeType.discount; 1450 this.feeType.discount = feeType.discount;
761 feeType.subParticularTotal = 1451 feeType.subParticularTotal =
762 this.feeTypeData[i].amount - 1452 this.feeTypeData[i].amount -
763 (this.feeTypeData[i].amount * this.feeTypeData[i].discount) / 100; 1453 (this.feeTypeData[i].amount * this.feeTypeData[i].discount) / 100;
764 this.feeTypeData[i].subTotal = feeType.subParticularTotal.toFixed(2); 1454 this.feeTypeData[i].subTotal = feeType.subParticularTotal.toFixed(2);
765 } 1455 }
766 1456
767 // *********** SUBTOTAL *********** 1457 // *********** SUBTOTAL ***********
768 1458
769 feeType.subTotal = 1459 feeType.subTotal =
770 Number(feeType.subTotal) + Number(this.feeTypeData[i].subTotal); 1460 Number(feeType.subTotal) + Number(this.feeTypeData[i].subTotal);
771 this.feeType.subTotal = feeType.subTotal.toFixed(2); 1461 this.feeType.subTotal = feeType.subTotal.toFixed(2);
772 1462
773 // *********** PAID-AMOUNT *********** 1463 // *********** PAID-AMOUNT ***********
774 1464
775 feeType.paidAmount = 1465 feeType.paidAmount =
776 Number(feeType.paidAmount) + Number(this.feeTypeData[i].paidAmount); 1466 Number(feeType.paidAmount) + Number(this.feeTypeData[i].paidAmount);
777 this.feeType.paidAmount = feeType.paidAmount.toFixed(2); 1467 this.feeType.paidAmount = feeType.paidAmount.toFixed(2);
778 1468
779 // if paid Amount fill large of subtotal value so this condition are fixed filled subtotal value. 1469 // if paid Amount fill large of subtotal value so this condition are fixed filled subtotal value.
780 if (feeType.paidAmount > feeType.subTotal) { 1470 if (feeType.paidAmount > feeType.subTotal) {
781 this.feeTypeData[i].paidAmount = this.feeTypeData[i].subTotal; 1471 this.feeTypeData[i].paidAmount = this.feeTypeData[i].subTotal;
782 this.feeType.paidAmount = feeType.subTotal; 1472 this.feeType.paidAmount = feeType.subTotal;
783 } 1473 }
784 } 1474 }
785 }, 1475 },
786 getPayMethodList() { 1476 getPayMethodList() {
787 if (this.invoiceData.paymentStatus == "PARTIALLY_PAID") { 1477 if (this.invoiceData.paymentStatus == "PARTIALLY_PAID") {
788 this.showPayMethods = true; 1478 this.showPayMethods = true;
789 } else if (this.invoiceData.paymentStatus == "FULLY_PAID") { 1479 } else if (this.invoiceData.paymentStatus == "FULLY_PAID") {
790 this.showPayMethods = true; 1480 this.showPayMethods = true;
791 } else { 1481 } else {
792 this.showPayMethods = false; 1482 this.showPayMethods = false;
793 } 1483 }
794 }, 1484 },
795 selectAllStudent() { 1485 selectAllStudent() {
796 console.log("this.studentId", this.invoiceData.studentId); 1486 // console.log("this.studentId", this.invoiceData.studentId);
797 this.invoiceData.students = []; 1487 this.invoiceData.students = [];
798 if (this.invoiceData.studentId === "Select All") { 1488 if (this.invoiceData.studentId === "Select All") {
799 for (let i = 1; i < this.studentList.length; i++) { 1489 for (let i = 1; i < this.studentList.length; i++) {
800 this.invoiceData.students.push(this.studentList[i]._id); 1490 this.invoiceData.students.push(this.studentList[i]._id);
801 console.log("data", this.invoiceData.students); 1491 console.log("data", this.invoiceData.students);
802 // data.push(this.studentList[i]._id); 1492 // data.push(this.studentList[i]._id);
803 // console.log("data", data); 1493 // console.log("data", data);
804 } 1494 }
805 } else { 1495 } else {
806 this.invoiceData.students.push(this.invoiceData.studentId); 1496 this.invoiceData.students.push(this.invoiceData.studentId);
807 } 1497 }
808 }, 1498 },
809 displaySearch() { 1499 displaySearch() {
810 (this.show = false), (this.showSearch = true); 1500 (this.show = false), (this.showSearch = true);
811 }, 1501 },
812 closeSearch() { 1502 closeSearch() {
813 this.showSearch = false; 1503 this.showSearch = false;
814 this.show = true; 1504 this.show = true;
815 this.search = ""; 1505 this.search = "";
816 } 1506 }
817 }, 1507 },
818 mounted() { 1508 mounted() {
819 this.token = this.$store.state.token; 1509 this.token = this.$store.state.token;
820 this.getInvoiceList(); 1510 this.getInvoiceList();
821 this.getAllClasses(); 1511 this.getAllClasses();
822 this.getfeeType(); 1512 this.getfeeType();
1513 this.getAllStudents();
823 } 1514 }
824 }; 1515 };
825 </script> 1516 </script>
826 1517
827 1518
828 <style scoped> 1519 <style scoped>
829 table { 1520 table {
830 border-collapse: collapse; 1521 border-collapse: collapse;
831 border: 1px solid #e2e7eb; 1522 border: 1px solid #e2e7eb;
832 } 1523 }
833 1524
834 th, 1525 th,
835 .tdFeeType { 1526 .tdFeeType {
836 border: 1px solid #e2e7eb; 1527 border: 1px solid #e2e7eb;
837 padding: 10px; 1528 padding: 10px;
838 text-align: center; 1529 text-align: center;
839 } 1530 }
840 table.feeTypeTable { 1531 table.feeTypeTable {
841 table-layout: auto !important; 1532 table-layout: auto !important;
842 width: 100% !important; 1533 width: 100% !important;
843 } 1534 }
src/pages/Account/viewInvoice.vue
Diff comments   View file @81d876b
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <!-- ****** Edit INVOICE ****** --> 3 <!-- ****** Edit INVOICE ****** -->
4 <v-container fluid grid-list-md> 4 <v-container fluid grid-list-md>
5 <v-layout> 5 <v-layout>
6 <v-flex xs12 sm8 md10> 6 <v-flex xs12 sm8 md10>
7 <v-btn class="open-dialog-button mt-3" round dark @click="printInvoice()"> 7 <v-btn class="open-dialog-button mt-3" round dark @click="printInvoice()">
8 Print 8 Print
9 <v-icon size="18" right dark>print</v-icon> 9 <v-icon size="18" right dark>print</v-icon>
10 </v-btn> 10 </v-btn>
11 </v-flex> 11 </v-flex>
12 </v-layout> 12 </v-layout>
13 <v-flex xs12 sm12 id="printMe"> 13 <v-flex xs12 sm12 id="printMe">
14 <v-layout wrap> 14 <v-layout wrap>
15 <!-- ****** TABLE DATA MARK ****** --> 15 <!-- ****** TABLE DATA MARK ****** -->
16 <v-flex xs12 sm12 md12> 16 <v-flex xs12 sm12 md12>
17 <v-card> 17 <v-card>
18 <v-layout wrap> 18 <v-layout wrap>
19 <v-flex 12> 19 <v-flex 12>
20 <br /> 20 <br />
21 <v-layout> 21 <v-layout>
22 <v-flex xs12 sm12 md12 class="text-xs-center"> 22 <v-flex xs12 sm12 md12 class="text-xs-center">
23 <img :src="userData.schoolLogoUrl" width="140" alt="logo" /> 23 <!-- <img :src="userData.schoolLogoUrl" width="140" alt="logo" />
24 <p class="title">{{ userData.name }}</p> 24 <p class="title">{{ userData.name }}</p>
25 <p>{{ userData.address }}</p> 25 <p>{{ userData.address }}</p>-->
26 </v-flex> 26 <v-avatar>
27 <img :src="userData.schoolLogoUrl" v-if="userData.schoolLogoUrl" />
28 <img
29 src="/static/schoolIcons/INTRACK_White.png"
30 v-else-if="!userData.schoolLogoUrl"
31 />
32 </v-avatar>
33 <p class="title">{{ userData.name }}</p>
34 <p>{{ userData.address }}</p>
35 </v-flex>
27 36
28 <v-flex xs12 sm12 md12 class="text-xs-center"> 37 <v-flex xs12 sm12 md12 class="text-xs-center">
29 <v-layout> 38 <v-layout>
30 <v-flex xs4 sm2> 39 <v-flex xs4 sm2>
31 <h5 class="right my-1"> 40 <h5 class="right my-1">
32 <b>invoice:</b> 41 <b>Name:</b>
33 </h5> 42 </h5>
34 </v-flex> 43 </v-flex>
35 <v-flex sm11 xs8> 44 <v-flex sm11 xs8>
36 <h5 class="my-1">#{{ invoiceParticularData.invoiceNumber }}</h5> 45 <h5 class="my-1">{{ invoiceParticularData.studentId.name }}</h5>
37 </v-flex> 46 </v-flex>
38 </v-layout> 47 </v-layout>
39 <v-layout> 48 <v-layout>
40 <v-flex xs4 sm2> 49 <v-flex xs4 sm2>
41 <h5 class="right my-1"> 50 <h5 class="right my-1">
42 <b>Name:</b> 51 <b>Class:</b>
43 </h5> 52 </h5>
44 </v-flex> 53 </v-flex>
45 <v-flex sm11 xs8> 54 <v-flex sm11 xs8>
46 <h5 class="my-1">{{ invoiceParticularData.studentId.name }}</h5> 55 <h5 class="my-1">{{ invoiceParticularData.classId.classNum }}</h5>
47 </v-flex> 56 </v-flex>
48 </v-layout> 57 </v-layout>
49 <v-layout> 58 <!-- <v-flex xs12 sm6> -->
50 <v-flex xs4 sm2> 59 <v-layout>
51 <h5 class="right my-1"> 60 <v-flex xs4 sm2>
52 <b>Class:</b> 61 <h5 class="right my-1">
53 </h5> 62 <b>Roll No:</b>
54 </v-flex> 63 </h5>
55 <v-flex sm11 xs8> 64 </v-flex>
56 <h5 class="my-1">{{ invoiceParticularData.classId.classNum }}</h5> 65 <v-flex sm6 xs8>
57 </v-flex> 66 <h5 class="my-1">{{ invoiceParticularData.studentId.rollNo }}</h5>
58 </v-layout> 67 </v-flex>
59 <!-- <v-flex xs12 sm6> --> 68 </v-layout>
60 <v-layout> 69 <v-layout>
61 <v-flex xs4 sm2> 70 <v-flex xs4 sm2>
62 <h5 class="right my-1"> 71 <h5 class="right my-1">
63 <b>Roll No:</b> 72 <b>email:</b>
64 </h5> 73 </h5>
65 </v-flex> 74 </v-flex>
66 <v-flex sm6 xs8> 75 <v-flex sm6 xs8>
67 <h5 class="my-1">{{ invoiceParticularData.studentId.rollNo }}</h5> 76 <h5 class="my-1 linkCover">{{ invoiceParticularData.studentId.email }}</h5>
68 </v-flex> 77 </v-flex>
69 </v-layout> 78 </v-layout>
70 <v-layout> 79 </v-flex>
71 <v-flex xs4 sm2> 80 <v-flex xs12 sm12 md12 class="text-xs-center">
72 <h5 class="right my-1"> 81 <v-layout>
73 <b>email:</b> 82 <v-flex xs4 sm2>
74 </h5> 83 <h5 class="right my-1">
75 </v-flex> 84 <b>invoice:</b>
76 <v-flex sm6 xs8> 85 </h5>
77 <h5 class="my-1 linkCover">{{ invoiceParticularData.studentId.email }}</h5> 86 </v-flex>
78 </v-flex> 87 <v-flex sm11 xs8>
79 </v-layout> 88 <h5 class="my-1">#{{ invoiceParticularData.invoiceNumber }}</h5>
80 <v-layout> 89 </v-flex>
81 <v-flex xs4 sm2> 90 </v-layout>
82 <h5 class="right my-1"> 91 <v-layout>
83 <b>Status :</b> 92 <v-flex xs4 sm2>
84 </h5> 93 <h5 class="right my-1">
85 </v-flex> 94 <b>Status :</b>
86 <v-flex sm6 xs8> 95 </h5>
87 <h5 class="my-1">{{ invoiceParticularData.paymentStatus }}</h5> 96 </v-flex>
88 </v-flex> 97 <v-flex sm6 xs8>
89 </v-layout> 98 <h5 class="my-1">{{ invoiceParticularData.paymentStatus }}</h5>
90 </v-flex> 99 </v-flex>
91 </v-layout> 100 </v-layout>
92 </v-flex> 101 </v-flex>
93 </v-layout> 102 </v-layout>
103 </v-flex>
104 </v-layout>
94 <table class="feeTypeTable tableRsponsive"> 105 <table class="feeTypeTable tableRsponsive">
95 <tr class="info white--text"> 106 <tr class="info white--text">
96 <th>#</th> 107 <th>#</th>
97 <th>Fee Type</th> 108 <th>Fee Type</th>
98 <th>Amount</th> 109 <th>Amount</th>
99 <th>Discount</th> 110 <th>Discount</th>
100 <th>Subtotal</th> 111 <th>Subtotal</th>
101 </tr> 112 </tr>
102 <tr 113 <tr
103 v-for="(feeType, index) in feeTypeData" 114 v-for="(feeType, index) in feeTypeData"
104 :key="index" 115 :key="index"
105 v-on:keyup="getAmmountDetails(feeType)" 116 v-on:keyup="getAmmountDetails(feeType)"
106 > 117 >
107 <td style="width:40px">{{ index + 1 }}</td> 118 <td style="width:40px">{{ index + 1 }}</td>
108 <td style="width:120px">{{ feeType.feeTypeName }}</td> 119 <td style="width:120px">{{ feeType.feeTypeName }}</td>
109 <td style="width:120px">{{ feeType.amount }}</td> 120 <td style="width:120px">{{ feeType.amount }}</td>
110 <td style="width:120px">{{ feeType.amount-feeType.subTotal }}</td> 121 <td style="width:120px">{{ feeType.amount-feeType.subTotal }}</td>
111 <td style="width:120px">{{ feeType.subTotal }}</td> 122 <td style="width:120px">{{ feeType.subTotal }}</td>
112 </tr> 123 </tr>
113 <!-- <tfoot> 124 <tfoot>
114 <tr> 125 <tr>
115 <td colspan="4"> 126 <td colspan="4">
116 <span class="right subheding">Total Amount (RS) :</span> 127 <span class="right subheding">Total Amount (RS) :</span>
117 </td> 128 </td>
118 <td>{{ feeType.subTotal }}</td> 129 <td>{{ feeType.subTotal }}</td>
119 </tr> 130 </tr>
120 <tr> 131 <tr>
121 <td colspan="4"> 132 <td colspan="4">
122 <span class="right subheding">Paid (RS) :</span> 133 <span class="right subheding">Paid (RS) :</span>
123 </td> 134 </td>
124 <td>{{ feeType.totalPaidAmount ? feeType.totalPaidAmount : 0 }}</td> 135 <td>{{ feeType.totalPaidAmount ? feeType.totalPaidAmount : 0 }}</td>
125 </tr> 136 </tr>
126 <tr> 137 <tr>
127 <td colspan="4"> 138 <td colspan="4">
139 <span class="right subheding">Discount (RS) :</span>
140 </td>
141 <td>{{ feeType.amount - feeType.subTotal }}</td>
142 </tr>
143 <tr>
144 <td colspan="4">
128 <span class="right subheding">Balance (RS) :</span> 145 <span class="right subheding">Balance (RS) :</span>
129 </td> 146 </td>
130 <td>{{ feeType.totalPaidAmount ? feeType.subTotal - feeType.totalPaidAmount : feeType.subTotal }}</td> 147 <td>{{ feeType.totalPaidAmount ? feeType.subTotal - feeType.totalPaidAmount : feeType.subTotal }}</td>
131 </tr> 148 </tr>
132 </tfoot>--> 149 </tfoot>
133 </table> 150 </table>
134 </v-card> 151 </v-card>
135 </v-flex> 152 </v-flex>
136 </v-layout> 153 </v-layout>
137 </v-flex> 154 </v-flex>
138 </v-container> 155 </v-container>
139 <div class="loader" v-if="showLoader"> 156 <div class="loader" v-if="showLoader">
140 <v-progress-circular indeterminate color="white"></v-progress-circular> 157 <v-progress-circular indeterminate color="white"></v-progress-circular>
141 </div> 158 </div>
142 </v-app> 159 </v-app>
143 </template> 160 </template>
144 161
145 <script> 162 <script>
146 import http from "@/Services/http.js"; 163 import http from "@/Services/http.js";
147 import moment from "moment"; 164 import moment from "moment";
148 165
149 export default { 166 export default {
150 data: () => ({ 167 data: () => ({
151 showLoader: false, 168 showLoader: false,
152 feeTypes: [], 169 feeTypes: [],
153 filterData: [], 170 filterData: [],
154 invoiceData: {}, 171 invoiceData: {},
155 feeType: { 172 feeType: {
156 amount: "", 173 amount: "",
157 discount: "", 174 discount: "",
158 totalPaidAmount: "", 175 totalPaidAmount: "",
159 subTotal: "", 176 subTotal: "",
160 feeTypeName: "" 177 feeTypeName: ""
161 }, 178 },
162 feeTypeData: [], 179 feeTypeData: [],
163 token: "", 180 token: "",
164 invoiceParticularData: { 181 invoiceParticularData: {
165 studentId: { 182 studentId: {
166 name: "" 183 name: ""
167 }, 184 },
168 classId: { 185 classId: {
169 classNum: "" 186 classNum: ""
170 }, 187 }
171 }, 188 },
172 userData: { 189 userData: {
173 name: "" 190 name: ""
174 }, 191 }
175 }), 192 }),
176 193
177 methods: { 194 methods: {
178 getInvoiceList() { 195 getInvoiceList() {
179 http() 196 http()
180 .get("/getParticularInvoice", { 197 .get("/getParticularInvoice", {
181 params: { 198 params: {
182 invoiceId: this.$route.params.viewInvoiceId, 199 invoiceId: this.$route.params.viewInvoiceId,
183 schoolId: this.$store.state.schoolId 200 schoolId: this.$store.state.schoolId
184 }, 201 },
185 headers: { Authorization: "Bearer " + this.token } 202 headers: { Authorization: "Bearer " + this.token }
186 }) 203 })
187 .then(response => { 204 .then(response => {
188 this.invoiceParticularData = response.data.data; 205 this.invoiceParticularData = response.data.data;
189 this.invoiceData = this.invoiceParticularData; 206 this.invoiceData = this.invoiceParticularData;
190 this.invoiceData.date = this.invoiceParticularData.date.slice(0, 10); 207 this.invoiceData.date = this.invoiceParticularData.date.slice(0, 10);
191 this.feeTypeData = this.invoiceParticularData.feeType; 208 this.feeTypeData = this.invoiceParticularData.feeType;
192 (this.feeType.amount = response.data.data.totalAmount), 209 (this.feeType.amount = response.data.data.totalAmount),
193 (this.feeType.discount = response.data.data.totalDiscount), 210 (this.feeType.discount = response.data.data.totalDiscount),
194 (this.feeType.subTotal = response.data.data.totalSubTotal), 211 (this.feeType.subTotal = response.data.data.totalSubTotal),
195 (this.feeType.totalPaidAmount = response.data.data.totalPaidAmount); 212 (this.feeType.totalPaidAmount = response.data.data.totalPaidAmount);
196 this.showLoader = false; 213 this.showLoader = false;
197 }) 214 })
198 .catch(error => { 215 .catch(error => {
199 this.showLoader = false; 216 this.showLoader = false;
200 if (error.response.status === 401) { 217 if (error.response.status === 401) {
201 this.$router.replace({ path: "/" }); 218 this.$router.replace({ path: "/" });
202 this.$store.dispatch("setToken", null); 219 this.$store.dispatch("setToken", null);
203 this.$store.dispatch("Id", null); 220 this.$store.dispatch("Id", null);
204 this.$store.dispatch("Role", null); 221 this.$store.dispatch("Role", null);
205 } 222 }
206 }); 223 });
207 }, 224 },
208 getfeeType() { 225 getfeeType() {
209 http() 226 http()
210 .get("/getFeesList", { 227 .get("/getFeesList", {
211 params: { schoolId: this.$store.state.schoolId }, 228 params: { schoolId: this.$store.state.schoolId },
212 headers: { Authorization: "Bearer " + this.token } 229 headers: { Authorization: "Bearer " + this.token }
213 }) 230 })
214 .then(response => { 231 .then(response => {
215 this.feeTypes = response.data.data; 232 this.feeTypes = response.data.data;
216 }) 233 })
217 .catch(err => { 234 .catch(err => {
218 // console.log("err====>", err); 235 // console.log("err====>", err);
219 }); 236 });
220 }, 237 },
221 getAmmountDetails(feeTyp) { 238 getAmmountDetails(feeTyp) {
222 let feeType = { 239 let feeType = {
223 subTotal: "", 240 subTotal: "",
224 subParticularTotal: "", 241 subParticularTotal: "",
225 paidAmount: "" 242 paidAmount: ""
226 }; 243 };
227 // *********** SUBTOTAL *********** 244 // *********** SUBTOTAL ***********
228 feeType.subTotal = 245 feeType.subTotal =
229 Number(feeType.subTotal) + Number(this.feeTypeData[i].subTotal); 246 Number(feeType.subTotal) + Number(this.feeTypeData[i].subTotal);
230 this.feeType.subTotal = feeType.subTotal.toFixed(2); 247 this.feeType.subTotal = feeType.subTotal.toFixed(2);
231 // *********** PAID-AMOUNT *********** 248 // *********** PAID-AMOUNT ***********
232 feeType.paidAmount = 249 feeType.paidAmount =
233 Number(feeType.paidAmount) + Number(this.feeTypeData[i].paidAmount); 250 Number(feeType.paidAmount) + Number(this.feeTypeData[i].paidAmount);
234 this.feeType.paidAmount = feeType.paidAmount.toFixed(2); 251 this.feeType.paidAmount = feeType.paidAmount.toFixed(2);
235 }, 252 },
236 printInvoice() { 253 printInvoice() {
237 // Pass the element id here 254 // Pass the element id here
238 this.$htmlToPaper("printMe"); 255 this.$htmlToPaper("printMe");
239 }, 256 },
240 getUserData() { 257 getUserData() {
241 http() 258 http()
242 .get("/getParticularUserDetail") 259 .get("/getParticularUserDetail")
243 .then(response => { 260 .then(response => {
244 this.userData = response.data.data; 261 this.userData = response.data.data;
245 }) 262 })
246 .catch(error => { 263 .catch(error => {
247 // if (error.response.status === 401) { 264 // if (error.response.status === 401) {
248 // this.$router.replace({ path: "/" }); 265 // this.$router.replace({ path: "/" });
249 // this.$store.dispatch("setToken", null); 266 // this.$store.dispatch("setToken", null);
250 // this.$store.dispatch("Id", null); 267 // this.$store.dispatch("Id", null);
251 // } 268 // }
252 }); 269 });
253 } 270 }
254 }, 271 },
255 mounted() { 272 mounted() {
256 this.token = this.$store.state.token; 273 this.token = this.$store.state.token;
257 this.getInvoiceList(); 274 this.getInvoiceList();
258 this.getfeeType(); 275 this.getfeeType();
259 this.getUserData(); 276 this.getUserData();
260
261 }, 277 },
262 created() { 278 created() {
263 this.$root.$on("app:search", search => { 279 this.$root.$on("app:search", search => {
264 this.search = search; 280 this.search = search;
265 }); 281 });
266 }, 282 },
267 beforeDestroy() { 283 beforeDestroy() {
268 // dont forget to remove the listener 284 // dont forget to remove the listener
269 this.$root.$off("app:search"); 285 this.$root.$off("app:search");
270 } 286 }
271 }; 287 };
272 </script> 288 </script>
273 289
274 290
275 <style scoped> 291 <style scoped>
276 .active { 292 .active {
277 background-color: gray; 293 background-color: gray;
278 color: white !important; 294 color: white !important;
279 } 295 }
280 .activebtn { 296 .activebtn {
281 color: black !important; 297 color: black !important;
282 } 298 }
283 table { 299 table {
284 border-collapse: collapse; 300 border-collapse: collapse;
285 border: 1px solid #e2e7eb; 301 border: 1px solid #e2e7eb;
286 } 302 }
287 .open-dialog-button { 303 .open-dialog-button {
288 background: #827bfa !important; 304 background: #827bfa !important;
289 border-color: #827bfa !important; 305 border-color: #827bfa !important;
290 text-transform: none !important; 306 text-transform: none !important;
291 } 307 }
292 308
293 th, 309 th,
294 td { 310 td {
295 border: 1px solid #e2e7eb; 311 border: 1px solid #e2e7eb;
296 padding: 10px; 312 padding: 10px;
297 text-align: center; 313 text-align: center;
298 } 314 }
299 table.feeTypeTable { 315 table.feeTypeTable {
300 table-layout: auto !important; 316 table-layout: auto !important;
301 width: 100% !important; 317 width: 100% !important;
302 } 318 }
303 @media screen and (max-width: 380px) { 319 @media screen and (max-width: 380px) {
304 .tableRsponsive { 320 .tableRsponsive {
305 display: block; 321 display: block;
306 position: relative; 322 position: relative;
307 overflow: scroll; 323 overflow: scroll;
308 } 324 }
309 } 325 }
src/pages/Account/viewPaymentInvoice.vue
Diff comments   View file @81d876b
File was created 1 <template>
2 <v-app id="pages-dasboard">
3 <!-- ****** Edit INVOICE ****** -->
4 <v-container fluid grid-list-md>
5 <v-layout>
6 <v-flex xs12 sm8 md10>
7 <v-btn class="open-dialog-button mt-3" round dark @click="printInvoice()">
8 Print
9 <v-icon size="18" right dark>print</v-icon>
10 </v-btn>
11 </v-flex>
12 </v-layout>
13 <v-flex xs12 sm12 id="printMe">
14 <v-layout wrap>
15 <!-- ****** TABLE DATA MARK ****** -->
16 <v-flex xs12 sm12 md12>
17 <v-card>
18 <v-layout wrap>
19 <v-flex 12>
20 <br />
21 <v-layout>
22 <v-flex xs12 sm12 md12 class="text-xs-center">
23 <!-- <img :src="userData.schoolLogoUrl" width="140" alt="logo" />
24 <p class="title">{{ userData.name }}</p>
25 <p>{{ userData.address }}</p>-->
26 <v-avatar>
27 <img :src="userData.schoolLogoUrl" v-if="userData.schoolLogoUrl" />
28 <img
29 src="/static/schoolIcons/INTRACK_White.png"
30 v-else-if="!userData.schoolLogoUrl"
31 />
32 </v-avatar>
33 <p class="title">{{ userData.name }}</p>
34 <p>{{ userData.address }}</p>
35 </v-flex>
36
37 <v-flex xs12 sm12 md12 class="text-xs-center">
38 <v-layout>
39 <v-flex xs4 sm2>
40 <h5 class="right my-1">
41 <b>Name:</b>
42 </h5>
43 </v-flex>
44 <v-flex sm11 xs8>
45 <h5 class="my-1">{{ invoiceParticularData.studentId.name }}</h5>
46 </v-flex>
47 </v-layout>
48 <v-layout>
49 <v-flex xs4 sm2>
50 <h5 class="right my-1">
51 <b>Class:</b>
52 </h5>
53 </v-flex>
54 <v-flex sm11 xs8>
55 <h5 class="my-1">{{ invoiceParticularData.classId.classNum }}</h5>
56 </v-flex>
57 </v-layout>
58 <!-- <v-flex xs12 sm6> -->
59 <v-layout>
60 <v-flex xs4 sm2>
61 <h5 class="right my-1">
62 <b>Roll No:</b>
63 </h5>
64 </v-flex>
65 <v-flex sm6 xs8>
66 <h5 class="my-1">{{ invoiceParticularData.studentId.rollNo }}</h5>
67 </v-flex>
68 </v-layout>
69 <v-layout>
70 <v-flex xs4 sm2>
71 <h5 class="right my-1">
72 <b>email:</b>
73 </h5>
74 </v-flex>
75 <v-flex sm6 xs8>
76 <h5 class="my-1 linkCover">{{ invoiceParticularData.studentId.email }}</h5>
77 </v-flex>
78 </v-layout>
79 </v-flex>
80 <v-flex xs12 sm12 md12 class="text-xs-center">
81 <v-layout>
82 <v-flex xs4 sm2>
83 <h5 class="right my-1">
84 <b>invoice:</b>
85 </h5>
86 </v-flex>
87 <v-flex sm11 xs8>
88 <h5 class="my-1">#{{ invoiceParticularData.invoiceNumber }}</h5>
89 </v-flex>
90 </v-layout>
91 <v-layout>
92 <v-flex xs4 sm2>
93 <h5 class="right my-1">
94 <b>Payment Method :</b>
95 </h5>
96 </v-flex>
97 <v-flex sm6 xs8>
98 <h5 class="my-1">{{ invoiceParticularData.paymentMethod }}</h5>
99 </v-flex>
100 </v-layout>
101 </v-flex>
102 </v-layout>
103 </v-flex>
104 </v-layout>
105 <table class="feeTypeTable tableRsponsive">
106 <tr class="info white--text">
107 <th>#</th>
108 <th>Fee Type</th>
109 <th>Amount</th>
110 <th>Discount</th>
111 <th>Subtotal</th>
112 </tr>
113 <tr
114 v-for="(feeType, index) in feeTypeData"
115 :key="index"
116 v-on:keyup="getAmmountDetails(feeType)"
117 >
118 <td style="width:40px">{{ index + 1 }}</td>
119 <td style="width:120px">{{ feeType.feeTypeName }}</td>
120 <td style="width:120px">{{ feeType.amount }}</td>
121 <td style="width:120px">{{ feeType.amount-feeType.subTotal }}</td>
122 <td style="width:120px">{{ feeType.subTotal }}</td>
123 </tr>
124 <tfoot>
125 <tr>
126 <td colspan="2">
127 <span class="right subheding">Total Amount (RS) :</span>
128 </td>
129 <td>{{ feeType.amount }}</td>
130 <td>{{ feeType.amount-feeType.subTotal }}</td>
131 <td>{{ feeType.subTotal }}</td>
132 </tr>
133 <!-- <tr>
134 <td colspan="4">
135 <span class="right subheding">Paid (RS) :</span>
136 </td>
137 <td>{{ feeType.totalPaidAmount ? feeType.totalPaidAmount : 0 }}</td>
138 </tr>
139 <tr>
140 <td colspan="4">
141 <span class="right subheding">Balance (RS) :</span>
142 </td>
143 <td>{{ feeType.totalPaidAmount ? feeType.subTotal - feeType.totalPaidAmount : feeType.subTotal }}</td>
144 </tr> -->
145 </tfoot>
146 </table>
147 </v-card>
148 </v-flex>
149 </v-layout>
150 </v-flex>
151 </v-container>
152 <div class="loader" v-if="showLoader">
153 <v-progress-circular indeterminate color="white"></v-progress-circular>
154 </div>
155 </v-app>
156 </template>
157
158 <script>
159 import http from "@/Services/http.js";
160 import moment from "moment";
161
162 export default {
163 data: () => ({
164 showLoader: false,
165 feeTypes: [],
166 filterData: [],
167 invoiceData: {},
168 feeType: {
169 amount: "",
170 discount: "",
171 totalPaidAmount: "",
172 subTotal: "",
173 feeTypeName: ""
174 },
175 feeTypeData: [],
176 token: "",
177 invoiceParticularData: {
178 studentId: {
179 name: ""
180 },
181 classId: {
182 classNum: ""
183 }
184 },
185 userData: {
186 name: ""
187 }
188 }),
189
190 methods: {
191 getInvoiceList() {
192 http()
193 .get("/getParticularInvoice", {
194 params: {
195 invoiceId: this.$route.params.viewPaymentInvoiceId,
196 schoolId: this.$store.state.schoolId
197 },
198 headers: { Authorization: "Bearer " + this.token }
199 })
200 .then(response => {
201 this.invoiceParticularData = response.data.data;
202 this.invoiceData = this.invoiceParticularData;
203 this.invoiceData.date = this.invoiceParticularData.date.slice(0, 10);
204 this.feeTypeData = this.invoiceParticularData.feeType;
205 (this.feeType.amount = response.data.data.totalAmount),
206 (this.feeType.discount = response.data.data.totalDiscount),
207 (this.feeType.subTotal = response.data.data.totalSubTotal),
208 (this.feeType.totalPaidAmount = response.data.data.totalPaidAmount);
209 this.showLoader = false;
210 })
211 .catch(error => {
212 this.showLoader = false;
213 if (error.response.status === 401) {
214 this.$router.replace({ path: "/" });
215 this.$store.dispatch("setToken", null);
216 this.$store.dispatch("Id", null);
217 this.$store.dispatch("Role", null);
218 }
219 });
220 },
221 getfeeType() {
222 http()
223 .get("/getFeesList", {
224 params: { schoolId: this.$store.state.schoolId },
225 headers: { Authorization: "Bearer " + this.token }
226 })
227 .then(response => {
228 this.feeTypes = response.data.data;
229 })
230 .catch(err => {
231 // console.log("err====>", err);
232 });
233 },
234 getAmmountDetails(feeTyp) {
235 let feeType = {
236 subTotal: "",
237 subParticularTotal: "",
238 paidAmount: ""
239 };
240 // *********** SUBTOTAL ***********
241 feeType.subTotal =
242 Number(feeType.subTotal) + Number(this.feeTypeData[i].subTotal);
243 this.feeType.subTotal = feeType.subTotal.toFixed(2);
244 // *********** PAID-AMOUNT ***********
245 feeType.paidAmount =
246 Number(feeType.paidAmount) + Number(this.feeTypeData[i].paidAmount);
247 this.feeType.paidAmount = feeType.paidAmount.toFixed(2);
248 },
249 printInvoice() {
250 // Pass the element id here
251 this.$htmlToPaper("printMe");
252 },
253 getUserData() {
254 http()
255 .get("/getParticularUserDetail")
256 .then(response => {
257 this.userData = response.data.data;
258 })
259 .catch(error => {
260 // if (error.response.status === 401) {
261 // this.$router.replace({ path: "/" });
262 // this.$store.dispatch("setToken", null);
263 // this.$store.dispatch("Id", null);
264 // }
265 });
266 }
267 },
268 mounted() {
269 this.token = this.$store.state.token;
270 this.getInvoiceList();
271 this.getfeeType();
272 this.getUserData();
273 },
274 created() {
275 this.$root.$on("app:search", search => {
276 this.search = search;
277 });
278 },
279 beforeDestroy() {
280 // dont forget to remove the listener
281 this.$root.$off("app:search");
282 }
283 };
284 </script>
285
286
287 <style scoped>
288 .active {
289 background-color: gray;
290 color: white !important;
291 }
292 .activebtn {
293 color: black !important;
294 }
295 table {
296 border-collapse: collapse;
297 border: 1px solid #e2e7eb;
298 }
299 .open-dialog-button {
300 background: #827bfa !important;
301 border-color: #827bfa !important;
302 text-transform: none !important;
303 }
304
305 th,
306 td {
307 border: 1px solid #e2e7eb;
308 padding: 10px;
309 text-align: center;
310 }
311 table.feeTypeTable {
312 table-layout: auto !important;
313 width: 100% !important;
314 }
315 @media screen and (max-width: 380px) {
316 .tableRsponsive {
317 display: block;
318 position: relative;
319 overflow: scroll;
320 }
321 }
322 </style>
src/router/paths.js
Diff comments   View file @81d876b
1 export default [{ 1 export default [{
2 path: '*', 2 path: '*',
3 meta: { 3 meta: {
4 public: true, 4 public: true,
5 }, 5 },
6 redirect: { 6 redirect: {
7 path: '/404' 7 path: '/404'
8 } 8 }
9 }, 9 },
10 { 10 {
11 path: '/404', 11 path: '/404',
12 meta: { 12 meta: {
13 public: true, 13 public: true,
14 }, 14 },
15 name: 'NotFound', 15 name: 'NotFound',
16 component: () => 16 component: () =>
17 import ( 17 import (
18 /* webpackChunkName: "routes" */ 18 /* webpackChunkName: "routes" */
19 /* webpackMode: "lazy-once" */ 19 /* webpackMode: "lazy-once" */
20 `@/pages/NotFound/NotFound.vue` 20 `@/pages/NotFound/NotFound.vue`
21 ) 21 )
22 }, 22 },
23 { 23 {
24 path: '*', 24 path: '*',
25 meta: {}, 25 meta: {},
26 name: 'dashboardAdmin', 26 name: 'dashboardAdmin',
27 props: (route) => ({ type: route.query.type }), 27 props: (route) => ({ type: route.query.type }),
28 component: () => 28 component: () =>
29 import ( 29 import (
30 /* webpackChunkName: "routes" */ 30 /* webpackChunkName: "routes" */
31 /* webpackMode: "lazy-once" */ 31 /* webpackMode: "lazy-once" */
32 `@/pages/Dashboard/dashboard.vue` 32 `@/pages/Dashboard/dashboard.vue`
33 ) 33 )
34 }, 34 },
35 { 35 {
36 path: '/500', 36 path: '/500',
37 meta: { 37 meta: {
38 public: true, 38 public: true,
39 }, 39 },
40 name: 'ServerError', 40 name: 'ServerError',
41 component: () => 41 component: () =>
42 import ( 42 import (
43 /* webpackChunkName: "routes" */ 43 /* webpackChunkName: "routes" */
44 /* webpackMode: "lazy-once" */ 44 /* webpackMode: "lazy-once" */
45 `@/pages/NotFound/Error.vue` 45 `@/pages/NotFound/Error.vue`
46 ) 46 )
47 }, 47 },
48 { 48 {
49 path: '/changepassword', 49 path: '/changepassword',
50 meta: {}, 50 meta: {},
51 name: 'changepassword', 51 name: 'changepassword',
52 props: (route) => ({ type: route.query.type }), 52 props: (route) => ({ type: route.query.type }),
53 component: () => 53 component: () =>
54 import ( 54 import (
55 /* webpackChunkName: "routes" */ 55 /* webpackChunkName: "routes" */
56 /* webpackMode: "lazy-once" */ 56 /* webpackMode: "lazy-once" */
57 `@/pages/Authentication/changepassword.vue` 57 `@/pages/Authentication/changepassword.vue`
58 ) 58 )
59 }, 59 },
60 { 60 {
61 path: '/teachers', 61 path: '/teachers',
62 meta: { breadcrumb: false }, 62 meta: { breadcrumb: false },
63 name: 'Teachers', 63 name: 'Teachers',
64 component: () => 64 component: () =>
65 import ( 65 import (
66 /* webpackChunkName: "routes" */ 66 /* webpackChunkName: "routes" */
67 /* webpackMode: "lazy-once" */ 67 /* webpackMode: "lazy-once" */
68 `@/pages/Teachers/teachers.vue` 68 `@/pages/Teachers/teachers.vue`
69 ) 69 )
70 }, 70 },
71 { 71 {
72 path: '/', 72 path: '/',
73 meta: { 73 meta: {
74 public: true, 74 public: true,
75 }, 75 },
76 name: 'Login', 76 name: 'Login',
77 component: () => 77 component: () =>
78 import ( 78 import (
79 /* webpackChunkName: "routes" */ 79 /* webpackChunkName: "routes" */
80 /* webpackMode: "lazy-once" */ 80 /* webpackMode: "lazy-once" */
81 `@/pages/Authentication/Login.vue` 81 `@/pages/Authentication/Login.vue`
82 ) 82 )
83 }, 83 },
84 { 84 {
85 path: '/forgetpassword', 85 path: '/forgetpassword',
86 meta: { 86 meta: {
87 public: true, 87 public: true,
88 }, 88 },
89 name: 'forgetpassword', 89 name: 'forgetpassword',
90 component: () => 90 component: () =>
91 import ( 91 import (
92 /* webpackChunkName: "routes" */ 92 /* webpackChunkName: "routes" */
93 /* webpackMode: "lazy-once" */ 93 /* webpackMode: "lazy-once" */
94 `@/pages/Authentication/forgetpassword.vue` 94 `@/pages/Authentication/forgetpassword.vue`
95 ) 95 )
96 }, 96 },
97 { 97 {
98 path: '/students', 98 path: '/students',
99 meta: {}, 99 meta: {},
100 name: 'Students', 100 name: 'Students',
101 props: (route) => ({ type: route.query.type }), 101 props: (route) => ({ type: route.query.type }),
102 component: () => 102 component: () =>
103 import ( 103 import (
104 /* webpackChunkName: "routes" */ 104 /* webpackChunkName: "routes" */
105 /* webpackMode: "lazy-once" */ 105 /* webpackMode: "lazy-once" */
106 `@/pages/Students/students.vue` 106 `@/pages/Students/students.vue`
107 ) 107 )
108 }, 108 },
109 { 109 {
110 path: '/class', 110 path: '/class',
111 meta: {}, 111 meta: {},
112 name: 'Class', 112 name: 'Class',
113 props: (route) => ({ type: route.query.type }), 113 props: (route) => ({ type: route.query.type }),
114 component: () => 114 component: () =>
115 import ( 115 import (
116 /* webpackChunkName: "routes" */ 116 /* webpackChunkName: "routes" */
117 /* webpackMode: "lazy-once" */ 117 /* webpackMode: "lazy-once" */
118 `@/pages/Class/addclass.vue` 118 `@/pages/Class/addclass.vue`
119 ) 119 )
120 }, 120 },
121 { 121 {
122 path: '/section', 122 path: '/section',
123 meta: {}, 123 meta: {},
124 name: 'Section', 124 name: 'Section',
125 props: (route) => ({ type: route.query.type }), 125 props: (route) => ({ type: route.query.type }),
126 component: () => 126 component: () =>
127 import ( 127 import (
128 /* webpackChunkName: "routes" */ 128 /* webpackChunkName: "routes" */
129 /* webpackMode: "lazy-once" */ 129 /* webpackMode: "lazy-once" */
130 `@/pages/Section/section.vue` 130 `@/pages/Section/section.vue`
131 ) 131 )
132 }, 132 },
133 { 133 {
134 path: '/noticeBoard', 134 path: '/noticeBoard',
135 meta: {}, 135 meta: {},
136 name: 'Notice Board', 136 name: 'Notice Board',
137 props: (route) => ({ type: route.query.type }), 137 props: (route) => ({ type: route.query.type }),
138 component: () => 138 component: () =>
139 import ( 139 import (
140 /* webpackChunkName: "routes" */ 140 /* webpackChunkName: "routes" */
141 /* webpackMode: "lazy-once" */ 141 /* webpackMode: "lazy-once" */
142 `@/pages/NoticeBoard/noticeBoard.vue` 142 `@/pages/NoticeBoard/noticeBoard.vue`
143 ) 143 )
144 }, 144 },
145 { 145 {
146 path: '/news', 146 path: '/news',
147 meta: {}, 147 meta: {},
148 name: 'News', 148 name: 'News',
149 props: (route) => ({ type: route.query.type }), 149 props: (route) => ({ type: route.query.type }),
150 component: () => 150 component: () =>
151 import ( 151 import (
152 /* webpackChunkName: "routes" */ 152 /* webpackChunkName: "routes" */
153 /* webpackMode: "lazy-once" */ 153 /* webpackMode: "lazy-once" */
154 `@/pages/News/news.vue` 154 `@/pages/News/news.vue`
155 ) 155 )
156 }, 156 },
157 // { 157 // {
158 // path: '/reminder', 158 // path: '/reminder',
159 // meta: { }, 159 // meta: { },
160 // name: 'reminder', 160 // name: 'reminder',
161 // props: (route) => ({ type: route.query.type }), 161 // props: (route) => ({ type: route.query.type }),
162 // component: () => import( 162 // component: () => import(
163 // /* webpackChunkName: "routes" */ 163 // /* webpackChunkName: "routes" */
164 // /* webpackMode: "lazy-once" */ 164 // /* webpackMode: "lazy-once" */
165 // `@/pages/Reminder/reminder.vue` 165 // `@/pages/Reminder/reminder.vue`
166 // ) 166 // )
167 // }, 167 // },
168 { 168 {
169 path: '/timeTable', 169 path: '/timeTable',
170 meta: {}, 170 meta: {},
171 name: 'Time Table', 171 name: 'Time Table',
172 props: (route) => ({ type: route.query.type }), 172 props: (route) => ({ type: route.query.type }),
173 component: () => 173 component: () =>
174 import ( 174 import (
175 /* webpackChunkName: "routes" */ 175 /* webpackChunkName: "routes" */
176 /* webpackMode: "lazy-once" */ 176 /* webpackMode: "lazy-once" */
177 `@/pages/TimeTable/timeTable.vue` 177 `@/pages/TimeTable/timeTable.vue`
178 ) 178 )
179 }, 179 },
180 { 180 {
181 path: '/notification', 181 path: '/notification',
182 meta: {}, 182 meta: {},
183 name: 'Notification', 183 name: 'Notification',
184 props: (route) => ({ type: route.query.type }), 184 props: (route) => ({ type: route.query.type }),
185 component: () => 185 component: () =>
186 import ( 186 import (
187 /* webpackChunkName: "routes" */ 187 /* webpackChunkName: "routes" */
188 /* webpackMode: "lazy-once" */ 188 /* webpackMode: "lazy-once" */
189 `@/pages/Notification/notification.vue` 189 `@/pages/Notification/notification.vue`
190 ) 190 )
191 }, 191 },
192 { 192 {
193 path: '/parents', 193 path: '/parents',
194 meta: {}, 194 meta: {},
195 name: 'Parents', 195 name: 'Parents',
196 props: (route) => ({ type: route.query.type }), 196 props: (route) => ({ type: route.query.type }),
197 component: () => 197 component: () =>
198 import ( 198 import (
199 /* webpackChunkName: "routes" */ 199 /* webpackChunkName: "routes" */
200 /* webpackMode: "lazy-once" */ 200 /* webpackMode: "lazy-once" */
201 `@/pages/Parent/parents.vue` 201 `@/pages/Parent/parents.vue`
202 ) 202 )
203 }, 203 },
204 // { 204 // {
205 // path: '/subject', 205 // path: '/subject',
206 // meta: {}, 206 // meta: {},
207 // name: 'Subject', 207 // name: 'Subject',
208 // props: (route) => ({ type: route.query.type }), 208 // props: (route) => ({ type: route.query.type }),
209 // component: () => 209 // component: () =>
210 // import ( 210 // import (
211 // /* webpackChunkName: "routes" */ 211 // /* webpackChunkName: "routes" */
212 // /* webpackMode: "lazy-once" */ 212 // /* webpackMode: "lazy-once" */
213 // `@/pages/Subjects/subjects.vue` 213 // `@/pages/Subjects/subjects.vue`
214 // ) 214 // )
215 // }, 215 // },
216 { 216 {
217 path: '/dashboard', 217 path: '/dashboard',
218 meta: {}, 218 meta: {},
219 name: 'Dashboard', 219 name: 'Dashboard',
220 props: (route) => ({ type: route.query.type }), 220 props: (route) => ({ type: route.query.type }),
221 component: () => 221 component: () =>
222 import ( 222 import (
223 /* webpackChunkName: "routes" */ 223 /* webpackChunkName: "routes" */
224 /* webpackMode: "lazy-once" */ 224 /* webpackMode: "lazy-once" */
225 `@/pages/Dashboard/dashboard.vue` 225 `@/pages/Dashboard/dashboard.vue`
226 ) 226 )
227 }, 227 },
228 { 228 {
229 path: '/socialMedia', 229 path: '/socialMedia',
230 meta: {}, 230 meta: {},
231 name: 'Social Media', 231 name: 'Social Media',
232 props: (route) => ({ type: route.query.type }), 232 props: (route) => ({ type: route.query.type }),
233 component: () => 233 component: () =>
234 import ( 234 import (
235 /* webpackChunkName: "routes" */ 235 /* webpackChunkName: "routes" */
236 /* webpackMode: "lazy-once" */ 236 /* webpackMode: "lazy-once" */
237 `@/pages/socialMedia/socialMedia.vue` 237 `@/pages/socialMedia/socialMedia.vue`
238 ) 238 )
239 }, 239 },
240 { 240 {
241 path: '/gallery', 241 path: '/gallery',
242 meta: {}, 242 meta: {},
243 name: 'Gallery', 243 name: 'Gallery',
244 props: (route) => ({ type: route.query.type }), 244 props: (route) => ({ type: route.query.type }),
245 component: () => 245 component: () =>
246 import ( 246 import (
247 /* webpackChunkName: "routes" */ 247 /* webpackChunkName: "routes" */
248 /* webpackMode: "lazy-once" */ 248 /* webpackMode: "lazy-once" */
249 `@/pages/Gallery/gallery.vue` 249 `@/pages/Gallery/gallery.vue`
250 ) 250 )
251 }, 251 },
252 { 252 {
253 path: '/event', 253 path: '/event',
254 meta: {}, 254 meta: {},
255 name: 'Event', 255 name: 'Event',
256 props: (route) => ({ type: route.query.type }), 256 props: (route) => ({ type: route.query.type }),
257 component: () => 257 component: () =>
258 import ( 258 import (
259 /* webpackChunkName: "routes" */ 259 /* webpackChunkName: "routes" */
260 /* webpackMode: "lazy-once" */ 260 /* webpackMode: "lazy-once" */
261 `@/pages/Event/event.vue` 261 `@/pages/Event/event.vue`
262 ) 262 )
263 }, 263 },
264 { 264 {
265 path: '/holiday', 265 path: '/holiday',
266 meta: {}, 266 meta: {},
267 name: 'Holiday', 267 name: 'Holiday',
268 props: (route) => ({ type: route.query.type }), 268 props: (route) => ({ type: route.query.type }),
269 component: () => 269 component: () =>
270 import ( 270 import (
271 /* webpackChunkName: "routes" */ 271 /* webpackChunkName: "routes" */
272 /* webpackMode: "lazy-once" */ 272 /* webpackMode: "lazy-once" */
273 `@/pages/Holiday/holiday.vue` 273 `@/pages/Holiday/holiday.vue`
274 ) 274 )
275 }, 275 },
276 { 276 {
277 path: '/user', 277 path: '/user',
278 meta: {}, 278 meta: {},
279 name: 'User', 279 name: 'User',
280 props: (route) => ({ type: route.query.type }), 280 props: (route) => ({ type: route.query.type }),
281 component: () => 281 component: () =>
282 import ( 282 import (
283 /* webpackChunkName: "routes" */ 283 /* webpackChunkName: "routes" */
284 /* webpackMode: "lazy-once" */ 284 /* webpackMode: "lazy-once" */
285 `@/pages/User/user.vue` 285 `@/pages/User/user.vue`
286 ) 286 )
287 }, 287 },
288 { 288 {
289 path: '/AttendenceStudent', 289 path: '/AttendenceStudent',
290 meta: {}, 290 meta: {},
291 name: 'Student Attendence', 291 name: 'Student Attendence',
292 props: (route) => ({ type: route.query.type }), 292 props: (route) => ({ type: route.query.type }),
293 component: () => 293 component: () =>
294 import ( 294 import (
295 /* webpackChunkName: "routes" */ 295 /* webpackChunkName: "routes" */
296 /* webpackMode: "lazy-once" */ 296 /* webpackMode: "lazy-once" */
297 `@/pages/Attendence/studentAttendence.vue` 297 `@/pages/Attendence/studentAttendence.vue`
298 ) 298 )
299 }, 299 },
300 { 300 {
301 path: '/AttendenceTeacher', 301 path: '/AttendenceTeacher',
302 meta: {}, 302 meta: {},
303 name: 'Teacher Attendence', 303 name: 'Teacher Attendence',
304 props: (route) => ({ type: route.query.type }), 304 props: (route) => ({ type: route.query.type }),
305 component: () => 305 component: () =>
306 import ( 306 import (
307 /* webpackChunkName: "routes" */ 307 /* webpackChunkName: "routes" */
308 /* webpackMode: "lazy-once" */ 308 /* webpackMode: "lazy-once" */
309 `@/pages/Attendence/teacherAttendence.vue` 309 `@/pages/Attendence/teacherAttendence.vue`
310 ) 310 )
311 }, 311 },
312 { 312 {
313 path: '/salaryTemplate', 313 path: '/salaryTemplate',
314 meta: {}, 314 meta: {},
315 name: 'Salary Template', 315 name: 'Salary Template',
316 props: (route) => ({ type: route.query.type }), 316 props: (route) => ({ type: route.query.type }),
317 component: () => 317 component: () =>
318 import ( 318 import (
319 `@/pages/Payroll/salaryTemplate.vue` 319 `@/pages/Payroll/salaryTemplate.vue`
320 ) 320 )
321 }, 321 },
322 { 322 {
323 path: '/hourlyTemplate', 323 path: '/hourlyTemplate',
324 meta: {}, 324 meta: {},
325 name: 'Hourly Template', 325 name: 'Hourly Template',
326 props: (route) => ({ type: route.query.type }), 326 props: (route) => ({ type: route.query.type }),
327 component: () => 327 component: () =>
328 import ( 328 import (
329 `@/pages/Payroll/hourlyTemplate.vue` 329 `@/pages/Payroll/hourlyTemplate.vue`
330 ) 330 )
331 }, 331 },
332 { 332 {
333 path: '/manageSalary', 333 path: '/manageSalary',
334 meta: {}, 334 meta: {},
335 name: 'Manage Salary', 335 name: 'Manage Salary',
336 props: (route) => ({ type: route.query.type }), 336 props: (route) => ({ type: route.query.type }),
337 component: () => 337 component: () =>
338 import ( 338 import (
339 `@/pages/Payroll/manageSalary.vue` 339 `@/pages/Payroll/manageSalary.vue`
340 ) 340 )
341 }, 341 },
342 // { 342 // {
343 // path: '/makePayment', 343 // path: '/makePayment',
344 // meta: {}, 344 // meta: {},
345 // name: 'Make Payment', 345 // name: 'Make Payment',
346 // props: (route) => ({ type: route.query.type }), 346 // props: (route) => ({ type: route.query.type }),
347 // component: () => 347 // component: () =>
348 // import ( 348 // import (
349 // `@/pages/Payroll/makePayment.vue` 349 // `@/pages/Payroll/makePayment.vue`
350 // ) 350 // )
351 // }, 351 // },
352 { 352 {
353 path: '/AttendenceUser', 353 path: '/AttendenceUser',
354 meta: {}, 354 meta: {},
355 name: 'User Attendence', 355 name: 'User Attendence',
356 props: (route) => ({ type: route.query.type }), 356 props: (route) => ({ type: route.query.type }),
357 component: () => 357 component: () =>
358 import ( 358 import (
359 /* webpackChunkName: "routes" */ 359 /* webpackChunkName: "routes" */
360 /* webpackMode: "lazy-once" */ 360 /* webpackMode: "lazy-once" */
361 `@/pages/Attendence/userAttendence.vue` 361 `@/pages/Attendence/userAttendence.vue`
362 ) 362 )
363 }, 363 },
364 { 364 {
365 path: '/feeTypes', 365 path: '/feeTypes',
366 meta: {}, 366 meta: {},
367 name: 'Fee Types', 367 name: 'Fee Types',
368 props: (route) => ({ type: route.query.type }), 368 props: (route) => ({ type: route.query.type }),
369 component: () => 369 component: () =>
370 import ( 370 import (
371 /* webpackChunkName: "routes" */ 371 /* webpackChunkName: "routes" */
372 /* webpackMode: "lazy-once" */ 372 /* webpackMode: "lazy-once" */
373 `@/pages/Account/feeTypes.vue` 373 `@/pages/Account/feeTypes.vue`
374 ) 374 )
375 }, 375 },
376 { 376 {
377 path: '/invoice', 377 path: '/invoice',
378 meta: {}, 378 meta: {},
379 name: 'Invoice', 379 name: 'Invoice',
380 props: (route) => ({ type: route.query.type }), 380 props: (route) => ({ type: route.query.type }),
381 component: () => 381 component: () =>
382 import ( 382 import (
383 /* webpackChunkName: "routes" */ 383 /* webpackChunkName: "routes" */
384 /* webpackMode: "lazy-once" */ 384 /* webpackMode: "lazy-once" */
385 `@/pages/Account/invoice.vue` 385 `@/pages/Account/invoice.vue`
386 ) 386 )
387 }, 387 },
388 { 388 {
389 path: '/paymentHistory', 389 path: '/paymentHistory',
390 meta: {}, 390 meta: {},
391 name: 'Payment History', 391 name: 'Payment History',
392 props: (route) => ({ type: route.query.type }), 392 props: (route) => ({ type: route.query.type }),
393 component: () => 393 component: () =>
394 import ( 394 import (
395 /* webpackChunkName: "routes" */ 395 /* webpackChunkName: "routes" */
396 /* webpackMode: "lazy-once" */ 396 /* webpackMode: "lazy-once" */
397 `@/pages/Account/paymentHistory.vue` 397 `@/pages/Account/paymentHistory.vue`
398 ) 398 )
399 }, 399 },
400 { 400 {
401 path: '/expense', 401 path: '/expense',
402 meta: {}, 402 meta: {},
403 name: 'Expense', 403 name: 'Expense',
404 props: (route) => ({ type: route.query.type }), 404 props: (route) => ({ type: route.query.type }),
405 component: () => 405 component: () =>
406 import ( 406 import (
407 /* webpackChunkName: "routes" */ 407 /* webpackChunkName: "routes" */
408 /* webpackMode: "lazy-once" */ 408 /* webpackMode: "lazy-once" */
409 `@/pages/Account/expense.vue` 409 `@/pages/Account/expense.vue`
410 ) 410 )
411 }, 411 },
412 { 412 {
413 path: '/income', 413 path: '/income',
414 meta: {}, 414 meta: {},
415 name: 'Income', 415 name: 'Income',
416 props: (route) => ({ type: route.query.type }), 416 props: (route) => ({ type: route.query.type }),
417 component: () => 417 component: () =>
418 import ( 418 import (
419 /* webpackChunkName: "routes" */ 419 /* webpackChunkName: "routes" */
420 /* webpackMode: "lazy-once" */ 420 /* webpackMode: "lazy-once" */
421 `@/pages/Account/income.vue` 421 `@/pages/Account/income.vue`
422 ) 422 )
423 }, 423 },
424 { 424 {
425 path: '/libraryMember', 425 path: '/libraryMember',
426 meta: {}, 426 meta: {},
427 name: 'Library Member', 427 name: 'Library Member',
428 props: (route) => ({ type: route.query.type }), 428 props: (route) => ({ type: route.query.type }),
429 component: () => 429 component: () =>
430 import ( 430 import (
431 /* webpackChunkName: "routes" */ 431 /* webpackChunkName: "routes" */
432 /* webpackMode: "lazy-once" */ 432 /* webpackMode: "lazy-once" */
433 `@/pages/Library/member.vue` 433 `@/pages/Library/member.vue`
434 ) 434 )
435 }, 435 },
436 { 436 {
437 path: '/books', 437 path: '/books',
438 meta: {}, 438 meta: {},
439 name: 'Books', 439 name: 'Books',
440 props: (route) => ({ type: route.query.type }), 440 props: (route) => ({ type: route.query.type }),
441 component: () => 441 component: () =>
442 import ( 442 import (
443 /* webpackChunkName: "routes" */ 443 /* webpackChunkName: "routes" */
444 /* webpackMode: "lazy-once" */ 444 /* webpackMode: "lazy-once" */
445 `@/pages/Library/books.vue` 445 `@/pages/Library/books.vue`
446 ) 446 )
447 }, 447 },
448 { 448 {
449 path: '/issue', 449 path: '/issue',
450 meta: {}, 450 meta: {},
451 name: 'Issue', 451 name: 'Issue',
452 props: (route) => ({ type: route.query.type }), 452 props: (route) => ({ type: route.query.type }),
453 component: () => 453 component: () =>
454 import ( 454 import (
455 /* webpackChunkName: "routes" */ 455 /* webpackChunkName: "routes" */
456 /* webpackMode: "lazy-once" */ 456 /* webpackMode: "lazy-once" */
457 `@/pages/Library/issue.vue` 457 `@/pages/Library/issue.vue`
458 ) 458 )
459 }, 459 },
460 { 460 {
461 path: '/e-books', 461 path: '/e-books',
462 meta: {}, 462 meta: {},
463 name: 'E-Books', 463 name: 'E-Books',
464 props: (route) => ({ type: route.query.type }), 464 props: (route) => ({ type: route.query.type }),
465 component: () => 465 component: () =>
466 import ( 466 import (
467 /* webpackChunkName: "routes" */ 467 /* webpackChunkName: "routes" */
468 /* webpackMode: "lazy-once" */ 468 /* webpackMode: "lazy-once" */
469 `@/pages/Library/eBook.vue` 469 `@/pages/Library/eBook.vue`
470 ) 470 )
471 }, 471 },
472 { 472 {
473 path: '/invoiceId/:invoiceid', 473 path: '/invoiceId/:invoiceid',
474 meta: {}, 474 meta: {},
475 name: 'Edit Invoice', 475 name: 'Edit Invoice',
476 // props: (route) => ({ type: route.query.type }), 476 // props: (route) => ({ type: route.query.type }),
477 component: () => 477 component: () =>
478 import ( 478 import (
479 /* webpackChunkName: "routes" */ 479 /* webpackChunkName: "routes" */
480 /* webpackMode: "lazy-once" */ 480 /* webpackMode: "lazy-once" */
481 `@/pages/Account/editInvoice.vue` 481 `@/pages/Account/editInvoice.vue`
482 ) 482 )
483 }, 483 },
484 { 484 {
485 path: '/StudentsAttendence/:id', 485 path: '/StudentsAttendence/:id',
486 meta: {}, 486 meta: {},
487 name: 'View Students Attendence', 487 name: 'View Students Attendence',
488 props: (route) => ({ type: route.query.type }), 488 props: (route) => ({ type: route.query.type }),
489 component: () => 489 component: () =>
490 import ( 490 import (
491 /* webpackChunkName: "routes" */ 491 /* webpackChunkName: "routes" */
492 /* webpackMode: "lazy-once" */ 492 /* webpackMode: "lazy-once" */
493 `@/pages/Attendence/viewStudentsAttendence.vue` 493 `@/pages/Attendence/viewStudentsAttendence.vue`
494 ) 494 )
495 }, 495 },
496 { 496 {
497 path: '/TeacherAttendence/:teacherId', 497 path: '/TeacherAttendence/:teacherId',
498 meta: {}, 498 meta: {},
499 name: 'View Teacher Attendence', 499 name: 'View Teacher Attendence',
500 props: (route) => ({ type: route.query.type }), 500 props: (route) => ({ type: route.query.type }),
501 component: () => 501 component: () =>
502 import ( 502 import (
503 /* webpackChunkName: "routes" */ 503 /* webpackChunkName: "routes" */
504 /* webpackMode: "lazy-once" */ 504 /* webpackMode: "lazy-once" */
505 `@/pages/Attendence/viewTeacherAttendence.vue` 505 `@/pages/Attendence/viewTeacherAttendence.vue`
506 ) 506 )
507 }, 507 },
508 { 508 {
509 path: '/viewInvoice/:viewInvoiceId', 509 path: '/viewInvoice/:viewInvoiceId',
510 meta: {}, 510 meta: {},
511 name: 'View Invoice', 511 name: 'View Invoice',
512 props: (route) => ({ type: route.query.type }), 512 props: (route) => ({ type: route.query.type }),
513 component: () => 513 component: () =>
514 import ( 514 import (
515 /* webpackChunkName: "routes" */ 515 /* webpackChunkName: "routes" */
516 /* webpackMode: "lazy-once" */ 516 /* webpackMode: "lazy-once" */
517 `@/pages/Account/viewInvoice.vue` 517 `@/pages/Account/viewInvoice.vue`
518 ) 518 )
519 }, 519 },
520 // { 520 {
521 // path: '/viewPaymentInvoice/:viewPaymentInvoiceId', 521 path: '/viewPaymentInvoice/:viewPaymentInvoiceId',
522 // meta: {}, 522 meta: {},
523 // name: 'View Payment Invoice', 523 name: 'View Payment Invoice',
524 // props: (route) => ({ type: route.query.type }), 524 props: (route) => ({ type: route.query.type }),
525 // component: () => 525 component: () =>
526 // import ( 526 import (
527 // /* webpackChunkName: "routes" */ 527 /* webpackChunkName: "routes" */
528 // /* webpackMode: "lazy-once" */ 528 /* webpackMode: "lazy-once" */
529 // `@/pages/Account/viewPaymentInvoice.vue` 529 `@/pages/Account/viewPaymentInvoice.vue`
530 // ) 530 )
531 // }, 531 },
532 { 532 {
533 path: '/globalPayment', 533 path: '/globalPayment',
534 meta: {}, 534 meta: {},
535 name: 'Global Payment', 535 name: 'Global Payment',
536 props: (route) => ({ type: route.query.type }), 536 props: (route) => ({ type: route.query.type }),
537 component: () => 537 component: () =>
538 import ( 538 import (
539 /* webpackChunkName: "routes" */ 539 /* webpackChunkName: "routes" */
540 /* webpackMode: "lazy-once" */ 540 /* webpackMode: "lazy-once" */
541 `@/pages/Account/globalPayment.vue` 541 `@/pages/Account/globalPayment.vue`
542 ) 542 )
543 }, 543 },
544 { 544 {
545 path: '/exam', 545 path: '/exam',
546 meta: {}, 546 meta: {},
547 name: 'Exam', 547 name: 'Exam',
548 props: (route) => ({ type: route.query.type }), 548 props: (route) => ({ type: route.query.type }),
549 component: () => 549 component: () =>
550 import ( 550 import (
551 /* webpackChunkName: "routes" */ 551 /* webpackChunkName: "routes" */
552 /* webpackMode: "lazy-once" */ 552 /* webpackMode: "lazy-once" */
553 `@/pages/Exam/exam.vue` 553 `@/pages/Exam/exam.vue`
554 ) 554 )
555 }, 555 },
556 { 556 {
557 path: '/grade', 557 path: '/grade',
558 meta: {}, 558 meta: {},
559 name: 'Grade', 559 name: 'Grade',
560 props: (route) => ({ type: route.query.type }), 560 props: (route) => ({ type: route.query.type }),
561 component: () => 561 component: () =>
562 import ( 562 import (
563 /* webpackChunkName: "routes" */ 563 /* webpackChunkName: "routes" */
564 /* webpackMode: "lazy-once" */ 564 /* webpackMode: "lazy-once" */
565 `@/pages/Exam/grade.vue` 565 `@/pages/Exam/grade.vue`
566 ) 566 )
567 }, 567 },
568 { 568 {
569 path: '/examSchedule', 569 path: '/examSchedule',
570 meta: {}, 570 meta: {},
571 name: 'Exam Schedule', 571 name: 'Exam Schedule',
572 props: (route) => ({ type: route.query.type }), 572 props: (route) => ({ type: route.query.type }),
573 component: () => 573 component: () =>
574 import ( 574 import (
575 /* webpackChunkName: "routes" */ 575 /* webpackChunkName: "routes" */
576 /* webpackMode: "lazy-once" */ 576 /* webpackMode: "lazy-once" */
577 `@/pages/Exam/examSchedule.vue` 577 `@/pages/Exam/examSchedule.vue`
578 ) 578 )
579 }, 579 },
580 { 580 {
581 path: '/examAttendence', 581 path: '/examAttendence',
582 meta: {}, 582 meta: {},
583 name: 'Exam Attendence', 583 name: 'Exam Attendence',
584 props: (route) => ({ type: route.query.type }), 584 props: (route) => ({ type: route.query.type }),
585 component: () => 585 component: () =>
586 import ( 586 import (
587 /* webpackChunkName: "routes" */ 587 /* webpackChunkName: "routes" */
588 /* webpackMode: "lazy-once" */ 588 /* webpackMode: "lazy-once" */
589 `@/pages/Exam/examAttendence.vue` 589 `@/pages/Exam/examAttendence.vue`
590 ) 590 )
591 }, 591 },
592 { 592 {
593 path: '/mark', 593 path: '/mark',
594 meta: {}, 594 meta: {},
595 name: 'Mark', 595 name: 'Mark',
596 props: (route) => ({ type: route.query.type }), 596 props: (route) => ({ type: route.query.type }),
597 component: () => 597 component: () =>
598 import ( 598 import (
599 /* webpackChunkName: "routes" */ 599 /* webpackChunkName: "routes" */
600 /* webpackMode: "lazy-once" */ 600 /* webpackMode: "lazy-once" */
601 `@/pages/Mark/mark.vue` 601 `@/pages/Mark/mark.vue`
602 ) 602 )
603 }, 603 },
604 { 604 {
605 path: '/viewMark/:markId', 605 path: '/viewMark/:markId',
606 meta: {}, 606 meta: {},
607 name: 'view Mark', 607 name: 'view Mark',
608 props: (route) => ({ type: route.query.type }), 608 props: (route) => ({ type: route.query.type }),
609 component: () => 609 component: () =>
610 import ( 610 import (
611 /* webpackChunkName: "routes" */ 611 /* webpackChunkName: "routes" */
612 /* webpackMode: "lazy-once" */ 612 /* webpackMode: "lazy-once" */
613 `@/pages/Mark/viewMark.vue` 613 `@/pages/Mark/viewMark.vue`
614 ) 614 )
615 }, 615 },
616 { 616 {
617 path: '/markDistribution', 617 path: '/markDistribution',
618 meta: {}, 618 meta: {},
619 name: 'Mark Distribution', 619 name: 'Mark Distribution',
620 props: (route) => ({ type: route.query.type }), 620 props: (route) => ({ type: route.query.type }),
621 component: () => 621 component: () =>
622 import ( 622 import (
623 /* webpackChunkName: "routes" */ 623 /* webpackChunkName: "routes" */
624 /* webpackMode: "lazy-once" */ 624 /* webpackMode: "lazy-once" */
625 `@/pages/Mark/markDistribution.vue` 625 `@/pages/Mark/markDistribution.vue`
626 ) 626 )
627 }, 627 },
628 { 628 {
629 path: '/promotion', 629 path: '/promotion',
630 meta: {}, 630 meta: {},
631 name: 'Promotion', 631 name: 'Promotion',
632 props: (route) => ({ type: route.query.type }), 632 props: (route) => ({ type: route.query.type }),
633 component: () => 633 component: () =>
634 import ( 634 import (
635 /* webpackChunkName: "routes" */ 635 /* webpackChunkName: "routes" */
636 /* webpackMode: "lazy-once" */ 636 /* webpackMode: "lazy-once" */
637 `@/pages/Mark/promotion.vue` 637 `@/pages/Mark/promotion.vue`
638 ) 638 )
639 }, 639 },
640 { 640 {
641 path: '/academicYear', 641 path: '/academicYear',
642 meta: {}, 642 meta: {},
643 name: 'Academic Year', 643 name: 'Academic Year',
644 props: (route) => ({ type: route.query.type }), 644 props: (route) => ({ type: route.query.type }),
645 component: () => 645 component: () =>
646 import ( 646 import (
647 /* webpackChunkName: "routes" */ 647 /* webpackChunkName: "routes" */
648 /* webpackMode: "lazy-once" */ 648 /* webpackMode: "lazy-once" */
649 `@/pages/Administrator/academicYear.vue` 649 `@/pages/Administrator/academicYear.vue`
650 ) 650 )
651 }, 651 },
652 { 652 {
653 path: '/systemAdmin', 653 path: '/systemAdmin',
654 meta: {}, 654 meta: {},
655 name: 'System Admin', 655 name: 'System Admin',
656 props: (route) => ({ type: route.query.type }), 656 props: (route) => ({ type: route.query.type }),
657 component: () => 657 component: () =>
658 import ( 658 import (
659 /* webpackChunkName: "routes" */ 659 /* webpackChunkName: "routes" */
660 /* webpackMode: "lazy-once" */ 660 /* webpackMode: "lazy-once" */
661 `@/pages/Administrator/systemAdmin.vue` 661 `@/pages/Administrator/systemAdmin.vue`
662 ) 662 )
663 }, 663 },
664 { 664 {
665 path: '/resetPassword', 665 path: '/resetPassword',
666 meta: {}, 666 meta: {},
667 name: 'Change Password', 667 name: 'Change Password',
668 props: (route) => ({ type: route.query.type }), 668 props: (route) => ({ type: route.query.type }),
669 component: () => 669 component: () =>
670 import ( 670 import (
671 /* webpackChunkName: "routes" */ 671 /* webpackChunkName: "routes" */
672 /* webpackMode: "lazy-once" */ 672 /* webpackMode: "lazy-once" */
673 `@/pages/Administrator/resetPassword.vue` 673 `@/pages/Administrator/resetPassword.vue`
674 ) 674 )
675 }, 675 },
676 { 676 {
677 path: '/role', 677 path: '/role',
678 meta: {}, 678 meta: {},
679 name: 'Role', 679 name: 'Role',
680 props: (route) => ({ type: route.query.type }), 680 props: (route) => ({ type: route.query.type }),
681 component: () => 681 component: () =>
682 import ( 682 import (
683 /* webpackChunkName: "routes" */ 683 /* webpackChunkName: "routes" */
684 /* webpackMode: "lazy-once" */ 684 /* webpackMode: "lazy-once" */
685 `@/pages/Administrator/role.vue` 685 `@/pages/Administrator/role.vue`
686 ) 686 )
687 }, 687 },
688 { 688 {
689 path: '/bulkImport', 689 path: '/bulkImport',
690 meta: {}, 690 meta: {},
691 name: 'Bulk Import', 691 name: 'Bulk Import',
692 props: (route) => ({ type: route.query.type }), 692 props: (route) => ({ type: route.query.type }),
693 component: () => 693 component: () =>
694 import ( 694 import (
695 /* webpackChunkName: "routes" */ 695 /* webpackChunkName: "routes" */
696 /* webpackMode: "lazy-once" */ 696 /* webpackMode: "lazy-once" */
697 `@/pages/Administrator/bulkImport.vue` 697 `@/pages/Administrator/bulkImport.vue`
698 ) 698 )
699 }, 699 },
700 { 700 {
701 path: '/studentReport', 701 path: '/studentReport',
702 meta: {}, 702 meta: {},
703 name: 'Student Report', 703 name: 'Student Report',
704 props: (route) => ({ type: route.query.type }), 704 props: (route) => ({ type: route.query.type }),
705 component: () => 705 component: () =>
706 import ( 706 import (
707 /* webpackChunkName: "routes" */ 707 /* webpackChunkName: "routes" */
708 /* webpackMode: "lazy-once" */ 708 /* webpackMode: "lazy-once" */
709 `@/pages/Report/studentReport.vue` 709 `@/pages/Report/studentReport.vue`
710 ) 710 )
711 }, 711 },
712 { 712 {
713 path: '/progressCardReport', 713 path: '/progressCardReport',
714 meta: {}, 714 meta: {},
715 name: 'Progress Card Report', 715 name: 'Progress Card Report',
716 props: (route) => ({ type: route.query.type }), 716 props: (route) => ({ type: route.query.type }),
717 component: () => 717 component: () =>
718 import ( 718 import (
719 /* webpackChunkName: "routes" */ 719 /* webpackChunkName: "routes" */
720 /* webpackMode: "lazy-once" */ 720 /* webpackMode: "lazy-once" */
721 `@/pages/Report/progressCardReport.vue` 721 `@/pages/Report/progressCardReport.vue`
722 ) 722 )
723 }, 723 },
724 { 724 {
725 path: '/idCard', 725 path: '/idCard',
726 meta: {}, 726 meta: {},
727 name: 'Id Card Report', 727 name: 'Id Card Report',
728 props: (route) => ({ type: route.query.type }), 728 props: (route) => ({ type: route.query.type }),
729 component: () => 729 component: () =>
730 import ( 730 import (
731 `@/pages/Report/idCard.vue` 731 `@/pages/Report/idCard.vue`
732 ) 732 )
733 }, 733 },
734 { 734 {
735 path: '/admitCard', 735 path: '/admitCard',
736 meta: {}, 736 meta: {},
737 name: 'Admit Card Report', 737 name: 'Admit Card Report',
738 props: (route) => ({ type: route.query.type }), 738 props: (route) => ({ type: route.query.type }),
739 component: () => 739 component: () =>
740 import ( 740 import (
741 `@/pages/Report/admitCard.vue` 741 `@/pages/Report/admitCard.vue`
742 ) 742 )
743 }, 743 },
744 { 744 {
745 path: '/generalSetting', 745 path: '/generalSetting',
746 meta: {}, 746 meta: {},
747 name: 'General Setting', 747 name: 'General Setting',
748 props: (route) => ({ type: route.query.type }), 748 props: (route) => ({ type: route.query.type }),
749 component: () => 749 component: () =>
750 import ( 750 import (
751 /* webpackChunkName: "routes" */ 751 /* webpackChunkName: "routes" */
752 /* webpackMode: "lazy-once" */ 752 /* webpackMode: "lazy-once" */
753 `@/pages/generalSetting/generalSetting.vue` 753 `@/pages/generalSetting/generalSetting.vue`
754 ) 754 )
755 }, 755 },
756 { 756 {
757 path: '/assignment', 757 path: '/assignment',
758 meta: {}, 758 meta: {},
759 name: 'Assignment', 759 name: 'Assignment',
760 props: (route) => ({ type: route.query.type }), 760 props: (route) => ({ type: route.query.type }),
761 component: () => 761 component: () =>
762 import ( 762 import (
763 `@/pages/Academic/assignment.vue` 763 `@/pages/Academic/assignment.vue`
764 ) 764 )
765 }, 765 },
766 { 766 {
767 path: '/routine', 767 path: '/routine',
768 meta: {}, 768 meta: {},
769 name: 'Routine', 769 name: 'Routine',
770 props: (route) => ({ type: route.query.type }), 770 props: (route) => ({ type: route.query.type }),
771 component: () => 771 component: () =>
772 import ( 772 import (
773 `@/pages/Academic/routine.vue` 773 `@/pages/Academic/routine.vue`
774 ) 774 )
775 }, 775 },
776 { 776 {
777 path: '/subject', 777 path: '/subject',
778 meta: {}, 778 meta: {},
779 name: 'Subject', 779 name: 'Subject',
780 props: (route) => ({ type: route.query.type }), 780 props: (route) => ({ type: route.query.type }),
781 component: () => 781 component: () =>
782 import ( 782 import (
783 `@/pages/Academic/subject.vue` 783 `@/pages/Academic/subject.vue`
784 ) 784 )
785 }, 785 },
786 { 786 {
787 path: '/syllabus', 787 path: '/syllabus',
788 meta: {}, 788 meta: {},
789 name: 'Syllabus', 789 name: 'Syllabus',
790 props: (route) => ({ type: route.query.type }), 790 props: (route) => ({ type: route.query.type }),
791 component: () => 791 component: () =>
792 import ( 792 import (
793 `@/pages/Academic/syllabus.vue` 793 `@/pages/Academic/syllabus.vue`
794 ) 794 )
795 }, 795 },
796 796
797 //////SCHOOL 797 //////SCHOOL
798 798
799 { 799 {
800 path: '/school', 800 path: '/school',
801 meta: {}, 801 meta: {},
802 name: 'School', 802 name: 'School',
803 props: (route) => ({ type: route.query.type }), 803 props: (route) => ({ type: route.query.type }),
804 component: () => 804 component: () =>
805 import ( 805 import (
806 /* webpackChunkName: "routes" */ 806 /* webpackChunkName: "routes" */
807 /* webpackMode: "lazy-once" */ 807 /* webpackMode: "lazy-once" */
808 `@/pages/School/school.vue` 808 `@/pages/School/school.vue`
809 ) 809 )
810 }, 810 },
811 { 811 {
812 path: '/schooldashboard', 812 path: '/schooldashboard',
813 meta: {}, 813 meta: {},
814 name: 'View School Dashboard', 814 name: 'View School Dashboard',
815 props: (route) => ({ type: route.query.type }), 815 props: (route) => ({ type: route.query.type }),
816 component: () => 816 component: () =>
817 import ( 817 import (
818 /* webpackChunkName: "routes" */ 818 /* webpackChunkName: "routes" */
819 /* webpackMode: "lazy-once" */ 819 /* webpackMode: "lazy-once" */
820 `@/pages/School/viewSchoolDashboard.vue` 820 `@/pages/School/viewSchoolDashboard.vue`
821 ) 821 )
822 } 822 }
823 ]; 823 ];