%PDF- %PDF-
Direktori : /home/opti/workflow/src/views/employee/ |
Current File : /home/opti/workflow/src/views/employee/dashboard.ejs |
<% include ../partials/header %> <!-- ////////////////////////////////////////////////////////////////////////////--> <% include ../partials/sidebar %> <div class="app-content content"> <div class="content-wrapper"> <div class="content-header row"> </div> <div class="content-body"> <!-- Breadcrumb starts--> <div class="content-header row"> <div class="content-header-left col-md-6 col-12 mb-1"> <h2 class="content-header-title">Dashboard</h2> </div> <div class="content-header-right breadcrumbs-right breadcrumbs-top col-md-6 col-12"> <div class="breadcrumb-wrapper col-12"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="/">Home</a> </li> </ol> </div> </div> </div> <!-- Breadcrumb ends--> <%- format_messages(messages) %> <div class="row"> <% /* %> <div class="col-xl-3 col-lg-6 col-12"> <div class="card bg-gradient-directional-info"> <div class="card-content"> <a href="/employees"> <div class="card-body"> <div class="media d-flex"> <div class="media-body text-white text-left"> <h3 class="text-white"><%= employees.length %></h3> <span>Employees</span> </div> <div class="align-self-center"> <i class="icon-users text-white font-large-2 float-right"></i> </div> </div> </div> </a> </div> </div> </div> <% */ %> <div class="col-xl-6 col-lg-6 col-12"> <div class="card bg-gradient-directional-info"> <div class="card-content"> <div class="card-body"> <div class="media d-flex"> <div class="media-body text-white text-left"> <!-- <h3 class="text-white">156</h3> --> <span>Workflow</span> </div> <div class="align-self-center"> <i class="la la-random text-white font-large-2 float-right"></i> </div> </div> </div> </div> </div> </div> <div class="col-xl-6 col-lg-6 col-12"> <div class="card bg-gradient-directional-success"> <div class="card-content"> <div class="card-body"> <div class="media d-flex"> <div class="media-body text-white text-left"> <!-- <h3 class="text-white">156</h3> --> <span>Document Manager</span> </div> <div class="align-self-center"> <i class="ft-folder text-white font-large-2 float-right"></i> </div> </div> </div> </div> </div> </div> </div> <!--/ eCommerce statistic --> <div class="content-body"> <section class="row"> <div class="col-12"> <div class="card"> <div class="card-header"> <h4 class="card-title">My Task List</h4> <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a> <div class="heading-elements"> <button class="btn btn-primary btn-sm"><i class="ft-plus white"></i> New Task</button> <span class="dropdown"> <button id="btnSearchDrop1" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-warning btn-sm dropdown-toggle dropdown-menu-right"><i class="ft-download white"></i></button> <span aria-labelledby="btnSearchDrop1" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="la la-calendar"></i> Due Date</a> <a href="#" class="dropdown-item"><i class="la la-random"></i> Priority </a> <a href="#" class="dropdown-item"><i class="la la-bar-chart"></i> Progress</a> <a href="#" class="dropdown-item"><i class="la la-user"></i> Assign to</a> </span> </span> <button class="btn btn-success btn-sm"><i class="ft-settings white"></i></button> </div> </div> <div class="card-content"> <div class="card-body"> <!-- Task List table --> <div class="table-responsive"> <table id="project-task-list" class="table table-white-space table-bordered row-grouping display no-wrap icheck table-middle"> <thead> <tr> <th> <input type="checkbox" class="input-chk"> </th> <th>Task</th> <th>Dates</th> <th>Priority</th> <th>Progress</th> <th>Owner</th> <th>Actions</th> </tr> </thead> <tbody> <!-- EZONE Project --> <tr> <td> <input type="checkbox" class="input-chk"> </td> <td> <a href="#" class="text-bold-600">Product inspection</a> <p class="text-muted">Inspect the newly delivered products. </p> </td> <td> <h6 class="mb-0">Basics Tasks & Milestones in <span class="text-bold-600">E-Zone Project</span> on <em>30 Oct, 2017</em> </h6> </td> <td> <span class="badge badge-default badge-danger">Critical</span> </td> <td> <div class="progress progress-sm"> <div aria-valuemin="82" aria-valuemax="100" class="progress-bar bg-gradient-x-success" role="progressbar" style="width:82%" aria-valuenow="82"></div> </div> </td> <td class="text-center"> <span class="avatar avatar-busy"> <img src="/app-assets/images/portrait/small/avatar-s-3.png" alt="avatar" data-toggle="tooltip" data-placement="right" title="John Doe"><i class=""></i> </span> </td> <td> <span class="dropdown"> <button id="btnSearchDrop2" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-info dropdown-toggle"><i class="la la-cog"></i></button> <span aria-labelledby="btnSearchDrop2" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-eye"></i> Open Task</a> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit Task</a> <a href="#" class="dropdown-item"><i class="ft-check"></i> Complete Task</a> <a href="#" class="dropdown-item"><i class="ft-upload"></i> Assign to</a> <div class="dropdown-divider"></div> <a href="#" class="dropdown-item"><i class="ft-trash"></i> Delete Task</a> </span> </span> </td> </tr> <tr> <td> <input type="checkbox" class="input-chk"> </td> <td> <a href="#" class="text-bold-600">Schedule a board meeting</a> <p class="text-muted">Meet with the HR Department to fix a date of which the HR staff meet with the Board</p> </td> <!-- <td> <h6 class="mb-0">Basics Tasks & Milestones in <span class="text-bold-600">EZONE Project</span> on <em>30 Oct, 2017</em> </h6> </td> --> <td> <span class="badge badge-default badge-primary">Medium</span> </td> <td> <div class="progress progress-sm"> <div aria-valuemin="30" aria-valuemax="100" class="progress-bar bg-gradient-x-warning" role="progressbar" style="width:32%" aria-valuenow="32"></div> </div> </td> <td class="text-center"> <span class="avatar avatar-online"> <img src="../../../app-assets/images/portrait/small/avatar-s-5.png" alt="avatar" data-placement="right" title="Peater Doe"><i></i> </span> </td> <td> <span class="dropdown"> <button id="btnSearchDrop3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-info dropdown-toggle"><i class="la la-cog"></i></button> <span aria-labelledby="btnSearchDrop3" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-eye"></i> Open Task</a> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit Task</a> <a href="#" class="dropdown-item"><i class="ft-check"></i> Complete Task</a> <a href="#" class="dropdown-item"><i class="ft-upload"></i> Assign to</a> <div class="dropdown-divider"></div> <a href="#" class="dropdown-item"><i class="ft-trash"></i> Delete Task</a> </span> </span> </td> </tr> <tr> <td> <input type="checkbox" class="input-chk"> </td> <td> <a href="#" class="text-bold-600">Integrate ChartJS Page</a> <p class="text-muted"> Curabitur tempor, quam vel pulvinar finibus.</p> </td> <td> <h6 class="mb-0">Basics Tasks & Milestones in <span class="text-bold-600">EZONE Project</span> on <em>30 Oct, 2017</em> </h6> </td> <td> <span class="badge badge-default badge-warning">High</span> </td> <td> <div class="progress progress-sm"> <div aria-valuemin="20" aria-valuemax="100" class="progress-bar bg-gradient-x-danger" role="progressbar" style="width:20%" aria-valuenow="20"></div> </div> </td> <td class="text-center"> <span class="avatar avatar-online"> <img src="../../../app-assets/images/portrait/small/avatar-s-6.png" alt="avatar" data-placement="right" title="Nicole Barrett"><i></i> </span> </td> <td> <span class="dropdown"> <button id="btnSearchDrop4" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-info dropdown-toggle"><i class="la la-cog"></i></button> <span aria-labelledby="btnSearchDrop4" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-eye"></i> Open Task</a> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit Task</a> <a href="#" class="dropdown-item"><i class="ft-check"></i> Complete Task</a> <a href="#" class="dropdown-item"><i class="ft-upload"></i> Assign to</a> <div class="dropdown-divider"></div> <a href="#" class="dropdown-item"><i class="ft-trash"></i> Delete Task</a> </span> </span> </td> </tr> <tr> <td> <input type="checkbox" class="input-chk"> </td> <td> <a href="#" class="text-bold-600">Support Charls Users</a> <p class="text-muted"> Donec pulvinar nisi ac convallis porta.</p> </td> <td> <h6 class="mb-0">Basics Tasks & Milestones in <span class="text-bold-600">EZONE Project</span> on <em>30 Oct, 2017</em> </h6> </td> <td> <span class="badge badge-default badge-info">Low</span> </td> <td> <div class="progress progress-sm"> <div aria-valuemin="30" aria-valuemax="100" class="progress-bar bg-gradient-x-info" role="progressbar" style="width:30%" aria-valuenow="30"></div> </div> </td> <td class="text-center"> <span class="avatar avatar-off"> <img src="../../../app-assets/images/portrait/small/avatar-s-7.png" alt="avatar" data-placement="right" title="Jason Robertson"><i></i> </span> </td> <td> <span class="dropdown"> <button id="btnSearchDrop5" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-info dropdown-toggle"><i class="la la-cog"></i></button> <span aria-labelledby="btnSearchDrop5" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-eye"></i> Open Task</a> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit Task</a> <a href="#" class="dropdown-item"><i class="ft-check"></i> Complete Task</a> <a href="#" class="dropdown-item"><i class="ft-upload"></i> Assign to</a> <div class="dropdown-divider"></div> <a href="#" class="dropdown-item"><i class="ft-trash"></i> Delete Task</a> </span> </span> </td> </tr> <!-- EZONE Project --> </tbody> <tfoot> <tr> <th> <input type="checkbox" class="input-chk"> </th> <th>Task</th> <th>Dates</th> <th>Priority</th> <th>Progress</th> <th>Owner</th> <th>Actions</th> </tr> </tfoot> </table> </div> <!--/ Task List table --> </div> </div> </div> </div> </section> </div> <section id="advance-examples"> <div class="row"> <div class="col-12"> <div class="card"> <div class="card-header"> <h4 class="card-title">Events Listing</h4> <a class="heading-elements-toggle"><i class="la la-ellipsis-v font-medium-3"></i></a> <div class="heading-elements"> <ul class="list-inline mb-0"> <li><a data-action="collapse"><i class="ft-minus"></i></a></li> <li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li> <li><a data-action="close"><i class="ft-x"></i></a></li> </ul> </div> </div> <div class="card-content collapse show"> <div class="card-body"> <p class="card-text"> <div class="row"> <div class="col-md-3"> <div id='external-events'> <h4>Events Listing</h4> <div class="fc-events-container"> <div class='fc-event' data-color='#2D95BF'>All Day Event</div> <div class='fc-event' data-color='#48CFAE'>Long Event</div> <div class='fc-event' data-color='#50C1E9'>Meeting</div> <div class='fc-event' data-color='#FB6E52'>Birthday party</div> <div class='fc-event' data-color='#ED5564'>Lunch</div> <div class='fc-event' data-color='#F8B195'>Conference Meeting</div> <div class='fc-event' data-color='#6C5B7B'>Party</div> <div class='fc-event' data-color='#355C7D'>Happy Hour</div> <div class='fc-event' data-color='#547A8B'>Dance party</div> <div class='fc-event' data-color='#3EACAB'>Dinner</div> <p> <input type='checkbox' id='drop-remove' /> <label for='drop-remove'>remove after drop</label> </p> </div> </div> </div> <div class="col-md-9"> <div id='fc-external-drag'> </div> </div> </div> </div> </div> </div> </div> </div> <!-- <div class="row"> <div class="col-12"> <div class="card"> <div class="card-header"> <h4 class="card-title">Selectable</h4> <a class="heading-elements-toggle"><i class="la la-ellipsis-v font-medium-3"></i></a> <div class="heading-elements"> <ul class="list-inline mb-0"> <li><a data-action="collapse"><i class="ft-minus"></i></a></li> <li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li> <li><a data-action="close"><i class="ft-x"></i></a></li> </ul> </div> </div> <div class="card-content collapse show"> <div class="card-body"> <p class="card-text">Allows a user to highlight multiple days or timeslots by clicking and dragging. To let the user make selections by clicking and dragging, <code>selectable</code> option must be set to <code>true</code>. The <code>select</code> and <code>unselect</code> callbacks will be useful for monitoring when selections are made and cleared.</p> <div id='fc-selectable'></div> </div> </div> </div> </div> </div> --> </section> </div> </div> </div> <!-- ////////////////////////////////////////////////////////////////////////////--> <!---////////////////////////////////////////--> <!-----Modal for creating Organ--> <div class="modal fade text-left" id="addOrgStructure" tabindex="-1" role="dialog" aria-labelledby="myModalLabel16" style="display: none;" aria-hidden="true"> <div class="modal-dialog modal-xl" role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title" id="myModalLabel16">Add Organization Structure</h4> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <h5> <div class="alert alert-warning mb-2" role="alert"> <strong>Warning!</strong> Please, be careful with this form, it cannot be edited after submission </div> </h5> <div class="row col-12"> <div class="card col-lg-6 col-6 col-md-6"> <fieldset> <hr> <div class="mb-1 pt-2 text-left"> <h4 class="col-sm-10 offset-1">Structure Name:</h4> <div class="form-group"> <input type="text" id="new_structure" for="name" class="col-sm-10 offset-1 form-control dropped " id="maxlength-featured" placeholder="Enter New Structure Name" maxlength="60" /> </div> </div> </fieldset> <fieldset> <div class="mb-1 pt-2 text-left"> <div class="form-group"> <button class="col-sm-5 offset-3 form-control btn btn-primary" onclick="addNewStructure()"> Save </button> </div> </div> </fieldset> <!-- <input class="" id="new_structure" name="new_structure" for="name" class="col-sm-10 offset-1 form-control "/> --> </div> <div class="card col-12 col-md-6"> <div class="alert alert-info" role="alert"> Organization Hierarchy </div> <div class="tools" id="tools"> <form action="/structure/save_organization_structure" method="POST"> <div class="col-lg-12"> <div class="mb-1"> <!-- <h5 class="mb-0">Basic List Group</h5> --> <small class="text-muted">Carefully arrange Structure in their Hierarchical order, remove the structures that are not applicable to you organization.</small> </div> <div class="card" id="Structure_list"> <ul class="list-group row" id="basic-list-group"> <!-- <li class="list-group-item col-12"> Dapibus ac facilisis in <span class="offset-6"> <span aria-hidden="true" class="btn btn-danger">×</span><input type="hidden" name="Structures[]" value="1"> <i class="icon-cursor-move btn btn-success font-medium-1"></i> </span> </li> --> </ul> </div> </div> </div> </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn grey btn-secondary" data-dismiss="modal">Close</button> <input type="submit" class="btn btn-primary" value="Save Structure" /> </div> </div> </form> </div> </div> <% include ../partials/footer %> <script> dragula([document.getElementById('basic-list-group')]) </script> <script> let counter = 0; //hold d last id let name_list = []; function getStructure() { jQuery.ajax({ type: "POST", // Post / Get method url: "/structure/get", //Where form data is sent on submission dataType: "text", // Data type, HTML, json etc. data: { "_token": "{{ csrf_token() }}" }, //Form variables success: function (response) { var data = JSON.parse(response); // console.log((data)) $("#basic-list-group").html(''); data.forEach(structure => { // console.log(structure); $("#basic-list-group").append( `<li class="list-group-item col-12"> ${structure.name} <span class=" pull-right"> <span aria-hidden="true" class="btn btn-danger" onclick="removeStructure(this)">×</span> <input type="hidden" class="structures" name="structure_ids" value="${structure.id}"> <input type="hidden" class="" name="structure_names" value="${structure.name}"> <i class="icon-cursor-move btn btn-success font-medium-1"></i> </span> </li>` ) counter = structure.id; }); }, error: function (xhr, ajaxOptions, thrownError) { //$("#loading").hide(); // Swal.fire("Error!", "An error occurred!", "error"); } }); } // function showList(){ // var list = $(".structures"); // for (let i = 0; i < list.length; i++) { // const element = list[i]; // console.log(element) // } // console.log(counter); // } //add new structur to list function addNewStructure() { let name = $("#new_structure").val(); if (name == "") return alert("Structure name cannot be empty"); if ($.inArray(name, name_list) !== -1) return alert("You've already added '" + name + "'"); $("#basic-list-group").append( `<li class="list-group-item col-12"> ${name} <span class="pull-right"> <span aria-hidden="true" class="btn btn-danger" onclick="removeStructure(this)">×</span> <input type="hidden" class="structures" name="structure_ids" value="${++counter}"> <input type="hidden" class="" name="structure_names" value="${name}"> <i class="icon-cursor-move btn btn-success font-medium-1"></i> </span> </li>` ) $("#new_structure").val(''); name_list.push(name); } function removeStructure(element) { $(element).parent().parent().remove(); } </script> <script src="/app-assets/vendors/js/extensions/fullcalendar.min.js" type="text/javascript"></script> <script src="/app-assets/js/scripts/extensions/fullcalendar.js" type="text/javascript"></script> <script src="/app-assets/js/scripts/pages/project-task-list.js" type="text/javascript"></script>