for patch

src/main/java/com/gcc/publicgrievance/PublicgrievanceApplication.java

@@ -7,7 +7,7 @@ import org.springframework.boot.autoconfigure.SpringBootApplication;
 public class PublicgrievanceApplication {
 
 	public static void main(String[] args) {
-		System.out.println("ready.....");
+		System.out.println("ready.........");
 		SpringApplication.run(PublicgrievanceApplication.class, args);
 	}
 

src/main/java/com/gcc/publicgrievance/controller/ComplaintController.java

@@ -1,6 +1,5 @@
 package com.gcc.publicgrievance.controller;
 
-import java.util.Base64;
 import java.util.List;
 import java.util.Map;
 
@@ -13,9 +12,11 @@ import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.ResponseBody;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.client.RestTemplate;
-
+import org.springframework.web.multipart.MultipartFile;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
+import org.springframework.util.LinkedMultiValueMap;
+import org.springframework.util.MultiValueMap;
 import org.springframework.web.bind.annotation.*;
 
 import java.io.BufferedReader;
@@ -25,10 +26,18 @@ import java.io.OutputStream;
 import java.net.HttpURLConnection;
 import java.net.URL;
 import java.net.URLEncoder;
+import org.springframework.http.*;
 
-
-
+import java.util.Base64;
+import java.util.HashMap;
 import com.gcc.publicgrievance.Service.ComplaintService;
+import org.springframework.web.multipart.MultipartFile;
+import java.awt.Graphics2D;
+import java.awt.image.BufferedImage;
+import java.io.ByteArrayOutputStream;
+import java.io.IOException;
+import javax.imageio.ImageIO;
+import java.util.Base64;
 
 @CrossOrigin
 @RestController
@@ -62,6 +71,7 @@ public class ComplaintController {
 	public List<Map<String, Object>> getComplaintDetailsByMobile(@RequestParam String mobileNo) {
 		return complaintService.fetchComplaintDetailsByMobile(mobileNo);
 	}
+
 	@PostMapping("/register")
 	public ResponseEntity<String> registerComplaint(
 			@RequestParam(value = "ComplainantName", required = false) String complainantName,
@@ -91,20 +101,20 @@ public class ComplaintController {
 			conn.setDoOutput(true);
 
 			// Create the parameters string, handling null values
-	        String params = "serviceId=RegComplaint" +
-	                "&ComplainantName=" + URLEncoder.encode(complainantName != null ? complainantName : "", "UTF-8") +
-	                "&ComplainantAddr=" + URLEncoder.encode(complainantAddr != null ? complainantAddr : "", "UTF-8") +
-	                "&MobileNo=" + URLEncoder.encode(mobileNo != null ? mobileNo : "", "UTF-8") +
-	                "&Email=" + URLEncoder.encode(email != null ? email : "", "UTF-8") +
-	                "&ComplaintType=" + URLEncoder.encode(complaintType != null ? complaintType : "", "UTF-8") +
-	                "&ComplaintTitle=" + URLEncoder.encode(complaintTitle != null ? complaintTitle : "", "UTF-8") +
-	                "&ComplaintDetails=" + URLEncoder.encode(complaintDetails != null ? complaintDetails : "", "UTF-8") +
-	                "&StreetId=" + URLEncoder.encode(streetId != null ? streetId : "", "UTF-8") +
-	                "&Comp_Image=" + URLEncoder.encode(compImage != null ? compImage : "", "UTF-8") +
-	                "&latitude=" + URLEncoder.encode(latitude != null ? latitude : "", "UTF-8") +
-	                "&longtitude=" + URLEncoder.encode(longtitude != null ? longtitude : "", "UTF-8") +
-	                "&Landmark=" + URLEncoder.encode(landmark != null ? landmark : "", "UTF-8") +
-	                "&gender=" + URLEncoder.encode(gender != null ? gender : "", "UTF-8");
+			String params = "serviceId=RegComplaint" + "&ComplainantName="
+					+ URLEncoder.encode(complainantName != null ? complainantName : "", "UTF-8") + "&ComplainantAddr="
+					+ URLEncoder.encode(complainantAddr != null ? complainantAddr : "", "UTF-8") + "&MobileNo="
+					+ URLEncoder.encode(mobileNo != null ? mobileNo : "", "UTF-8") + "&Email="
+					+ URLEncoder.encode(email != null ? email : "", "UTF-8") + "&ComplaintType="
+					+ URLEncoder.encode(complaintType != null ? complaintType : "", "UTF-8") + "&ComplaintTitle="
+					+ URLEncoder.encode(complaintTitle != null ? complaintTitle : "", "UTF-8") + "&ComplaintDetails="
+					+ URLEncoder.encode(complaintDetails != null ? complaintDetails : "", "UTF-8") + "&StreetId="
+					+ URLEncoder.encode(streetId != null ? streetId : "", "UTF-8") + "&Comp_Image="
+					+ URLEncoder.encode(compImage != null ? compImage : "", "UTF-8") + "&latitude="
+					+ URLEncoder.encode(latitude != null ? latitude : "", "UTF-8") + "&longtitude="
+					+ URLEncoder.encode(longtitude != null ? longtitude : "", "UTF-8") + "&Landmark="
+					+ URLEncoder.encode(landmark != null ? landmark : "", "UTF-8") + "&gender="
+					+ URLEncoder.encode(gender != null ? gender : "", "UTF-8");
 
 			// Write parameters to request body
 			try (OutputStream os = conn.getOutputStream()) {
@@ -133,47 +143,159 @@ public class ComplaintController {
 
 		} catch (IOException e) {
 			e.printStackTrace();
-	        return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("An error occurred while processing the request.");
+			return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
+					.body("An error occurred while processing the request.");
 		}
 	}
 
-	
+//	@PostMapping("/updateComplaint")
+//	public ResponseEntity<String> updateComplaint(@RequestParam("ComplaintId") String complaintId,
+//			@RequestParam(value = "Message", required = false) String message,
+//			@RequestParam(value = "UserType", required = false) String userType,
+//			@RequestParam(value = "Status", required = false) String status,
+//			@RequestParam(value = "Comp_Image", required = false) String compImage) {
+//
+//		// Print for debugging
+//		System.out.println("ComplaintId: " + complaintId);
+//		System.out.println("Message: " + message);
+//		System.out.println("Status: " + status);
+//
+//		// External API URL
+//		String externalUrl = "https://erp.chennaicorporation.gov.in/pgr/external/mobileservice";
+//
+//		// Create the request body as MultiValueMap for form-encoded data
+//		MultiValueMap<String, String> requestBody = new LinkedMultiValueMap<>();
+//		requestBody.add("serviceId", "UpdateComplaint");
+//		requestBody.add("ComplaintId", complaintId != null ? complaintId : "");
+//		requestBody.add("Message", message != null ? message : "");
+//		requestBody.add("UserType", userType != null ? userType : "");
+//		requestBody.add("Status", status != null ? status : "");
+//		requestBody.add("Comp_Image", compImage != null ? compImage : "");
+//		requestBody.add("Token", "718333469976265947044293");
+////		MultiValueMap<String, String> requestBody = new LinkedMultiValueMap<>();
+////		requestBody.add("serviceId", "UpdateComplaint");
+////		requestBody.add("ComplaintId",  "2024-516FGB");
+////		requestBody.add("Message","test");
+////		requestBody.add("UserType", "Public");
+////		requestBody.add("Status","8");
+////		requestBody.add("Comp_Image","null");
+////		requestBody.add("Token", "718333469976265947044293");
+//		System.out.println(requestBody);
+//
+//		// Set headers to indicate form data
+//		HttpHeaders headers = new HttpHeaders();
+//		headers.setContentType(MediaType.APPLICATION_FORM_URLENCODED);
+//
+//		// Build the request entity with headers and body
+//		HttpEntity<MultiValueMap<String, String>> entity = new HttpEntity<>(requestBody, headers);
+//
+//		try {
+//			// Make the POST request using RestTemplate
+//			ResponseEntity<String> response = restTemplate.exchange(externalUrl, // External API endpoint
+//					HttpMethod.GET, // HTTP Method
+//					entity, // The request entity containing body and headers
+//					String.class // Expected response type
+//			);
+//			System.out.println(response.getBody());
+//
+//			// Return the response from the external API
+//			return new ResponseEntity<>(response.getBody(), response.getStatusCode());
+//
+//		} catch (Exception e) {
+//			e.printStackTrace();
+//			return ResponseEntity.status(500).body("An error occurred while processing the request.");
+//		}
+//	}
+
+	/*
+	 * @PostMapping("/updateComplaint") public ResponseEntity<String>
+	 * updateComplaint(@RequestParam("ComplaintId") String complaintId,
+	 * 
+	 * @RequestParam(value = "Message", required = false) String message,
+	 * 
+	 * @RequestParam(value = "Status") String status,
+	 * 
+	 * @RequestParam(value = "Comp_Image", required = false) String compImage) {
+	 * String userType = "Public";
+	 * System.out.println("message:-"+message+"\n UserType:-"+userType+"\n Status:-"
+	 * +status); String externalUrl =
+	 * "https://erp.chennaicorporation.gov.in/pgr/external/mobileservice";
+	 * 
+	 * try { // Create the URL object URL url = new URL(externalUrl);
+	 * 
+	 * // Create the HttpURLConnection object HttpURLConnection conn =
+	 * (HttpURLConnection) url.openConnection(); conn.setRequestMethod("POST");
+	 * conn.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
+	 * conn.setDoOutput(true);
+	 * 
+	 * // Create the parameters string, handling null values String params =
+	 * "serviceId=UpdateComplaint" + "&ComplaintId=" + URLEncoder.encode(complaintId
+	 * != null ? complaintId : "", "UTF-8") + "&Message=" +
+	 * URLEncoder.encode(message != null ? message : "", "UTF-8") + "&UserType=" +
+	 * URLEncoder.encode(userType , "UTF-8") + "&Status=" + URLEncoder.encode(status
+	 * != null ? status : "", "UTF-8") + "&Comp_Image=" +
+	 * URLEncoder.encode(compImage != null ? compImage : "", "UTF-8") +
+	 * "&Token=718333469976265947044293"; System.out.println(params); // Write
+	 * parameters to request body try (OutputStream os = conn.getOutputStream()) {
+	 * byte[] input = params.getBytes("UTF-8"); os.write(input, 0, input.length); }
+	 * 
+	 * // Read the response int responseCode = conn.getResponseCode();
+	 * BufferedReader reader; if (responseCode == HttpURLConnection.HTTP_OK) {
+	 * reader = new BufferedReader(new InputStreamReader(conn.getInputStream())); }
+	 * else { reader = new BufferedReader(new
+	 * InputStreamReader(conn.getErrorStream())); }
+	 * 
+	 * StringBuilder response = new StringBuilder(); String line; while ((line =
+	 * reader.readLine()) != null) { response.append(line); } reader.close();
+	 * System.out.println(response.toString()); // Return the response from the
+	 * external API return
+	 * ResponseEntity.status(responseCode).body(response.toString());
+	 * 
+	 * } catch (IOException e) { e.printStackTrace(); return
+	 * ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
+	 * .body("An error occurred while processing the request."); } }
+	 */
 	@PostMapping("/updateComplaint")
 	public ResponseEntity<String> updateComplaint(
 	        @RequestParam("ComplaintId") String complaintId,
 	        @RequestParam(value = "Message", required = false) String message,
-	            @RequestParam(value = "UserType", required = false) String userType,
-	            @RequestParam(value = "Status", required = false) String status,
-	            @RequestParam(value = "Comp_Image", required = false) String compImage) {
+	        @RequestParam(value = "Status") String status,
+	        @RequestPart(value = "Comp_Image", required = false) MultipartFile compImage) {
+
+	    String userType = "Public";
+	    System.out.println("message:-" + message + "\n UserType:-" + userType + "\n Status:-" + status);
 
 	    String externalUrl = "https://erp.chennaicorporation.gov.in/pgr/external/mobileservice";
 
 	    try {
-	            // Create the URL object
-	            URL url = new URL(externalUrl);
-
-	            // Create the HttpURLConnection object
-	            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
-	            conn.setRequestMethod("POST");
-	            conn.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
-	            conn.setDoOutput(true);
+	        // Convert and compress the image to base64 if provided
+	        String base64Image = null;
+	        if (compImage != null && !compImage.isEmpty()) {
+	            base64Image = compressAndEncodeToBase64(compImage);
+	        }
 
-	            // Create the parameters string, handling null values
-	            String params = "serviceId=UpdateComplaint"+
+	        // Construct the POST body with parameters
+	        String params = "serviceId=UpdateComplaint" +
 	                "&ComplaintId=" + URLEncoder.encode(complaintId != null ? complaintId : "", "UTF-8") +
 	                "&Message=" + URLEncoder.encode(message != null ? message : "", "UTF-8") +
-	                    "&UserType=" + URLEncoder.encode(userType != null ? userType : "", "UTF-8") +
+	                "&UserType=" + URLEncoder.encode(userType, "UTF-8") +
 	                "&Status=" + URLEncoder.encode(status != null ? status : "", "UTF-8") +
-	                    "&Comp_Image=" + URLEncoder.encode(compImage != null ? compImage : "", "UTF-8") +
 	                "&Token=718333469976265947044293";
 
-	            // Write parameters to request body
-	            try (OutputStream os = conn.getOutputStream()) {
-	                byte[] input = params.getBytes("UTF-8");
-	                os.write(input, 0, input.length);
-	            }
+	        // Open connection and send POST request
+	        URL url = new URL(externalUrl);
+	        HttpURLConnection conn = (HttpURLConnection) url.openConnection();
+	        conn.setRequestMethod("POST");
+	        conn.setDoOutput(true);
+	        conn.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
 
-	            // Read the response
+	        // Send parameters
+	        OutputStream os = conn.getOutputStream();
+	        os.write(params.getBytes());
+	        os.flush();
+	        os.close();
+
+	        // Handle the response
 	        int responseCode = conn.getResponseCode();
 	        BufferedReader reader;
 	        if (responseCode == HttpURLConnection.HTTP_OK) {
@@ -189,17 +311,37 @@ public class ComplaintController {
 	        }
 	        reader.close();
 
-	            // Return the response from the external API
 	        return ResponseEntity.status(responseCode).body(response.toString());
 
 	    } catch (IOException e) {
 	        e.printStackTrace();
-	            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body("An error occurred while processing the request.");
+	        return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
+	                .body("An error occurred while processing the request.");
 	    }
 	}
 
 
+	private String compressAndEncodeToBase64(MultipartFile file) throws IOException {
+		// Convert MultipartFile to BufferedImage
+		BufferedImage originalImage = ImageIO.read(file.getInputStream());
+
+		// Resize/Compress the image
+		int targetWidth = 800; // You can adjust the width as needed
+		int targetHeight = (int) (originalImage.getHeight() * (800.0 / originalImage.getWidth())); // Preserve aspect
+																									// ratio
 
+		BufferedImage resizedImage = new BufferedImage(targetWidth, targetHeight, BufferedImage.TYPE_INT_RGB);
+		Graphics2D g = resizedImage.createGraphics();
+		g.drawImage(originalImage, 0, 0, targetWidth, targetHeight, null);
+		g.dispose();
 
+		// Compress the image by writing it to a ByteArrayOutputStream in JPEG format
+		ByteArrayOutputStream baos = new ByteArrayOutputStream();
+		ImageIO.write(resizedImage, "jpg", baos); // You can change the format to "png" or "jpg"
+		byte[] compressedBytes = baos.toByteArray();
+
+		// Convert the compressed image to base64
+		return Base64.getEncoder().encodeToString(compressedBytes);
+	}
 
 }

src/main/java/com/gcc/publicgrievance/controller/UserController.java

@@ -7,7 +7,7 @@ import org.springframework.web.bind.annotation.GetMapping;
 @Controller
 public class UserController {
 
-	@GetMapping("/home")
+	@GetMapping({"/", "/home"})
 	public String home(Model model) {
 	    return "User/home";
 	}
@@ -27,30 +27,5 @@ public class UserController {
 	public String checklistuser(Model model) {
 		return "checklistuser/checklistuser";
 	}
-	//staff 
-	@GetMapping("/createorder")
-	public String createorder(Model model) {
-		return "staff/createorder";
-	}
-	@GetMapping("/staffenrollment")
-	public String staffenrollment(Model model) {
-		return "staff/staffenrollment";
-	}
-	@GetMapping("/appoinmentscreen")
-	public String appoinmentscreen(Model model) {
-		return "staff/appoinmentscreen";
-	}
-	@GetMapping("/schemegroup")
-	public String schemegroup(Model model) {
-		return "staff/schemegroup";
-	}
-	@GetMapping("/appoinment")
-	public String appoinment(Model model) {
-		return "staff/appoinment";
-	}
-	//tradelicence
-	@GetMapping("/tradelicence")
-	public String tradelicence(Model model) {
-		return "Tradelicence/tradelicence";
-	}
+	
 }

src/main/resources/templates/checklistofficer/checklistofficer.html

@@ -8,9 +8,7 @@
 	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
 	<!-- Bootstrap CSS -->
 	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
-		integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
-		crossorigin="anonymous" referrerpolicy="no-referrer" />
+
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
 	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
 	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
@@ -183,7 +181,7 @@
 			<div class="card-header text-white" style="background-color: #414f69;">Complaint Action</div>
 			<div class="card-body">
 				<div class="row">
-					<!--<div class="col-md-2" id="">Aug 24<br>7.00 pm</div>-->
+
 
 					<div class="col-md-4">
 						Complaint Closed Date:
@@ -194,11 +192,10 @@
 						Official Name:
 						<input type="text" class="form-control" id="commentuser" disabled>
 					</div>
-					<!--<div class="col-md-2"><button class="btn  btn-sm"
-							style="background-color: #414f69;color: white;" id="status"></button></div>-->
+
 					<div class="col-md-4">
 						Status:
-						<input type="text" class="form-control" id="status"
+						<input type="text" class="form-control" id="statusshow"
 							style="background-color: #414f69;color: white;" disabled>
 					</div>
 				</div>
@@ -227,7 +224,7 @@
 							<option value="0">Choose</option>
 							<option value="8">WITHDRAW</option>
 							<option value="9">REOPENED</option>
-							<option value="10" selected="true">CLOSE</option>
+
 						</select>
 					</div>
 
@@ -248,6 +245,10 @@
 				</div>
 			</div>
 		</div>
+
+
+
+
 	</div>
 
 
@@ -311,7 +312,7 @@
 
 								document.getElementById("commentDate").value = complaintDetails.complaintcloseddate || '';
 								document.getElementById("commentuser").value = complaintDetails.Officialname || '';
-								document.getElementById("status").value = complaintDetails.complaintcurrentstatus || '';
+								document.getElementById("statusshow").value = complaintDetails.complaintcurrentstatus || '';
 
 								// Handle nested Comments array
 								if (Array.isArray(complaintDetails.Comments) && complaintDetails.Comments.length > 0) {
@@ -449,58 +450,51 @@
         }
     });
 
-			// Handle the form submission
     $('.btn').click(function (e) {
         e.preventDefault();
 
-				var complaintId = 'YOUR_COMPLAINT_ID'; // You should fetch this dynamically
-				var status = $('#complaintStatus').val();
+        var complaintId = $('#complaintid').val();
+        var complaintStatus = $('#complaintStatus').val();
         var message = $('#othercomplaint-details').val();
 
-				// Validate the "Details of Complaint" field
+        // Validate "Details of Complaint" field
         if (message.trim() === "") {
-					// Display a SweetAlert validation message if the field is empty
             Swal.fire({
                 title: 'Validation Error!',
                 text: 'Please enter the details of the complaint.',
                 icon: 'warning',
                 confirmButtonText: 'OK'
             });
-					return; // Stop the form submission if the field is empty
+            return;
         }
 
-				// Convert image to base64 if it's selected
-				var imageFile = $('#photo')[0].files[0];
-				var compImage = '';
+        if (complaintStatus == '0') {
+            Swal.fire({
+                title: 'Validation Error!',
+                text: 'Please select a valid complaint status.',
+                icon: 'warning',
+                confirmButtonText: 'OK'
+            });
+            return;
+        }
 
+        var formData = new FormData();
+        formData.append("ComplaintId", complaintId);
+        formData.append("Message", message);
+        formData.append("Status", complaintStatus);
+
+        var imageFile = $('#photo')[0].files[0];
         if (imageFile) {
-					var reader = new FileReader();
-					reader.readAsDataURL(imageFile);
-					reader.onload = function () {
-						compImage = reader.result.split(',')[1]; // Extract base64 part
-
-						// Proceed with the AJAX call after the image is converted
-						updateComplaint(complaintId, message, status, compImage);
-					};
-				} else {
-					// No image selected, proceed with the AJAX call without the image
-					updateComplaint(complaintId, message, status, '');
+            formData.append("Comp_Image", imageFile);
         }
-			});
 
-			// Function to send the AJAX request to the backend
-			function updateComplaint(complaintId, message, status, compImage) {
         $.ajax({
-					url: '/updateComplaint', // Adjust this to match your endpoint
+            url: '/updateComplaint',
             type: 'POST',
-					data: {
-						ComplaintId: complaintId,   // complaintId mapped from your backend
-						Message: message,           // message field
-						Status: status,             // status dropdown
-						Comp_Image: compImage       // base64 image data
-					},
+            data: formData,
+            processData: false,
+            contentType: false,
             success: function (response) {
-						// Display SweetAlert and redirect on 'OK'
                 Swal.fire({
                     title: 'Success!',
                     text: 'Complaint updated successfully.',
@@ -508,25 +502,25 @@
                     confirmButtonText: 'OK'
                 }).then((result) => {
                     if (result.isConfirmed) {
-								// Redirect to home.html after clicking OK
                         window.location.href = 'home';
                     }
                 });
             },
             error: function (xhr, status, error) {
-						// Handle error
                 console.error('Error updating complaint:', error);
-					}
+                let errorMessage = xhr.responseText ? xhr.responseText : 'An error occurred while updating the complaint.';
+                Swal.fire({
+                    title: 'Error!',
+                    text: errorMessage,
+                    icon: 'error',
+                    confirmButtonText: 'OK'
                 });
             }
         });
-
+    });
+});
 
 	</script>
-
-
-
-
 </body>
 
 </html>

src/main/resources/templates/checklistuser/checklistuser.html

@@ -1,275 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>CheckList User</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	
-	<style>
-		/*rating style for css*/
-		.rating {
-			direction: rtl;
-			display: inline-flex;
-			font-size: 24px;
-		}
-
-		.rating input {
-			display: none;
-		}
-
-		.rating label {
-			color: #ddd;
-			cursor: pointer;
-			margin: 0;
-		}
-
-		.rating input:checked~label {
-			color: #414f69;
-		}
-
-		.rating label:hover,
-		.rating label:hover~label {
-			color: #414f69;
-		}
-	</style>
-</head>
-
-<body>
-
-	<!-- Insert the header fragment -->
-	<div th:insert="fragments/header :: headerFragment"></div>
-
-	<div class="container mt-4">
-		 <!-- Screen Reader Button -->
-    <div class="row align-items-center justify-content-center mt-4">
-        <button id="screenReaderBtn" class="btn btn-info">Screen Reader</button>
-    </div>
-		<div class="mt-1">
-			<div class="row align-items-center justify-content-center">
-				<!--<button class="back-button" onclick="window.location.href='home';">← Back</button>-->
-
-				<h4 class="title" style="color: #414f69;">Check Availability Status</h4>
-			</div>
-		</div>
-		<!-- Card Section -->
-		<div class="card p-3" style="margin-bottom: 8px;color: #414f69;">
-			<div class="row" style="font-weight: bolder;">
-				<div class="col-md-6">
-							Complainant Number:
-						</div>
-						<div class="col-md-6">
-							Date:
-						</div>
-			</div>
-			<div class="row" style="font-weight: bolder;color: #414f69;">
-				<div class="col-md-6">
-							Complainant Mode:
-						</div>
-						<div class="col-md-6">
-							Expiry:
-						</div>
-			</div>
-			<div class="card mb-3">
-				<div class="card-header text-white" style="background-color: #414f69;">1. Complaining Person's Details
-				</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-6">
-							Complainant Mobile Number:
-							<input type="text" class="form-control" value="">
-						</div>
-						<div class="col-md-6">
-							Complainant Name:
-							<input type="text" class="form-control" value="">
-						</div>
-						<div class="col-md-6">
-							Complainant Email:
-							<input type="email" class="form-control" value="">
-						</div>
-						<div class="col-md-6">
-							Gender:
-							<select class="form-control">
-							<option value="0">Select Gender</option>
-							<option value="male">Male</option>
-							<option value="femlae">Female</option>
-							<option value="transgender">Transgender</option>
-						</select>
-						</div>
-					</div>
-				</div>
-
-			</div>
-
-			<div class="card mb-3">
-				<div class="card-header text-white" style="background-color: #414f69;">2. Complaint Location Details
-				</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-4">
-							Complainant Street:
-							<input type="text" class="form-control" value="Street Address">
-						</div>
-						<div class="col-md-4">
-							Complainant Zone:
-							<input type="text" class="form-control" value="Zone 12">
-						</div>
-						<div class="col-md-4">
-							Complainant Ward:
-							<input type="text" class="form-control" value="Ward 12">
-						</div>
-						<div class="col-md-4">
-							Complainant Area:
-							<input type="text" class="form-control" value="Chennai Central">
-						</div>
-						<div class="col-md-4">
-							Complainant Locality:
-							<input type="text" class="form-control" value="Periyamet">
-						</div>
-					</div>
-				</div>
-
-			</div>
-
-			<div class="card">
-				<div class="card-header text-white" style="background-color: #414f69;">3. Complaint Type</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-4">
-							Complainant Type:
-							<input type="text" class="form-control" value="Street Light">
-						</div>
-						<div class="col-md-4">
-							Complainant Sub-Type:
-							<input type="text" class="form-control" value="Mohamed Afridi">
-						</div>
-						<div class="col-md-4">
-							Complainant Title:
-							<input type="text" class="form-control" value="Male">
-						</div>
-						<div class="col-md-12">
-							Complainant Description:
-							<input type="text" class="form-control"
-								value="Street Light is not working. Kindly rectify it.">
-						</div>
-
-					</div>
-				</div>
-
-			</div>
-		</div>
-
-
-		<div class="card mb-3">
-			<div class="card-header text-white" style="background-color: #414f69;">Complaint Action</div>
-			<div class="card-body">
-				<div class="row">
-					<div class="col-md-2">Aug 24<br>7.00 pm</div>
-					<div class="col-md-8">Officer - AE Zone 15<br>Lorem ipsum dolor sit amet, consectetur adipiscing
-						elit. In sit arcu aliquet ut dui egestas.</div>
-					<div class="col-md-2"><button class="btn  btn-sm"
-							style="background-color: #414f69;color: white;">Redressed</button></div>
-				</div>
-				<div class="row mt-3">
-					<div class="col-md-2">Aug 25<br>10.00 am</div>
-					<div class="col-md-8">Citizen<br>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-						Ullamcorper ullamcorper quis.</div>
-					<div class="col-md-2"><button class="btn btn-secondary btn-sm">Reopened</button></div>
-				</div>
-				<div class="row mt-3">
-					<div class="col-md-2">Aug 26<br>3.00 pm</div>
-					<div class="col-md-8">Officer - AE Zone 15<br>Lorem ipsum dolor sit amet, consectetur adipiscing
-						elit. In sit arcu aliquet ut dui egestas.</div>
-					<div class="col-md-2"><button class="btn  btn-sm"
-							style="background-color: #414f69;color: white;">Redressed</button></div>
-				</div>
-			</div>
-		</div>
-
-		<div class="card mb-3">
-			<div class="card-header text-white" style="background-color: #414f69;">Update Complaint </div>
-			<div class="card-body">
-				<div class="row">
-					<div class="col-md-6">
-						Change Complaint Status:
-						<select class="form-control">
-							<option value="0">Select Complaint</option>
-							<option value="complaint1">Complaint 1</option>
-							<option value="complaint2">Complaint 2</option>
-						</select>
-					</div>
-
-
-
-
-					<div class="col-md-6">
-						<label for="rating" style="display: block; margin-bottom: 4px;">Feedback Rating:</label>
-						<div class="rating">
-							<input type="radio" name="star" id="star1"><label for="star1">★</label>
-							<input type="radio" name="star" id="star2"><label for="star2">★</label>
-							<input type="radio" name="star" id="star3"><label for="star3">★</label>
-							<input type="radio" name="star" id="star4"><label for="star4">★</label>
-							<input type="radio" name="star" id="star5"><label for="star5">★</label>
-						</div>
-					</div>
-
-
-
-
-				</div>
-				<div class="row">
-					<div class="col-md-12">
-						Complainant Locality:
-						<textarea class="form-control" id="othercomplaint-details" rows="3"
-							placeholder="Enter complaint details" maxlength="400"></textarea>
-					</div>
-				</div>
-				<div class="row align-items-center justify-content-center" style="margin-top: 5px;">
-				<button class="btn  btn-sm"
-							style="background-color: #414f69;color: white;">Submit</button>
-							</div>
-			</div>
-		
-
-		</div>
-	</div>
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-	<script>
-    document.getElementById('screenReaderBtn').addEventListener('click', function() {
-        // Get the content of the page
-        const content = document.body.innerText; // You might want to filter or customize this
-
-        // Check if SpeechSynthesis is supported
-        if ('speechSynthesis' in window) {
-            // Create a new speech synthesis utterance
-            const utterance = new SpeechSynthesisUtterance(content);
-
-            // Set the voice, rate, pitch, and volume if needed
-            utterance.voice = speechSynthesis.getVoices().find(voice => voice.name === 'Google UK English Male'); // Example voice
-            utterance.rate = 1; // Speed of speech
-            utterance.pitch = 1; // Pitch of speech
-            utterance.volume = 1; // Volume of speech
-
-            // Speak the content
-            window.speechSynthesis.speak(utterance);
-        } else {
-            alert('Your browser does not support speech synthesis.');
-        }
-    });
-</script>
-
-
-</body>
-
-</html>

