Commit 4bd94ba603fbb4ca3a611f3a32ec9c0b42ccf2f2

Authored by Neeraj Sharma
1 parent 1571e40b57

implement api and design of holiday

... ... @@ -76,6 +76,16 @@ const Menu = [
76 76 name: 'Gallery',
77 77 icon: 'photo',
78 78 },
  79 + {
  80 + title: 'Event',
  81 + name: 'Event',
  82 + icon: 'event',
  83 + },
  84 + {
  85 + title: 'Holiday',
  86 + name: 'Holiday',
  87 + icon: 'star',
  88 + }
79 89 ];
80 90  
81 91  
... ...
src/components/pageHeader/AppToolbar.vue
... ... @@ -88,6 +88,7 @@ export default {
88 88 methods: {
89 89 emitSearch (ev) {
90 90 this.$root.$emit('app:search', ev.target.value)
  91 + console.log("ev.target.value",ev.target.value)
91 92 },
92 93 handleDrawerToggle() {
93 94 window.getApp.$emit("APP_DRAWER_TOGGLED");
... ...
src/pages/Event/event.vue
... ... @@ -0,0 +1,618 @@
  1 +<template>
  2 + <v-app id="pages-dasboard">
  3 + <v-tabs grow slider-color="black">
  4 + <v-tab
  5 + ripple
  6 + @click="activeTab('existing')"
  7 + v-bind:class="{ active: isActive }"
  8 + id="tab"
  9 + class="subheading"
  10 + >Existing Event</v-tab>
  11 + <v-tab
  12 + ripple
  13 + @click="activeTab('new')"
  14 + v-bind:class="{ active: newActive }"
  15 + id="tab1"
  16 + User
  17 + class="subheading"
  18 + >Add New Event</v-tab>
  19 +
  20 + <!-- ****** EDITS EVENT DETAILS ****** -->
  21 +
  22 + <v-tab-item>
  23 + <v-snackbar
  24 + :timeout="timeout"
  25 + :top="y === 'top'"
  26 + :right="x === 'right'"
  27 + :vertical="mode === 'vertical'"
  28 + v-model="snackbar"
  29 + color="success"
  30 + >{{ text }}</v-snackbar>
  31 + <v-dialog v-model="dialog" max-width="600px">
  32 + <v-flex xs12 sm12>
  33 + <v-toolbar color="v-toolbar">
  34 + <v-spacer></v-spacer>
  35 + <v-toolbar-title>
  36 + <h3>Edit Event</h3>
  37 + </v-toolbar-title>
  38 + <v-spacer></v-spacer>
  39 + </v-toolbar>
  40 + <v-card flat>
  41 + <v-form ref="form">
  42 + <v-container fluid>
  43 + <v-layout>
  44 + <!-- <v-flex
  45 + xs12
  46 + class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
  47 + >
  48 + <v-avatar size="100px">
  49 + <img src="/static/icon/user.png" />
  50 + </v-avatar> -->
  51 + <!-- <input
  52 + type="file"
  53 + style="display: none"
  54 + ref="image"
  55 + accept="image/*"
  56 + @change="onFilePicked"
  57 + />
  58 + <img
  59 + :src="imageData.imageUrl"
  60 + height="150"
  61 + v-if="imageUrl"
  62 + style="border-radius:50%; width:200px"
  63 + />-->
  64 + <!-- </v-flex> -->
  65 + </v-layout>
  66 + <v-flex xs12 sm12>
  67 + <v-layout>
  68 + <v-flex xs4 class="pt-4 subheading">
  69 + <label class="right">Title:</label>
  70 + </v-flex>
  71 + <v-flex xs5 class="ml-3">
  72 + <v-text-field
  73 + v-model="editedItem.title"
  74 + placeholder="fill your Title"
  75 + name="name"
  76 + type="text"
  77 + ></v-text-field>
  78 + </v-flex>
  79 + </v-layout>
  80 + </v-flex>
  81 + <v-flex xs12 sm12>
  82 + <v-layout>
  83 + <v-flex xs4 class="pt-4 subheading">
  84 + <label class="right">Date:</label>
  85 + </v-flex>
  86 + <v-flex xs5 class="ml-3">
  87 + <v-menu
  88 + ref="menu"
  89 + :close-on-content-click="false"
  90 + v-model="menu"
  91 + :nudge-right="40"
  92 + lazy
  93 + transition="scale-transition"
  94 + offset-y
  95 + full-width
  96 + min-width="290px"
  97 + >
  98 + <v-text-field
  99 + slot="activator"
  100 + :rules="dateRules"
  101 + v-model="editedItem.joinDate"
  102 + placeholder="Select date"
  103 + ></v-text-field>
  104 + <v-date-picker
  105 + ref="picker"
  106 + v-model="editedItem.joinDate"
  107 + @input="menu = false"
  108 + ></v-date-picker>
  109 + </v-menu>
  110 + </v-flex>
  111 + </v-layout>
  112 + </v-flex>
  113 + <v-flex xs12 sm12>
  114 + <v-layout>
  115 + <v-flex xs4 class="pt-4 subheading">
  116 + <label class="right">Description:</label>
  117 + </v-flex>
  118 + <v-flex xs5 class="ml-3">
  119 + <v-text-field
  120 + placeholder="fill your Description"
  121 + v-model="editedItem.description"
  122 + type="text"
  123 + ></v-text-field>
  124 + </v-flex>
  125 + </v-layout>
  126 + </v-flex>
  127 + <v-layout>
  128 + <v-flex xs12 sm10 offset-sm1>
  129 + <v-card-actions>
  130 + <v-btn round dark @click.native="close">Cancel</v-btn>
  131 + <v-spacer></v-spacer>
  132 + <v-btn round dark @click="save">Save</v-btn>
  133 + </v-card-actions>
  134 + </v-flex>
  135 + </v-layout>
  136 + </v-container>
  137 + </v-form>
  138 + </v-card>
  139 + </v-flex>
  140 + </v-dialog>
  141 +
  142 + <!-- ****** PROFILE VIEW EVENT DEATILS ****** -->
  143 +
  144 + <v-dialog v-model="dialog1" max-width="700px">
  145 + <v-toolbar color="white">
  146 + <v-spacer></v-spacer>
  147 + <v-toolbar-title>
  148 + <h3>Event</h3>
  149 + </v-toolbar-title>
  150 + <v-spacer></v-spacer>
  151 + <v-icon @click="close1">close</v-icon>
  152 + </v-toolbar>
  153 + <v-card>
  154 + <!-- <v-flex align-center justify-center layout text-xs-center>
  155 + <v-avatar size="50px" style="position:absolute; top:20px;">
  156 + <img src="/static/icon/user.png" />
  157 + </v-avatar>
  158 + </v-flex> -->
  159 + <v-card-text>
  160 + <v-container grid-list-md>
  161 + <v-layout wrap>
  162 + <v-flex>
  163 + <v-layout>
  164 + <v-flex xs5 sm6>
  165 + <h5 class="right my-1">Title:</h5>
  166 + </v-flex>
  167 + <v-flex sm6 xs8>
  168 + <h5 class="my-1">{{ editedItem.title }}</h5>
  169 + </v-flex>
  170 + </v-layout>
  171 + <v-layout>
  172 + <v-flex xs5 sm6>
  173 + <h5 class="right my-1">Date:</h5>
  174 + </v-flex>
  175 + <v-flex sm6 xs8>
  176 + <h5 class="my-1">{{ editedItem.title }}</h5>
  177 + </v-flex>
  178 + </v-layout>
  179 + <v-layout>
  180 + <v-flex xs5 sm6>
  181 + <h5 class="right my-1">Description:</h5>
  182 + </v-flex>
  183 + <v-flex sm6 xs8>
  184 + <h5 class="my-1">{{ editedItem.description }}</h5>
  185 + </v-flex>
  186 + </v-layout>
  187 + </v-flex>
  188 + </v-layout>
  189 + </v-container>
  190 + </v-card-text>
  191 + </v-card>
  192 + </v-dialog>
  193 + <v-snackbar
  194 + :timeout="timeout"
  195 + :top="y === 'top'"
  196 + :right="x === 'right'"
  197 + :vertical="mode === 'vertical'"
  198 + v-model="snackbar"
  199 + color="success"
  200 + >{{ text }}</v-snackbar>
  201 +
  202 + <!-- ****** EXISTING-USERS EVENT TABLE ****** -->
  203 +
  204 + <v-data-table
  205 + :headers="headers"
  206 + :items="desserts"
  207 + :pagination.sync="pagination"
  208 + :search="search"
  209 + >
  210 + <template slot="items" slot-scope="props">
  211 + <td id="td" class="text-xs-center">{{ props.index}}</td>
  212 + <td id="td" class="text-xs-center">{{ props.item.title}}</td>
  213 + <td id="td" class="text-xs-center">{{ props.item.description}}</td>
  214 +
  215 + <td id="td" class="text-xs-center">
  216 + <span>
  217 + <img
  218 + style="cursor:pointer; width:25px; height:18px; "
  219 + class="mr-5"
  220 + @click="profile(props.item)"
  221 + src="/static/icon/eye1.png"
  222 + />
  223 + <img
  224 + style="cursor:pointer; width:20px; height:18px; "
  225 + class="mr-5"
  226 + @click="editItem(props.item)"
  227 + src="/static/icon/edit1.png"
  228 + />
  229 + <img
  230 + style="cursor:pointer;width:20px; height:20px; "
  231 + class="mr-5"
  232 + @click="deleteItem(props.item)"
  233 + src="/static/icon/delete1.png"
  234 + />
  235 + </span>
  236 + </td>
  237 + </template>
  238 + <v-alert
  239 + slot="no-results"
  240 + :value="true"
  241 + color="error"
  242 + icon="warning"
  243 + >Your search for "{{ search }}" found no results.</v-alert>
  244 + </v-data-table>
  245 + </v-tab-item>
  246 +
  247 + <!-- ****** ADD MULTIPLE EVENT ****** -->
  248 +
  249 + <v-tab-item>
  250 + <v-container>
  251 + <v-snackbar
  252 + :timeout="timeout"
  253 + :top="y === 'top'"
  254 + :right="x === 'right'"
  255 + :vertical="mode === 'vertical'"
  256 + v-model="snackbar"
  257 + color="success"
  258 + >{{ text }}</v-snackbar>
  259 + <v-flex xs12 sm12 class="my-4">
  260 + <v-card flat>
  261 + <v-form ref="form" v-model="valid" lazy-validation>
  262 + <v-container fluid>
  263 + <v-layout>
  264 + <!-- <v-flex
  265 + xs12
  266 + class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
  267 + >
  268 + <v-avatar size="100px">
  269 + <img src="/static/icon/user.png" />
  270 + </v-avatar> -->
  271 + <!-- <input
  272 + type="file"
  273 + style="display: none"
  274 + ref="image"
  275 + accept="image/*"
  276 + @change="onFilePicked"
  277 + />
  278 + <img
  279 + :src="imageData.imageUrl"
  280 + height="150"
  281 + v-if="imageUrl"
  282 + style="border-radius:50%; width:200px"
  283 + />-->
  284 + <!-- </v-flex> -->
  285 + </v-layout>
  286 + <v-flex xs12>
  287 + <v-layout>
  288 + <v-flex xs4 class="pt-4 subheading">
  289 + <label class="right">Title:</label>
  290 + </v-flex>
  291 + <v-flex xs4 class="ml-3">
  292 + <v-text-field
  293 + v-model="addEvent.title"
  294 + placeholder="fill your Title"
  295 + type="text"
  296 + :rules="titleRules"
  297 + required
  298 + ></v-text-field>
  299 + </v-flex>
  300 + </v-layout>
  301 + </v-flex>
  302 + <v-flex xs12>
  303 + <v-layout>
  304 + <v-flex xs4 class="pt-4 subheading">
  305 + <label class="right">date:</label>
  306 + </v-flex>
  307 + <v-flex xs4 class="ml-3">
  308 + <v-menu
  309 + ref="menu1"
  310 + :close-on-content-click="false"
  311 + v-model="menu1"
  312 + :nudge-right="40"
  313 + lazy
  314 + transition="scale-transition"
  315 + offset-y
  316 + full-width
  317 + min-width="290px"
  318 + >
  319 + <v-text-field
  320 + slot="activator"
  321 + :rules="dateRules"
  322 + v-model="addEvent.joinDate"
  323 + placeholder="Select date"
  324 + ></v-text-field>
  325 + <v-date-picker
  326 + ref="picker"
  327 + v-model="addEvent.joinDate"
  328 + @input="menu1 = false"
  329 + ></v-date-picker>
  330 + </v-menu>
  331 + </v-flex>
  332 + </v-layout>
  333 + </v-flex>
  334 + <v-flex xs12>
  335 + <v-layout>
  336 + <v-flex xs4 class="pt-4 subheading">
  337 + <label class="right">Description:</label>
  338 + </v-flex>
  339 + <v-flex xs4 class="ml-3">
  340 + <v-text-field
  341 + placeholder="fill your Description"
  342 + :rules="descriptionRules"
  343 + v-model="addEvent.description"
  344 + type="text"
  345 + required
  346 + ></v-text-field>
  347 + </v-flex>
  348 + </v-layout>
  349 + </v-flex>
  350 + <v-layout>
  351 + <v-flex xs12 sm6 offset-sm3>
  352 + <v-card-actions>
  353 + <v-btn @click="clear" round dark>clear</v-btn>
  354 + <v-spacer></v-spacer>
  355 + <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
  356 + </v-card-actions>
  357 + </v-flex>
  358 + </v-layout>
  359 + </v-container>
  360 + </v-form>
  361 + </v-card>
  362 + </v-flex>
  363 + </v-container>
  364 + </v-tab-item>
  365 + </v-tabs>
  366 + <div class="loader" v-if="showLoader">
  367 + <v-progress-circular indeterminate color="white"></v-progress-circular>
  368 + </div>
  369 + </v-app>
  370 +</template>
  371 +
  372 +<script>
  373 +import http from "@/Services/http.js";
  374 +import Util from "@/util";
  375 +
  376 +export default {
  377 + data: () => ({
  378 + snackbar: false,
  379 + y: "top",
  380 + x: "right",
  381 + mode: "",
  382 + timeout: 3000,
  383 + text: "",
  384 + loading: false,
  385 + date: null,
  386 + search: "",
  387 + showLoader: false,
  388 + dialog: false,
  389 + dialog1: false,
  390 + valid: true,
  391 + isActive: true,
  392 + newActive: false,
  393 + pagination: {
  394 + rowsPerPage: 15
  395 + },
  396 + date: null,
  397 + menu1: false,
  398 + menu: false,
  399 + // imageData: {},
  400 + // imageName: "",
  401 + // imageUrl: "",
  402 + // imageFile: "",
  403 + titleRules: [v => !!v || " Tilte is required"],
  404 + descriptionRules: [v => !!v || " Discription is required"],
  405 + dateRules: [v => !!v || "Date is required"],
  406 + headers: [
  407 + {
  408 + text: "No",
  409 + align: "center",
  410 + sortable: false,
  411 + value: "No"
  412 + },
  413 + { text: "Title", value: "title", sortable: false, align: "center" },
  414 + {
  415 + text: "Description",
  416 + value: "description",
  417 + sortable: false,
  418 + align: "center"
  419 + },
  420 + { text: "Action", value: "", sortable: false, align: "center" }
  421 + ],
  422 + desserts: [],
  423 + editedIndex: -1,
  424 + addEvent: {},
  425 + editedItem: {}
  426 + }),
  427 + methods: {
  428 + // pickFile() {
  429 + // this.$refs.image.click();
  430 + // },
  431 +
  432 + // onFilePicked(e) {
  433 + // // console.log(e)
  434 + // const files = e.target.files;
  435 + // this.imageData.upload = e.target.files[0];
  436 + // if (files[0] !== undefined) {
  437 + // this.imageName = files[0].name;
  438 + // if (this.imageName.lastIndexOf(".") <= 0) {
  439 + // return;
  440 + // }
  441 + // const fr = new FileReader();
  442 + // fr.readAsDataURL(files[0]);
  443 + // fr.addEventListener("load", () => {
  444 + // this.imageUrl = fr.result;
  445 + // this.imageFile = files[0]; // this is an image file that can be sent to server...
  446 + // this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
  447 + // console.log("upload=======>", this.imageData.imageUrl);
  448 + // console.log("imageFile", this.imageFile);
  449 + // });
  450 + // } else {
  451 + // this.imageName = "";
  452 + // this.imageFile = "";
  453 + // this.imageUrl = "";
  454 + // }
  455 + // },
  456 + getEvents() {
  457 + // this.showLoader = true;
  458 + var token = this.$store.state.token;
  459 + http()
  460 + .get("/getNotificationsList", {
  461 + headers: { Authorization: "Bearer " + token }
  462 + })
  463 + .then(response => {
  464 + this.desserts = response.data.data;
  465 + this.showLoader = false;
  466 + })
  467 + .catch(err => {
  468 + // console.log("err====>", err);
  469 + this.showLoader = false;
  470 + if (error.response.status === 401) {
  471 + this.$router.replace({ path: "/" });
  472 + this.$store.dispatch("setToken", null);
  473 + this.$store.dispatch("Id", null);
  474 + }
  475 + });
  476 + },
  477 + editItem(item) {
  478 + this.editedIndex = this.desserts.indexOf(item);
  479 + this.editedItem = Object.assign({}, item);
  480 + this.dialog = true;
  481 + },
  482 + profile(item) {
  483 + this.editedIndex = this.desserts.indexOf(item);
  484 + this.editedItem = Object.assign({}, item);
  485 + this.dialog1 = true;
  486 + },
  487 +
  488 + deleteItem(item) {
  489 + let deleteEvent = {
  490 + notificationId: item._id
  491 + };
  492 + http()
  493 + .delete(
  494 + "/deleteNotification",
  495 + confirm("Are you sure you want to delete this?") && {
  496 + params: deleteNotification
  497 + }
  498 + )
  499 + .then(response => {
  500 + // console.log("deleteNotification",deleteNotification)
  501 + if ((this.snackbar = true)) {
  502 + this.text = response.data.message;
  503 + }
  504 + this.getEvents();
  505 + })
  506 + .catch(error => {
  507 + console.log(error);
  508 + });
  509 + },
  510 + activeTab(type) {
  511 + switch (type) {
  512 + case "existing":
  513 + this.newActive = false;
  514 + this.isActive = true;
  515 + break;
  516 +
  517 + default:
  518 + this.newActive = true;
  519 + this.isActive = false;
  520 + break;
  521 + }
  522 + },
  523 + close() {
  524 + this.dialog = false;
  525 + setTimeout(() => {
  526 + this.editedItem = Object.assign({}, this.defaultItem);
  527 + this.editedIndex = -1;
  528 + }, 300);
  529 + },
  530 + close1() {
  531 + this.dialog1 = false;
  532 + },
  533 + submit() {
  534 + if (this.$refs.form.validate()) {
  535 + // let imageData = new FormData();
  536 + // imageData.append("upload", this.imageFile);
  537 + // console.log(imageData);
  538 + // let create = {
  539 + // title: this.addNotification.title,
  540 + // description: this.addNotification.description
  541 + // // imageData
  542 + // };
  543 + // console.log(create);
  544 + this.loading = true;
  545 + http()
  546 + .post("/createNotification", this.addEvent)
  547 + .then(response => {
  548 + console.log(create);
  549 + if ((this.snackbar = true)) {
  550 + this.text = "New Notification added successfully";
  551 + }
  552 + this.getEvents();
  553 + this.clear();
  554 + this.loading = false;
  555 + })
  556 + .catch(error => {
  557 + // console.log(error);
  558 + if ((this.snackbar = true)) {
  559 + this.text = error.response.data.message;
  560 + }
  561 + this.loading = false;
  562 + });
  563 + }
  564 + },
  565 + clear() {
  566 + this.$refs.form.reset();
  567 + },
  568 + save() {
  569 + // let imageData = new FormData();
  570 + // imageData.append("upload", this.imageFile);
  571 + // console.log(imageData);
  572 + // let editNotification = {
  573 + // notificationId: this.editedItem._id,
  574 + // title: this.editedItem.title,
  575 + // description: this.editedItem.description
  576 + // // imageData
  577 + // };
  578 + http()
  579 + .put("/updateNotification", this.editedItem)
  580 + .then(response => {
  581 + // console.log("editNotification",editNotification);
  582 + if ((this.snackbar = true)) {
  583 + this.text = "Successfully Edit Notification";
  584 + }
  585 + this.getEvents();
  586 + })
  587 + .catch(error => {
  588 + // console.log(error);
  589 + });
  590 + this.close();
  591 + }
  592 + },
  593 + mounted() {
  594 + this.getEvents();
  595 + },
  596 + created() {
  597 + this.$root.$on("app:search", search => {
  598 + this.search = search;
  599 + });
  600 + },
  601 + beforeDestroy() {
  602 + // dont forget to remove the listener
  603 + this.$root.$off("app:search");
  604 + }
  605 +};
  606 +</script>
  607 +<style scoped>
  608 +#td {
  609 + max-width: 200px;
  610 +}
  611 +.active {
  612 + background-color: black;
  613 + color: white !important;
  614 +}
  615 +.activebtn {
  616 + color: black !important;
  617 +}
  618 +</style>
0 619 \ No newline at end of file
... ...
src/pages/Holiday/holiday.vue
... ... @@ -0,0 +1,477 @@
  1 +<template>
  2 + <v-app id="pages-dasboard">
  3 + <v-tabs grow slider-color="black">
  4 + <v-tab
  5 + ripple
  6 + @click="activeTab('existing')"
  7 + v-bind:class="{ active: isActive }"
  8 + id="tab"
  9 + class="subheading"
  10 + >Existing Holiday</v-tab>
  11 + <v-tab
  12 + ripple
  13 + @click="activeTab('new')"
  14 + v-bind:class="{ active: newActive }"
  15 + id="tab1"
  16 + User
  17 + class="subheading"
  18 + >Add New Holiday</v-tab>
  19 +
  20 + <!-- ****** EDITS Holiday DETAILS ****** -->
  21 +
  22 + <v-tab-item>
  23 + <v-snackbar
  24 + :timeout="timeout"
  25 + :top="y === 'top'"
  26 + :right="x === 'right'"
  27 + :vertical="mode === 'vertical'"
  28 + v-model="snackbar"
  29 + color="success"
  30 + >{{ text }}</v-snackbar>
  31 + <v-dialog v-model="dialog" max-width="600px">
  32 + <v-flex xs12 sm12>
  33 + <v-toolbar color="v-toolbar">
  34 + <v-spacer></v-spacer>
  35 + <v-toolbar-title>
  36 + <h3>Edit Holiday</h3>
  37 + </v-toolbar-title>
  38 + <v-spacer></v-spacer>
  39 + </v-toolbar>
  40 + <v-card flat>
  41 + <v-form ref="form">
  42 + <v-container fluid>
  43 + <v-flex xs12 sm12>
  44 + <v-layout>
  45 + <v-flex xs4 class="pt-4 subheading">
  46 + <label class="right">Occasion:</label>
  47 + </v-flex>
  48 + <v-flex xs5 class="ml-3">
  49 + <v-text-field
  50 + v-model="editedItem.occasion"
  51 + placeholder="fill your Occasion"
  52 + name="name"
  53 + type="text"
  54 + ></v-text-field>
  55 + </v-flex>
  56 + </v-layout>
  57 + </v-flex>
  58 + <v-flex xs12 sm12>
  59 + <v-layout>
  60 + <v-flex xs4 class="pt-4 subheading">
  61 + <label class="right">Date:</label>
  62 + </v-flex>
  63 + <v-flex xs5 class="ml-3">
  64 + <v-menu
  65 + ref="menu"
  66 + :close-on-content-click="false"
  67 + v-model="menu"
  68 + :nudge-right="40"
  69 + lazy
  70 + transition="scale-transition"
  71 + offset-y
  72 + full-width
  73 + min-width="290px"
  74 + >
  75 + <v-text-field
  76 + slot="activator"
  77 + :rules="dateRules"
  78 + v-model="editedItem.dateOfHoliday"
  79 + placeholder="Select date"
  80 + ></v-text-field>
  81 + <v-date-picker
  82 + ref="picker"
  83 + v-model="editedItem.dateOfHoliday"
  84 + @input="menu = false"
  85 + ></v-date-picker>
  86 + </v-menu>
  87 + </v-flex>
  88 + </v-layout>
  89 + </v-flex>
  90 + <v-layout>
  91 + <v-flex xs12 sm10 offset-sm1>
  92 + <v-card-actions>
  93 + <v-btn round dark @click.native="close">Cancel</v-btn>
  94 + <v-spacer></v-spacer>
  95 + <v-btn round dark @click="save">Save</v-btn>
  96 + </v-card-actions>
  97 + </v-flex>
  98 + </v-layout>
  99 + </v-container>
  100 + </v-form>
  101 + </v-card>
  102 + </v-flex>
  103 + </v-dialog>
  104 +
  105 + <!-- ****** PROFILE VIEW Holiday DEATILS ****** -->
  106 +
  107 + <v-dialog v-model="dialog1" max-width="700px">
  108 + <v-toolbar color="white">
  109 + <v-spacer></v-spacer>
  110 + <v-toolbar-title>
  111 + <h3>Holiday</h3>
  112 + </v-toolbar-title>
  113 + <v-spacer></v-spacer>
  114 + <v-icon @click="close1">close</v-icon>
  115 + </v-toolbar>
  116 + <v-card>
  117 + <v-card-text>
  118 + <v-container grid-list-md>
  119 + <v-layout wrap>
  120 + <v-flex>
  121 + <v-layout>
  122 + <v-flex xs5 sm6>
  123 + <h5 class="right my-1">Occasion:</h5>
  124 + </v-flex>
  125 + <v-flex sm6 xs8>
  126 + <h5 class="my-1">{{ editedItem.occasion }}</h5>
  127 + </v-flex>
  128 + </v-layout>
  129 + <v-layout>
  130 + <v-flex xs5 sm6>
  131 + <h5 class="right my-1">Date:</h5>
  132 + </v-flex>
  133 + <v-flex sm6 xs8>
  134 + <h5 class="my-1">{{ editedItem.dateOfHoliday }}</h5>
  135 + </v-flex>
  136 + </v-layout>
  137 + </v-flex>
  138 + </v-layout>
  139 + </v-container>
  140 + </v-card-text>
  141 + </v-card>
  142 + </v-dialog>
  143 + <v-snackbar
  144 + :timeout="timeout"
  145 + :top="y === 'top'"
  146 + :right="x === 'right'"
  147 + :vertical="mode === 'vertical'"
  148 + v-model="snackbar"
  149 + color="success"
  150 + >{{ text }}</v-snackbar>
  151 +
  152 + <!-- ****** EXISTING-USERS Holiday TABLE ****** -->
  153 +
  154 + <v-data-table
  155 + :headers="headers"
  156 + :items="desserts"
  157 + :pagination.sync="pagination"
  158 + :search="search"
  159 + >
  160 + <template slot="items" slot-scope="props">
  161 + <td id="td" class="text-xs-center">{{ props.index}}</td>
  162 + <td id="td" class="text-xs-center">{{ props.item.occasion}}</td>
  163 + <td id="td" class="text-xs-center">{{ dates(props.item.dateOfHoliday) }}</td>
  164 +
  165 + <td id="td" class="text-xs-center">
  166 + <span>
  167 + <img
  168 + style="cursor:pointer; width:25px; height:18px; "
  169 + class="mr-5"
  170 + @click="profile(props.item)"
  171 + src="/static/icon/eye1.png"
  172 + />
  173 + <img
  174 + style="cursor:pointer; width:20px; height:18px; "
  175 + class="mr-5"
  176 + @click="editItem(props.item)"
  177 + src="/static/icon/edit1.png"
  178 + />
  179 + <img
  180 + style="cursor:pointer;width:20px; height:20px; "
  181 + class="mr-5"
  182 + @click="deleteItem(props.item)"
  183 + src="/static/icon/delete1.png"
  184 + />
  185 + </span>
  186 + </td>
  187 + </template>
  188 + <v-alert
  189 + slot="no-results"
  190 + :value="true"
  191 + color="error"
  192 + icon="warning"
  193 + >Your search for "{{ search }}" found no results.</v-alert>
  194 + </v-data-table>
  195 + </v-tab-item>
  196 +
  197 + <!-- ****** ADD MULTIPLE Holiday ****** -->
  198 +
  199 + <v-tab-item>
  200 + <v-container>
  201 + <v-snackbar
  202 + :timeout="timeout"
  203 + :top="y === 'top'"
  204 + :right="x === 'right'"
  205 + :vertical="mode === 'vertical'"
  206 + v-model="snackbar"
  207 + color="success"
  208 + >{{ text }}</v-snackbar>
  209 + <v-flex xs12 sm8 class="my-4" offset-sm2>
  210 + <v-card flat>
  211 + <v-form ref="form" v-model="valid" lazy-validation>
  212 + <v-container fluid>
  213 + <v-flex xs12>
  214 + <v-layout>
  215 + <v-flex xs4 class="pt-4 subheading">
  216 + <label class="right">Occasion:</label>
  217 + </v-flex>
  218 + <v-flex xs4 class="ml-3">
  219 + <v-text-field
  220 + v-model="addHoliday.occasion"
  221 + placeholder="fill your Occasion"
  222 + type="text"
  223 + :rules="occasionRules"
  224 + required
  225 + ></v-text-field>
  226 + </v-flex>
  227 + </v-layout>
  228 + </v-flex>
  229 + <v-flex xs12>
  230 + <v-layout>
  231 + <v-flex xs4 class="pt-4 subheading">
  232 + <label class="right">date:</label>
  233 + </v-flex>
  234 + <v-flex xs4 class="ml-3">
  235 + <v-menu
  236 + ref="menu1"
  237 + :close-on-content-click="false"
  238 + v-model="menu1"
  239 + :nudge-right="40"
  240 + lazy
  241 + transition="scale-transition"
  242 + offset-y
  243 + full-width
  244 + min-width="290px"
  245 + >
  246 + <v-text-field
  247 + slot="activator"
  248 + :rules="dateRules"
  249 + v-model="addHoliday.dateOfHoliday"
  250 + placeholder="Select date"
  251 + ></v-text-field>
  252 + <v-date-picker
  253 + ref="picker"
  254 + v-model="addHoliday.dateOfHoliday"
  255 + @input="menu1 = false"
  256 + ></v-date-picker>
  257 + </v-menu>
  258 + </v-flex>
  259 + </v-layout>
  260 + </v-flex>
  261 + <v-layout>
  262 + <v-flex xs12 sm7 offset-sm2>
  263 + <v-card-actions>
  264 + <v-btn @click="clear" round dark>clear</v-btn>
  265 + <v-spacer></v-spacer>
  266 + <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
  267 + </v-card-actions>
  268 + </v-flex>
  269 + </v-layout>
  270 + </v-container>
  271 + </v-form>
  272 + </v-card>
  273 + </v-flex>
  274 + </v-container>
  275 + </v-tab-item>
  276 + </v-tabs>
  277 + <div class="loader" v-if="showLoader">
  278 + <v-progress-circular indeterminate color="white"></v-progress-circular>
  279 + </div>
  280 + </v-app>
  281 +</template>
  282 +
  283 +<script>
  284 +import http from "@/Services/http.js";
  285 +import moment from "moment";
  286 +
  287 +export default {
  288 + data: () => ({
  289 + snackbar: false,
  290 + y: "top",
  291 + x: "right",
  292 + mode: "",
  293 + timeout: 3000,
  294 + text: "",
  295 + loading: false,
  296 + date: null,
  297 + search: "",
  298 + showLoader: false,
  299 + dialog: false,
  300 + dialog1: false,
  301 + valid: true,
  302 + isActive: true,
  303 + newActive: false,
  304 + pagination: {
  305 + rowsPerPage: 15
  306 + },
  307 + date: null,
  308 + menu1: false,
  309 + menu: false,
  310 + occasionRules: [v => !!v || "Occasion is required"],
  311 + dateRules: [v => !!v || "Date is required"],
  312 + headers: [
  313 + {
  314 + text: "No",
  315 + align: "center",
  316 + sortable: false,
  317 + value: "No"
  318 + },
  319 + { text: "Occasion", value: "occasion", sortable: false, align: "center" },
  320 + {
  321 + text: "Date Of Holiday",
  322 + value: "dateOfHoliday",
  323 + sortable: false,
  324 + align: "center"
  325 + },
  326 + { text: "Action", value: "", sortable: false, align: "center" }
  327 + ],
  328 + desserts: [],
  329 + editedIndex: -1,
  330 + addHoliday: {},
  331 + editedItem: {}
  332 + }),
  333 + methods: {
  334 + dates: function(date) {
  335 + return moment(date).format("MMMM DD, YYYY");
  336 + },
  337 + getHolidays() {
  338 + this.showLoader = true;
  339 + var token = this.$store.state.token;
  340 + http()
  341 + .get("/getHolidaysList", {
  342 + headers: { Authorization: "Bearer " + token }
  343 + })
  344 + .then(response => {
  345 + this.desserts = response.data.data;
  346 + this.showLoader = false;
  347 + })
  348 + .catch(err => {
  349 + // console.log("err====>", err);
  350 + this.showLoader = false;
  351 + if (error.response.status === 401) {
  352 + this.$router.replace({ path: "/" });
  353 + this.$store.dispatch("setToken", null);
  354 + this.$store.dispatch("Id", null);
  355 + }
  356 + });
  357 + },
  358 + editItem(item) {
  359 + this.editedIndex = this.desserts.indexOf(item);
  360 + this.editedItem = Object.assign({}, item);
  361 + this.editedItem.holidayId = item._id;
  362 + this.dialog = true;
  363 + },
  364 + profile(item) {
  365 + this.editedIndex = this.desserts.indexOf(item);
  366 + this.editedItem = Object.assign({}, item);
  367 + this.dialog1 = true;
  368 + },
  369 +
  370 + deleteItem(item) {
  371 + let deleteHoliday = {
  372 + holidayId: item._id
  373 + };
  374 + http()
  375 + .delete(
  376 + "/deleteHoliday",
  377 + confirm("Are you sure you want to delete this?") && {
  378 + params: deleteHoliday
  379 + }
  380 + )
  381 + .then(response => {
  382 + this.snackbar = true;
  383 + this.text = response.data.message;
  384 + this.getHolidays();
  385 + })
  386 + .catch(error => {
  387 + console.log(error);
  388 + });
  389 + },
  390 + activeTab(type) {
  391 + switch (type) {
  392 + case "existing":
  393 + this.newActive = false;
  394 + this.isActive = true;
  395 + break;
  396 +
  397 + default:
  398 + this.newActive = true;
  399 + this.isActive = false;
  400 + break;
  401 + }
  402 + },
  403 + close() {
  404 + this.dialog = false;
  405 + setTimeout(() => {
  406 + this.editedItem = Object.assign({}, this.defaultItem);
  407 + this.editedIndex = -1;
  408 + }, 300);
  409 + },
  410 + close1() {
  411 + this.dialog1 = false;
  412 + },
  413 + submit() {
  414 + if (this.$refs.form.validate()) {
  415 + this.loading = true;
  416 + http()
  417 + .post("/createHoliday", this.addHoliday)
  418 + .then(response => {
  419 + this.snackbar = true;
  420 + this.text = response.data.message;
  421 + this.getHolidays();
  422 + this.clear();
  423 + this.loading = false;
  424 + })
  425 + .catch(error => {
  426 + // console.log(error);
  427 + if ((this.snackbar = true)) {
  428 + this.text = error.response.data.message;
  429 + }
  430 + this.loading = false;
  431 + });
  432 + }
  433 + },
  434 + clear() {
  435 + this.$refs.form.reset();
  436 + },
  437 + save() {
  438 + http()
  439 + .put("/updateHoliday", this.editedItem)
  440 + .then(response => {
  441 + if ((this.snackbar = true)) {
  442 + this.text = response.data.message;
  443 + }
  444 + this.getHolidays();
  445 + })
  446 + .catch(error => {
  447 + // console.log(error);
  448 + });
  449 + this.close();
  450 + }
  451 + },
  452 + mounted() {
  453 + this.getHolidays();
  454 + },
  455 + created() {
  456 + this.$root.$on("app:search", search => {
  457 + this.search = search;
  458 + });
  459 + },
  460 + beforeDestroy() {
  461 + // dont forget to remove the listener
  462 + this.$root.$off("app:search");
  463 + }
  464 +};
  465 +</script>
  466 +<style scoped>
  467 +#td {
  468 + max-width: 200px;
  469 +}
  470 +.active {
  471 + background-color: black;
  472 + color: white !important;
  473 +}
  474 +.activebtn {
  475 + color: black !important;
  476 +}
  477 +</style>
0 478 \ No newline at end of file
... ...
src/pages/Notification/notification.vue
... ... @@ -17,7 +17,7 @@
17 17 class="subheading"
18 18 >Add New Notifictaion</v-tab>
19 19  
20   - <!-- ****** EDITS REMINDER DETAILS ****** -->
  20 + <!-- ****** EDITS NOTIFICATION DETAILS ****** -->
21 21  
22 22 <v-tab-item>
23 23 <v-snackbar
... ... @@ -107,7 +107,7 @@
107 107 </v-flex>
108 108 </v-dialog>
109 109  
110   - <!-- ****** PROFILE VIEW REMINDER DEATILS ****** -->
  110 + <!-- ****** PROFILE VIEW NOTIFICATION DEATILS ****** -->
111 111  
112 112 <v-dialog v-model="dialog1" max-width="600px">
113 113 <v-toolbar color="white">
... ... @@ -161,7 +161,7 @@
161 161 color="success"
162 162 >{{ text }}</v-snackbar>
163 163  
164   - <!-- ****** EXISTING-USERS REMINDER TABLE ****** -->
  164 + <!-- ****** EXISTING-USERS NOTIFICATION TABLE ****** -->
165 165  
166 166 <v-data-table
167 167 :headers="headers"
... ... @@ -206,7 +206,7 @@
206 206 </v-data-table>
207 207 </v-tab-item>
208 208  
209   - <!-- ****** ADD MULTIPLE REMINDER ****** -->
  209 + <!-- ****** ADD MULTIPLE NOTIFICATION ****** -->
210 210  
211 211 <v-tab-item>
212 212 <v-container>
... ...
src/pages/Teachers/teachers.vue
... ... @@ -799,15 +799,11 @@
799 799 </template>
800 800  
801 801 <script>
802   -// import AppToolbar from '@/components/AppToolbar';
803 802 import http from "@/Services/http.js";
804 803 import Util from "@/util";
805 804 import moment from "moment";
806 805  
807 806 export default {
808   - components: {
809   - // "one-month": onemonth,
810   - },
811 807 data: () => ({
812 808 component: "report-generate",
813 809 snackbar: false,
... ...
src/pages/TimeTable/timeTable.vue
... ... @@ -510,7 +510,12 @@
510 510 @click="deleteItem(props.item)"
511 511 src="/static/icon/delete1.png"
512 512 />
513   - <v-icon color="black" @click="addSchedule(props.item._id)">add_circle_outline</v-icon>
  513 + <img
  514 + style="cursor:pointer; width:20px; height:20px; "
  515 + src="/static/icon/add1.png"
  516 + @click="addSchedule(props.item._id)"
  517 + />
  518 + <!-- <v-icon color="black" >add_circle_outline</v-icon> -->
514 519 </span>
515 520 </td>
516 521 </tr>
... ... @@ -913,7 +918,7 @@ export default {
913 918 menu4: false,
914 919 menu5: false,
915 920 menu6: false,
916   - scheduleDayId: "",
  921 + scheduleDayId: ""
917 922 }),
918 923 methods: {
919 924 findTimeTable() {
... ...
src/router/paths.js
... ... @@ -236,5 +236,29 @@ export default [{
236 236 /* webpackMode: "lazy-once" */
237 237 `@/pages/Gallery/gallery.vue`
238 238 )
  239 + },
  240 + {
  241 + path: '/event',
  242 + meta: {},
  243 + name: 'Event',
  244 + props: (route) => ({ type: route.query.type }),
  245 + component: () =>
  246 + import (
  247 + /* webpackChunkName: "routes" */
  248 + /* webpackMode: "lazy-once" */
  249 + `@/pages/Event/event.vue`
  250 + )
  251 + },
  252 + {
  253 + path: '/holiday',
  254 + meta: {},
  255 + name: 'Holiday',
  256 + props: (route) => ({ type: route.query.type }),
  257 + component: () =>
  258 + import (
  259 + /* webpackChunkName: "routes" */
  260 + /* webpackMode: "lazy-once" */
  261 + `@/pages/Holiday/holiday.vue`
  262 + )
239 263 }
240 264 ];
241 265 \ No newline at end of file
... ...
static/icon/add.png

9.46 KB

static/icon/add1.png

45 KB