viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 51e4f3e16373cb862bed84b3688ad5e6e29eb105

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

add sunbject and notice board dunamic data

Showing 1 changed file with 1 additions and 5 deletions   Show diff stats
src/pages/Subjects/subjects.vue
Diff comments   View file @51e4f3e
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <v-toolbar class="fixcolors" fixed app> 3 <v-toolbar class="fixcolors" fixed app>
4 <v-toolbar-title class="ml-0 pl-3"> 4 <v-toolbar-title class="ml-0 pl-3">
5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon> 5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
6 </v-toolbar-title> 6 </v-toolbar-title>
7 7
8 <!-- ****** SEARCH ALL EXISTING Subjects ****** --> 8 <!-- ****** SEARCH ALL EXISTING Subjects ****** -->
9 9
10 <v-flex xs7 sm3 class="userSearch"> 10 <v-flex xs7 sm3 class="userSearch">
11 <v-text-field 11 <v-text-field
12 flat 12 flat
13 append-icon="search" 13 append-icon="search"
14 label="Find your Subject" 14 label="Find your Subject"
15 v-model="search" 15 v-model="search"
16 color="white" 16 color="white"
17 dark 17 dark
18 ></v-text-field> 18 ></v-text-field>
19 </v-flex> 19 </v-flex>
20 <v-spacer></v-spacer> 20 <v-spacer></v-spacer>
21 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition"> 21 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
22 <v-btn icon large flat slot="activator"> 22 <v-btn icon large flat slot="activator">
23 <v-avatar size="40px"> 23 <v-avatar size="40px">
24 <img src="/static/icon/user.png" /> 24 <img src="/static/icon/user.png" />
25 </v-avatar> 25 </v-avatar>
26 </v-btn> 26 </v-btn>
27 <v-list class="pa-0"> 27 <v-list class="pa-0">
28 <v-list-tile 28 <v-list-tile
29 v-for="(item,index) in items" 29 v-for="(item,index) in items"
30 :to="!item.href ? { name: item.name } : null" 30 :to="!item.href ? { name: item.name } : null"
31 :href="item.href" 31 :href="item.href"
32 @click="item.click" 32 @click="item.click"
33 ripple="ripple" 33 ripple="ripple"
34 :disabled="item.disabled" 34 :disabled="item.disabled"
35 :target="item.target" 35 :target="item.target"
36 rel="noopener" 36 rel="noopener"
37 :key="index" 37 :key="index"
38 > 38 >
39 <v-list-tile-action v-if="item.icon"> 39 <v-list-tile-action v-if="item.icon">
40 <v-icon>{{ item.icon }}</v-icon> 40 <v-icon>{{ item.icon }}</v-icon>
41 </v-list-tile-action> 41 </v-list-tile-action>
42 <v-list-tile-content> 42 <v-list-tile-content>
43 <v-list-tile-title>{{ item.title }}</v-list-tile-title> 43 <v-list-tile-title>{{ item.title }}</v-list-tile-title>
44 </v-list-tile-content> 44 </v-list-tile-content>
45 </v-list-tile> 45 </v-list-tile>
46 </v-list> 46 </v-list>
47 </v-menu> 47 </v-menu>
48 </v-toolbar> 48 </v-toolbar>
49 <v-tabs grow slider-color="black"> 49 <v-tabs grow slider-color="black">
50 <v-tab 50 <v-tab
51 ripple 51 ripple
52 @click="activeTab('existing')" 52 @click="activeTab('existing')"
53 v-bind:class="{ active: isActive }" 53 v-bind:class="{ active: isActive }"
54 id="tab" 54 id="tab"
55 class="subheading" 55 class="subheading"
56 >Existing Subjects</v-tab> 56 >Existing Subjects</v-tab>
57 <v-tab 57 <v-tab
58 ripple 58 ripple
59 @click="activeTab('new')" 59 @click="activeTab('new')"
60 v-bind:class="{ active: newActive }" 60 v-bind:class="{ active: newActive }"
61 id="tab1" 61 id="tab1"
62 User 62 User
63 class="subheading" 63 class="subheading"
64 >Add New Subject</v-tab> 64 >Add New Subject</v-tab>
65 65
66 <!-- ****** EDIT Subject ****** --> 66 <!-- ****** EDIT Subject ****** -->
67 67
68 <v-tab-item> 68 <v-tab-item>
69 <v-snackbar 69 <v-snackbar
70 :timeout="timeout" 70 :timeout="timeout"
71 :top="y === 'top'" 71 :top="y === 'top'"
72 :right="x === 'right'" 72 :right="x === 'right'"
73 :vertical="mode === 'vertical'" 73 :vertical="mode === 'vertical'"
74 v-model="snackbar" 74 v-model="snackbar"
75 color="success" 75 color="success"
76 >{{ text }}</v-snackbar> 76 >{{ text }}</v-snackbar>
77 <v-dialog v-model="dialog" max-width="600px"> 77 <v-dialog v-model="dialog" max-width="600px">
78 <v-flex xs12 sm12 class> 78 <v-flex xs12 sm12 class>
79 <v-toolbar color="v-toolbar"> 79 <v-toolbar color="v-toolbar">
80 <v-spacer></v-spacer> 80 <v-spacer></v-spacer>
81 <v-toolbar-title> 81 <v-toolbar-title>
82 <h3>Edit Subject</h3> 82 <h3>Edit Subject</h3>
83 </v-toolbar-title> 83 </v-toolbar-title>
84 <v-spacer></v-spacer> 84 <v-spacer></v-spacer>
85 </v-toolbar> 85 </v-toolbar>
86 <v-card flat> 86 <v-card flat>
87 <v-form ref="form"> 87 <v-form ref="form">
88 <v-container fluid> 88 <v-container fluid>
89 <v-layout> 89 <v-layout>
90 <v-flex xs4 class="pt-4 subheading"> 90 <v-flex xs4 class="pt-4 subheading">
91 <label class="right">Class:</label> 91 <label class="right">Class:</label>
92 </v-flex> 92 </v-flex>
93 <v-flex xs6 class="ml-3"> 93 <v-flex xs6 class="ml-3">
94 <v-select 94 <v-select
95 :items="classList" 95 :items="classList"
96 label="Select Class" 96 label="Select Class"
97 v-model="addSubject.selectName" 97 v-model="addSubject.selectName"
98 item-text="classNum" 98 item-text="classNum"
99 item-value="_id" 99 item-value="_id"
100 name="Select Class" 100 name="Select Class"
101 :rules="nameRules" 101 :rules="nameRules"
102 required 102 required
103 ></v-select> 103 ></v-select>
104 </v-flex> 104 </v-flex>
105 </v-layout> 105 </v-layout>
106 <v-layout> 106 <v-layout>
107 <v-flex xs4 class="pt-4 subheading"> 107 <v-flex xs4 class="pt-4 subheading">
108 <label class="right">Subject:</label> 108 <label class="right">Subject:</label>
109 </v-flex> 109 </v-flex>
110 <v-flex xs6 class="ml-3"> 110 <v-flex xs6 class="ml-3">
111 <v-text-field 111 <v-text-field
112 placeholder="fill your Subject" 112 placeholder="fill your Subject"
113 v-model="editedItem.subjectName" 113 v-model="editedItem.subjectName"
114 type="text" 114 type="text"
115 name="email" 115 name="email"
116 required 116 required
117 ></v-text-field> 117 ></v-text-field>
118 </v-flex> 118 </v-flex>
119 </v-layout> 119 </v-layout>
120 <v-flex xs12 sm9 offset-sm2> 120 <v-flex xs12 sm9 offset-sm2>
121 <v-card-actions> 121 <v-card-actions>
122 <v-btn round dark @click.native="close">Cancel</v-btn> 122 <v-btn round dark @click.native="close">Cancel</v-btn>
123 <v-spacer></v-spacer> 123 <v-spacer></v-spacer>
124 <v-btn round dark @click="save">Save</v-btn> 124 <v-btn round dark @click="save">Save</v-btn>
125 </v-card-actions> 125 </v-card-actions>
126 </v-flex> 126 </v-flex>
127 </v-container> 127 </v-container>
128 </v-form> 128 </v-form>
129 </v-card> 129 </v-card>
130 </v-flex> 130 </v-flex>
131 </v-dialog> 131 </v-dialog>
132 132
133 <!-- ****** VIEW PROFIL NOTICE BOARD ****** --> 133 <!-- ****** VIEW PROFIL NOTICE BOARD ****** -->
134 134
135 <v-dialog v-model="dialog1" max-width="600px"> 135 <v-dialog v-model="dialog1" max-width="600px">
136 <v-toolbar color="v-toolbar"> 136 <v-toolbar color="v-toolbar">
137 <v-spacer></v-spacer> 137 <v-spacer></v-spacer>
138 <v-toolbar-title> 138 <v-toolbar-title>
139 <h3>Subject</h3> 139 <h3>Subject</h3>
140 </v-toolbar-title> 140 </v-toolbar-title>
141 <v-spacer></v-spacer> 141 <v-spacer></v-spacer>
142 <v-icon @click="close1">close</v-icon> 142 <v-icon @click="close1">close</v-icon>
143 </v-toolbar> 143 </v-toolbar>
144 <v-card> 144 <v-card>
145 <v-card-text> 145 <v-card-text>
146 <v-container grid-list-md> 146 <v-container grid-list-md>
147 <v-layout wrap> 147 <v-layout wrap>
148 <v-flex> 148 <v-flex>
149 <v-layout> 149 <v-layout>
150 <v-flex xs5 sm6> 150 <v-flex xs5 sm6>
151 <h5 class="right my-1"> 151 <h5 class="right my-1">
152 <b>Subject Name:</b> 152 <b>Subject Name:</b>
153 </h5> 153 </h5>
154 </v-flex> 154 </v-flex>
155 <v-flex sm6 xs8> 155 <v-flex sm6 xs8>
156 <h5 class="my-1">{{ editedItem.subjectName }}</h5> 156 <h5 class="my-1">{{ editedItem.subjectName }}</h5>
157 </v-flex> 157 </v-flex>
158 </v-layout> 158 </v-layout>
159 </v-flex> 159 </v-flex>
160 </v-layout> 160 </v-layout>
161 </v-container> 161 </v-container>
162 </v-card-text> 162 </v-card-text>
163 </v-card> 163 </v-card>
164 </v-dialog> 164 </v-dialog>
165 165
166 <v-snackbar 166 <v-snackbar
167 :timeout="timeout" 167 :timeout="timeout"
168 :top="y === 'top'" 168 :top="y === 'top'"
169 :right="x === 'right'" 169 :right="x === 'right'"
170 :vertical="mode === 'vertical'" 170 :vertical="mode === 'vertical'"
171 v-model="snackbar" 171 v-model="snackbar"
172 color="success" 172 color="success"
173 >{{ text }}</v-snackbar> 173 >{{ text }}</v-snackbar>
174 174
175 <!-- ****** EXISTING SUBJECTS TABLE ****** --> 175 <!-- ****** EXISTING SUBJECTS TABLE ****** -->
176 <v-card flat> 176 <v-card flat>
177 <v-card-actions> 177 <v-card-actions>
178 <v-layout> 178 <v-layout>
179 <v-flex xs1> 179 <v-flex xs1>
180 <label class="right mt-4">Select Class:</label> 180 <label class="right mt-4">Select Class:</label>
181 </v-flex> 181 </v-flex>
182 <v-flex xs3> 182 <v-flex xs3>
183 <v-select 183 <v-select
184 :items="classList" 184 :items="classList"
185 label="Select Class" 185 label="Select Class"
186 v-model="addSubject.selectName" 186 v-model="addSubject.selectName"
187 item-text="classNum" 187 item-text="classNum"
188 item-value="_id" 188 item-value="_id"
189 name="Select Class" 189 name="Select Class"
190 :rules="nameRules" 190 :rules="nameRules"
191 @change="getClassSubject(addSubject.selectName)" 191 @change="getClassSubject(addSubject.selectName)"
192 class="px-4" 192 class="px-4"
193 required 193 required
194 ></v-select> 194 ></v-select>
195 </v-flex> 195 </v-flex>
196 </v-layout> 196 </v-layout>
197 </v-card-actions> 197 </v-card-actions>
198 </v-card> 198 </v-card>
199 <v-data-table 199 <v-data-table
200 :headers="headers" 200 :headers="headers"
201 :items="subjectList.subjects" 201 :items="subjectList.subjects"
202 :pagination.sync="pagination" 202 :pagination.sync="pagination"
203 :search="search" 203 :search="search"
204 > 204 >
205 <template slot="items" slot-scope="props"> 205 <template slot="items" slot-scope="props">
206 <td id="td" class="text-xs-center">{{ props.index}}</td> 206 <td id="td" class="text-xs-center">{{ props.index}}</td>
207 <td id="td" class="text-xs-center">{{ props.item.subjectName}}</td> 207 <td id="td" class="text-xs-center">{{ props.item.subjectName}}</td>
208 208
209 <td class="text-xs-center"> 209 <td class="text-xs-center">
210 <span> 210 <span>
211 <img 211 <img
212 style="cursor:pointer; width:25px; height:18px; " 212 style="cursor:pointer; width:25px; height:18px; "
213 class="mr-5" 213 class="mr-5"
214 @click="profile(props.item)" 214 @click="profile(props.item)"
215 src="/static/icon/eye1.png" 215 src="/static/icon/eye1.png"
216 /> 216 />
217 <img 217 <img
218 style="cursor:pointer; width:20px; height:18px; " 218 style="cursor:pointer; width:20px; height:18px; "
219 class="mr-5" 219 class="mr-5"
220 @click="editItem(props.item)" 220 @click="editItem(props.item)"
221 src="/static/icon/edit1.png" 221 src="/static/icon/edit1.png"
222 /> 222 />
223 <img 223 <img
224 style="cursor:pointer;width:20px; height:20px; " 224 style="cursor:pointer;width:20px; height:20px; "
225 class="mr-5" 225 class="mr-5"
226 @click="deleteItem(props.item)" 226 @click="deleteItem(props.item)"
227 src="/static/icon/delete1.png" 227 src="/static/icon/delete1.png"
228 /> 228 />
229 </span> 229 </span>
230 </td> 230 </td>
231 </template> 231 </template>
232 <v-alert 232 <v-alert
233 slot="no-results" 233 slot="no-results"
234 :value="true" 234 :value="true"
235 color="error" 235 color="error"
236 icon="warning" 236 icon="warning"
237 >Your search for "{{ search }}" found no results.</v-alert> 237 >Your search for "{{ search }}" found no results.</v-alert>
238 </v-data-table> 238 </v-data-table>
239 </v-tab-item> 239 </v-tab-item>
240 240
241 <!-- ****** ADD MULTIPLE Subject ****** --> 241 <!-- ****** ADD MULTIPLE Subject ****** -->
242 242
243 <v-tab-item> 243 <v-tab-item>
244 <v-container> 244 <v-container>
245 <v-snackbar 245 <v-snackbar
246 :timeout="timeout" 246 :timeout="timeout"
247 :top="y === 'top'" 247 :top="y === 'top'"
248 :right="x === 'right'" 248 :right="x === 'right'"
249 :vertical="mode === 'vertical'" 249 :vertical="mode === 'vertical'"
250 v-model="snackbar" 250 v-model="snackbar"
251 color="success" 251 color="success"
252 >{{ text }}</v-snackbar> 252 >{{ text }}</v-snackbar>
253 <v-flex xs12 sm8 offset-sm2 class="top"> 253 <v-flex xs12 sm8 offset-sm2 class="top">
254 <v-card flat> 254 <v-card flat>
255 <v-container fluid fill-height> 255 <v-container fluid fill-height>
256 <v-layout align-center> 256 <v-layout align-center>
257 <v-flex xs12> 257 <v-flex xs12>
258 <v-form ref="form" v-model="valid" lazy-validation> 258 <v-form ref="form" v-model="valid" lazy-validation>
259 <v-layout> 259 <v-layout>
260 <v-flex 260 <v-flex
261 xs12 261 xs12
262 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4" 262 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
263 > 263 >
264 <v-avatar size="100px"> 264 <v-avatar size="100px">
265 <img src="/static/icon/user.png" /> 265 <img src="/static/icon/user.png" />
266 </v-avatar> 266 </v-avatar>
267 </v-flex> 267 </v-flex>
268 </v-layout> 268 </v-layout>
269 <v-layout> 269 <v-layout>
270 <v-flex xs4 class="pt-4 subheading"> 270 <v-flex xs4 class="pt-4 subheading">
271 <label class="right">Class:</label> 271 <label class="right">Class:</label>
272 </v-flex> 272 </v-flex>
273 <v-flex xs6 class="ml-3"> 273 <v-flex xs6 class="ml-3">
274 <v-autocomplete 274 <v-autocomplete
275 v-model="addSubject.classId" 275 v-model="addSubject.classId"
276 placeholder="fill your class Name" 276 placeholder="fill your class Name"
277 type="text" 277 type="text"
278 :items="classList" 278 :items="classList"
279 item-text="classNum" 279 item-text="classNum"
280 item-value="_id" 280 item-value="_id"
281 :rules="nameRules" 281 :rules="nameRules"
282 required 282 required
283 ></v-autocomplete> 283 ></v-autocomplete>
284 </v-flex> 284 </v-flex>
285 </v-layout> 285 </v-layout>
286 <v-layout> 286 <v-layout>
287 <v-flex xs4 class="pt-4 subheading"> 287 <v-flex xs4 class="pt-4 subheading">
288 <label class="right">Subject:</label> 288 <label class="right">Subject:</label>
289 </v-flex> 289 </v-flex>
290 <v-flex xs6 class="ml-3"> 290 <v-flex xs6 class="ml-3">
291 <v-text-field 291 <v-text-field
292 v-model="addSubject.subjectName" 292 v-model="addSubject.subjectName"
293 placeholder="fill your Description" 293 placeholder="fill your Subject Name"
294 name="name" 294 name="name"
295 type="text" 295 type="text"
296 :rules="subjectRules" 296 :rules="subjectRules"
297 required 297 required
298 ></v-text-field> 298 ></v-text-field>
299 </v-flex> 299 </v-flex>
300 </v-layout> 300 </v-layout>
301 <v-layout> 301 <v-layout>
302 <v-flex xs12 sm9 offset-sm2> 302 <v-flex xs12 sm9 offset-sm2>
303 <v-card-actions> 303 <v-card-actions>
304 <v-btn @click="clear" round dark>clear</v-btn> 304 <v-btn @click="clear" round dark>clear</v-btn>
305 <v-spacer></v-spacer> 305 <v-spacer></v-spacer>
306 <v-btn @click="submit" round dark :loading="loading">Add</v-btn> 306 <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
307 </v-card-actions> 307 </v-card-actions>
308 </v-flex> 308 </v-flex>
309 </v-layout> 309 </v-layout>
310 </v-form> 310 </v-form>
311 </v-flex> 311 </v-flex>
312 </v-layout> 312 </v-layout>
313 </v-container> 313 </v-container>
314 </v-card> 314 </v-card>
315 </v-flex> 315 </v-flex>
316 </v-container> 316 </v-container>
317 </v-tab-item> 317 </v-tab-item>
318 </v-tabs> 318 </v-tabs>
319 <div class="loader" v-if="showLoader"> 319 <div class="loader" v-if="showLoader">
320 <v-progress-circular indeterminate color="white"></v-progress-circular> 320 <v-progress-circular indeterminate color="white"></v-progress-circular>
321 </div> 321 </div>
322 </v-app> 322 </v-app>
323 </template> 323 </template>
324 324
325 <script> 325 <script>
326 import http from "@/Services/http.js"; 326 import http from "@/Services/http.js";
327 import Util from "@/util"; 327 import Util from "@/util";
328 328
329 export default { 329 export default {
330 data: () => ({ 330 data: () => ({
331 snackbar: false, 331 snackbar: false,
332 y: "top", 332 y: "top",
333 x: "right", 333 x: "right",
334 mode: "", 334 mode: "",
335 timeout: 3000, 335 timeout: 3000,
336 text: "", 336 text: "",
337 showLoader: false, 337 showLoader: false,
338 loading: false, 338 loading: false,
339 date: null, 339 date: null,
340 search: "", 340 search: "",
341 dialog: false, 341 dialog: false,
342 dialog1: false, 342 dialog1: false,
343 valid: true, 343 valid: true,
344 isActive: true, 344 isActive: true,
345 newActive: false, 345 newActive: false,
346 gender: ["Male", "Female"], 346 gender: ["Male", "Female"],
347 pagination: { 347 pagination: {
348 rowsPerPage: 19 348 rowsPerPage: 19
349 }, 349 },
350 // imageName: "", 350 // imageName: "",
351 // imageUrl: "", 351 // imageUrl: "",
352 // imageFile: "", 352 // imageFile: "",
353 // upload: "", 353 // upload: "",
354 token: "", 354 token: "",
355 nameRules: [v => !!v || " Class Name is required"], 355 nameRules: [v => !!v || " Class Name is required"],
356 subjectRules: [v => !!v || " Subject Name is required"], 356 subjectRules: [v => !!v || " Subject Name is required"],
357 headers: [ 357 headers: [
358 { 358 {
359 text: "No", 359 text: "No",
360 align: "center", 360 align: "center",
361 sortable: false, 361 sortable: false,
362 value: "No" 362 value: "No"
363 }, 363 },
364 { 364 {
365 text: "Subject Name", 365 text: "Subject Name",
366 value: "subjectName", 366 value: "subjectName",
367 sortable: false, 367 sortable: false,
368 align: "center" 368 align: "center"
369 }, 369 },
370 { text: "Action", value: "", sortable: false, align: "center" } 370 { text: "Action", value: "", sortable: false, align: "center" }
371 ], 371 ],
372 subjectList: [], 372 subjectList: [],
373 classList: [], 373 classList: [],
374 editedIndex: -1, 374 editedIndex: -1,
375 addSubject: {}, 375 addSubject: {},
376 selectClassId: "", 376 selectClassId: "",
377 editedItem: { 377 editedItem: {
378 subjectName: "" 378 subjectName: ""
379 }, 379 },
380 defaultItem: {
381 title: "",
382 description: ""
383 },
384 userName: "", 380 userName: "",
385 items: [ 381 items: [
386 { 382 {
387 href: "/changepassword", 383 href: "/changepassword",
388 title: "Change Password", 384 title: "Change Password",
389 click: e => { 385 click: e => {
390 console.log(e); 386 console.log(e);
391 } 387 }
392 }, 388 },
393 { 389 {
394 href: "#", 390 href: "#",
395 title: "Logout", 391 title: "Logout",
396 click: e => { 392 click: e => {
397 window.getApp.$emit("APP_LOGOUT"); 393 window.getApp.$emit("APP_LOGOUT");
398 } 394 }
399 } 395 }
400 ] 396 ]
401 }), 397 }),
402 methods: { 398 methods: {
403 pickFile() { 399 pickFile() {
404 this.$refs.image.click(); 400 this.$refs.image.click();
405 }, 401 },
406 402
407 editItem(item) { 403 editItem(item) {
408 this.editedItem = Object.assign({}, item); 404 this.editedItem = Object.assign({}, item);
409 console.log("this.editedItem._id", this.editedItem._id); 405 console.log("this.editedItem._id", this.editedItem._id);
410 this.dialog = true; 406 this.dialog = true;
411 }, 407 },
412 profile(item) { 408 profile(item) {
413 this.editedItem = Object.assign({}, item); 409 this.editedItem = Object.assign({}, item);
414 this.dialog1 = true; 410 this.dialog1 = true;
415 }, 411 },
416 deleteItem(item) { 412 deleteItem(item) {
417 let deleteSubject = { 413 let deleteSubject = {
418 classId: this.addSubject.selectName, 414 classId: this.addSubject.selectName,
419 subjectId: item._id 415 subjectId: item._id
420 }; 416 };
421 http() 417 http()
422 .delete( 418 .delete(
423 "/deleteSubject", 419 "/deleteSubject",
424 confirm("Are you sure you want to delete this?") && { 420 confirm("Are you sure you want to delete this?") && {
425 params: deleteSubject 421 params: deleteSubject
426 } 422 }
427 ) 423 )
428 .then(response => { 424 .then(response => {
429 if ((this.snackbar = true)) { 425 if ((this.snackbar = true)) {
430 this.text = "Successfully delete Existing Subject"; 426 this.text = "Successfully delete Existing Subject";
431 } 427 }
432 this.getEventList(); 428 this.getEventList();
433 }) 429 })
434 .catch(error => { 430 .catch(error => {
435 // console.log(error); 431 // console.log(error);
436 }); 432 });
437 }, 433 },
438 activeTab(type) { 434 activeTab(type) {
439 switch (type) { 435 switch (type) {
440 case "existing": 436 case "existing":
441 this.newActive = false; 437 this.newActive = false;
442 this.isActive = true; 438 this.isActive = true;
443 break; 439 break;
444 440
445 default: 441 default:
446 this.newActive = true; 442 this.newActive = true;
447 this.isActive = false; 443 this.isActive = false;
448 break; 444 break;
449 } 445 }
450 }, 446 },
451 close() { 447 close() {
452 this.dialog = false; 448 this.dialog = false;
453 setTimeout(() => { 449 setTimeout(() => {
454 this.editedItem = Object.assign({}, this.defaultItem); 450 this.editedItem = Object.assign({}, this.defaultItem);
455 this.editedIndex = -1; 451 this.editedIndex = -1;
456 }, 300); 452 }, 300);
457 }, 453 },
458 close1() { 454 close1() {
459 this.dialog1 = false; 455 this.dialog1 = false;
460 }, 456 },
461 submit() { 457 submit() {
462 if (this.$refs.form.validate()) { 458 if (this.$refs.form.validate()) {
463 http() 459 http()
464 .post("/addSubject", this.addSubject) 460 .post("/addSubject", this.addSubject)
465 .then(response => { 461 .then(response => {
466 if ((this.snackbar = true)) { 462 if ((this.snackbar = true)) {
467 this.text = "New Subject added successfully"; 463 this.text = "New Subject added successfully";
468 } 464 }
469 this.clear(); 465 this.clear();
470 }) 466 })
471 .catch(error => { 467 .catch(error => {
472 // console.log(error); 468 // console.log(error);
473 if ((this.snackbar = true)) { 469 if ((this.snackbar = true)) {
474 this.text = error.response.data.message; 470 this.text = error.response.data.message;
475 } 471 }
476 }); 472 });
477 } 473 }
478 }, 474 },
479 mail() {}, 475 mail() {},
480 download() {}, 476 download() {},
481 clear() { 477 clear() {
482 this.$refs.form.reset(); 478 this.$refs.form.reset();
483 }, 479 },
484 save() { 480 save() {
485 let editSubject = { 481 let editSubject = {
486 classId: this.addSubject.selectName, 482 classId: this.addSubject.selectName,
487 subjectId: this.editedItem._id, 483 subjectId: this.editedItem._id,
488 subjectName: this.editedItem.subjectName 484 subjectName: this.editedItem.subjectName
489 }; 485 };
490 http() 486 http()
491 .put("/updateSubject", editSubject) 487 .put("/updateSubject", editSubject)
492 .then(response => { 488 .then(response => {
493 // console.log("editEvent",editEvent); 489 // console.log("editEvent",editEvent);
494 if ((this.snackbar = true)) { 490 if ((this.snackbar = true)) {
495 this.text = "Successfully Edit Existing Subject"; 491 this.text = "Successfully Edit Existing Subject";
496 } 492 }
497 // this.getClassSubject(); 493 // this.getClassSubject();
498 http() 494 http()
499 .get( 495 .get(
500 "/getParticularClass", 496 "/getParticularClass",
501 { params: { classId: this.selectClassId } }, 497 { params: { classId: this.selectClassId } },
502 { 498 {
503 headers: { Authorization: "Bearer " + this.token } 499 headers: { Authorization: "Bearer " + this.token }
504 } 500 }
505 ) 501 )
506 .then(response => { 502 .then(response => {
507 this.subjectList = response.data.data; 503 this.subjectList = response.data.data;
508 }) 504 })
509 .catch(err => { 505 .catch(err => {
510 console.log("err====>", err); 506 console.log("err====>", err);
511 }); 507 });
512 }) 508 })
513 .catch(error => { 509 .catch(error => {
514 // console.log(error); 510 // console.log(error);
515 }); 511 });
516 this.close(); 512 this.close();
517 }, 513 },
518 handleDrawerToggle() { 514 handleDrawerToggle() {
519 window.getApp.$emit("APP_DRAWER_TOGGLED"); 515 window.getApp.$emit("APP_DRAWER_TOGGLED");
520 }, 516 },
521 handleFullScreen() { 517 handleFullScreen() {
522 Util.toggleFullScreen(); 518 Util.toggleFullScreen();
523 }, 519 },
524 getClassSubject(id) { 520 getClassSubject(id) {
525 this.selectClassId = id; 521 this.selectClassId = id;
526 http() 522 http()
527 .get( 523 .get(
528 "/getParticularClass", 524 "/getParticularClass",
529 { params: { classId: this.selectClassId } }, 525 { params: { classId: this.selectClassId } },
530 { 526 {
531 headers: { Authorization: "Bearer " + this.token } 527 headers: { Authorization: "Bearer " + this.token }
532 } 528 }
533 ) 529 )
534 .then(response => { 530 .then(response => {
535 this.subjectList = response.data.data; 531 this.subjectList = response.data.data;
536 }) 532 })
537 .catch(err => { 533 .catch(err => {
538 console.log("err====>", err); 534 console.log("err====>", err);
539 }); 535 });
540 }, 536 },
541 getClass() { 537 getClass() {
542 http() 538 http()
543 .get("/getClassesList", { 539 .get("/getClassesList", {
544 headers: { Authorization: "Bearer " + this.token } 540 headers: { Authorization: "Bearer " + this.token }
545 }) 541 })
546 .then(response => { 542 .then(response => {
547 this.classList = response.data.data; 543 this.classList = response.data.data;
548 }) 544 })
549 .catch(err => { 545 .catch(err => {
550 // console.log("err====>", err); 546 // console.log("err====>", err);
551 this.$router.replace({ path: "/" }); 547 this.$router.replace({ path: "/" });
552 }); 548 });
553 } 549 }
554 }, 550 },
555 mounted() { 551 mounted() {
556 this.token = this.$store.state.token; 552 this.token = this.$store.state.token;
557 // this.getNoticeDataList(); 553 // this.getNoticeDataList();
558 this.getClass(); 554 this.getClass();
559 }, 555 },
560 computed: { 556 computed: {
561 toolbarColor() { 557 toolbarColor() {
562 return this.$vuetify.options.extra.mainNav; 558 return this.$vuetify.options.extra.mainNav;
563 } 559 }
564 } 560 }
565 }; 561 };
566 </script> 562 </script>
567 <style scoped> 563 <style scoped>
568 .v-tabs__div { 564 .v-tabs__div {
569 text-transform: none; 565 text-transform: none;
570 } 566 }
571 .v-input__prepend-outer { 567 .v-input__prepend-outer {
572 margin-right: 0px !important; 568 margin-right: 0px !important;
573 } 569 }
574 .v-card__actions .v-btn { 570 .v-card__actions .v-btn {
575 margin: 0 15px; 571 margin: 0 15px;
576 min-width: 120px; 572 min-width: 120px;
577 } 573 }
578 .primary { 574 .primary {
579 background-color: #aaa !important; 575 background-color: #aaa !important;
580 border-color: #aaa !important; 576 border-color: #aaa !important;
581 } 577 }
582 h4 { 578 h4 {
583 background-repeat: no-repeat; 579 background-repeat: no-repeat;
584 padding: 8px; 580 padding: 8px;
585 margin: auto; 581 margin: auto;
586 font-size: 25px; 582 font-size: 25px;
587 } 583 }
588 #name { 584 #name {
589 position: absolute; 585 position: absolute;
590 left: 100px; 586 left: 100px;
591 top: 17px; 587 top: 17px;
592 } 588 }
593 #icon { 589 #icon {
594 position: absolute; 590 position: absolute;
595 right: 8px; 591 right: 8px;
596 top: 8px; 592 top: 8px;
597 } 593 }
598 #m { 594 #m {
599 position: relative; 595 position: relative;
600 left: 135px; 596 left: 135px;
601 top: -15px; 597 top: -15px;
602 } 598 }
603 #G { 599 #G {
604 position: absolute; 600 position: absolute;
605 top: 38px; 601 top: 38px;
606 color: white; 602 color: white;
607 } 603 }
608 #bt { 604 #bt {
609 position: relative; 605 position: relative;
610 top: -20px; 606 top: -20px;
611 left: 115px; 607 left: 115px;
612 } 608 }
613 #e { 609 #e {
614 position: relative; 610 position: relative;
615 top: 5px; 611 top: 5px;
616 right: -30px; 612 right: -30px;
617 height: 17px; 613 height: 17px;
618 cursor: pointer; 614 cursor: pointer;
619 } 615 }
620 #d { 616 #d {
621 position: relative; 617 position: relative;
622 top: 5px; 618 top: 5px;
623 right: -70px; 619 right: -70px;
624 height: 17px; 620 height: 17px;
625 cursor: pointer; 621 cursor: pointer;
626 } 622 }
627 #td { 623 #td {
628 border: 1px solid #dddddd; 624 border: 1px solid #dddddd;
629 text-align: left; 625 text-align: left;
630 padding: 8px; 626 padding: 8px;
631 } 627 }
632 #dialog { 628 #dialog {
633 height: 550px; 629 height: 550px;
634 } 630 }
635 .active { 631 .active {
636 background-color: black; 632 background-color: black;
637 color: white !important; 633 color: white !important;
638 } 634 }
639 .activebtn { 635 .activebtn {
640 color: black !important; 636 color: black !important;
641 } 637 }
642 #flex { 638 #flex {
643 height: 300px; 639 height: 300px;
644 } 640 }
645 .top { 641 .top {
646 margin-top: 100px; 642 margin-top: 100px;
647 } 643 }
648 .v-tabs__item a { 644 .v-tabs__item a {
649 font-size: 16px !important; 645 font-size: 16px !important;
650 } 646 }
651 @media screen and (max-width: 769px) { 647 @media screen and (max-width: 769px) {
652 .top { 648 .top {
653 margin-top: 0 !important; 649 margin-top: 0 !important;
654 } 650 }
655 .userSearch .v-icon { 651 .userSearch .v-icon {
656 font-size: 20px !important; 652 font-size: 20px !important;
657 margin-left: 20px; 653 margin-left: 20px;
658 } 654 }
659 } 655 }
660 @media screen and (max-width: 380px) { 656 @media screen and (max-width: 380px) {
661 .pl-3 { 657 .pl-3 {
662 padding-left: 0px !important; 658 padding-left: 0px !important;
663 } 659 }
664 .right { 660 .right {
665 float: none !important; 661 float: none !important;
666 } 662 }
667 .subheading { 663 .subheading {
668 font-size: 14px !important; 664 font-size: 14px !important;
669 } 665 }
670 .v-card__actions .v-btn { 666 .v-card__actions .v-btn {
671 margin: 0 0px; 667 margin: 0 0px;
672 min-width: 100px; 668 min-width: 100px;
673 } 669 }
674 /* .searchIcon .v-icon { 670 /* .searchIcon .v-icon {
675 font-size: 20px; 671 font-size: 20px;
676 margin-left: 20px; 672 margin-left: 20px;
677 } */ 673 } */
678 .subheading { 674 .subheading {
679 font-size: 12px !important; 675 font-size: 12px !important;
680 } 676 }
681 h5 { 677 h5 {
682 font-size: 13px; 678 font-size: 13px;
683 } 679 }
684 } 680 }
685 .v-icon { 681 .v-icon {
686 font-size: 30px; 682 font-size: 30px;
687 } 683 }
688 @media screen and (min-width: 1270px) { 684 @media screen and (min-width: 1270px) {
689 .hide { 685 .hide {
690 display: none; 686 display: none;
691 } 687 }
692 /* } 688 /* }
693 @media screen and (max-width: 962px) { 689 @media screen and (max-width: 962px) {
694 .imglogo{ 690 .imglogo{
695 position: absolute; 691 position: absolute;
696 top: 13px; 692 top: 13px;
697 left: 13px !important; 693 left: 13px !important;
698 width: 70px; 694 width: 70px;
699 height: 24px; 695 height: 24px;
700 } */ 696 } */
701 } 697 }
702 @media screen and (max-width: 420px) { 698 @media screen and (max-width: 420px) {
703 .userSearch .v-text-field .v-label { 699 .userSearch .v-text-field .v-label {
704 line-height: 24px !important; 700 line-height: 24px !important;
705 } 701 }
706 .userSearch .v-label { 702 .userSearch .v-label {
707 font-size: 13px !important; 703 font-size: 13px !important;
708 } 704 }
709 .v-list__tile { 705 .v-list__tile {
710 font-size: 14px; 706 font-size: 14px;
711 padding: 0 10px; 707 padding: 0 10px;
712 } 708 }
713 .name { 709 .name {
714 font-size: 15px; 710 font-size: 15px;
715 } 711 }
716 } 712 }
717 </style> 713 </style>