Browse Source

added master enable concept on child survey

main
AJITHKUMAR12 5 months ago
parent
commit
e1dfa1c52f
  1. 324
      gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Controller/ChildrenSurveyController.java
  2. 71
      gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Controller/MainController.java
  3. 1036
      gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Service/ChildrenSurveyService.java
  4. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/castemaster.html
  5. 129
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/childlist.html
  6. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/documentcorrectionmaster.html
  7. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/documentreasonmaster.html
  8. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/dropoutreasonmaster.html
  9. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/educationmaster.html
  10. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/gendermaster.html
  11. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/incomemaster.html
  12. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/interestfieldmaster.html
  13. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/livingmaster.html
  14. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/locationmaster.html
  15. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/ownermaster.html
  16. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/religionmaster.html
  17. 15
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/surveyorsreports.html
  18. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/vulnerabilitymaster.html
  19. 531
      gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/whereaboutmaster.html

324
gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Controller/ChildrenSurveyController.java

@ -6,6 +6,8 @@ import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller; import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.bind.annotation.ResponseBody;
@ -86,4 +88,326 @@ public class ChildrenSurveyController {
return service.getDashboardData(); return service.getDashboardData();
} }
@GetMapping("/educationmasterlist")
public List<Map<String, Object>> list() {
return service.getEducationList();
}
@PostMapping("/save")
public String save(
@RequestBody Map<String, Object> req) {
service.saveEducation(req);
return "SUCCESS";
}
@PostMapping("/status")
public String updateStatus(
@RequestBody Map<String, Object> req) {
service.updateStatus(req);
return "SUCCESS";
}
@GetMapping("/locationmasterlist")
public List<Map<String, Object>> getLocationList() {
return service.getLocationList();
}
@PostMapping("/locationsave")
public String saveLocation(
@RequestBody Map<String, Object> req) {
service.saveLocation(req);
return "SUCCESS";
}
@PostMapping("/location-status")
public String updateLocationStatus(
@RequestBody Map<String, Object> req) {
service.updateLocationStatus(req);
return "SUCCESS";
}
@GetMapping("/gendermasterlist")
public List<Map<String, Object>> getGenderList() {
return service.getGenderList();
}
@PostMapping("/gendersave")
public String saveGender(
@RequestBody Map<String, Object> req) {
service.saveGender(req);
return "SUCCESS";
}
@PostMapping("/gender-status")
public String updateGenderStatus(
@RequestBody Map<String, Object> req) {
service.updateGenderStatus(req);
return "SUCCESS";
}
@GetMapping("/castemasterlist")
public List<Map<String, Object>> getCasteList() {
return service.getCasteList();
}
@PostMapping("/savecaste")
public String saveCaste(
@RequestBody Map<String, Object> req) {
service.saveCaste(req);
return "SUCCESS";
}
@PostMapping("/caste-status")
public String updateCasteStatus(
@RequestBody Map<String, Object> req) {
service.updateCasteStatus(req);
return "SUCCESS";
}
@GetMapping("/livingmasterlist")
public List<Map<String, Object>> getLivingList() {
return service.getLivingList();
}
@PostMapping("/livingsave")
public String saveLiving(
@RequestBody Map<String, Object> req) {
service.saveLiving(req);
return "SUCCESS";
}
@PostMapping("/living-status")
public String updateLivingStatus(
@RequestBody Map<String, Object> req) {
service.updateLivingStatus(req);
return "SUCCESS";
}
@GetMapping("/documentcreationmasterlist")
public List<Map<String, Object>> getDocumentCreationList() {
return service.getDocumentCreationList();
}
@PostMapping("/documentcreationsave")
public String saveDocumentCreation(
@RequestBody Map<String, Object> req) {
service.saveDocumentCreation(req);
return "SUCCESS";
}
@PostMapping("/documentcreationstatus")
public String updateDocumentCreationStatus(
@RequestBody Map<String, Object> req) {
service.updateDocumentCreationStatus(req);
return "SUCCESS";
}
@GetMapping("/dropoutreasonmasterlist")
public List<Map<String, Object>> getDropoutReasonList() {
return service.getDropoutReasonList();
}
@PostMapping("/dropoutreasonsave")
public String saveDropoutReason(
@RequestBody Map<String, Object> req) {
service.saveDropoutReason(req);
return "SUCCESS";
}
@PostMapping("/dropoutreasonstatus")
public String updateDropoutReasonStatus(
@RequestBody Map<String, Object> req) {
service.updateDropoutReasonStatus(req);
return "SUCCESS";
}
@GetMapping("/incomemasterlist")
public List<Map<String, Object>> getIncomeList() {
return service.getIncomeList();
}
@PostMapping("/incomesave")
public String saveIncome(
@RequestBody Map<String, Object> req) {
service.saveIncome(req);
return "SUCCESS";
}
@PostMapping("/incomemasterstatus")
public String updateIncomeStatus(
@RequestBody Map<String, Object> req) {
service.updateIncomeStatus(req);
return "SUCCESS";
}
@GetMapping("/interestfieldmasterlist")
public List<Map<String, Object>> getInterestFieldList() {
return service.getInterestFieldList();
}
@PostMapping("/interestfieldsave")
public String saveInterestField(
@RequestBody Map<String, Object> req) {
service.saveInterestField(req);
return "SUCCESS";
}
@PostMapping("/interestfieldmaster-status")
public String updateInterestFieldStatus(
@RequestBody Map<String, Object> req) {
service.updateInterestFieldStatus(req);
return "SUCCESS";
}
@GetMapping("/ownermasterlist")
public List<Map<String, Object>> getOwnerList() {
return service.getOwnerList();
}
@PostMapping("/ownermastersave")
public String saveOwner(
@RequestBody Map<String, Object> req) {
service.saveOwner(req);
return "SUCCESS";
}
@PostMapping("/ownermasterstatus")
public String updateOwnerStatus(
@RequestBody Map<String, Object> req) {
service.updateOwnerStatus(req);
return "SUCCESS";
}
@GetMapping("/religionmasterlist")
public List<Map<String, Object>> getReligionList() {
return service.getReligionList();
}
@PostMapping("/religionsave")
public String saveReligion(
@RequestBody Map<String, Object> req) {
service.saveReligion(req);
return "SUCCESS";
}
@PostMapping("/religion-status")
public String updateReligionStatus(
@RequestBody Map<String, Object> req) {
service.updateReligionStatus(req);
return "SUCCESS";
}
@GetMapping("/vulnerabilitymasterlist")
public List<Map<String, Object>> getVulnerabilityList() {
return service.getVulnerabilityList();
}
@PostMapping("/vulnerabilitysave")
public String saveVulnerability(
@RequestBody Map<String, Object> req) {
service.saveVulnerability(req);
return "SUCCESS";
}
@PostMapping("/vulnerabilitymasterstatus")
public String updateVulnerabilityStatus(
@RequestBody Map<String, Object> req) {
service.updateVulnerabilityStatus(req);
return "SUCCESS";
}
@GetMapping("/whereaboutmasterlist")
public List<Map<String, Object>> getWhereaboutList() {
return service.getWhereaboutList();
}
@PostMapping("/whereaboutsave")
public String saveWhereabout(
@RequestBody Map<String, Object> req) {
service.saveWhereabout(req);
return "SUCCESS";
}
@PostMapping("/whereaboutstatus")
public String updateWhereaboutStatus(
@RequestBody Map<String, Object> req) {
service.updateWhereaboutStatus(req);
return "SUCCESS";
}
@GetMapping("/documentreasonmasterlist")
public List<Map<String, Object>> getDocumentReasonList() {
return service.getDocumentReasonList();
}
@PostMapping("/documentreasonmaster")
public String saveDocumentReason(
@RequestBody Map<String, Object> req) {
service.saveDocumentReason(req);
return "SUCCESS";
}
@PostMapping("/documentreasonmasterstatus")
public String updateDocumentReasonStatus(
@RequestBody Map<String, Object> req) {
service.updateDocumentReasonStatus(req);
return "SUCCESS";
}
} }

71
gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Controller/MainController.java

@ -23,4 +23,75 @@ public class MainController {
return "modules/childrensurvey/surveyorsreports"; return "modules/childrensurvey/surveyorsreports";
} }
@GetMapping("/mastersubmenu/educationmaster")
public String educationmaster() {
return "modules/childrensurvey/educationmaster";
}
@GetMapping("/mastersubmenu/locationmaster")
public String locationmaster() {
return "modules/childrensurvey/locationmaster";
}
@GetMapping("/mastersubmenu/gendermaster")
public String gendermaster() {
return "modules/childrensurvey/gendermaster";
}
@GetMapping("/mastersubmenu/castemaster")
public String castemaster() {
return "modules/childrensurvey/castemaster";
}
@GetMapping("/mastersubmenu/livingmaster")
public String livingmaster() {
return "modules/childrensurvey/livingmaster";
}
// documentation
@GetMapping("/mastersubmenu/documentcorrectionmaster")
public String documentcorrectionmaster() {
return "modules/childrensurvey/documentcorrectionmaster";
}
@GetMapping("/mastersubmenu/dropoutreasonmaster")
public String dropoutreasonmaster() {
return "modules/childrensurvey/dropoutreasonmaster";
}
@GetMapping("/mastersubmenu/incomemaster")
public String incomemaster() {
return "modules/childrensurvey/incomemaster";
}
@GetMapping("/mastersubmenu/religionmaster")
public String religionmaster() {
return "modules/childrensurvey/religionmaster";
}
@GetMapping("/mastersubmenu/interestfieldmaster")
public String interestfieldmaster() {
return "modules/childrensurvey/interestfieldmaster";
}
@GetMapping("/mastersubmenu/ownershipmaster")
public String ownermaster() {
return "modules/childrensurvey/ownermaster";
}
@GetMapping("/mastersubmenu/vulnerabilitymaster")
public String vulnerabilitymaster() {
return "modules/childrensurvey/vulnerabilitymaster";
}
@GetMapping("/mastersubmenu/whereaboutmaster")
public String whereaboutmaster() {
return "modules/childrensurvey/whereaboutmaster";
}
@GetMapping("/mastersubmenu/documentreasonmaster")
public String documentreasonmaster() {
return "modules/childrensurvey/documentreasonmaster";
}
} }

1036
gcc_officer_portal/src/main/java/in/gov/chennaicorporation/gccoffice/childrensurvey/Service/ChildrenSurveyService.java
File diff suppressed because it is too large
View File

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/castemaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Caste Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Caste
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th> Caste Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Caste</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label> Caste Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/castemasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/savecaste",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/caste-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

129
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/childlist.html

@ -358,6 +358,16 @@
<!-- Salary Report Table --> <!-- Salary Report Table -->
<div class="card-block mt-3"> <div class="card-block mt-3">
<table id="surveyTable" class="table table-striped table-bordered"> <table id="surveyTable" class="table table-striped table-bordered">
<div class="mb-3">
<button class="btn btn-success" onclick="downloadBulkSurveyExcel()">
<i class="fa fa-file-excel"></i>
Bulk Download Excel
</button>
</div>
<thead class="thead-dark"> <thead class="thead-dark">
<tr> <tr>
<th>Date</th> <th>Date</th>
@ -430,6 +440,7 @@
<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/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.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 src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.html5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
<script th:inline="javascript"> <script th:inline="javascript">
@ -498,6 +509,124 @@
});*/ });*/
async function downloadBulkSurveyExcel() {
try {
Swal.fire({
title: 'Preparing Excel...',
text: 'Please wait',
allowOutsideClick: false,
didOpen: () => {
Swal.showLoading();
}
});
// GET TABLE DATA
let table = $('#surveyTable').DataTable();
let rows = table.rows().data().toArray();
if (rows.length === 0) {
Swal.fire({
icon: 'warning',
title: 'No Data Found'
});
return;
}
let excelData = [];
let slno = 1;
for (const rowNode of rows) {
// GET SURVEY ID FROM TABLE
let surveyId = $(rowNode[1]).text() || rowNode[1];
surveyId = surveyId.toString().trim();
// CALL DETAILS API
let surveyData = await $.ajax({
url: "/gcc/api/children-survey/details",
type: "GET",
data: {
surveyId: surveyId
}
});
// MERGE ALL SECTIONS
let allQuestions = {
...surveyData.personalInformation,
...surveyData.locationDetails,
...surveyData.educationDetails,
...surveyData.healthDetails,
...surveyData.documentDetails,
...surveyData.vulnerabilityDetails
};
// CREATE ROW OBJECT
let rowData = {
"S.No": slno,
"Survey ID": surveyId
};
// ADD ALL QUESTIONS AS COLUMNS
Object.keys(allQuestions).forEach(function (question) {
rowData[question] = allQuestions[question];
});
excelData.push(rowData);
slno++;
}
// CREATE WORKSHEET
const worksheet = XLSX.utils.json_to_sheet(excelData);
// AUTO COLUMN WIDTH
const columns = [];
Object.keys(excelData[0]).forEach(function () {
columns.push({ wch: 30 });
});
worksheet['!cols'] = columns;
// CREATE WORKBOOK
const workbook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(
workbook,
worksheet,
"Children Survey"
);
// DOWNLOAD
XLSX.writeFile(
workbook,
"Children_Survey_Report.xlsx"
);
Swal.close();
} catch (e) {
console.log(e);
Swal.fire({
icon: 'error',
title: 'Excel Download Failed'
});
}
}
$(document).ready(function () { $(document).ready(function () {
// 🔹 Load dropdowns when page loads // 🔹 Load dropdowns when page loads

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/documentcorrectionmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Document Correction Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Document Correction
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Document Correction Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Document Correction</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Document Correction Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/documentcreationmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/documentcreationsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/documentcreationstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/documentreasonmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Document Reason Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Document Reason
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Document Reason Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Document Reason</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Religion Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/documentreasonmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/documentreasonmaster",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/documentreasonmasterstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/dropoutreasonmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Dropout Reason Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Dropout Reason
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Dropout Reason Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Dropout Reason</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Dropout Reason Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/dropoutreasonmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/dropoutreasonsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/dropoutreasonstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/educationmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Education Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Education
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Education Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Education</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Education Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/educationmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/save",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/gendermaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Gender Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Gender
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Gender Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Gender</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Gender Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/gendermasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/gendersave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/gender-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/incomemaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Income Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Income
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Income Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Income</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Income Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/incomemasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/incomesave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/incomemasterstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/interestfieldmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Interest Field Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Interest Field
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Interest Field Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Interest Field</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Interest Field Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/interestfieldmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/interestfieldsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/interestfieldmaster-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/livingmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Living Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Living Type
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Living Type Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Living</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Living Type Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/livingmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/livingsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/living-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/locationmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Location Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Location
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Location Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Location</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Location Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/locationmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/locationsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/location-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/ownermaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Owner Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Owner
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Owner Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Owner</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Owner Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/ownermasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/ownermastersave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/ownermasterstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/religionmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Religion Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Religion
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Religion Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Religion</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Religion Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/religionmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/religionsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/religion-status",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

15
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/surveyorsreports.html

@ -393,6 +393,20 @@
</div> </div>
</div> </div>
<div class="col mb-4 d-flex">
<div class="card dashboard-card text-center w-100">
<div class="card-body">
<h6 class="card-title">
Gender - Others
</h6>
<h1 id="othersCount" class="dashboard-count">
0
</h1>
</div>
</div>
</div>
<div class="col mb-4 d-flex"> <div class="col mb-4 d-flex">
<div class="card dashboard-card text-center w-100"> <div class="card dashboard-card text-center w-100">
<div class="card-body"> <div class="card-body">
@ -718,6 +732,7 @@
$("#maleCount").text(data.maleCount); $("#maleCount").text(data.maleCount);
$("#femaleCount").text(data.femaleCount); $("#femaleCount").text(data.femaleCount);
$("#othersCount").text(data.othersCount);
//$("#currentlyStudying").text(data.currentlyStudying); //$("#currentlyStudying").text(data.currentlyStudying);
$("#currentlyStudying").text( $("#currentlyStudying").text(

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/vulnerabilitymaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Vulnerability Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Vulnerability
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Vulnerability Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Vulnerability</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Vulnerability Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/vulnerabilitymasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/vulnerabilitysave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/vulnerabilitymasterstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>

531
gcc_officer_portal/src/main/resources/templates/modules/childrensurvey/whereaboutmaster.html

@ -0,0 +1,531 @@
<!DOCTYPE html>
<html lang="en" dir="">
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/modules/base/head :: head}">
<style>
#surveyModal .modal-dialog {
max-width: 70%;
width: 70%;
}
#surveyModal .modal-content {
border-radius: 10px;
}
#surveyModal .modal-header {
background-color: #f8f9fa;
border-bottom: 2px solid #007bff;
}
#surveyModal .modal-title {
font-weight: 600;
color: #2c3e50;
}
#surveyModal .modal-body {
padding: 30px 40px;
}
#surveyDetails .row {
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #e9ecef;
}
#surveyDetails .col-md-5 {
font-weight: 600;
color: #34495e;
font-size: 14px;
}
#surveyDetails .col-md-7 {
font-weight: 500;
color: #555;
font-size: 14px;
}
/* Modal scrollbar styling */
#surveyModal .modal-body::-webkit-scrollbar {
width: 6px;
}
#surveyModal .modal-body::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb {
background: #007bff;
border-radius: 10px;
}
#surveyModal .modal-body::-webkit-scrollbar-thumb:hover {
background: #0056b3;
}
@media (max-width: 768px) {
#surveyModal .modal-dialog {
max-width: 96%;
width: 96%;
}
#surveyModal .modal-body {
padding: 20px;
}
}
#surveyModal .modal-dialog {
max-width: 75%;
}
#surveyModal .modal-content {
border-radius: 12px;
overflow: hidden;
}
#surveyModal .modal-header {
background: #44506A;
color: white;
border: none;
}
#surveyModal .modal-title {
font-size: 32px;
font-weight: 600;
}
#surveyModal .modal-body {
padding: 30px;
background: #f7f8fa;
}
.detail-card {
background: #fff;
border-radius: 12px;
padding: 14px 18px;
border: 1px solid #e9ecef;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
height: 100%;
}
.detail-label {
font-size: 13px;
font-weight: 700;
color: #7f8c8d;
text-transform: uppercase;
line-height: 1.5;
}
.detail-value {
font-size: 16px;
font-weight: 600;
color: #2c3e50;
line-height: 1.6;
word-break: break-word;
}
.section-heading {
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e5e7eb;
color: #2c3e50;
}
.section-heading {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 2px solid #e74c3c;
color: #2c3e50;
}
.detail-card {
background: white;
border-radius: 10px;
padding: 15px 18px;
height: 100%;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
border: 1px solid #edf0f2;
}
@media(max-width:768px) {
#surveyModal .modal-dialog {
max-width: 95%;
}
.detail-card {
margin-bottom: 10px;
}
}
</style>
</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>Children Survey Dashboard</h5>
</div>
<div class="col-lg-6 text-end">
<input type="date" id="fromDate" class="form-control d-inline-block"
style="width:150px;">
<span class="mx-1">to</span>
<input type="date" id="toDate" class="form-control d-inline-block"
style="width:150px;">
</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">Update Staff</li>
</ol>
</nav>
</div>
</div>
</div>-->
<div class="page-header">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="page-header-title d-flex align-items-center">
<i class="ik ik-book bg-blue me-2"></i>
<h5 class="mb-0">Where About Master</h5>
</div>
</div>
<div class="col-lg-6 text-end">
<button class="btn btn-primary" onclick="openAddModal()">
<i class="fa fa-plus"></i> Add Where About
</button>
</div>
</div>
</div>
<hr>
<div class="card-block">
<table id="educationTable" class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>Where About Name</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="modal fade" id="educationModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title">Add Religion</h5>
<button type="button" class="close" data-bs-dismiss="modal">
&times;
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Where About Name</label>
<input type="text" id="educationName" class="form-control">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" onclick="saveEducation()">
Save
</button>
<button class="btn btn-secondary" data-bs-dismiss="modal">
Close
</button>
</div>
</div>
</div>
</div>
<!--<hr>-->
<!-- Filters Section -->
<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">
//var createdBy = /*[[${LoginUserId}]]*/'';
/*$(document).ready(function () {
function clearUrlParams() {
const currentUrl = window.location.href;
const urlWithoutParams = currentUrl.split('?')[0]; // Remove the query parameters
window.history.replaceState({}, document.title, urlWithoutParams); // Replace the current URL without params
}
// Call this on page load to reset the URL
clearUrlParams();
// Initialize DataTable
var table = $('#salaryreporttable').DataTable({
dom: 'Bftip',
columnDefs: [
{ targets: 'no-sort', orderable: false }
],
lengthMenu: [
[50, 100, 200, 500, -1],
['50 rows', '100 rows', '200 rows', 'Show all']
],
scrollY: '50vh',
fixedColumns: {
left: 1,
right: 1
},
buttons: [
{
extend: 'pageLength',
className: 'btn btn-warning'
},
{
extend: 'pdfHtml5',
text: 'PDF',
className: 'btn btn-secondary',
id: 'pdfBtn',
exportOptions: {
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]
},
orientation: 'landscape', // Change to landscape for more horizontal space
pageSize: 'A3', // You can change to A4 or A3 depending on your needs
customize: function (doc) {
// Custom column widths for better fit
//doc.content[1].table.widths = ['2%', '6%', '6%', '6%', '6%', '6%', '6%', '3%', '3%', '3%', '3%', '3%', '3%', '6%', '6%', '6%'];
// Optional: Adjust font size if needed
doc.styles.tableBodyEven.alignment = 'center';
doc.styles.tableBodyOdd.alignment = 'center';
}
}
],
fixedHeader: true,
autoWidth: true,
responsive: true,
searching: true,
select: false,
processing: false
});
});*/
$(document).ready(function () {
loadEducationTable();
});
function openAddModal() {
$("#educationName").val('');
let modal = new bootstrap.Modal(
document.getElementById('educationModal')
);
modal.show();
}
function loadEducationTable() {
$.ajax({
url: "/gcc/api/children-survey/whereaboutmasterlist",
type: "GET",
success: function (data) {
let tbody = "";
data.forEach(function (row) {
let statusBadge = row.isactive == 1
? `<span class="badge">Active</span>`
: `<span class="badge">Disabled</span>`;
let actionButton = row.isactive == 1
? `
<button class="btn btn-danger btn-sm"
onclick="toggleStatus(${row.id},0)">
Disable
</button>
`
: `
<button class="btn btn-success btn-sm"
onclick="toggleStatus(${row.id},1)">
Enable
</button>
`;
tbody += `
<tr>
<td>${row.id}</td>
<td>${row.english_name}</td>
<td>${statusBadge}</td>
<td>${actionButton}</td>
</tr>
`;
});
if ($.fn.DataTable.isDataTable('#educationTable')) {
$('#educationTable')
.DataTable()
.clear()
.destroy();
}
$("#educationTable tbody").html(tbody);
$('#educationTable').DataTable({
responsive: true
});
}
});
}
function saveEducation() {
$.ajax({
url: "/gcc/api/children-survey/whereaboutsave",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
english_name: $("#educationName").val()
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Saved Successfully'
});
bootstrap.Modal.getInstance(
document.getElementById('educationModal')
).hide();
loadEducationTable();
}
});
}
function toggleStatus(id, status) {
$.ajax({
url: "/gcc/api/children-survey/whereaboutstatus",
type: "POST",
contentType: "application/json",
data: JSON.stringify({
id: id,
status: status
}),
success: function () {
Swal.fire({
icon: 'success',
title: 'Status Updated'
});
loadEducationTable();
}
});
}
</script>
</body>
</html>
Loading…
Cancel
Save