src/main/resources/templates/officer/officercomplaint.html

@@ -1,685 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>Main Page</title>
-	<!--Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!--Bootstrap CSS-->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	<style>
-		body {
-			font-family: 'Lato', sans-serif;
-		}
-
-		.card {
-			border-radius: 15px;
-			border: none;
-			padding: 20px;
-			background-color: #f0f4ff;
-			box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-			margin-top: 20px;
-		}
-
-		.card-title {
-			font-size: 1.2rem;
-			font-weight: bold;
-		}
-
-		.card-text {
-			color: #666;
-			margin-bottom: 20px;
-		}
-
-		.progress {
-			height: 20px;
-			border-radius: 10px;
-		}
-
-		.progress-bar {
-			background-color: #414f69;
-			/* New color for the progress bar */
-			border-radius: 10px;
-		}
-
-
-		.form-row {
-			margin-bottom: 20px;
-		}
-
-		.form-step {
-			display: none;
-		}
-
-		.form-step.active {
-			display: block;
-		}
-
-		.container {
-			max-width: 100%;
-		}
-
-		/*css for step 3*/
-		.complaint-icons {
-			display: flex;
-			justify-content: space-around;
-			margin-bottom: 20px;
-		}
-
-		.complaint-icon {
-			text-align: center;
-			cursor: pointer;
-		}
-
-		.complaint-icon img {
-			width: 50px;
-			height: 50px;
-		}
-/*complaints css*/
-		.complaint-fields {
-    display: none; /* Default hidden */
-}
-.complaint-fields.active {
-    display: block; /* Show when active */
-}
-/*complaints css*/
-
-		/*for radio button style*/
-		.radio-group {
-			display: flex;
-			align-items: center;
-			/* Ensures all items are aligned to the center */
-		}
-
-		.radio-item {
-			display: flex;
-			align-items: center;
-			margin-right: 20px;
-			/* Adds space between each radio item */
-		}
-
-		.radio-item input[type="radio"] {
-			margin-right: 10px;
-			/* Adds space between the radio button and its label */
-			vertical-align: middle;
-			/* Ensures vertical alignment */
-		}
-
-		.radio-item label {
-			margin: 0;
-			/* Removes any default margins that might affect alignment */
-		}
-
-		.back-button {
-			background: none;
-			border: none;
-			color: #000;
-			font-size: 16px;
-			cursor: pointer;
-			padding: 0;
-			margin-right: auto;
-			/* Align the button to the left */
-		}
-
-		.title {
-			text-align: center;
-			flex-grow: 1;
-			font-size: 24px;
-			font-weight: bold;
-			margin: 0;
-		}
-
-		/*css for map in step2*/
-		#map {
-			height: 300px;
-			width: 100%;
-			position: relative;
-			overflow: hidden;
-			max-width: 100%;
-		}
-
-		#search-container {
-			position: absolute;
-			top: 10px;
-			left: 50%;
-			transform: translateX(-50%);
-			z-index: 1000;
-			width: 500px;
-			box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
-			background-color: white;
-			border-radius: 4px;
-			padding: 0;
-			/* Removed extra padding to match the input width */
-		}
-
-		#search-box {
-			width: 100%;
-			/* Ensures the input takes up the entire width of the container */
-			padding: 5px;
-			font-size: 16px;
-			border: 1px solid #ccc;
-			border-radius: 4px;
-			/* Rounded corners matching the container */
-			box-sizing: border-box;
-			/* Makes sure padding is considered in width */
-		}
-
-		#suggestions {
-			border: 1px solid #ccc;
-			border-radius: 4px;
-			max-height: 200px;
-			overflow-y: auto;
-			margin-top: 5px;
-			background-color: white;
-			display: none;
-			width: 100%;
-			/* Matches the width of the container and input */
-			box-sizing: border-box;
-			/* Ensures the width includes borders and padding */
-		}
-
-		#suggestions ul {
-			list-style: none;
-			padding: 0;
-			margin: 0;
-		}
-
-		#suggestions ul li {
-			padding: 5px;
-			cursor: pointer;
-		}
-
-		#suggestions ul li:hover {
-			background-color: #f0f0f0;
-		}
-	</style>
-</head>
-
-<body>
-
-	<!-- Insert the header fragment -->
-	<div th:insert="fragments/header :: headerFragment"></div>
-
-	<!-- Progress Bar Section -->
-	<div class="container">
-		<div class="mt-1">
-			<div class="row align-items-center justify-content-center">
-				<button class="back-button" onclick="window.location.href='home';">← Back</button>
-
-				<h2 class="title">Registration of Complaint</h2>
-			</div>
-		</div>
-
-
-		<div class="card">
-			<h3>Instructions:</h3>
-			<p>Please fill your complaint details below and click the ‘Submit’ button at the bottom. You will be given a
-				Complaint Number upon submitting the complaint that you can use to track the complaint.</p>
-		</div>
-		<div class="container">
-			<!-- Card 1: Step 1 -->
-			<div class="card col-md-12 mb-3" id="step-1">
-				<div class="card-body">
-					<h5 class="card-title">1. Complaining Person's Details:</h5>
-					<div class="form-row">
-						<div class="col-md-4">
-							<label for="mobile">Mobile Number:</label>
-							<div class="input-group">
-								<input type="number" class="form-control" id="mobile"
-									placeholder="Enter your Mobile Number">
-								<div class="input-group-append">
-									<button type="button" id="getOtpBtn" class="btn btn-primary"
-										style="background-color: #414f69;">Get OTP</button>
-								</div>
-							</div>
-						</div>
-						<div class="col-md-4">
-							<div class="input-group" id="otpSection" style="display: none;">
-								<label for="verify">Verify OTP:</label>
-								<div class="input-group">
-									<input type="number" class="form-control" id="otp" placeholder="Enter OTP">
-									<div class="input-group-append">
-										<button type="button" id="verifyBtn" class="btn btn-success">Verify</button>
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-					<div class="form-row mt-3">
-						<div class="col-md-4">
-							<label for="name">Name:</label>
-							<input type="text" class="form-control" id="name" placeholder="Enter your name">
-						</div>
-						<div class="col-md-4">
-							<label for="gender">Gender/பாலினம்:<span class="required">*</span></label>
-							<div class="radio-group">
-								<div class="radio-item">
-									<input type="radio" id="male" name="gender" value="male" checked>
-									<label for="male">Male</label>
-								</div>
-								<div class="radio-item">
-									<input type="radio" id="female" name="gender" value="female">
-									<label for="female">Female</label>
-								</div>
-								<div class="radio-item">
-									<input type="radio" id="transgender" name="gender" value="transgender">
-									<label for="transgender">Transgender</label>
-								</div>
-							</div>
-						</div>
-						<div class="col-md-4">
-							<label for="email">Email:</label>
-							<input type="email" class="form-control" id="email" placeholder="Enter your email">
-						</div>
-					</div>
-				</div>
-			</div>
-
-			<!-- Card 2: Step 2 -->
-			<div class="card col-md-12 mb-3" id="step-2">
-				<div class="card-body">
-					<h5 class="card-title">2. Complaint Location Details:</h5>
-					<div class="form-row">
-						<div class="col-md-12">
-							<div id="map"></div>
-							<div id="search-container">
-								<input type="text" id="search-box" placeholder="Search for a location...">
-								<div id="suggestions"></div>
-							</div>
-							<label for="street">Street:</label>
-							<input type="text" class="form-control" id="street">
-						</div>
-					</div>
-				</div>
-			</div>
-
-			<!-- Card 3: Step 3 -->
-			<div class="card col-md-12 mb-3" id="step-3">
-				<div class="card-body">
-					<h5 class="card-title">3. Complaint Type:</h5>
-					<div class="complaint-icons">
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/road.png" alt="Pothole">
-							<p>Pothole</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/recycle.png" alt="garbage">
-							<p>Garbage</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/waste-bin.png" alt="broken-bin">
-							<p>Broken-Bin</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/street-lamp.png" alt="StreetLight">
-							<p>StreetLight</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/portable-bathroom.png" alt="public-toilet">
-							<p>Public Toilet</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/mosquito.png" alt="mosquito">
-							<p>Mosquito Menace</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/tsunami.png" alt="waterstag">
-							<p>WaterStagnation</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/sewage.png" alt="sewage">
-							<p>Storm Water Drains</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/dog.png" alt="dog">
-							<p>Street Dog</p>
-						</div>
-						<div class="complaint-icon" data-type="specific">
-							<img src="images/bad-weather.png" alt="weather">
-							<p>Tree Fallen</p>
-						</div>
-						<div class="complaint-icon" data-type="others">
-							<img src="images/menu.png" alt="Others">
-							<p>Others</p>
-						</div>
-					</div>
-					<div class="complaint-fields active" id="specific-fields">
-						<div class="form-row mt-3">
-							<div class="col-md-6">
-								<label for="complaint-title">Complaint Title:</label>
-								<input type="text" class="form-control" id="complaint-title"
-									placeholder="Enter complaint title">
-							</div>
-							<div class="col-md-6">
-								<label for="othercomplaint-details">Details of Complaint:</label>
-								<textarea class="form-control" id="othercomplaint-details" rows="3"
-									placeholder="Enter complaint details" maxlength="400"></textarea>
-							</div>
-						</div>
-						<div class="form-row mt-3">
-							<div class="col-md-6">
-								<label for="upload">Upload Photo Or Video:</label>
-								<input type="file" class="form-control" id="upload">
-							</div>
-						</div>
-					</div>
-
-					<div class="complaint-fields" id="others-fields" style="display:none;">
-						<div class="form-row mt-3">
-							<div class="col-md-4">
-								<label for="type">Type:</label>
-								<select class="form-control" id="type">
-									<option value="">Please Select</option>
-								</select>
-							</div>
-							<div class="col-md-4">
-								<label for="sub-type">Sub-Type:</label>
-								<select class="form-control" id="sub-type">
-									<option value="">Select complaint</option>
-								</select>
-							</div>
-							<div class="col-md-4">
-								<label for="uploadothers">Upload Photo or Video:</label>
-								<input type="file" class="form-control" id="uploadothers" accept="image/*,video/*">
-							</div>
-						</div>
-						<div class="form-row mt-3">
-							<div class="col-md-6">
-								<label for="othercomplaint-details">Details of Complaint:</label>
-								<textarea class="form-control" id="othercomplaint-details" rows="3"
-									placeholder="Enter complaint details" maxlength="400"></textarea>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-
-			
-		</div>
-	</div>
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-
-	<!-- Font Awesome for Icons -->
-	<script src="https://kit.fontawesome.com/a076d05399.js"></script>
-
-	<!-- Progress Bar Script -->
-	<script>
-		let currentStep = 1;
-
-		function showStep(step) {
-			$('.form-step').removeClass('active');
-			$('#step-' + step).addClass('active');
-			updateProgressBar(step);
-		}
-
-		function nextStep() {
-			if (currentStep < 4) {
-				currentStep++;
-				showStep(currentStep);
-			}
-		}
-
-		function prevStep() {
-			if (currentStep > 1) {
-				currentStep--;
-				showStep(currentStep);
-			}
-		}
-
-		function updateProgressBar(step) {
-			const progress = (step / 4) * 100;
-			$('.progress-bar').css('width', progress + '%').attr('aria-valuenow', progress);
-		}
-
-		$(document).ready(function () {
-			showStep(currentStep);
-		});
-
-
-		//for step3 onclick function
-		$(document).ready(function () {
-    $('.complaint-icon').click(function () {
-        const type = $(this).data('type');
-        const title = $(this).find('p').text().trim(); // Get the icon name
-
-        // Hide all fields initially
-        $('.complaint-fields').removeClass('active').hide();
-
-        if (type === 'specific') {
-            $('#specific-fields').addClass('active').show();
-            $('#complaint-title').val(title); // Set the complaint title to the icon name
-        } else if (type === 'others') {
-            $('#others-fields').addClass('active').show();
-            $('#complaint-title').val(''); // Clear the complaint title for 'Others'
-        }
-    });
-});
-
-		//for complaint group and complainttype wise options dropdown api
-		$(document).ready(function () {
-			const $type = $('#type');
-			const $subType = $('#sub-type');
-
-			$subType.prop('disabled', true);
-
-			// Fetch and populate the Type dropdown
-			$.ajax({
-				url: '/api/getComplaintCategories',
-				method: 'GET',
-				success: function (response) {
-					const data = typeof response === 'string' ? JSON.parse(response) : response;
-					//console.log('Response:', response); // Log the response to verify
-					let optionsHtml = '<option value="">Please Select</option>';
-					data.ComplaintCategoryListResult.forEach(function (group) {
-						optionsHtml += `<option value="${group.groupid}">${group.groupname}</option>`;
-					});
-					$type.html(optionsHtml);
-				},
-				error: function (error) {
-					console.error('Error fetching complaint categories:', error);
-				}
-			});
-
-			// Handle Type dropdown change
-			$type.change(function () {
-				const selectedType = $(this).val();
-				$subType.empty().append('<option value="">Select complaint</option>');
-
-				if (selectedType) {
-					$.ajax({
-						url: `/api/getComplaintSubTypes?groupId=${selectedType}`,
-						method: 'GET',
-						success: function (response) {
-							const data = typeof response === 'string' ? JSON.parse(response) : response;
-							const selectedGroup = data.ComplaintCategoryListResult[0];
-
-							if (selectedGroup && selectedGroup.group) {
-								$subType.prop('disabled', false);
-								selectedGroup.group.forEach(function (complaint) {
-									$subType.append(`<option value="${complaint.id}">${complaint.complaintname}</option>`);
-								});
-							} else {
-								$subType.prop('disabled', true);
-							}
-						},
-						error: function (error) {
-							console.error('Error fetching sub-types:', error);
-							$subType.prop('disabled', true);
-						}
-					});
-				} else {
-					$subType.prop('disabled', true);
-				}
-			});
-		});
-
-		//for step 1 otp input box
-		document.getElementById('getOtpBtn').addEventListener('click', function () {
-			document.getElementById('otpSection').style.display = 'flex';
-		});
-
-
-
-		
-
-
-
-
-
-
-		//for sweet alert
-		function showSuccessAlert() {
-			Swal.fire({
-				icon: 'success',
-				title: 'Complaint Registration Success',
-				text: 'Complaint Number 123456. Use this Number for Complaint Status Check.',
-				confirmButtonText: 'Back to Home',
-				confirmButtonColor: '#3085d6',
-			}).then((result) => {
-				if (result.isConfirmed) {
-					window.location.href = 'home';
-				}
-			});
-		}
-		//script for map in step2
-
-		// Script For Map
-
-		function initializeMap() {
-			var map = L.map('map', {attributionControl: false}).setView([11.1271, 78.6569], 7);
-
-			L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-				maxZoom: 19,
-				attributionControl: false,
-			}).addTo(map);
-
-			var currentMarker = null;
-
-			map.on('click', function (e) {
-				var lat = e.latlng.lat;
-				var lng = e.latlng.lng;
-
-				if (currentMarker) {
-					map.removeLayer(currentMarker);
-				}
-
-				currentMarker = L.marker([lat, lng]).addTo(map);
-
-				fetchLocationInfo(lat, lng, currentMarker);
-			});
-
-			document.getElementById('search-box').addEventListener('input', function () {
-				var query = this.value.trim();
-				if (query.length > 2) {
-					fetchSuggestions(query);
-				} else {
-					document.getElementById('suggestions').style.display = 'none';
-				}
-			});
-
-			document.getElementById('suggestions').addEventListener('click', function (e) {
-				if (e.target.tagName === 'LI') {
-					var latlng = JSON.parse(e.target.dataset.latlng);
-					map.setView(latlng, 13);
-
-					if (currentMarker) {
-						map.removeLayer(currentMarker);
-					}
-
-					currentMarker = L.marker(latlng).addTo(map);
-					fetchLocationInfo(latlng[0], latlng[1], currentMarker);
-
-					// Clear the search box value
-					document.getElementById('search-box').value = '';
-
-					// Hide the suggestions
-					document.getElementById('suggestions').style.display = 'none';
-				}
-			});
-		}
-
-		function fetchSuggestions(query) {
-			fetch(`https://nominatim.openstreetmap.org/search?format=json&q=${query}&limit=5`)
-				.then(response => response.json())
-				.then(data => {
-					var suggestions = document.getElementById('suggestions');
-					suggestions.innerHTML = '';
-
-					if (data.length > 0) {
-						suggestions.style.display = 'block';
-						var ul = document.createElement('ul');
-						data.forEach(function (result) {
-							var li = document.createElement('li');
-							li.textContent = result.display_name;
-							li.dataset.latlng = JSON.stringify([result.lat, result.lon]);
-							ul.appendChild(li);
-						});
-						suggestions.appendChild(ul);
-					} else {
-						suggestions.style.display = 'none';
-					}
-				})
-				.catch(error => console.error('Error fetching suggestions:', error));
-		}
-
-		function fetchLocationInfo(lat, lng, marker) {
-			fetch(`https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=${lat}&lon=${lng}`)
-				.then(response => response.json())
-				.then(data => {
-					const zoneMatch = data.display_name.match(/Zone (\d+)/);
-					const divisionMatch = data.display_name.match(/Division (\d+)/);
-					const wardMatch = data.display_name.match(/Ward (\d+)/);
-
-					const zone = zoneMatch ? `Zone: ${zoneMatch[1]}` : '';
-					const division = divisionMatch ? `Division: ${divisionMatch[1]}` : '';
-					const ward = wardMatch ? `Ward: ${wardMatch[1]}` : '';
-
-					const firstCommaIndex = data.display_name.indexOf(',');
-					const address = firstCommaIndex !== -1
-						? `Address: ${data.display_name.substring(firstCommaIndex + 1).trim()}`
-						: '';
-					const place1 = firstCommaIndex !== -1
-						? `Place: ${data.display_name.substring(0, firstCommaIndex).trim()}`
-						: `Place: ${data.display_name.trim()}`;
-
-					const place2 = firstCommaIndex !== -1
-						? data.display_name.substring(0, firstCommaIndex).trim()
-						: data.display_name.trim();
-
-					document.getElementById('street').value = place2;
-
-					let result = `${place1}<br>Latitude: ${lat}<br>Longitude: ${lng}<br>${address}`;
-					if (zone) {
-						result += `<br>${zone}`;
-					}
-					if (division) {
-						result += `<br>${division}`;
-					}
-					if (ward) {
-						result += `<br>${ward}`;
-					}
-
-					marker.bindTooltip(result, {permanent: false, direction: 'top'}).openTooltip();
-				})
-				.catch(error => console.error('Error fetching location data:', error));
-		}
-
-		document.addEventListener('DOMContentLoaded', function () {
-			setTimeout(initializeMap, 2000); // Delay map initialization by 2000 milliseconds (2 seconds)
-		});
-
-	</script>
-
-</body>
-
-</html>

src/main/resources/templates/staff/appoinment.html

@@ -1,217 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>Create Order</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	<!-- Include Font Awesome -->
-	<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
-	<style>
-		label {
-			font-weight: 700;
-			color: #2d5263;
-		}
-
-		/*for uploading fields*/
-		.custom-file-upload {
-			position: relative;
-			display: flex;
-			align-items: center;
-			border: 1px solid #d9dde4;
-			border-radius: 5px;
-			padding: 5px;
-			background-color: #f9fafb;
-			cursor: pointer;
-			margin-top: 5px;
-		}
-
-		.custom-file-upload input[type="file"] {
-			position: absolute;
-			left: 0;
-			top: 0;
-			width: 100%;
-			height: 100%;
-			opacity: 0;
-			cursor: pointer;
-		}
-
-		.custom-file-upload label {
-			display: flex;
-			justify-content: space-between;
-			width: 100%;
-			align-items: center;
-		}
-
-		.upload-text {
-			color: #a6adb5;
-
-			font-weight: 700;
-		}
-
-		.upload-icon i {
-			color: #a6adb5;
-			font-size: 18px;
-		}
-
-		.file-name {
-			margin-left: 10px;
-			color: #414f69;
-			font-size: 14px;
-
-		}
-	</style>
-</head>
-
-<body>
-
-
-	<div class="row align-items-center justify-content-center"
-		style="color: white;background-color:#414f69 ;padding: 10px;">
-		<h3 class="title resizable-content">Create Order</h3>
-	</div>
-	<div class="container mt-4">
-
-		<div class="mt-1">
-
-		</div>
-		<!-- Card Content -->
-		<div class="card p-3 resizable-content" style="margin-bottom: 8px;color: #414f69;">
-			<!-- Error message container -->
-			<div  id="errorMessages" style="background-color: #ff6666;color: white;"></div>
-
-			<!-- Card Content -->
-			<div class="card mb-3 resizable-content">
-				<div class="card-header text-white" style="background-color: #414f69;">Order Details</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-6">
-							<label>Order Number:</label>
-							<input type="text" class="form-control" id="orderNumber" placeholder="Enter Order Number">
-						</div>
-						<div class="col-md-6">
-							<label>Order Date:</label>
-							<input type="date" class="form-control" id="orderDate">
-						</div>
-						<div class="col-md-6">
-							<label>Order Title:</label>
-							<input type="text" class="form-control" id="orderTitle" placeholder="Enter Order Title">
-						</div>
-						<div class="col-md-6">
-							<label>Number Of Staff Required:</label>
-							<input type="number" class="form-control" id="staffRequired"
-								placeholder="Enter Staff Required...">
-						</div>
-						<div class="col-md-6">
-							<label>Order Description:</label>
-							<textarea class="form-control" id="details" rows="3" placeholder="description..."
-								maxlength="400"></textarea>
-						</div>
-						<div class="col-md-6">
-							<label>Order Document:</label>
-							<div class="custom-file-upload">
-								<input type="file" id="file-upload" class="form-control" onchange="displayFileName()">
-								<label for="file-upload" id="file-label">
-									<span class="upload-text" id="upload-text">Upload Order Document</span>
-									<span class="upload-icon">
-										<i class="fas fa-file-upload"></i>
-									</span>
-								</label>
-								<span id="file-name" class="file-name"></span>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-			<button class="btn btn-sm" style="background-color: #414f69; color: white;" id="createorder">Create
-				Order</button>
-		</div>
-
-	</div>
-
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-
-	<!-- JavaScript to handle button clicks -->
-
-	<script>
-		function displayFileName() {
-			const fileInput = document.getElementById('file-upload');
-			const fileNameSpan = document.getElementById('file-name');
-			const fileName = fileInput.files[0].name;
-			fileNameSpan.textContent = fileName;
-		}
-
-		$(document).ready(function () {
-			$('#createorder').click(function () {
-				let isValid = true;
-				let errorMessages = [];
-
-				// Clear previous error messages
-				$('#errorMessages').addClass('d-none').html('');
-
-				// Validate Order Number
-				if ($('#orderNumber').val().trim() == '') {
-					errorMessages.push('Enter the Order Number.');
-					isValid = false;
-				}
-
-				// Validate Order Date
-				if ($('#orderDate').val().trim() === '') {
-					errorMessages.push('Enter the Order Date.');
-					isValid = false;
-				}
-
-				// Validate Order Title
-				if ($('#orderTitle').val().trim() === '') {
-					errorMessages.push('Enter the Order Title.');
-					isValid = false;
-				}
-
-				// Validate Number Of Staff Required
-				if ($('#staffRequired').val().trim() === '') {
-					errorMessages.push('Enter the Number Of Staff Required.');
-					isValid = false;
-				}
-
-				// Validate Order Description
-				if ($('#details').val().trim() === '') {
-					errorMessages.push('Enter the Order Description.');
-					isValid = false;
-				}
-
-				// Validate Order Document
-				if ($('#file-upload').val().trim() === '') {
-					errorMessages.push('Upload the Order Document.');
-					isValid = false;
-				}
-
-				// Display error messages if any
-				if (!isValid) {
-					$('#errorMessages').removeClass('d-none').html(errorMessages.join('<br>'));
-				} else {
-					Swal.fire({
-						title: 'Success!',
-						text: 'Order Created Successfully',
-						icon: 'success',
-						confirmButtonText: 'OK',
-						background: '#f5f5f5',
-						confirmButtonColor: '#414f69'
-					});
-				}
-			});
-		});
-	</script>
-</body>
-
-</html>

src/main/resources/templates/staff/appoinmentscreen.html

@@ -1,251 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>Appoinment Screen</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<!-- Include Font Awesome -->
-	<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	<style>
-		label {
-			font-weight: 700;
-			color: #2d5263;
-		}
-
-		/*for radio button style*/
-		.radio-group {
-			display: flex;
-			align-items: center;
-			/* Ensures all items are aligned to the center */
-		}
-
-		.radio-item {
-			display: flex;
-			align-items: center;
-			margin-right: 20px;
-			/* Adds space between each radio item */
-		}
-
-		.radio-item input[type="radio"] {
-			margin-right: 10px;
-			/* Adds space between the radio button and its label */
-			vertical-align: middle;
-			/* Ensures vertical alignment */
-		}
-
-		.radio-item label {
-			margin: 0;
-			/* Removes any default margins that might affect alignment */
-		}
-
-		/*for check box*/
-		.checkbox-label {
-			display: block;
-			margin-bottom: 10px;
-			font-size: 16px;
-		}
-
-		/*for file uploading*/
-		.custom-file-upload {
-			position: relative;
-			display: flex;
-			align-items: center;
-			border: 1px solid #d9dde4;
-			border-radius: 5px;
-			padding: 5px;
-			background-color: #f9fafb;
-			cursor: pointer;
-			margin-top: 5px;
-		}
-
-		.custom-file-upload input[type="file"] {
-			position: absolute;
-			left: 0;
-			top: 0;
-			width: 100%;
-			height: 100%;
-			opacity: 0;
-			cursor: pointer;
-		}
-
-		.custom-file-upload label {
-			display: flex;
-			justify-content: space-between;
-			width: 100%;
-			align-items: center;
-		}
-
-		.upload-icon i {
-			color: #a6adb5;
-			font-size: 18px;
-		}
-
-		.file-name {
-			margin-left: 10px;
-			color: #414f69;
-			font-size: 14px;
-		}
-
-		#upload-text {
-			color: #a7adb5;
-
-		}
-		
-		 .order-no {
-            font-size: 14px;
-            color: lightSkyBlue;
-        }
-
-        .user-icon {
-            margin-right: 5px;
-            color: #414f69;
-        }
-	</style>
-</head>
-
-<body>
-
-<div class="row align-items-center justify-content-center" style="color: white;background-color:#414f69 ;padding: 10px;">
-				<h3 class="title resizable-content" >Appoinment Screen</h3>
-			</div>
-
-	<div class="container mt-4">
-
-		
-		<!-- Card Section -->
-		<div class="card p-3 resizable-content" style="margin-bottom: 8px;color: #414f69;">
-
-
-			<!-- Add the resizable-content class to the card sections -->
-			<div class="card mb-3 resizable-content">
-
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-12">
-							<label>Select Order</label>
-							<select class="form-control">
-								<option value="0">Select Order</option>
-								<option value="1">Order 1</option>
-								<option value="2">Order 2</option>
-							</select>
-						</div>
-					</div>
-
-				</div>
-
-			</div>
-			
-			
-	
-	        <div class="card mb-3 resizable-content">
-				<div class="card-body">
-	            <div class="row" style="font-weight: bolder;">
-	                <div class="col-md-6">
-	                    <label >Order No: 166565</label>
-	                </div>
-	            </div>
-	            <div class="row" style="font-weight: bolder;">
-	                <div class="col-md-6">
-	                    <p class="order-no">16 June 2024</p>
-	                </div>
-	                <div class="col-md-6">
-	                    <p><i class="fas fa-user user-icon"></i>85/100</p>
-	                </div>
-	            </div>
-	            <div class="row" >
-	                <div class="col-md-6">
-	                    <label>Order Type:</label>
-	                </div>
-	                
-	            </div>
-	            <div class="row">
-					<div class="col-md-6" style="font-weight: bolder;">
-						<p class="order-no">Order Description Long text</p>
-					</div>
-				</div>
-	            </div>
-	        </div>
-   
-			
-			
-		
-			<div class="card mb-3 resizable-content">
-
-
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-12">
-							<label>Assign Staff</label>
-							<select class="form-control">
-								<option value="0">Select Staff</option>
-								<option value="1">staff 1</option>
-								<option value="2">staff 2</option>
-							</select>
-						</div>
-						<br><br>
-						<div class="col-md-12" style="padding: 14px;">
-
-							<input type="text" class="form-control" value="" placeholder="Enter the Staff Name...">
-							<br>
-							<input type="text" class="form-control" value="" placeholder="Enter the Staff Name...">
-						</div>
-						<br>
-						<div class="col-md-12">
-
-							<label>Date Of Appoinment</label>
-							<input type="date" class="form-control" value="">
-
-						</div>
-
-
-
-					</div>
-				</div>
-
-			</div>
-			
-        <button class="btn btn-sm" style="background-color: #414f69; color: white;" id="addAppointmentBtn">Add Appointment</button>
-    
-
-
-
-
-		</div>
-
-
-
-
-	</div>
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-
-	<!-- JavaScript to handle button clicks -->
-	<script>
-        $(document).ready(function () {
-            $('#addAppointmentBtn').click(function () {
-                Swal.fire({
-                    title: 'Success!',
-                    text: 'Your appointment has been added',
-                    icon: 'success',
-                    confirmButtonText: 'OK',
-                    background: '#f5f5f5',
-                    confirmButtonColor: '#414f69'
-                });
-            });
-        });
-    </script>
-
-</body>
-
-</html>

src/main/resources/templates/staff/createorder.html

@@ -1,230 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>Create Order</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	<!-- Include Font Awesome -->
-	<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
-	<style>
-		label {
-			font-weight: 700;
-			color: #2d5263;
-		}
-
-		/*for uploading fields*/
-		.custom-file-upload {
-			position: relative;
-			display: flex;
-			align-items: center;
-			border: 1px solid #d9dde4;
-			border-radius: 5px;
-			padding: 5px;
-			background-color: #f9fafb;
-			cursor: pointer;
-			margin-top: 5px;
-		}
-
-		.custom-file-upload input[type="file"] {
-			position: absolute;
-			left: 0;
-			top: 0;
-			width: 100%;
-			height: 100%;
-			opacity: 0;
-			cursor: pointer;
-		}
-
-		.custom-file-upload label {
-			display: flex;
-			justify-content: space-between;
-			width: 100%;
-			align-items: center;
-		}
-
-		.upload-text {
-			color: #a6adb5;
-
-			font-weight: 700;
-		}
-
-		.upload-icon i {
-			color: #a6adb5;
-			font-size: 18px;
-		}
-
-		.file-name {
-			margin-left: 10px;
-			color: #414f69;
-			font-size: 14px;
-
-		}
-	</style>
-</head>
-
-<body>
-
-
-	<div class="row align-items-center justify-content-center"
-		style="color: white;background-color:#414f69 ;padding: 10px;">
-		<h3 class="title resizable-content">Create Order</h3>
-	</div>
-	<div class="container mt-4">
-
-		<div class="mt-1">
-
-		</div>
-		<!-- Card Section -->
-		<div class="card p-3 resizable-content" style="margin-bottom: 8px;color: #414f69;">
-
-
-			<!-- Add the resizable-content class to the card sections -->
-			<div class="card mb-3 resizable-content">
-				<div class="card-header text-white" style="background-color: #414f69;">Order Details
-				</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-6">
-							<label>Order Number:</label>
-							<input type="text" class="form-control" id="orderNumber" placeholder="Enter Order Number">
-							<span class="text-danger" id="orderNumberError"></span> <!-- Validation message -->
-						</div>
-						<div class="col-md-6">
-							<label>Order Date:</label>
-							<input type="date" class="form-control" id="orderDate">
-							<span class="text-danger" id="orderDateError"></span>
-						</div>
-						<div class="col-md-6">
-							<label>Order Title:</label>
-							<input type="text" class="form-control" id="orderTitle" placeholder="Enter Order Title">
-							<span class="text-danger" id="orderTitleError"></span>
-						</div>
-						<div class="col-md-6">
-							<label>Number Of Staff Required:</label>
-							<input type="number" class="form-control" id="staffRequired"
-								placeholder="Enter Staff Required...">
-							<span class="text-danger" id="staffRequiredError"></span>
-						</div>
-						<div class="col-md-6">
-							<label>Order Description:</label>
-							<textarea class="form-control" id="details" rows="3" placeholder="description..."
-								maxlength="400"></textarea>
-							<span class="text-danger" id="detailsError"></span>
-						</div>
-						<div class="col-md-6">
-							<label>Order Document:</label>
-							<div class="custom-file-upload">
-								<input type="file" id="file-upload" class="form-control" onchange="displayFileName()">
-								<label for="file-upload" id="file-label">
-									<span class="upload-text" id="upload-text">Upload Order Document</span>
-									<span class="upload-icon">
-										<i class="fas fa-file-upload"></i>
-									</span>
-								</label>
-								<span id="file-name" class="file-name"></span>
-								<span class="text-danger" id="fileUploadError"></span>
-							</div>
-						</div>
-
-
-
-					</div>
-				</div>
-
-			</div>
-			<button class="btn btn-sm" style="background-color: #414f69; color: white;" id="createorder">Create
-				Order</button>
-
-
-
-		</div>
-
-
-
-
-	</div>
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-
-	<!-- JavaScript to handle button clicks -->
-
-	<script>
-		function displayFileName() {
-			const fileInput = document.getElementById('file-upload');
-			const fileNameSpan = document.getElementById('file-name');
-			const fileName = fileInput.files[0].name;
-			fileNameSpan.textContent = fileName;
-		}
-		$(document).ready(function () {
-			$('#createorder').click(function () {
-				let isValid = true;
-
-				// Clear previous error messages
-				$('.text-danger').text('');
-
-				// Validate Order Number
-				if ($('#orderNumber').val().trim() == '') {
-					$('#orderNumberError').text('Enter the Order Number.');
-					isValid = false;
-				}
-
-				// Validate Order Date
-				if ($('#orderDate').val().trim() === '') {
-					$('#orderDateError').text('Enter the Order Date.');
-					isValid = false;
-				}
-
-				// Validate Order Title
-				if ($('#orderTitle').val().trim() === '') {
-					$('#orderTitleError').text('Enter the Order Title.');
-					isValid = false;
-				}
-
-				// Validate Number Of Staff Required
-				if ($('#staffRequired').val().trim() === '') {
-					$('#staffRequiredError').text('Enter the Number Of Staff Required.');
-					isValid = false;
-				}
-
-				// Validate Order Description
-				if ($('#details').val().trim() === '') {
-					$('#detailsError').text('Enter the Order Description.');
-					isValid = false;
-				}
-
-				// Validate Order Document
-				if ($('#file-upload').val().trim() === '') {
-					$('#fileUploadError').text('Upload the Order Document.');
-					isValid = false;
-				}
-
-				// If all fields are valid, show success message
-				if (isValid) {
-					Swal.fire({
-						title: 'Success!',
-						text: 'Order Created Successfully',
-						icon: 'success',
-						confirmButtonText: 'OK',
-						background: '#f5f5f5',
-						confirmButtonColor: '#414f69'
-					});
-				}
-			});
-		});
-
-
-	</script>
-</body>
-
-</html>

src/main/resources/templates/staff/schemegroup.html

@@ -1,186 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>CheckList User</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-
-</head>
-
-<body>
-
-	<!-- Insert the header fragment -->
-	<div th:insert="fragments/header :: headerFragment"></div>
-
-
-
-
-	<div class="mt-1">
-		<div class="row align-items-center justify-content-center">
-
-
-			<h4 class="title" style="color: #414f69;">Acknowledgement</h4>
-		</div>
-	</div>
-	<!-- Card Section -->
-	<div class="card p-3" style="margin-bottom: 8px;color: #414f69;">
-
-		<div class="row">
-			<!-- First two cards side by side -->
-			<div class="col-md-6">
-				<div class="card mb-3">
-					<div class="card-header text-white" style="background-color: #414f69;">
-						1. User Details
-					</div>
-					<div class="card-body">
-						<table class="table">
-							<tbody>
-								<tr>
-									<td>Name:</td>
-									<td>Yogesh</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Name:</td>
-									<td>John Doe</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Email:</td>
-									<td>john.doe@example.com</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Gender:</td>
-									<td>Male</td> <!-- Replace this value with dynamic data -->
-								</tr>
-							</tbody>
-						</table>
-					</div>
-
-
-				</div>
-			</div>
-
-			<div class="col-md-6">
-				<div class="card ">
-					<div class="card-header text-white" style="background-color: #414f69;">
-						2. Complaint Location Details
-					</div>
-					<div class="card-body">
-						<table class="table">
-							<tbody>
-								<tr>
-									<td>Name:</td>
-									<td>Yogesh</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Name:</td>
-									<td>John Doe</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Email:</td>
-									<td>john.doe@example.com</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Gender:</td>
-									<td>Male</td> <!-- Replace this value with dynamic data -->
-								</tr>
-							</tbody>
-						</table>
-					</div>
-				</div>
-			</div>
-		</div>
-
-		<!-- Third card full width -->
-		<div class="row mb-3">
-			<div class="col-md-12">
-				<div class="card">
-					<div class="card-header text-white" style="background-color: #414f69;">
-						3. Complaint Type
-					</div>
-					<div class="card-body">
-						<table class="table">
-							<tbody>
-								<tr>
-									<td>Name:</td>
-									<td>Yogesh</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Name:</td>
-									<td>John Doe</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Email:</td>
-									<td>john.doe@example.com</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Gender:</td>
-									<td>Male</td> <!-- Replace this value with dynamic data -->
-								</tr>
-							</tbody>
-						</table>
-					</div>
-				</div>
-			</div>
-		</div>
-
-		<div class="row">
-			<div class="col-md-12">
-				<div class="card">
-					<div class="card-header text-white" style="background-color: #414f69;">
-						3. Complaint Type
-					</div>
-					<div class="card-body">
-						<table class="table">
-							<tbody>
-								<tr>
-									<td>Name:</td>
-									<td>Yogesh</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Name:</td>
-									<td>John Doe</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Complainant Email:</td>
-									<td>john.doe@example.com</td> <!-- Replace this value with dynamic data -->
-								</tr>
-								<tr>
-									<td>Gender:</td>
-									<td>Male</td> <!-- Replace this value with dynamic data -->
-								</tr>
-							</tbody>
-						</table>
-					</div>
-				</div>
-			</div>
-		</div>
-
-	</div>
-
-
-
-
-
-
-
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-	<script>
-
-	</script>
-
-
-</body>
-
-</html>

