5 changed files with 815 additions and 10 deletions
-
51gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/nulm/controller/NulmAPIController.java
-
44gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/nulm/controller/NulmController.java
-
152gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/nulm/service/NulmService.java
-
558gcc_officer_portal/src/main/resources/templates/modules/nulm/addstaff.html
-
20gcc_officer_portal/src/main/resources/templates/modules/nulm/staffupdate.html
@ -0,0 +1,558 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang="en" dir=""> |
||||
|
<html xmlns:th="http://www.thymeleaf.org"> |
||||
|
|
||||
|
<head th:replace="~{fragments/modules/base/head :: head}"></head> |
||||
|
|
||||
|
<body> |
||||
|
<div class="wrapper"> |
||||
|
<header th:replace="~{fragments/modules/base/header :: header}"></header> |
||||
|
|
||||
|
<div class="page-wrap"> |
||||
|
<div th:replace="~{fragments/modules/base/menu :: menu}"></div> |
||||
|
<div class="main-content"> |
||||
|
<div class="container-fluid"> |
||||
|
<div class="page-header"> |
||||
|
<div class="row align-items-end"> |
||||
|
<div class="col-lg-6"> |
||||
|
<div class="page-header-title"> |
||||
|
<i class="ik ik-thumbs-up bg-blue"></i> |
||||
|
<div class="d-inline"> |
||||
|
<h5>NULM STAFF</h5> |
||||
|
<span>Add Staff</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-lg-6"> |
||||
|
<nav class="breadcrumb-container" aria-label="breadcrumb"> |
||||
|
<ol class="breadcrumb"> |
||||
|
<li class="breadcrumb-item"> |
||||
|
<a href="/index"><i class="ik ik-home"></i></a> |
||||
|
</li> |
||||
|
<li class="breadcrumb-item active" aria-current="page">Add Staff</li> |
||||
|
</ol> |
||||
|
</nav> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<hr> |
||||
|
|
||||
|
<div class="card"> |
||||
|
<div class="card-header"> |
||||
|
<h6><b>Create Employee</b></h6> |
||||
|
</div> |
||||
|
<div class="card-body"> |
||||
|
|
||||
|
<div class="row"> |
||||
|
<div class="col-md-6"> <label>Employee Name</label> <input type="text" id="empName" |
||||
|
class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^a-zA-Z\s]/g,'').toUpperCase()"> </div> |
||||
|
<div class="col-md-6"> <label>Father / Husband Name</label> |
||||
|
<input type="text" id="fhName" class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^a-zA-Z\s]/g,'').toUpperCase()"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> |
||||
|
<label>Designation</label> <select id="designationId" class="form-control"> |
||||
|
<option value="">Select</option> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> |
||||
|
<label>Zone</label> <select id="zoneId" class="form-control"> |
||||
|
<option value="">Slect</option> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> |
||||
|
<label>Park Name</label> |
||||
|
<select id="parkId" class="form-control"> |
||||
|
<option value="">Select</option> |
||||
|
</select> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> |
||||
|
<label>Incharge Name</label> |
||||
|
<input type="text" id="inchargeName" class="form-control" readonly> |
||||
|
<input type="hidden" id="inchargeId"> |
||||
|
<input type="hidden" id="zone"> |
||||
|
<input type="hidden" id="inchargeDesignation"> |
||||
|
<input type="hidden" id="inchargePhone"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Group Name</label> |
||||
|
<input type="text" id="groupName" disabled class="form-control"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Aadhar Number</label> |
||||
|
<input type="text" id="aadharNo" maxlength="12" class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^0-9]/g,'')"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Mobile Number</label> |
||||
|
<input type="text" id="mobileNo" class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^0-9]/g,'').slice(0,10)"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Bank Account Number</label> |
||||
|
<input type="text" id="bankAccNo" class="form-control" minlength="9" maxlength="18" |
||||
|
oninput="this.value=this.value.replace(/[^0-9]/g,'')"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Bank Name</label> |
||||
|
<input type="text" id="bankName" class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^a-zA-Z\s]/g,'').toUpperCase()"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>IFSC Code</label> |
||||
|
<input type="text" id="ifscCode" class="form-control" maxlength="11" |
||||
|
oninput="this.value=this.value.toUpperCase()"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Branch</label> |
||||
|
<input type="text" id="branch" class="form-control" |
||||
|
oninput="this.value=this.value.replace(/[^a-zA-Z\s]/g,'').toUpperCase()"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Branch Address</label> |
||||
|
<input type="text" id="branchAddress" class="form-control"> |
||||
|
</div> |
||||
|
<div class="col-md-12 mt-3"> <label>Residential Address</label> <textarea id="address" |
||||
|
class="form-control"></textarea> </div> |
||||
|
<div class="col-md-6 mt-3"> <label>Upload Form</label> |
||||
|
<input type="file" id="formFile" class="form-control" accept=".jpg,.jpeg"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Upload Aadhar Card</label> |
||||
|
<input type="file" id="aadharFile" class="form-control" accept=".jpg,.jpeg"> |
||||
|
</div> |
||||
|
<div class="col-md-6 mt-3"> <label>Upload Bank Passbook</label> |
||||
|
<input type="file" id="bankPassbookFile" class="form-control" accept=".jpg,.jpeg"> |
||||
|
</div> |
||||
|
</div> |
||||
|
<hr> |
||||
|
<div class="text-center mt-3"> <button class="btn btn-primary" |
||||
|
onclick="saveEmployee()">Submit</button> <button class="btn btn-secondary" |
||||
|
onclick="resetForm()">Reset</button> </div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<footer th:replace="~{fragments/modules/base/footer :: footer}"></footer> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div th:replace="~{fragments/modules/base/script :: script}"></div> |
||||
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> |
||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> |
||||
|
<!-- DataTables --> |
||||
|
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.8/css/dataTables.bootstrap5.min.css"> |
||||
|
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.2/css/buttons.bootstrap5.min.css"> |
||||
|
|
||||
|
<script src="https://cdn.datatables.net/1.13.8/js/jquery.dataTables.min.js"></script> |
||||
|
<script src="https://cdn.datatables.net/1.13.8/js/dataTables.bootstrap5.min.js"></script> |
||||
|
<script src="https://cdn.datatables.net/responsive/2.5.0/js/dataTables.responsive.min.js"></script> |
||||
|
|
||||
|
<!-- DataTable Buttons --> |
||||
|
<script src="https://cdn.datatables.net/buttons/2.4.2/js/dataTables.buttons.min.js"></script> |
||||
|
<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.bootstrap5.min.js"></script> |
||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script> |
||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script> |
||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script> |
||||
|
<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.html5.min.js"></script> |
||||
|
|
||||
|
|
||||
|
<script th:inline="javascript"> |
||||
|
$(document).ready(function () { |
||||
|
|
||||
|
$.ajax({ |
||||
|
url: "/gcc/api/nulm/designations", |
||||
|
type: "GET", |
||||
|
|
||||
|
success: function (data) { |
||||
|
|
||||
|
let options = '<option value="">Select Designation</option>'; |
||||
|
|
||||
|
data.forEach(function (item) { |
||||
|
|
||||
|
options += `<option value="${item.designation_id}"> |
||||
|
${item.designation} |
||||
|
</option>`; |
||||
|
}); |
||||
|
|
||||
|
$("#designationId").html(options); |
||||
|
} |
||||
|
|
||||
|
}); |
||||
|
/*$.ajax({ |
||||
|
url: "/gcc/api/nulm/parks", |
||||
|
type: "GET", |
||||
|
|
||||
|
success: function (data) { |
||||
|
|
||||
|
let options = '<option value="">Select</option>'; |
||||
|
|
||||
|
data.forEach(function (p) { |
||||
|
|
||||
|
options += `<option |
||||
|
value="${p.park_id}" |
||||
|
data-supervisor="${p.supervisor_name}" |
||||
|
data-supervisorid="${p.supervisor_id}" |
||||
|
data-zone="${p.zone}" |
||||
|
data-designation="${p.supervisor_designation}" |
||||
|
data-mobile="${p.supervisor_mobile}"> |
||||
|
${p.park_name} |
||||
|
</option>`; |
||||
|
}); |
||||
|
|
||||
|
$("#parkId").html(options); |
||||
|
} |
||||
|
});*/ |
||||
|
$("#zoneId").change(function () { |
||||
|
|
||||
|
let zone = $(this).val(); |
||||
|
|
||||
|
$("#parkId").html('<option value="">Select</option>'); |
||||
|
$("#inchargeName").val(""); |
||||
|
|
||||
|
if (!zone) return; |
||||
|
|
||||
|
$.ajax({ |
||||
|
url: "/gcc/api/nulm/parks", |
||||
|
type: "GET", |
||||
|
data: { zone: zone }, |
||||
|
|
||||
|
success: function (data) { |
||||
|
|
||||
|
let options = '<option value="">Select</option>'; |
||||
|
|
||||
|
data.forEach(function (p) { |
||||
|
|
||||
|
options += `<option |
||||
|
value="${p.park_id}" |
||||
|
data-supervisor="${p.supervisor_name}" |
||||
|
data-supervisorid="${p.supervisor_id}" |
||||
|
data-zone="${p.zone}" |
||||
|
data-designation="${p.supervisor_designation}" |
||||
|
data-mobile="${p.supervisor_mobile}"> |
||||
|
${p.park_name} |
||||
|
</option>`; |
||||
|
}); |
||||
|
|
||||
|
$("#parkId").html(options); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
$("#parkId").change(function () { |
||||
|
|
||||
|
let selected = $(this).find(":selected"); |
||||
|
|
||||
|
let supervisorName = selected.data("supervisor"); |
||||
|
let supervisorId = selected.data("supervisorid"); |
||||
|
let zone = selected.data("zone"); |
||||
|
if (supervisorName) { |
||||
|
supervisorName = supervisorName.toUpperCase(); |
||||
|
} |
||||
|
let supervisorDesignation = selected.data("designation"); |
||||
|
let supervisorMobile = selected.data("mobile"); |
||||
|
if (supervisorDesignation) { |
||||
|
supervisorDesignation = supervisorDesignation.toUpperCase(); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
$("#inchargeName").val(supervisorName || ""); |
||||
|
$("#inchargeId").val(supervisorId || ""); |
||||
|
$("#zone").val(zone || ""); |
||||
|
|
||||
|
$("#inchargeDesignation").val(supervisorDesignation); |
||||
|
$("#inchargePhone").val(supervisorMobile); |
||||
|
|
||||
|
|
||||
|
|
||||
|
}); |
||||
|
$.ajax({ |
||||
|
url: "/gcc/api/nulm/zones", |
||||
|
type: "GET", |
||||
|
success: function (data) { |
||||
|
|
||||
|
let options = '<option value="">Select Zone</option>'; |
||||
|
|
||||
|
data.forEach(function (z) { |
||||
|
options += `<option value="${z}"> ${z}</option>`; |
||||
|
}); |
||||
|
|
||||
|
$("#zoneId").html(options); |
||||
|
} |
||||
|
}); |
||||
|
function resetForm() { |
||||
|
|
||||
|
// Text fields |
||||
|
$("#empName").val(""); |
||||
|
$("#fhName").val(""); |
||||
|
$("#inchargeName").val(""); |
||||
|
$("#groupName").val(""); |
||||
|
$("#aadharNo").val(""); |
||||
|
$("#mobileNo").val(""); |
||||
|
$("#bankAccNo").val(""); |
||||
|
$("#bankName").val(""); |
||||
|
$("#ifscCode").val(""); |
||||
|
$("#branch").val(""); |
||||
|
$("#branchAddress").val(""); |
||||
|
$("#address").val(""); |
||||
|
|
||||
|
// Dropdowns |
||||
|
$("#designationId").val(""); |
||||
|
$("#parkId").val(""); |
||||
|
|
||||
|
// Hidden fields |
||||
|
$("#inchargeId").val(""); |
||||
|
$("#zone").val(""); |
||||
|
$("#inchargeDesignation").val(""); |
||||
|
$("#inchargePhone").val(""); |
||||
|
|
||||
|
// File inputs |
||||
|
$("#formFile").val(""); |
||||
|
$("#aadharFile").val(""); |
||||
|
$("#bankPassbookFile").val(""); |
||||
|
|
||||
|
} |
||||
|
function saveEmployee() { |
||||
|
|
||||
|
let empName = $("#empName").val().trim(); |
||||
|
let fhName = $("#fhName").val().trim(); |
||||
|
let parkId = $("#parkId").val(); |
||||
|
let parkName = $("#parkId option:selected").text().trim(); |
||||
|
let designationId = $("#designationId").val(); |
||||
|
let designationText = $("#designationId option:selected").text().trim(); |
||||
|
let inchargeId = $("#inchargeId").val(); |
||||
|
let inchargeName = $("#inchargeName").val(); |
||||
|
let zone = $("#parkId option:selected").data("zone"); |
||||
|
let inchargeDesignation = $("#inchargeDesignation").val(); |
||||
|
let inchargePhone = $("#inchargePhone").val(); |
||||
|
|
||||
|
//let groupName = $("#groupName").val().trim(); |
||||
|
let aadhar = $("#aadharNo").val().trim(); |
||||
|
let phone = $("#mobileNo").val().trim(); |
||||
|
let bankAcc = $("#bankAccNo").val().trim(); |
||||
|
let bankName = $("#bankName").val().trim(); |
||||
|
let ifscCode = $("#ifscCode").val().trim(); |
||||
|
let branch = $("#branch").val().trim(); |
||||
|
let branchAddress = $("#branchAddress").val().trim(); |
||||
|
let address = $("#address").val().trim(); |
||||
|
//let createdBy = /*[[${LoginUserId}]]*/''; |
||||
|
|
||||
|
let phonePattern = /^[6-9]\d{9}$/; |
||||
|
let aadharPattern = /^\d{12}$/; |
||||
|
let bankPattern = /^[0-9]{9,18}$/; |
||||
|
let ifscPattern = /^[A-Z]{4}0[A-Z0-9]{6}$/; |
||||
|
|
||||
|
function showWarning(msg) { |
||||
|
Swal.fire({ |
||||
|
icon: 'warning', |
||||
|
title: 'Warning', |
||||
|
text: msg |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
/* ========================= |
||||
|
VALIDATION |
||||
|
========================= */ |
||||
|
|
||||
|
if (!empName) { |
||||
|
showWarning("Please enter employee name"); |
||||
|
$("#empName").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!fhName) { |
||||
|
showWarning("Please enter father / husband name"); |
||||
|
$("#fhName").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!parkId) { |
||||
|
showWarning("Please select park"); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!designationId) { |
||||
|
showWarning("Please select designation"); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
/*if (!groupName) { |
||||
|
showWarning("Please enter group name"); |
||||
|
$("#groupName").focus(); |
||||
|
return; |
||||
|
}*/ |
||||
|
|
||||
|
if (!aadhar) { |
||||
|
showWarning("Please enter aadhar number"); |
||||
|
$("#aadharNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!aadharPattern.test(aadhar)) { |
||||
|
showWarning("Aadhar must be 12 digits"); |
||||
|
$("#aadharNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!phone) { |
||||
|
showWarning("Please enter mobile number"); |
||||
|
$("#mobileNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!phonePattern.test(phone)) { |
||||
|
showWarning("Invalid mobile number"); |
||||
|
$("#mobileNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!bankAcc) { |
||||
|
showWarning("Please enter bank account number"); |
||||
|
$("#bankAccNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!bankPattern.test(bankAcc)) { |
||||
|
showWarning("Bank account must be 9-18 digits"); |
||||
|
$("#bankAccNo").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!bankName) { |
||||
|
showWarning("Please enter bank name"); |
||||
|
$("#bankName").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!ifscCode) { |
||||
|
showWarning("Please enter IFSC code"); |
||||
|
$("#ifscCode").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!ifscPattern.test(ifscCode)) { |
||||
|
showWarning("Invalid IFSC code (Example: SBIN0001234)"); |
||||
|
$("#ifscCode").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!branch) { |
||||
|
showWarning("Please enter branch"); |
||||
|
$("#branch").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!branchAddress) { |
||||
|
showWarning("Please enter branch address"); |
||||
|
$("#branchAddress").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if (!address) { |
||||
|
showWarning("Please enter address"); |
||||
|
$("#address").focus(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
/* ========================= |
||||
|
FILE VALIDATION |
||||
|
========================= */ |
||||
|
|
||||
|
let formFile = $("#formFile")[0].files[0]; |
||||
|
let aadharFile = $("#aadharFile")[0].files[0]; |
||||
|
let bankFile = $("#bankPassbookFile")[0].files[0]; |
||||
|
|
||||
|
function validateFile(file) { |
||||
|
|
||||
|
if (!file) return true; |
||||
|
|
||||
|
let allowed = ["image/jpeg", "image/jpg"]; |
||||
|
|
||||
|
if (!allowed.includes(file.type)) { |
||||
|
Swal.fire({ |
||||
|
icon: 'warning', |
||||
|
title: 'Invalid File', |
||||
|
text: 'Only JPG/JPEG allowed' |
||||
|
}); |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
return true; |
||||
|
} |
||||
|
|
||||
|
if (!validateFile(formFile)) return; |
||||
|
if (!validateFile(aadharFile)) return; |
||||
|
if (!validateFile(bankFile)) return; |
||||
|
|
||||
|
/* ========================= |
||||
|
FORM DATA |
||||
|
========================= */ |
||||
|
|
||||
|
let formData = new FormData(); |
||||
|
|
||||
|
formData.append("name", empName); |
||||
|
formData.append("fhName", fhName); |
||||
|
formData.append("designation", designationText); |
||||
|
formData.append("designationId", designationId); |
||||
|
formData.append("aadharNo", aadhar); |
||||
|
formData.append("bankAccNo", bankAcc); |
||||
|
formData.append("phoneNumber", phone); |
||||
|
formData.append("address", address); |
||||
|
|
||||
|
formData.append("bankName", bankName); |
||||
|
formData.append("ifscCode", ifscCode); |
||||
|
formData.append("branch", branch); |
||||
|
formData.append("branchAddress", branchAddress); |
||||
|
|
||||
|
formData.append("parkId", parkId); |
||||
|
formData.append("parkName", parkName); |
||||
|
formData.append("inchargeId", inchargeId); |
||||
|
formData.append("inchargeName", inchargeName); |
||||
|
formData.append("zone", zone); |
||||
|
formData.append("inchargeDesignation", inchargeDesignation); |
||||
|
formData.append("inchargePhone", inchargePhone); |
||||
|
// formData.append("createdBy", createdBy); |
||||
|
|
||||
|
if (formFile) formData.append("uploadform", formFile); |
||||
|
if (aadharFile) formData.append("aadharcard", aadharFile); |
||||
|
if (bankFile) formData.append("bankpassbook", bankFile); |
||||
|
|
||||
|
/* ========================= |
||||
|
AJAX SAVE |
||||
|
========================= */ |
||||
|
|
||||
|
$.ajax({ |
||||
|
|
||||
|
url: "/gcc/api/nulm/create-employee", |
||||
|
type: "POST", |
||||
|
data: formData, |
||||
|
processData: false, |
||||
|
contentType: false, |
||||
|
|
||||
|
success: function (res) { |
||||
|
|
||||
|
Swal.fire({ |
||||
|
icon: 'success', |
||||
|
title: 'Employee Added', |
||||
|
text: 'Employee ID ' + res.employeeId + ' added successfully' |
||||
|
}).then(() => { |
||||
|
location.reload(); |
||||
|
}); |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
error: function () { |
||||
|
Swal.fire({ |
||||
|
icon: 'error', |
||||
|
title: 'Error', |
||||
|
text: 'Failed to create employee' |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
</script> |
||||
|
</body> |
||||
|
|
||||
|
</html> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue