%PDF- %PDF-
Direktori : /home/opti/workflow/src/views/hr/job/ |
Current File : /home/opti/workflow/src/views/hr/job/title.ejs |
<% include ../../partials/header %> <!-- ////////////////////////////////////////////////////////////////////////////--> <% include ../../partials/sidebar %> <!-- <link rel="stylesheet" type="text/css" href="/app-assets/ekko-lightbox/dist/ekko-lightbox.css"> --> <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/forms/icheck/icheck.css"> <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/forms/icheck/custom.css"> <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/checkboxes-radios.css"> <style> .modal-header .close { padding: 1rem; margin: -1rem -1rem -1rem; } .modal-header { background-color:#2196F3; } /* .dataTables_filter, .dataTables_info { display: none; } */ </style> <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-left col-md-6 col-12 mb-2"> <h3 class="content-header-title">Jobs</h3> <div class="row breadcrumbs-top"> <div class="breadcrumb-wrapper col-12"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="/">Dashboard</a> </li> <li class="breadcrumb-item"><a href="/hr">Human Resources</a> </li> <li class="breadcrumb-item active">Jobs </li> </ol> </div> </div> </div> <!-- Breadcrumb ends--> <!-- <div class="text-center"> <a class="quick-btn text-red" href="/accounts/payments/create" > <i class="la la-plus fa-2x"></i> <span>New Payment</span> </a> </div> --> <%- format_messages(messages) %> <section class="row"> <div class=" col-lg-12 col-md-6 col-sm-12" > <div class="card " > <div class="card-header" > <h4 class="card-title">Job Categories</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><button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#addCategory"><i class="ft-plus white"></i> Add Job Category</button></li> <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="expand"><i class="ft-maximize"></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 card-dashboard "> <div class="table-responsive"> <table class="table" > <thead> <!-- <th>S/N</th> --> <th>Job Category</th> <th>Category Description</th> <th></th> </thead> <tbody id="categories"> <% categories.forEach((category, index) => { %> <tr id="category<%= category.id %>"> <!-- <td><%= index+1 %></td> --> <td><%= category.title %></td> <td><%= category.description %> </td> <td> <a class="btn " href="/hr/jobs/view/<%= category.uuid %>" ><i class="la la-eye" ></i> </a> <a class="btn " href="/hr/jobs/add-category" data-toggle="modal" onclick="editCategory('<%= JSON.stringify(category) %>')" value="" data-target="#addCategory"><i class="la la-pencil" ></i> </a> </td> </tr> <% }) %> </tbody> </table> </div> </div> </div> </div> </div> </section> </div> </div> </div> <!-- ////////////////////////////////////////////////////////////////////////////--> <input type="hidden" id="_csrf" name="_csrf" value="<%= _csrfToken %>"> <!-- /////////// --> <div class="modal fade text-left" id="addCategory" tabindex="-1" role="dialog" aria-labelledby="addCategory" aria-hidden="true"> <form action="/hr/jobs/add-category" method="POST" id="addCategoryForm"> <input type="hidden" id="category_id" name="id"> <input type="hidden" name="_csrf" value="<%= _csrfToken %>"> <div class="modal-dialog modal-sm" role="document"> <div class="modal-content"> <div class="modal-header bg-blue"> <h3 class="modal-title" ><span id="_categoryModalLabel">Add Job Category</span> </h3> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <div class="form-group"> <label for="fromContact" id="">Category Title :</label> <input type="text" class="form-control" id="categoryTitle" name="title" required value=""> </div> <div class="form-group"> <label for="fromContact" id="">Category Description :</label> <textarea type="text" class="form-control" id="categoryDescription" name="description" ></textarea> </div> </div> <div class="modal-footer"> <button type="button" class="btn grey btn-outline-secondary d" data-dismiss="modal" >Close</button> <button type="submit" class="btn btn-info " ><i class="la la-check" ></i> Save </button> </div> </div> </div> </form> </div> <% include ../../partials/footer %> <!-- <script src="/app-assets/ekko-lightbox/dist/ekko-lightbox.js"></script> --> <script> // // Ekko lightbox Initialization // $(document).on('click', '[data-toggle="lightbox"]', function(event) { // event.preventDefault(); // $(this).ekkoLightbox(); // }); // let category_count = parseInt("<%= categories.length %>"); // let title_count = parseInt("<%= titles.length %>"); $("#addCategoryForm").on('submit',(event)=>{ $('#spinnerContainer').addClass('show'); event.preventDefault(); var data = getFormData($('#addCategoryForm')) $.ajax({ type: "POST", // Post / Get method url: "/hr/jobs/add-category", //Where form data is sent on submission dataType: "text", // Data type, HTML, json etc. data: data, //Form variables success: function (response) { $('#spinnerContainer').removeClass('show'); response = JSON.parse(response); // console.log(data) if(response.status == "success"){ category = response.category; // console.log(category) var tr = `<td>${category.title}</td> <td> ${category.description} </td> <td><a class="btn dropdown-item" href="/hr/jobs/add-category" data-toggle="modal" onclick="editCategory('${JSON.stringify(JSON.stringify(category))}')" value="" data-target="#addCategory"><i class="la la-pencil" ></i> </a></td>` if(data.id){ $(`#category${data.id}`).html(tr); } else{ $('#categories').append("<tr>"+tr+"</tr>"); } toastr.success(response.msg, '', {"showMethod": "slideDown", "hideMethod": "slideUp", timeOut: 3000}); $('#category_id').val('') $('#categoryTitle').val('') $('#categoryDescription').val('') $('#_categoryModalLabel').html("Add Job Category") } else{ toastr.error(response.msg, '', {"showMethod": "slideDown", "hideMethod": "slideUp", timeOut: 3000}); } $(".d").trigger('click'); }, error:function (error){ $('#spinnerContainer').removeClass('show'); alert(error.message) } }) }) function editCategory(category){ category = JSON.parse(category); $('#_categoryModalLabel').html("Edit Job Category") $('#category_id').val(category.id) $('#categoryTitle').val(category.title) $('#categoryDescription').val(category.description) } function getFormData(form) { var rawJson = form.serializeArray(); var model = {}; $.map(rawJson, function (n, i) { model[n['name']] = n['value']; }); return model; } </script>