src/main/resources/templates/staff/staffenrollment.html

@@ -1,316 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-
-<head>
-	<meta charset="UTF-8">
-	<title>Staff Enrollment</title>
-	<!-- Google Font -->
-	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" rel="stylesheet">
-	<!-- Bootstrap CSS -->
-	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
-	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
-	<!-- Include Font Awesome -->
-	<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
-	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
-	<style>
-		label {
-			font-weight: 700;
-			color: #2d5263;
-		}
-
-		/*for radio button style*/
-		.radio-group {
-			display: flex;
-			align-items: center;
-			/* Ensures all items are aligned to the center */
-		}
-
-		.radio-item {
-			display: flex;
-			align-items: center;
-			margin-right: 20px;
-			/* Adds space between each radio item */
-		}
-
-		.radio-item input[type="radio"] {
-			margin-right: 10px;
-			/* Adds space between the radio button and its label */
-			vertical-align: middle;
-			/* Ensures vertical alignment */
-		}
-
-		.radio-item label {
-			margin: 0;
-			/* Removes any default margins that might affect alignment */
-		}
-
-		/*for check box*/
-		.checkbox-label {
-			display: block;
-			margin-bottom: 10px;
-			font-size: 16px;
-		}
-
-		/*for file uploading*/
-		.custom-file-upload {
-			position: relative;
-			display: flex;
-			align-items: center;
-			border: 1px solid #d9dde4;
-			border-radius: 5px;
-			padding: 5px;
-			background-color: #f9fafb;
-			cursor: pointer;
-			margin-top: 5px;
-		}
-
-		.custom-file-upload input[type="file"] {
-			position: absolute;
-			left: 0;
-			top: 0;
-			width: 100%;
-			height: 100%;
-			opacity: 0;
-			cursor: pointer;
-		}
-
-		.custom-file-upload label {
-			display: flex;
-			justify-content: space-between;
-			width: 100%;
-			align-items: center;
-		}
-
-		.upload-icon i {
-			color: #a6adb5;
-			font-size: 18px;
-		}
-
-		.file-name {
-			margin-left: 10px;
-			color: #414f69;
-			font-size: 14px;
-		}
-
-		#upload-text {
-			color: #a7adb5;
-
-		}
-	</style>
-</head>
-
-<body>
-
-
-	<div class="row align-items-center justify-content-center"
-		style="color: white;background-color:#414f69 ;padding: 10px;">
-		<h3 class="title resizable-content">Staff Enrollment</h3>
-	</div>
-
-	<div class="container mt-4">
-
-
-		<!-- Card Section -->
-		<div class="card p-3 resizable-content" style="margin-bottom: 8px;color: #414f69;">
-
-
-			<!-- Add the resizable-content class to the card sections -->
-			<div class="card mb-3 resizable-content">
-				<div class="card-header text-white" style="background-color: #414f69;">Personal Information's
-				</div>
-				<div class="card-body">
-					<div class="row">
-						<div class="col-md-6">
-							<label>Name:</label>
-							<input type="text" class="form-control" value="" placeholder="Enter Name...">
-						</div>
-						<div class="col-md-6">
-							<label>Phone number:</label>
-							<input type="number" class="form-control" value="" placeholder="Enter the Phone Number...">
-						</div>
-						<div class="col-md-6">
-							<label>Gender:</label>
-							<div class="radio-group">
-								<div class="radio-item">
-									<input type="radio" id="male" name="gender" value="male" checked>
-									<label for="male">Male</label>
-								</div>
-								<div class="radio-item">
-									<input type="radio" id="female" name="gender" value="female">
-									<label for="female">Female</label>
-								</div>
-								<div class="radio-item">
-									<input type="radio" id="transgender" name="gender" value="transgender">
-									<label for="transgender">Transgender</label>
-								</div>
-							</div>
-						</div>
-						<div class="col-md-6">
-							<label>Date Of Birth:</label>
-							<input type="date" class="form-control" value="" placeholder="">
-						</div>
-						<div class="col-md-6">
-							<label>Education Qualification</label>
-							<select class="form-control">
-								<option value="0">Select Qualification</option>
-								<option value="1">B.E</option>
-								<option value="2">Bcom</option>
-							</select>
-						</div>
-						<div class="col-md-6">
-							<label>Scheme Group:</label>
-							<select class="form-control">
-								<option value="0">Select Scheme Group</option>
-								<option value="1"> Scheme Group 1</option>
-								<option value="2">  Scheme Group 2</option>
-							</select>
-						</div>
-
-						<div class="col-md-12">
-							<label>Additional Skills:</label>
-							<div class="row">
-								<div class="col-md-3">
-									<div class="form-check checkbox-label">
-										<input class="form-check-input" type="checkbox" id="typeing" name="skills"
-											value="typeing">
-										<label class="form-check-label" for="typeing">
-											Typing
-										</label>
-									</div>
-									</div>
-									<div class="col-md-3">
-									<div class="form-check checkbox-label">
-										<input class="form-check-input" type="checkbox" id="shortHand" name="skills"
-											value="shortHand">
-										<label class="form-check-label" for="shortHand">
-											ShortHand
-										</label>
-									</div>
-									</div>
-								
-								<div class="col-md-3">
-									<div class="form-check checkbox-label">
-										<input class="form-check-input" type="checkbox" id="dataentry" name="skills"
-											value="dataentry">
-										<label class="form-check-label" for="dataentry">
-											DataEntry
-										</label>
-									</div>
-									</div>
-									<div class="col-md-3">
-									<div class="form-check checkbox-label">
-										<input class="form-check-input" type="checkbox" id="others" name="skills"
-											value="others">
-										<label class="form-check-label" for="others">
-											Others
-										</label>
-									</div>
-									</div>
-								
-							</div>
-						</div>
-						<div class="col-md-12">
-							<label>Proof Documents:</label>
-							<div class="row">
-
-
-							<!-- First File Upload -->
-							<div class="col-md-6">
-							<div class="custom-file-upload">
-								<input type="file" id="file-upload-1" class="form-control"
-									onchange="displayFileName('file-upload-1', 'file-name-1')">
-								<label for="file-upload-1" id="file-label-1">
-									<span class="upload-text" id="upload-text">Upload Aadhar Card</span>
-									<span class="upload-icon">
-										<i class="fas fa-file-upload"></i>
-									</span>
-								</label>
-								<span id="file-name-1" class="file-name"></span>
-							</div>
-							</div>
-
-							<!-- Second File Upload -->
-							<div class="col-md-6">
-							<div class="custom-file-upload">
-								<input type="file" id="file-upload-2" class="form-control"
-									onchange="displayFileName('file-upload-2', 'file-name-2')">
-								<label for="file-upload-2" id="file-label-2">
-									<span class="upload-text" id="upload-text">Upload Bank Passbook</span>
-									<span class="upload-icon">
-										<i class="fas fa-file-upload"></i>
-									</span>
-								</label>
-								<span id="file-name-2" class="file-name"></span>
-							</div>
-							</div>
-
-							<!-- Third File Upload -->
-							<div class="col-md-6">
-							<div class="custom-file-upload">
-								<input type="file" id="file-upload-3" class="form-control"
-									onchange="displayFileName('file-upload-3', 'file-name-3')">
-								<label for="file-upload-3" id="file-label-3">
-									<span class="upload-text" id="upload-text">Upload Ration Casd</span>
-									<span class="upload-icon">
-										<i class="fas fa-file-upload"></i>
-									</span>
-								</label>
-								<span id="file-name-3" class="file-name"></span>
-							</div>
-							</div>
-							</div>
-						</div>
-						
-
-
-
-					</div>
-				</div>
-
-			</div>
-			<button class="btn btn-sm" style="background-color: #414f69;color: white;" id="staffenroll">Enroll
-				Staff</button>
-
-
-
-
-		</div>
-
-
-
-
-	</div>
-
-	<!-- Bootstrap JS -->
-	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
-	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
-	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
-	<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
-
-	<!-- JavaScript to handle button clicks -->
-	<script>
-		function displayFileName(inputId, outputId) {
-			const fileInput = document.getElementById(inputId);
-			const fileNameSpan = document.getElementById(outputId);
-			const fileName = fileInput.files[0]?.name || 'No file chosen';
-			fileNameSpan.textContent = fileName;
-		}
-		$(document).ready(function () {
-			$('#staffenroll').click(function () {
-				Swal.fire({
-					title: 'Success!',
-					text: 'Staff Enrolled Successfully',
-					icon: 'success',
-					confirmButtonText: 'OK',
-					background: '#f5f5f5',
-					confirmButtonColor: '#414f69'
-				});
-			});
-		});
-
-	</script>
-
-</body>
-
-</html>