You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1021 lines
42 KiB

2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
2 years ago
2 years ago
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
​
​
​
​
​
2 years ago
2 years ago
​
​
​
​
​
2 years ago
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
2 years ago
​
2 years ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
  1. <!DOCTYPE html>
  2. <html lang="en" dir="">
  3. <html xmlns:th="http://www.thymeleaf.org">
  4. <head th:replace="~{fragments/modules/base/head :: head}"></head>
  5. <style>
  6. .required{
  7. color: red;
  8. }
  9. #modalBody h4 {
  10. font-weight: bold;
  11. margin-top: 15px;
  12. margin-bottom: 10px;
  13. }
  14. #modalBody p {
  15. margin: 5px 0;
  16. }
  17. #modalBody hr {
  18. margin: 15px 0;
  19. }
  20. .comment {
  21. margin-bottom: 20px;
  22. }
  23. .comment p {
  24. margin: 0;
  25. }
  26. hr {
  27. border: 1px solid #ccc;
  28. margin-top: 20px;
  29. margin-bottom: 20px;
  30. }
  31. h5 {
  32. font-size: bold;
  33. }
  34. /* Limit the height of the dropdown menu and make it scrollable */
  35. .dropdown-menu {
  36. max-height: 200px; /* Adjust this value as needed */
  37. overflow-y: auto;
  38. }
  39. .col-4 {
  40. font-weight: bold;
  41. text-align: right;
  42. }
  43. .col-8 {
  44. padding-left: 20px;
  45. }
  46. .comment {
  47. padding: 10px 0;
  48. }
  49. .comment .text-muted {
  50. font-size: 0.9em;
  51. color: #6c757d;
  52. }
  53. .comment hr {
  54. border-top: 1px solid #ccc;
  55. }
  56. .comment .btn-link {
  57. font-size: 0.9em;
  58. text-decoration: underline;
  59. color: #007bff;
  60. }
  61. /* Make the modal body scrollable */
  62. #detailsModal .modal-body {
  63. max-height: 70vh; /* Limit the height to 70% of the viewport */
  64. overflow-y: auto; /* Enable vertical scrolling */
  65. }
  66. .card-box {
  67. border-radius: 20px;
  68. box-shadow: rgba(0, 0, 0, 0.5) 0px 3px 8px;
  69. }
  70. #followupCard {
  71. transition: transform 0.2s ease; /* Smooth scaling transition */
  72. cursor: pointer; /* Default cursor change */
  73. }
  74. #followupCard:hover {
  75. transform: scale(1.05); /* Slightly scale up on hover */
  76. cursor: pointer; /* Change cursor to hand symbol */
  77. }
  78. .card-block {
  79. padding: 20px;
  80. }
  81. .form-label {
  82. margin-bottom: 0.5rem;
  83. }
  84. input.form-control {
  85. padding: 10px;
  86. }
  87. .form-select {
  88. padding: 10px;
  89. height: 40px;
  90. }
  91. #employeeCard label{
  92. padding-top: 2%;
  93. }
  94. </style>
  95. <body>
  96. <!--[if lt IE 8]>
  97. <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
  98. <![endif]-->
  99. <div class="wrapper">
  100. <!-- header top menu Start -->
  101. <header th:replace="~{fragments/modules/base/header :: header}"></header>
  102. <!-- header top menu end -->
  103. <div class="page-wrap">
  104. <!--=============== Left Menu side Start ================-->
  105. <div th:replace="~{fragments/modules/base/menu :: menu}"></div>
  106. <!--=============== Left side End ================-->
  107. <div class="main-content">
  108. <div class="container-fluid">
  109. <div class="page-header mb-2">
  110. <div class="row align-items-end">
  111. <div class="col-lg-8">
  112. <div class="page-header-title">
  113. <i class="fa fa-list-alt bg-blue"></i>
  114. <div class="d-inline">
  115. <h5>Department Entries</h5>
  116. <span>Contributory Pension Scheme</span>
  117. </div>
  118. </div>
  119. </div>
  120. <div class="col-lg-4">
  121. <nav class="breadcrumb-container" aria-label="breadcrumb">
  122. <ol class="breadcrumb">
  123. <li class="breadcrumb-item"><a href="/gcc/index"><i class="ik ik-home"></i></a></li>
  124. <li class="breadcrumb-item" aria-current="page">Department Entries</li>
  125. <li class="breadcrumb-item" aria-current="page">NewEntry</li>
  126. <li class="breadcrumb-item active" aria-current="page">Contributory Pension Scheme</li>
  127. </ol>
  128. </nav>
  129. </div>
  130. </div>
  131. </div>
  132. <div class="row mt-4" >
  133. <div class="col-md-12">
  134. <div class="card">
  135. <div class="card-block">
  136. <h5 style="font-weight:bold;"> <span th:text="${deptname}" id="deptname"></span>&nbsp;Department</h5><h5 style="font-weight:bold;">New Entry - Contributory Pension</h5><span th:text="${filecategory}" id="filecategory" style="display:none"></span>
  137. <h5 style="font-weight:bold;"><span th:text="${deptId}" id="deptId" style="display:none"></span></h5>
  138. <span th:text="${userId}" id="userId" style="display:none"></span>
  139. <div class="row mb-4">
  140. <!-- Input Fields for Year Selection -->
  141. <!-- Start Year Dropdown as Button Dropdown -->
  142. <div class="col-md-4" >
  143. <label for="empCode" class="form-label fw-bold">Search by Employee No <span class="text-danger">*</span></label>
  144. <div class="dropdown">
  145. <input type="number" id="empCode" class="form-control" pattern="^[A-Za-z0-9]+$" placeholder="Enter Employee No" required>
  146. <small id="employeenoHelp" class="form-text text-muted">Only numeric characters (numbers) are allowed.</small>
  147. </div>
  148. </div>
  149. <div class="col-md-4 mt-20">
  150. <button id="searchButton" class="btn btn-primary mt-2" Style="height:38px;">Search</button>
  151. <!-- <button id="resetButton" class="btn btn-secondary mt-2">Reset</button> -->
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. </div>
  157. </div>
  158. <div class="row mb-4" id="employeeCard" style="display: none;">
  159. <div class="col-md-12">
  160. <div class="card">
  161. <div class="card-block">
  162. <h5 style="font-weight:bold;">New Entry - Contributory Pension - <span id="EmployeeCode"></span></h5>
  163. <hr>
  164. <div class="row">
  165. <!-- Employee No -->
  166. <div class="col-md-6">
  167. <label for="employeeno" class="form-label fw-bold">Employee No <span class="text-danger">*</span></label>
  168. <div class="dropdown">
  169. <input type="number" id="employeeno" class="form-control" readonly>
  170. </div>
  171. </div>
  172. <!-- Employee Name -->
  173. <div class="col-md-6">
  174. <label for="employeename" class="form-label fw-bold">Employee Name <span class="text-danger">*</span></label>
  175. <div class="dropdown">
  176. <input type="text" id="employeename" class="form-control" readonly>
  177. </div>
  178. </div>
  179. <div class="col-md-6">
  180. <label for="Department" class="form-label fw-bold">Department <span class="text-danger">*</span></label>
  181. <div class="dropdown">
  182. <input type="text" id="department" class="form-control" readonly>
  183. </div>
  184. </div>
  185. <div class="col-md-6">
  186. <label for="Designation" class="form-label fw-bold">Designation<span class="text-danger">*</span></label>
  187. <div class="dropdown">
  188. <input type="text" id="designation" class="form-control" readonly>
  189. </div>
  190. </div>
  191. <div class="col-md-6">
  192. <label for="classes" class="form-label fw-bold">Class<span class="text-danger">*</span></label>
  193. <div class="dropdown" >
  194. <input type="text" id="classes" class="form-control" readonly>
  195. </div>
  196. </div>
  197. <div class="col-sm-6">
  198. <label for="retirementdate" class="form-label fw-bold">Retirement Date <span class="text-danger">*</span></label>
  199. <input type="date" id="retirementdate" class="form-control" readonly>
  200. </div>
  201. <div class="col-md-6">
  202. <label for="pendingDuration" class="form-label fw-bold">Pending Duration <span class="text-danger">*</span></label>
  203. <div class="d-flex align-items-center">
  204. <div class="form-check" style="padding-right:10px;">
  205. <input type="radio" id="yespen" name="pendingDuration" value="Yes" class="form-check-input" onclick="toggleInputField(this)">
  206. <label for="yespen" class="form-check-label">Yes</label>
  207. </div>
  208. <div class="form-check">
  209. <input type="radio" id="nopen" name="pendingDuration" value="No" class="form-check-input" onclick="toggleInputField(this)">
  210. <label for="nopen" class="form-check-label">No</label>
  211. </div>
  212. </div>
  213. <div id="clickyesdiv" style="display: none; margin-top: 10px;">
  214. <label for="clickyes" class="form-label">Please specify:<span class="text-danger">*</span></label>
  215. <input type="text" id="Clickyes" class="form-control" placeholder="Enter Pending Duration">
  216. </div>
  217. </div>
  218. <div class="col-md-6">
  219. <label for="retirement" class="form-label fw-bold">Type Of Retirement<span class="text-danger">*</span></label>
  220. <div class="dropdown" >
  221. <select id="retirement" class="form-select" style="width: 100%;" required>
  222. </select>
  223. </div>
  224. </div>
  225. <div class="col-md-6">
  226. <label for="filesentuac" class="form-label fw-bold">
  227. Whether file sent to UAC (if yes, Date)
  228. <span class="text-danger">*</span>
  229. </label>
  230. <div class="d-flex align-items-center">
  231. <div class="form-check" style="padding-right:10px;">
  232. <input type="radio" id="yes" name="filesentuac" class="form-check-input" value="yes">
  233. <label for="yes" class="form-check-label">Yes</label>
  234. </div>
  235. <br>
  236. <div class="form-check">
  237. <input type="radio" id="no" name="filesentuac" class="form-check-input" value="no">
  238. <label for="no" class="form-check-label">No</label>
  239. </div>
  240. </div>
  241. <div class="dropdown" id="dateInputContainer" style="display: none; margin-top: 10px;">
  242. <input type="date" id="dateInput" name="filesentuac_date" class="form-control" onclick="this.showPicker()" >
  243. </div>
  244. </div>
  245. <!-- <div class="col-md-6">
  246. <label for="pendingDuration" class="form-label fw-bold">
  247. Pending Duration
  248. <span class="text-danger">*</span>
  249. </label>
  250. <div class="d-flex align-items-center">
  251. <div class="form-check" style="padding-right:10px;">
  252. <input type="radio" id="pendingDurationYes" name="pendingDuration" value="yes" class="form-check-input">
  253. <label for="pendingDurationYes" class="form-check-label">Yes</label>
  254. </div>
  255. <div class="form-check">
  256. <input type="radio" id="pendingDurationNo" name="pendingDuration" value="no" class="form-check-input">
  257. <label for="pendingDurationNo" class="form-check-label">No</label>
  258. </div>
  259. </div>
  260. <div class="dropdown" id="pendingDurationInputContainer" style="display: none; margin-top: 10px;">
  261. <input type="text" id="pendingDurationInput" name="pendingDurationValue" class="form-control" placeholder="Enter details for pending duration">
  262. </div>
  263. </div> -->
  264. <div class="col-md-6">
  265. <label for="cpsamount" class="form-label fw-bold">
  266. Whether CPS Amount Settled
  267. <span class="text-danger">*</span>
  268. </label>
  269. <div class="d-flex align-items-center">
  270. <div class="form-check" style="padding-right:10px;">
  271. <input type="radio" id="yes1" name="cpsamount" class="form-check-input" value="yes">
  272. <label for="yes1" class="form-check-label">Yes</label>
  273. </div>
  274. <div class="form-check">
  275. <input type="radio" id="no1" name="cpsamount" class="form-check-input" value="no">
  276. <label for="no1" class="form-check-label">No</label>
  277. </div>
  278. </div>
  279. <div class="dropdown" id="cpsAmountInputContainer" style="display: none; margin-top: 10px;">
  280. <input type="number" id="cpsAmountInput" name="cpsamount_value" class="form-control"
  281. placeholder="Enter CPS Amount" min="1" oninput="validatePositiveNumber(this)">
  282. </div>
  283. </div>
  284. <div class="col-md-6">
  285. <label for="elamount" class="form-label fw-bold">
  286. Whether EL/LPA Amount Settled
  287. <span class="text-danger">*</span>
  288. </label>
  289. <div class="d-flex align-items-center">
  290. <div class="form-check" style="padding-right:10px;">
  291. <input type="radio" id="yes2" name="elamount" class="form-check-input" value="yes">
  292. <label for="yes2" class="form-check-label">Yes</label>
  293. </div>
  294. <div class="form-check">
  295. <input type="radio" id="no2" name="elamount" class="form-check-input" value="no">
  296. <label for="no2" class="form-check-label">No</label>
  297. </div>
  298. </div>
  299. <div class="dropdown" id="elAmountInputContainer" style="display: none; margin-top: 10px;">
  300. <input type="number" id="elAmountInput" name="elamount_value" class="form-control"
  301. placeholder="Enter EL/LPA Amount" min="1" oninput="validatePositiveNumber(this)">
  302. </div>
  303. </div>
  304. <div class="col-md-6">
  305. <label for="spfgsamount" class="form-label fw-bold">
  306. Whether SPFGS Amount Settled
  307. <span class="text-danger">*</span>
  308. </label>
  309. <div class="d-flex align-items-center">
  310. <div class="form-check" style="padding-right:10px;">
  311. <input type="radio" id="yes3" name="spfgsamount" class="form-check-input" value="yes">
  312. <label for="yes3" class="form-check-label">Yes</label>
  313. </div>
  314. <div class="form-check">
  315. <input type="radio" id="no3" name="spfgsamount" class="form-check-input" value="no">
  316. <label for="no3" class="form-check-label">No</label>
  317. </div>
  318. </div>
  319. <div class="dropdown" id="spfgsAmountInputContainer" style="display: none; margin-top: 10px;">
  320. <input type="number" id="spfgsAmountInput" name="spfgsamount_value" class="form-control"
  321. placeholder="Enter SPFGS Amount" min="1" oninput="validatePositiveNumber(this)">
  322. </div>
  323. </div>
  324. <div class="col-md-12">
  325. <label for="Remarks" class="form-label fw-bold">Comments/Remarks <span class="text-danger">*</span></label>
  326. <div class="dropdown">
  327. <textarea id="remarks" class="form-control" rows="4" placeholder="Enter your remarks here" required></textarea>
  328. </div>
  329. </div>
  330. </div>
  331. <div class="row mt-4">
  332. <div class="col-12 d-flex justify-content-center">
  333. <button id="lfauditButton" class="btn btn-primary mt-2 mx-2">Submit</button>
  334. <button id="cancelButton" class="btn btn-secondary mt-2">Cancel</button>
  335. </div>
  336. </div>
  337. </div>
  338. </div>
  339. </div>
  340. </div>
  341. </div>
  342. </div>
  343. <div id="pageLoader" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); z-index: 9999; text-align: center;">
  344. <div style="position: relative; top: 50%; transform: translateY(-50%);">
  345. <div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;">
  346. <span class="sr-only">Loading...</span>
  347. </div>
  348. <!-- Add the 'Please wait' text below the spinner -->
  349. <p style="margin-top: 1rem; font-size: 1.2rem; color: #007bff;">Please wait...</p>
  350. </div>
  351. </div>
  352. <footer th:replace="~{fragments/modules/base/footer :: footer}"></footer>
  353. </div>
  354. </div>
  355. <div th:replace="~{fragments/modules/base/app_module_menu_box :: div}"></div>
  356. <script th:replace="~{fragments/modules/base/script :: script}"></script>
  357. <script src="node_modules/tempusdominus-bootstrap-4/build/js/tempusdominus-bootstrap-4.min.js"></script>
  358. <!-- Bootstrap 5 JS -->
  359. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
  360. <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  361. <script>
  362. $(document).ready(function (){
  363. // Handle Search button click
  364. $('#searchButton').on('click', function () {
  365. const empCode = $('#empCode').val();
  366. console.log("empCode",empCode);
  367. if (empCode) {
  368. $('#pageLoader').show();
  369. document.getElementById("employeeCard").style.display = "block";
  370. }else{
  371. Swal.fire({
  372. icon: "warning", // Display a warning icon
  373. title: "Missing Employee Number",
  374. text: "Please enter an employee number to proceed.",
  375. confirmButtonText: "OK",
  376. customClass: {
  377. confirmButton: "btn btn-primary" // Optional styling for the button
  378. }
  379. });
  380. //document.getElementById("newemployeeCard").style.display = "block";
  381. return; // Stop further execution if empCode is not provided
  382. }
  383. // Format dates to dd-MM-yyyy
  384. $('#pageLoader').show();
  385. $('#employeeCard').hide();
  386. $('#newemployeeCard').hide();
  387. $('#retirement').val('');
  388. $('#dateInput').val('');
  389. $('#remarks').val('');
  390. $('#pendingDurationInput').val('');
  391. $('#cpsAmountInput').val('');
  392. $('#elAmountInput').val('');
  393. $('#spfgsAmountInput').val('');
  394. $('input[name="filesentuac"]').prop('checked', false);
  395. $('input[name="pendingDuration"]').prop('checked', false);
  396. $('input[name="cpsamount"]').prop('checked', false);
  397. $('input[name="elamount"]').prop('checked', false);
  398. $('input[name="spfgsamount"]').prop('checked', false);
  399. // Call the API
  400. $('#pageLoader').show();
  401. $.ajax({
  402. url: '/gcc/api/department/newentry/cpsexists', // Endpoint to check existence
  403. type: 'GET',
  404. data: { empCode: empCode },
  405. success: function (existsResponse) {
  406. console.log("Exists API Response:", existsResponse);
  407. $('#pageLoader').hide(); // Hide loader after the first API response
  408. if (existsResponse && existsResponse.exists) {
  409. console.log(`Employee Code ${empCode} exists in the database.`);
  410. Swal.fire({
  411. icon: "warning",
  412. title: "Already Exists",
  413. text: "This employee number already exists.",
  414. confirmButtonText: "OK",
  415. customClass: {
  416. confirmButton: "btn btn-primary"
  417. }
  418. });
  419. return; // Exit if employee already exists
  420. }
  421. $('#pageLoader').show();
  422. $.ajax({
  423. url: '/gcc/api/department/newentry/employeedetails', // Correct API URL
  424. type: 'GET',
  425. data: { empCode: empCode },
  426. success: function (response) {
  427. $('#pageLoader').hide();
  428. console.log("response:", response.list);
  429. if (response.list && response.list.length > 0) {
  430. // Clear existing data
  431. let employeeDetails = response.list[0];
  432. console.log("employeedetails",response);
  433. const loggedInDeptId = $('#deptId').text().trim(); // Get logged-in deptId dynamically
  434. // Validate department ID
  435. if (employeeDetails.ID_DEPT !== loggedInDeptId) {
  436. Swal.fire({
  437. icon: "error",
  438. title: "Access Denied",
  439. text: "This employee does not belong to your department. Please try again with a valid employee code.",
  440. confirmButtonText: "OK",
  441. customClass: {
  442. confirmButton: "btn btn-danger"
  443. }
  444. });
  445. return; // Exit if the department does not match
  446. }
  447. // Function to handle radio button state based on retirement date
  448. function handlePendingDurationState() {
  449. const currentDate = new Date().toISOString().split('T')[0]; // Get today's date in YYYY-MM-DD format
  450. const retirementDate = employeeDetails.RETIREMENT_DATE; // Assuming this comes in YYYY-MM-DD format
  451. const yesRadio = document.getElementById("yespen");
  452. const noRadio = document.getElementById("nopen");
  453. const inputFieldDiv = document.getElementById('clickyesdiv');
  454. if (retirementDate <= currentDate) {
  455. // If retirement date is less than or equal to current date, disable 'Yes' option
  456. yesRadio.checked = true;
  457. inputFieldDiv.style.display = 'block';
  458. noRadio.disabled = true; // Default to 'No'
  459. } else {
  460. // If retirement date is greater than current date, disable 'No' option
  461. noRadio.checked = true;
  462. yesRadio.disabled = true; // Default to 'Yes'
  463. }
  464. }
  465. // Call the function after fetching `employeeDetails`
  466. handlePendingDurationState();
  467. $('#employeeno').val(employeeDetails.EMPLOYEE_CODE);
  468. $('#employeename').val(employeeDetails.EMPLOYEE_NAME);
  469. $('#department').val(employeeDetails.DEPARTMENT);
  470. $('#designation').val(employeeDetails.DESIGNATION);
  471. $('#classes').val(employeeDetails.GROUP_TYPE);
  472. $('#retirementdate').val(employeeDetails.RETIREMENT_DATE);
  473. $('#EmployeeCode').text(empCode);
  474. //show the modal
  475. $('#employeeCard').show();
  476. } else {
  477. //$('#pageLoader').hide();
  478. //document.getElementById("newemployeeCard").style.display = "block";
  479. Swal.fire({
  480. icon: "warning", // Display a warning icon
  481. title: "No Data Found",
  482. text: "No details found for this employee number.",
  483. confirmButtonText: "OK",
  484. customClass: {
  485. confirmButton: "btn btn-primary" // Optional styling for the button
  486. }
  487. });
  488. //document.getElementById("newemployeeCard").style.display = "block"; // Show the new employee card
  489. }
  490. },
  491. error: function () {
  492. $('#pageLoader').hide(); // Hide loader on error
  493. Swal.fire({
  494. icon: "error",
  495. title: "Error",
  496. text: "An error occurred while fetching data. Please try again.",
  497. confirmButtonText: "OK",
  498. });
  499. }
  500. });
  501. },
  502. error: function () {
  503. $('#pageLoader').hide();
  504. Swal.fire({
  505. icon: "error",
  506. title: "Error",
  507. text: "An error occurred while fetching data. Please try again.",
  508. confirmButtonText: "OK",
  509. });
  510. }
  511. });
  512. });
  513. })
  514. function toggleInputField(radio) {
  515. const inputFieldDiv = document.getElementById('clickyesdiv');
  516. if (radio.value === "Yes") {
  517. inputFieldDiv.style.display = 'block';
  518. } else {
  519. inputFieldDiv.style.display = 'none';
  520. document.getElementById('Clickyes').value = ''; // Clear the input field
  521. }
  522. }
  523. $(document).ready(function () {
  524. function loadRetirementTypes() {
  525. $.ajax({
  526. url: "/gcc/api/getRetrimentTypes",
  527. type: "GET",
  528. success: function (data) {
  529. var dropdown = $("#retirement");
  530. dropdown.empty();
  531. dropdown.append('<option value="" selected>-- Select Option --</option>');
  532. $.each(data, function (key, entry) {
  533. if (entry.retriment_type !== "Provisional") { // Exclude "Provisional"
  534. dropdown.append($('<option></option>').attr('value', entry.retriment_type).text(entry.retriment_type));
  535. }
  536. });
  537. },
  538. error: function () {
  539. console.log("Error loading dropdown data.");
  540. }
  541. });
  542. }
  543. // Call function on page load
  544. loadRetirementTypes();
  545. });
  546. // Trigger search on pressing Enter key
  547. $('#empCode').on('keydown', function (event) {
  548. if (event.key === 'Enter') {
  549. event.preventDefault(); // Prevent default form submission or page reload
  550. const empCode = $('#empCode').val(); // Get the value of empCode
  551. if (!empCode) {
  552. // Show Swal alert if the employee number is missing
  553. Swal.fire({
  554. icon: "warning", // Display a warning icon
  555. title: "Missing Employee Number",
  556. text: "Please enter an employee number to proceed.",
  557. confirmButtonText: "OK",
  558. customClass: {
  559. confirmButton: "btn btn-primary" // Optional styling for the button
  560. }
  561. });
  562. return; // Stop further execution
  563. }
  564. $('#searchButton').click(); // Trigger the click event of the search button
  565. }
  566. });
  567. // Handle close button click
  568. $('#cancelButton').click(function () {
  569. // Clear the input field value
  570. $('#empCode').val('');
  571. document.getElementById('dateInputContainer').style.display = 'none';
  572. document.getElementById('pendingDurationInputContainer').style.display = 'none';
  573. document.getElementById('cpsAmountInputContainer').style.display = 'none';
  574. document.getElementById('elAmountInputContainer').style.display = 'none';
  575. document.getElementById('spfgsAmountInputContainer').style.display = 'none';
  576. // Hide the card
  577. $('#employeeCard').hide();
  578. });
  579. // Handle close button click
  580. $('#cancelButtonnew').click(function () {
  581. // Clear the input field value
  582. $('#empCode').val('');
  583. $('#newemployeeCard').hide();
  584. });
  585. // Set the max attribute to today's date to disable future dates
  586. document.addEventListener("DOMContentLoaded", function () {
  587. let today = new Date().toISOString().split("T")[0];
  588. document.getElementById("dateInput").setAttribute("max", today);
  589. });
  590. document.querySelectorAll('input[name="filesentuac"]').forEach(radio => {
  591. radio.addEventListener('change', function () {
  592. const dateInputContainer = document.getElementById('dateInputContainer');
  593. if (this.value === 'yes') {
  594. dateInputContainer.style.display = 'block'; // Show the input field
  595. } else {
  596. dateInputContainer.style.display = 'none'; // Hide the input field
  597. document.getElementById('dateInput').value = ''; // Clear the input field
  598. }
  599. });
  600. });
  601. document.querySelectorAll('input[name="cpsamount"]').forEach(radio => {
  602. radio.addEventListener('change', function () {
  603. const cpsAmountInputContainer = document.getElementById('cpsAmountInputContainer');
  604. if (this.value === 'yes') {
  605. cpsAmountInputContainer.style.display = 'block'; // Show the input field
  606. } else {
  607. cpsAmountInputContainer.style.display = 'none'; // Hide the input field
  608. document.getElementById('cpsAmountInput').value = ''; // Clear the input field
  609. }
  610. });
  611. });
  612. document.querySelectorAll('input[name="elamount"]').forEach(radio => {
  613. radio.addEventListener('change', function () {
  614. const elAmountInputContainer = document.getElementById('elAmountInputContainer');
  615. if (this.value === 'yes') {
  616. elAmountInputContainer.style.display = 'block'; // Show the input field
  617. } else {
  618. elAmountInputContainer.style.display = 'none'; // Hide the input field
  619. document.getElementById('elAmountInput').value = ''; // Clear the input field
  620. }
  621. });
  622. });
  623. document.querySelectorAll('input[name="spfgsamount"]').forEach(radio => {
  624. radio.addEventListener('change', function () {
  625. const spfgsAmountInputContainer = document.getElementById('spfgsAmountInputContainer');
  626. if (this.value === 'yes') {
  627. spfgsAmountInputContainer.style.display = 'block'; // Show the input field
  628. } else {
  629. spfgsAmountInputContainer.style.display = 'none'; // Hide the input field
  630. document.getElementById('spfgsAmountInput').value = ''; // Clear the input field
  631. }
  632. });
  633. });
  634. function validatePositiveNumber(input) {
  635. if (input.value < 1) {
  636. input.value = "";
  637. }
  638. }
  639. function saveNewEntryDetailsPensionScheme() {
  640. let selecteduacValue = $('input[name="filesentuac"]:checked').val();
  641. let uacDate = null;
  642. let selectedPendingDurationValue = $('input[name="pendingDuration"]:checked').val();
  643. let selectedReasonValue = $('#Clickyes').val();
  644. if (selecteduacValue === 'yes') {
  645. uacDate = $('#dateInput').val();
  646. if (!uacDate) {
  647. Swal.fire({
  648. icon: 'warning',
  649. title: 'Validation Error',
  650. text: 'Please Enter UAC Date',
  651. confirmButtonText: 'OK'
  652. });
  653. return; // Stop further execution if validation fails
  654. }
  655. }
  656. let pendingDuration= $('input[name="pendingDuration"]:checked').val();
  657. let pendingDurationReason=null;
  658. if (pendingDuration === 'yes' ) {
  659. pendingDurationReason = $('#pendingDurationInput').val(); // Retrieve the amount if available, else null
  660. if (!pendingDurationReason) {
  661. Swal.fire({
  662. icon: 'warning',
  663. title: 'Validation Error',
  664. text: 'Please Enter Pending Reason',
  665. confirmButtonText: 'OK'
  666. });
  667. return; // Stop further execution if validation fails
  668. }
  669. }
  670. let selcpsamount = $('input[name="cpsamount"]:checked').val();
  671. let selcpsamountval = null;
  672. if (selcpsamount === 'yes') {
  673. selcpsamountval = $('#cpsAmountInput').val();
  674. if (!selcpsamountval || selcpsamountval <= 0) {
  675. Swal.fire({
  676. icon: 'warning',
  677. title: 'Validation Error',
  678. text: 'Please enter a valid CPS Amount greater than zero',
  679. confirmButtonText: 'OK'
  680. });
  681. return ; // Stop further execution
  682. }
  683. }
  684. let selelamount = $('input[name="elamount"]:checked').val();
  685. let selelamountval = null;
  686. if (selelamount === 'yes') {
  687. selelamountval = $('#elAmountInput').val();
  688. if (!selelamountval || selelamountval <= 0) {
  689. Swal.fire({
  690. icon: 'warning',
  691. title: 'Validation Error',
  692. text: 'Please enter a valid EL/LPA Amount greater than zero',
  693. confirmButtonText: 'OK'
  694. });
  695. return ; // Stop further execution
  696. }
  697. }
  698. let selspfgsamount = $('input[name="spfgsamount"]:checked').val();
  699. let selspfgsamountval = null;
  700. if (selspfgsamount === 'yes') {
  701. selspfgsamountval = $('#spfgsAmountInput').val().trim(); // Trim input to remove spaces
  702. if (!selspfgsamountval || selspfgsamountval <= 0) {
  703. Swal.fire({
  704. icon: 'warning',
  705. title: 'Validation Error',
  706. text: 'Please enter a valid SPFGS Amount greater than zero',
  707. confirmButtonText: 'OK'
  708. });
  709. return; // Stop further execution if validation fails
  710. }
  711. }
  712. // Check for "Yes" in Pending Duration
  713. if (selectedPendingDurationValue === 'Yes') {
  714. selectedReasonPending = $('#Clickyes').val()?.trim() || null;
  715. if (!selectedReasonPending) {
  716. Swal.fire({
  717. icon: 'warning',
  718. title: 'Validation Error',
  719. text: 'Please specify the reason for selecting "Yes" for Pending Duration.',
  720. confirmButtonText: 'OK'
  721. });
  722. return;
  723. }
  724. }
  725. // Collecting input values
  726. let entryDetails = {
  727. empNo: $('#employeeno').val(),
  728. empName: $('#employeename').val(),
  729. deptName: $('#department').val(),
  730. designation: $('#designation').val(),
  731. classes: $('#classes').val(),
  732. retirementdate: $('#retirementdate').val()?.trim(),
  733. fileMovedBy: $('#userId').text().trim(),
  734. remarks: $('#remarks').val(),
  735. retirementType: $('#retirement').val(),
  736. uac: selecteduacValue,
  737. uacDate: uacDate,
  738. pendingDuration: selectedPendingDurationValue,
  739. reasonPending: selectedReasonValue || null,
  740. cps: selcpsamount,
  741. cpsAmount: selcpsamountval,
  742. elOrLpa: selelamount,
  743. elOrLpaAmount:selelamountval,
  744. spfgs: selspfgsamount,
  745. spfgsAmount: selspfgsamountval,
  746. deptId: $('#deptId').text().trim(),
  747. filecategory:$('#filecategory').text().trim()
  748. };
  749. if(!entryDetails.retirementType){
  750. Swal.fire({
  751. icon: 'warning',
  752. title: 'Validation Error!',
  753. text: 'Type of Retirement is required.',
  754. confirmButtonText: 'OK'
  755. });
  756. return;
  757. }
  758. if(!entryDetails.uac){
  759. Swal.fire({
  760. icon: 'warning',
  761. title: 'Validation Error!',
  762. text: 'uac is required.',
  763. confirmButtonText: 'OK'
  764. });
  765. return;
  766. }
  767. if(!entryDetails.pendingDuration){
  768. Swal.fire({
  769. icon: 'warning',
  770. title: 'Validation Error!',
  771. text: 'Pending Duration is required!.',
  772. confirmButtonText: 'OK'
  773. });
  774. return;
  775. }
  776. if(!entryDetails.cps){
  777. Swal.fire({
  778. icon: 'warning',
  779. title: 'Validation Error!',
  780. text: 'CPS is required.',
  781. confirmButtonText: 'OK'
  782. });
  783. return;
  784. }
  785. if(!entryDetails.elOrLpa){
  786. Swal.fire({
  787. icon: 'warning',
  788. title: 'Validation Error!',
  789. text: 'EL/LPA is required.',
  790. confirmButtonText: 'OK'
  791. });
  792. return;
  793. }
  794. if(!entryDetails.spfgs){
  795. Swal.fire({
  796. icon: 'warning',
  797. title: 'Validation Error!',
  798. text: 'SPFGS is required.',
  799. confirmButtonText: 'OK'
  800. });
  801. return;
  802. }
  803. if(!entryDetails.remarks){
  804. Swal.fire({
  805. icon: 'warning',
  806. title: 'Validation Error!',
  807. text: 'Remarks is required.',
  808. confirmButtonText: 'OK'
  809. });
  810. return;
  811. }
  812. console.log("entrydetails:>>", entryDetails);
  813. $('#lfauditButton').prop('disabled', true).text('Processing...');
  814. // AJAX call to save data
  815. $.ajax({
  816. url: '/gcc/api/department/newentry/saveEmployeeDetailsPensionScheme',
  817. type: 'POST',
  818. contentType: 'application/json',
  819. data: JSON.stringify(entryDetails),
  820. success: function (response) {
  821. $('#lfauditButton').prop('disabled', false).text('Submit');
  822. console.log("saveddetails:",entryDetails);
  823. Swal.fire({
  824. icon: 'success',
  825. title: 'Success',
  826. text: response,
  827. allowOutsideClick: false,
  828. allowEscapeKey: false,
  829. allowEnterKey: false,
  830. confirmButtonText: 'OK'
  831. }).then((result) => {
  832. if (result.isConfirmed) {
  833. $('#lfauditButton').prop('disabled', false).text('Submit');
  834. window.location.href = '/gcc/department/newentry/contributorypensionscheme';
  835. console.log('Continue clicked');
  836. }
  837. });
  838. },
  839. error: function (xhr, status, error) {
  840. $('#lfauditButton').prop('disabled', false).text('Submit');
  841. Swal.fire({
  842. icon: 'error',
  843. title: 'Error',
  844. text: 'Failed to save details. Please try again.',
  845. confirmButtonText: 'OK'
  846. });
  847. console.error('Error:', xhr.responseText);
  848. }
  849. });
  850. }
  851. $('#lfauditButton').off('click').on('click', saveNewEntryDetailsPensionScheme);
  852. </script>
  853. </body>
  854. </html>