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.

1179 lines
51 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
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. .col-4 {
  36. font-weight: bold;
  37. text-align: right;
  38. }
  39. .col-8 {
  40. padding-left: 20px;
  41. }
  42. .comment {
  43. padding: 10px 0;
  44. }
  45. .comment .text-muted {
  46. font-size: 0.9em;
  47. color: #6c757d;
  48. }
  49. .comment hr {
  50. border-top: 1px solid #ccc;
  51. }
  52. .comment .btn-link {
  53. font-size: 0.9em;
  54. text-decoration: underline;
  55. color: #007bff;
  56. }
  57. /* Make the modal body scrollable */
  58. #detailsModal .modal-body {
  59. max-height: 70vh; /* Limit the height to 70% of the viewport */
  60. overflow-y: auto; /* Enable vertical scrolling */
  61. }
  62. .card-box {
  63. border-radius: 20px;
  64. box-shadow: rgba(0, 0, 0, 0.5) 0px 3px 8px;
  65. }
  66. #followupCard {
  67. transition: transform 0.2s ease; /* Smooth scaling transition */
  68. cursor: pointer; /* Default cursor change */
  69. }
  70. #followupCard:hover {
  71. transform: scale(1.05); /* Slightly scale up on hover */
  72. cursor: pointer; /* Change cursor to hand symbol */
  73. }
  74. #returnretrieddetailsModal .modal-body{
  75. max-height:80vh;
  76. overflow-y:auto;
  77. }
  78. #returnretrieddreportetailsModals .modal-body{
  79. max-height:80vh;
  80. overflow-y:auto;
  81. }
  82. /* Ensure consistent table borders */
  83. .table {
  84. border-collapse: collapse !important;
  85. }
  86. .table thead th {
  87. background-color: #343a40; /* Dark header background */
  88. color: #ffffff; /* White text */
  89. text-align: center;
  90. }
  91. .table-bordered td, .table-bordered th {
  92. border: 1px solid #dee2e6 !important; /* Ensure borders are visible */
  93. }
  94. /* Ensure proper column width */
  95. #SecondFollowupDatatables, #FollowupDatatable, #reportFollowupDatatables {
  96. table-layout: fixed;
  97. width: 100%;
  98. }
  99. #SecondFollowupDatatables th,
  100. #FollowupDatatable th,
  101. #reportFollowupDatatables th {
  102. white-space: nowrap;
  103. overflow: hidden;
  104. text-overflow: ellipsis;
  105. }
  106. /* Add padding for better readability */
  107. td, th {
  108. padding: 10px;
  109. text-align: center;
  110. }
  111. .col-md-3 label{
  112. padding-top: 2%;
  113. }
  114. </style>
  115. <body>
  116. <!--[if lt IE 8]>
  117. <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>
  118. <![endif]-->
  119. <div class="wrapper">
  120. <!-- header top menu Start -->
  121. <header th:replace="~{fragments/modules/base/header :: header}"></header>
  122. <!-- header top menu end -->
  123. <div class="page-wrap">
  124. <!--=============== Left Menu side Start ================-->
  125. <div th:replace="~{fragments/modules/base/menu :: menu}"></div>
  126. <!--=============== Left side End ================-->
  127. <div class="main-content">
  128. <div class="container-fluid">
  129. <div class="page-header mb-2">
  130. <div class="row align-items-end">
  131. <div class="col-lg-8">
  132. <div class="page-header-title">
  133. <i class="fa fa-list-alt bg-blue"></i>
  134. <div class="d-inline">
  135. <h5>Report</h5>
  136. <span>Department Entries</span>
  137. </div>
  138. </div>
  139. </div>
  140. <div class="col-lg-4">
  141. <nav class="breadcrumb-container" aria-label="breadcrumb">
  142. <ol class="breadcrumb">
  143. <li class="breadcrumb-item"><a href="/gcc/index"><i class="ik ik-home"></i></a></li>
  144. <li class="breadcrumb-item" aria-current="page">Department Entries</li>
  145. <li class="breadcrumb-item" aria-current="page">Reports</li>
  146. </ol>
  147. </nav>
  148. </div>
  149. </div>
  150. </div>
  151. <div class="row mt-4">
  152. <div class="col-md-12">
  153. <div class="card">
  154. <div class="card-block">
  155. <h5 style="font-weight:bold;">Zone Department/Report</h5>
  156. <h5 style="font-weight:bold;"> <span th:text="${deptname}" id="deptname"></span>&nbsp;</h5><span th:text="${filecategory}" id="filecategory" style="display:none"></span>
  157. <h5 style="font-weight:bold;"><span th:text="${deptId}" id="deptId" style="display:none"></span> </h5>
  158. <div class="row mb-4">
  159. <!-- Input Fields for Year Selection -->
  160. <!-- Start Year Dropdown as Button Dropdown -->
  161. <!-- Start Year Dropdown as Button Dropdown -->
  162. <div class="col-md-3">
  163. <label for="startdate" class="form-label fw-bold">Start Date<span class="text-danger">*</span></label>
  164. <input type="date" id="startdate" class="form-control" onclick="this.showPicker()" >
  165. </div>
  166. <div class="col-md-3">
  167. <label for="enddate" class="form-label fw-bold">End Date<span class="text-danger">*</span></label>
  168. <input type="date" id="enddate" class="form-control" onclick="this.showPicker()" >
  169. </div>
  170. <div class="col-md-3">
  171. <label for="typeofreport" class="form-label fw-bold">Type of Report<span class="text-danger">*</span></label>
  172. <select id="typeofreport" class="form-control" style="width: 100%;" required>
  173. <option value="" selected>-- Select Option --</option>
  174. <option value="Abstract">Abstract</option>
  175. <option value="Detailed">Detailed</option>
  176. </select>
  177. </div>
  178. <!-- Type of Category (Initially Hidden) -->
  179. <!-- <div class="col-md-3" id="categoryDiv" style="display: none;">
  180. <label for="typeofcategory" class="form-label fw-bold">Type of Category<span class="text-danger">*</span></label>
  181. <select id="typeofcategory" class="form-control" style="width: 100%;">
  182. <option value="" selected>-- Select Category --</option>
  183. <option value="1">Retirement</option>
  184. <option value="2">Family Pension</option>
  185. <option value="3">Pendency</option>
  186. <option value="4">GIS</option>
  187. <option value="5">Provisional Retirement</option>
  188. <option value="6">Contributory Pension Scheme</option>
  189. </select>
  190. </div> -->
  191. <div class="col-md-3" id="categoryDiv" style="display: none;">
  192. <label for="typeofcategory" class="form-label fw-bold">Type of Category<span class="text-danger">*</span></label>
  193. <select id="typeofcategory" class="form-control" style="width: 100%;">
  194. <option value="" selected>-- Select Category --</option>
  195. </select>
  196. </div>
  197. <div class="col-md-3" id="statusDiv" style="display: none;">
  198. <label for="statusDropdown" class="form-label fw-bold">File Status</label>
  199. <select id="statusDropdown" class="form-control" style="width: 100%;">
  200. <option value="" selected>-- Select Status --</option>
  201. <option value="[1,3]">Audit Pending</option>
  202. <option value="[2,5,6,9]">Department Pending</option>
  203. <option value="[4,7,8,10]">Pension Pending</option>
  204. <option value="[11]">File Completed</option>
  205. <option value="[12]">File Closed</option>
  206. </select>
  207. </div>
  208. <div class="col-md-4 mt-20">
  209. <button id="searchButton" class="btn btn-primary mt-2 mx-2">Search</button>
  210. <button id="resetButton" class="btn btn-secondary mt-2">Reset</button>
  211. </div>
  212. </div>
  213. <div class="page-header-title"></div>
  214. <div style= display:none id="audittable">
  215. <!-- <div style="visibility: hidden; height: 0; overflow: hidden;" id="audittable"> -->
  216. <table id="FileCategoryTable" class="table table-striped table-bordered dataTable">
  217. <thead class="thead-dark">
  218. <tr>
  219. <th class="text-center">S.No</th>
  220. <th class="text-center">File Category</th>
  221. <th class="text-center">Department Pending</th>
  222. <th class="text-center">Audit Pending</th>
  223. <th class="text-center">Pension Pending</th>
  224. <th class="text-center">Completed</th>
  225. <th class="text-center">Total count</th>
  226. </tr>
  227. </thead>
  228. <tbody id="fileCategoryTableBody" style="text-align:center;">
  229. <!-- Data will be inserted dynamically -->
  230. </tbody>
  231. </table>
  232. </div>
  233. <div style= display:none id="cpstable">
  234. <table id="FileDetailsTable" class="table table-striped table-bordered dataTable">
  235. <thead class="thead-dark">
  236. <tr>
  237. <th class="text-center">S.No</th>
  238. <th class="text-center">Employee Code</th>
  239. <th class="text-center">Name</th>
  240. <th class="text-center">Designation</th>
  241. <th class="text-center">Type of Retirement</th>
  242. <th class="text-center">Pending Duration</th>
  243. <th class="text-center">File Status</th>
  244. <th class="text-center">File category</th>
  245. <th class="text-center">File Moved Date</th>
  246. <th class="text-center">Comments/Remarks</th>
  247. </tr>
  248. </thead>
  249. <tbody id="fileDetailsTableBody" style="text-align:center;">
  250. <!-- Data will be inserted dynamically -->
  251. </tbody>
  252. </table>
  253. </div>
  254. <!-- retirement datatable -->
  255. <div style= display:none id="retiretable">
  256. <table id="FileRetirementTable" class="table table-striped table-bordered dataTable">
  257. <thead class="thead-dark">
  258. <tr>
  259. <th class="text-center">S.No</th>
  260. <th class="text-center">Employee Code</th>
  261. <th class="text-center">Name</th>
  262. <th class="text-center">Designation</th>
  263. <th class="text-center">Type of Retirement</th>
  264. <th class="text-center">Date of Retirement</th>
  265. <th class="text-center">File Status</th>
  266. <th class="text-center">File Category</th>
  267. <th class="text-center">File Moved Date</th>
  268. <th class="text-center">Comments/Remarks</th>
  269. </tr>
  270. </thead>
  271. <tbody id="fileRetireTableBody" style="text-align:center;">
  272. <!-- Data will be inserted dynamically -->
  273. </tbody>
  274. </table>
  275. </div>
  276. <!-- Family pension datatable -->
  277. <div style= display:none id="familypensiontable">
  278. <table id="FileFamilyPensionTable" class="table table-striped table-bordered dataTable">
  279. <thead class="thead-dark">
  280. <tr>
  281. <th class="text-center">S.No</th>
  282. <th class="text-center">Employee Code</th>
  283. <th class="text-center">Name</th>
  284. <th class="text-center">Designation</th>
  285. <th class="text-center">Service Death Date</th>
  286. <th class="text-center">Relationship Type</th>
  287. <th class="text-center">Pending Duration</th>
  288. <th class="text-center">File Status</th>
  289. <th class="text-center">File Category</th>
  290. <th class="text-center">File Moved Date</th>
  291. <th class="text-center">Comments/Remarks</th>
  292. </tr>
  293. </thead>
  294. <tbody id="fileFamilyTableBody" style="text-align:center;">
  295. <!-- Data will be inserted dynamically -->
  296. </tbody>
  297. </table>
  298. </div>
  299. <!-- Pendency datatable -->
  300. <div style= display:none id="pendencytable">
  301. <table id="FilePendencyTable" class="table table-striped table-bordered dataTable">
  302. <thead class="thead-dark">
  303. <tr>
  304. <th class="text-center">S.No</th>
  305. <th class="text-center">Employee Code</th>
  306. <th class="text-center">Name</th>
  307. <th class="text-center">Designation</th>
  308. <th class="text-center">Type of Retirement</th>
  309. <th class="text-center">Date of Retirement</th>
  310. <th class="text-center">Pending Duration</th>
  311. <th class="text-center">File Status</th>
  312. <th class="text-center">File Category</th>
  313. <th class="text-center">File Moved Date</th>
  314. <th class="text-center">Comments/Remarks</th>
  315. </tr>
  316. </thead>
  317. <tbody id="filePendencyTableBody" style="text-align:center;">
  318. <!-- Data will be inserted dynamically -->
  319. </tbody>
  320. </table>
  321. </div>
  322. <!-- Gis datatable -->
  323. <div style= display:none id="gistable">
  324. <table id="FileGisTable" class="table table-striped table-bordered dataTable">
  325. <thead class="thead-dark">
  326. <tr>
  327. <th class="text-center">S.No</th>
  328. <th class="text-center">Employee Code</th>
  329. <th class="text-center">Name</th>
  330. <th class="text-center">Designation</th>
  331. <th class="text-center">Service Death Date</th>
  332. <th class="text-center">Sanctioned Amount</th>
  333. <th class="text-center">File Status</th>
  334. <th class="text-center">File category</th>
  335. <th class="text-center">File Moved Date</th>
  336. <th class="text-center">Comments/Remarks</th>
  337. </tr>
  338. </thead>
  339. <tbody id="fileGisTableBody" style="text-align:center;">
  340. <!-- Data will be inserted dynamically -->
  341. </tbody>
  342. </table>
  343. </div>
  344. <!-- provisonal datatable -->
  345. <div style= display:none id="provisionaltable">
  346. <table id="FileProvisionalTable" class="table table-striped table-bordered dataTable">
  347. <thead class="thead-dark">
  348. <tr>
  349. <th class="text-center">S.No</th>
  350. <th class="text-center">Employee Code</th>
  351. <th class="text-center">Name</th>
  352. <th class="text-center">Designation</th>
  353. <th class="text-center">Type of Retirement</th>
  354. <th class="text-center">Date of Retirement</th>
  355. <th class="text-center">File Status</th>
  356. <th class="text-center">File category</th>
  357. <th class="text-center">File Moved Date</th>
  358. <th class="text-center">Comments/Remarks</th>
  359. </tr>
  360. </thead>
  361. <tbody id="fileProvisionalTableBody" style="text-align:center;">
  362. <!-- Data will be inserted dynamically -->
  363. </tbody>
  364. </table>
  365. </div>
  366. </div>
  367. </div>
  368. </div>
  369. </div>
  370. </div>
  371. </div>
  372. <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;">
  373. <div style="position: relative; top: 50%; transform: translateY(-50%);">
  374. <div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;">
  375. <span class="sr-only">Loading...</span>
  376. </div>
  377. <!-- Add the 'Please wait' text below the spinner -->
  378. <p style="margin-top: 1rem; font-size: 1.2rem; color: #007bff;">Please wait...</p>
  379. </div>
  380. </div>
  381. <footer th:replace="~{fragments/modules/base/footer :: footer}"></footer>
  382. </div>
  383. </div>
  384. <!-- Modal Box -->
  385. <div th:replace="~{fragments/modules/base/app_module_menu_box :: div}"></div>
  386. <script th:replace="~{fragments/modules/base/script :: script}"></script>
  387. <script src="node_modules/tempusdominus-bootstrap-4/build/js/tempusdominus-bootstrap-4.min.js"></script>
  388. <!-- Bootstrap 5 JS -->
  389. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
  390. <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  391. <script>
  392. $(document).ready(function () {
  393. function loadFileCategories() {
  394. $.ajax({
  395. url: "/getFileCategories", // Ensure this is the correct endpoint
  396. type: "GET",
  397. dataType: "json",
  398. success: function (response) {
  399. console.log("File Categories Loaded:", response); // Debugging
  400. if (response.length === 0) {
  401. console.warn("No categories found!");
  402. return;
  403. }
  404. let $categoryDropdown = $("#typeofcategory");
  405. // $categoryDropdown.empty().append('<option value="">-- Select Category --</option>');
  406. response.forEach(category => {
  407. $categoryDropdown.append(`<option value="${category.id}">${category.file_name}</option>`);
  408. });
  409. },
  410. error: function (xhr, status, error) {
  411. console.error("Error fetching categories:", xhr.responseText);
  412. Swal.fire({
  413. icon: "error",
  414. title: "Error Fetching Data",
  415. text: "Failed to load categories. Please try again later.",
  416. });
  417. }
  418. });
  419. }
  420. // Call function to load categories when the page is ready
  421. loadFileCategories();
  422. $('#resetButton').on('click', function () {
  423. window.location.href = "/gcc/department/reports";
  424. });
  425. });
  426. $(document).ready(function () {
  427. // Initialize DataTables
  428. // count datatable
  429. let fileCategoryTable = $("#FileCategoryTable").DataTable({
  430. dom: 'Bftip',
  431. columnDefs: [{ targets: 'no-sort', orderable: false }],
  432. lengthMenu: [
  433. [50, 100, 200, 500, -1],
  434. ['50 rows', '100 rows', '200 rows', 'Show all']
  435. ],
  436. scrollY: '50vh',
  437. fixedColumns: { left: 1, right: 1 },
  438. buttons: [
  439. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  440. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  441. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  442. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  443. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  444. ],
  445. fixedHeader: false,
  446. autoWidth: true,
  447. responsive: true,
  448. searching: true,
  449. select: false,
  450. processing: false,
  451. data: [], // Start with an empty table
  452. columns: [
  453. { title: "S.No", data: "index", className: "text-center" },
  454. { title: "File Category", data: "file_name", className: "text-center" },
  455. { title: "Department Pending", data: "department_pending", className: "text-center" },
  456. { title: "Audit Pending", data: "audit_pending", className: "text-center" },
  457. { title: "Pension Pending", data: "pension_pending", className: "text-center" },
  458. { title: "Completed", data: "completed", className: "text-center" },
  459. { title: "Total Count", data: "total_count", className: "text-center" }
  460. ]
  461. });
  462. //cps datatable
  463. let fileDetailsTable = $("#FileDetailsTable").DataTable({
  464. dom: 'Bftip',
  465. columnDefs: [{ targets: 'no-sort', orderable: false }],
  466. lengthMenu: [
  467. [50, 100, 200, 500, -1],
  468. ['50 rows', '100 rows', '200 rows', 'Show all']
  469. ],
  470. scrollY: '50vh',
  471. fixedColumns: { left: 1, right: 1 },
  472. buttons: [
  473. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  474. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  475. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  476. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  477. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  478. ],
  479. fixedHeader: false,
  480. autoWidth: true,
  481. responsive: true,
  482. searching: true,
  483. select: false,
  484. processing: false,
  485. data: [],
  486. columns: [
  487. { title: "S.No", data: "index", className: "text-center" },
  488. { title: "Employee Code", data: "emp_no", className: "text-center" },
  489. { title: "Name", data: "emp_name", className: "text-center" },
  490. { title: "Designation", data: "designation", className: "text-center" },
  491. { title: "Type of Retirement", data: "type_of_retirement", className: "text-center" },
  492. { title: "Pending Duration", data: "reason_for_pending", className: "text-center" },
  493. { title: "File Status", data: "fst", className: "text-center" },
  494. { title: "File Category", data: "file_category_name", className: "text-center" },
  495. { title: "File Moved Date", data: "created_date", className: "text-center" },
  496. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  497. ]
  498. });
  499. // retirement datatable
  500. let fileRetireTable = $("#FileRetirementTable").DataTable({
  501. dom: 'Bftip',
  502. columnDefs: [{ targets: 'no-sort', orderable: false }],
  503. lengthMenu: [
  504. [50, 100, 200, 500, -1],
  505. ['50 rows', '100 rows', '200 rows', 'Show all']
  506. ],
  507. scrollY: '50vh',
  508. fixedColumns: { left: 1, right: 1 },
  509. buttons: [
  510. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  511. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  512. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  513. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  514. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  515. ],
  516. fixedHeader: false,
  517. autoWidth: true,
  518. responsive: true,
  519. searching: true,
  520. select: false,
  521. processing: false,
  522. data: [],
  523. columns: [
  524. { title: "S.No", data: "index", className: "text-center" },
  525. { title: "Employee Code", data: "emp_no", className: "text-center" },
  526. { title: "Name", data: "emp_name", className: "text-center" },
  527. { title: "Designation", data: "designation", className: "text-center" },
  528. { title: "Type of Retirement", data: "type_of_retirement", className: "text-center" },
  529. { title: "Date of Retirement", data: "retirement_date", className: "text-center" },
  530. { title: "File Status", data: "fst", className: "text-center" },
  531. { title: "File Category", data: "file_category_name", className: "text-center" },
  532. { title: "File Moved Date", data: "file_moved_date", className: "text-center" },
  533. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  534. ]
  535. });
  536. // family pension datatable
  537. let fileFamilyPensionTable = $("#FileFamilyPensionTable").DataTable({
  538. dom: 'Bftip',
  539. columnDefs: [{ targets: 'no-sort', orderable: false }],
  540. lengthMenu: [
  541. [50, 100, 200, 500, -1],
  542. ['50 rows', '100 rows', '200 rows', 'Show all']
  543. ],
  544. scrollY: '50vh',
  545. fixedColumns: { left: 1, right: 1 },
  546. buttons: [
  547. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  548. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  549. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  550. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  551. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  552. ],
  553. fixedHeader: false,
  554. autoWidth: true,
  555. responsive: true,
  556. searching: true,
  557. select: false,
  558. processing: false,
  559. data: [],
  560. columns: [
  561. { title: "S.No", data: "index", className: "text-center" },
  562. { title: "Employee Code", data: "emp_no", className: "text-center" },
  563. { title: "Name", data: "emp_name", className: "text-center" },
  564. { title: "Designation", data: "designation", className: "text-center" },
  565. { title: "Service Death Date", data: "service_death", className: "text-center" },
  566. { title: "Relationship Type", data: "relationship_deceased", className: "text-center" },
  567. { title: "Pending Duration", data: "reason_for_pending", className: "text-center" },
  568. { title: "File Status", data: "fst", className: "text-center" },
  569. { title: "File Category", data: "file_category_name", className: "text-center" },
  570. { title: "File Moved Date", data: "file_moved_date", className: "text-center" },
  571. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  572. ]
  573. });
  574. // pendency datatable
  575. let filePendencyTable = $("#FilePendencyTable").DataTable({
  576. dom: 'Bftip',
  577. columnDefs: [{ targets: 'no-sort', orderable: false }],
  578. lengthMenu: [
  579. [50, 100, 200, 500, -1],
  580. ['50 rows', '100 rows', '200 rows', 'Show all']
  581. ],
  582. scrollY: '50vh',
  583. fixedColumns: { left: 1, right: 1 },
  584. buttons: [
  585. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  586. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  587. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  588. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  589. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  590. ],
  591. fixedHeader: false,
  592. autoWidth: true,
  593. responsive: true,
  594. searching: true,
  595. select: false,
  596. processing: false,
  597. data: [],
  598. columns: [
  599. { title: "S.No", data: "index", className: "text-center" },
  600. { title: "Employee Code", data: "emp_no", className: "text-center" },
  601. { title: "Name", data: "emp_name", className: "text-center" },
  602. { title: "Designation", data: "designation", className: "text-center" },
  603. { title: "Type of Retirement", data: "type_of_retirement", className: "text-center" },
  604. { title: "Date of Retirement", data: "retirement_date", className: "text-center" },
  605. { title: "Pending Duration", data: "reason_for_pending", className: "text-center" },
  606. { title: "File Status", data: "fst", className: "text-center" },
  607. { title: "File Category", data: "file_category_name", className: "text-center" },
  608. { title: "File Moved Date", data: "file_moved_date", className: "text-center" },
  609. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  610. ]
  611. });
  612. // Gis datatable
  613. let fileGisTable = $("#FileGisTable").DataTable({
  614. dom: 'Bftip',
  615. columnDefs: [{ targets: 'no-sort', orderable: false }],
  616. lengthMenu: [
  617. [50, 100, 200, 500, -1],
  618. ['50 rows', '100 rows', '200 rows', 'Show all']
  619. ],
  620. scrollY: '50vh',
  621. fixedColumns: { left: 1, right: 1 },
  622. buttons: [
  623. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  624. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  625. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  626. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  627. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  628. ],
  629. fixedHeader: false,
  630. autoWidth: true,
  631. responsive: true,
  632. searching: true,
  633. select: false,
  634. processing: false,
  635. data: [],
  636. columns: [
  637. { title: "S.No", data: "index", className: "text-center" },
  638. { title: "Employee Code", data: "emp_no", className: "text-center" },
  639. { title: "Name", data: "emp_name", className: "text-center" },
  640. { title: "Designation", data: "designation", className: "text-center" },
  641. { title: "Service Death Date", data: "service_death", className: "text-center" },
  642. { title: "Sanctioned Amount", data: "sanctional_gis_amount", className: "text-center" },
  643. { title: "File Status", data: "fst", className: "text-center" },
  644. { title: "File Category", data: "file_category_name", className: "text-center" },
  645. { title: "File Moved Date", data: "file_moved_date", className: "text-center" },
  646. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  647. ]
  648. });
  649. // provisional datatable
  650. let fileProvisionalTable = $("#FileProvisionalTable").DataTable({
  651. dom: 'Bftip',
  652. columnDefs: [{ targets: 'no-sort', orderable: false }],
  653. lengthMenu: [
  654. [50, 100, 200, 500, -1],
  655. ['50 rows', '100 rows', '200 rows', 'Show all']
  656. ],
  657. scrollY: '50vh',
  658. fixedColumns: { left: 1, right: 1 },
  659. buttons: [
  660. { extend: 'pageLength', className: 'btn btn-warning ' }, // GIS-style
  661. { title: 'Data export', extend: 'copyHtml5', text: 'Copy', className: 'btn btn-secondary ' }, // GIS-style
  662. { extend: 'excelHtml5', text: 'Excel', className: 'btn btn-secondary' }, // GIS-style
  663. { extend: 'csvHtml5', text: 'CSV', className: 'btn btn-secondary' }, // GIS-style
  664. { extend: 'pdfHtml5', text: 'PDF', className: 'btn btn-secondary' } // GIS-style
  665. ],
  666. fixedHeader: false,
  667. autoWidth: true,
  668. responsive: true,
  669. searching: true,
  670. select: false,
  671. processing: false,
  672. data: [],
  673. columns: [
  674. { title: "S.No", data: "index", className: "text-center" },
  675. { title: "Employee Code", data: "emp_no", className: "text-center" },
  676. { title: "Name", data: "emp_name", className: "text-center" },
  677. { title: "Designation", data: "designation", className: "text-center" },
  678. { title: "Type of Retirement", data: "type_of_retirement", className: "text-center" },
  679. { title: "Date of Retirement", data: "retirement_date", className: "text-center" },
  680. { title: "File Category", data: "file_category_name", className: "text-center" },
  681. { title: "File Status", data: "fst", className: "text-center" },
  682. { title: "File Moved Date", data: "file_moved_date", className: "text-center" },
  683. { title: "Comments/Remarks", data: "remarks", className: "text-center" },
  684. ]
  685. });
  686. // Listen for changes in the Type of Report dropdown
  687. $("#typeofreport").change(function () {
  688. let selectedValue = $(this).val();
  689. if (selectedValue === "Detailed") {
  690. $("#categoryDiv").show();
  691. } else {
  692. $("#categoryDiv").hide();
  693. $("#typeofcategory").val(""); // Reset category value
  694. $("#statusDiv").hide();
  695. $("#statusDropdown").val("");
  696. }
  697. });
  698. $("#typeofcategory").change(function () {
  699. let selectedCatValue = $(this).val();
  700. let statusDropdown = $("#statusDropdown");
  701. if(selectedCatValue==""){
  702. $("#statusDiv").hide();
  703. $("#statusDropdown").val("");
  704. }
  705. else{
  706. $("#statusDiv").show();
  707. }
  708. // Backup of all options (only once)
  709. if (!statusDropdown.data("original-options")) {
  710. statusDropdown.data("original-options", statusDropdown.html());
  711. }
  712. if (selectedCatValue === "1") {
  713. // Restore all options
  714. statusDropdown.html(statusDropdown.data("original-options"));
  715. } else {
  716. // Remove the last two options ("File Completed" and "File Closed")
  717. statusDropdown.html(statusDropdown.data("original-options"));
  718. statusDropdown.find("option[value='[12]']").remove();
  719. }
  720. });
  721. /* $('#statusDropdown').on('change', function () {
  722. let selectedValue = $(this).val();
  723. let statusArray = selectedValue ? JSON.parse(selectedValue) : []; // Convert string to array
  724. console.log(statusArray); // Output: [1,3] or [2,5,6,9] etc.
  725. }); */
  726. // Handle Search Button click
  727. $("#searchButton").click(function () {
  728. let startDate = $("#startdate").val();
  729. let endDate = $("#enddate").val();
  730. let deptId = $('#deptId').text().trim();
  731. let typeOfReport = $("#typeofreport").val();
  732. let typeOfCategory = $("#typeofcategory").val();
  733. let selectedStatus = $("#statusDropdown").val();
  734. let statusArray = selectedStatus ? JSON.parse(selectedStatus) : [];
  735. console.log("statusArray", statusArray);
  736. if (!startDate || !endDate) {
  737. Swal.fire({
  738. icon: "warning",
  739. title: "Validation Error",
  740. text: "Please select Both Date before searching.",
  741. confirmButtonText: "OK"
  742. });
  743. return;
  744. }
  745. // Validation
  746. if (!typeOfReport) {
  747. Swal.fire({
  748. icon: "warning",
  749. title: "Validation Error",
  750. text: "Please select a Type of Report before searching.",
  751. confirmButtonText: "OK"
  752. });
  753. return; // Stop execution if validation fails
  754. }
  755. // Handle Detailed Report or Summary Report based on selection
  756. if (typeOfReport === "Detailed" && !typeOfCategory) {
  757. Swal.fire({
  758. icon: "warning",
  759. title: "Validation Error",
  760. text: "Please select a Category for Detailed report.",
  761. confirmButtonText: "OK"
  762. });
  763. return;
  764. }
  765. // Perform AJAX for FileCategory (Summary) or FileDetails (Detailed)
  766. let url, data;
  767. if (typeOfReport === "Detailed") {
  768. url = "/getReportDetails";
  769. data = { startDate: startDate, endDate: endDate, deptId: deptId, fileCatId: typeOfCategory , fileStatus:statusArray};
  770. } else {
  771. url = "/getReportData";
  772. data = { startDate: startDate, endDate: endDate, deptId: deptId };
  773. }
  774. $('#pageLoader').show();
  775. // Make AJAX request based on selected report type
  776. $.ajax({
  777. url: url,
  778. type: "GET",
  779. data: data,
  780. traditional: true,
  781. dataType: "json",
  782. success: function (response) {
  783. $('#pageLoader').hide();
  784. if (response.length === 0) {
  785. $('#FileCategoryTable').DataTable().clear().draw();
  786. $('#FileDetailsTable').DataTable().clear().draw();
  787. $('#FileRetirementTable').DataTable().clear().draw();
  788. $('#FileFamilyPensionTable').DataTable().clear().draw();
  789. $('#FilePendencyTable').DataTable().clear().draw();
  790. $('#FileGisTable').DataTable().clear().draw();
  791. $('#FileProvisionalTable').DataTable().clear().draw();
  792. Swal.fire({
  793. icon: "info",
  794. title: "No Data Found",
  795. text: "No records match your selection.",
  796. confirmButtonText: "OK"
  797. });
  798. } else {
  799. $('#pageLoader').hide();
  800. // Format and add data to the correct table based on the report type
  801. if (typeOfReport === "Detailed" && typeOfCategory=='6' ) {
  802. $("#cpstable").css("display", "block").css("height", "auto");
  803. $("#audittable").css("display", "none").css("height", "auto");
  804. $("#retiretable").css("display", "none").css("height", "auto");
  805. $("#familypensiontable").css("display", "none").css("height", "auto");
  806. $("#pendencytable").css("display", "none").css("height", "auto");
  807. $("#gistable").css("display", "none").css("height", "auto");
  808. $("#provisionaltable").css("display", "none").css("height", "auto");
  809. let formattedData = response.map((row, index) => ({
  810. index: index + 1,
  811. emp_no: row.emp_no,
  812. emp_name: row.emp_name,
  813. designation: row.designation,
  814. type_of_retirement: row.type_of_retirement,
  815. reason_for_pending: row.reason_for_pending,
  816. fst: row.fst,
  817. file_category_name:row.file_category_name,
  818. remarks: row.remarks,
  819. created_date: row.created_date,
  820. }));
  821. fileDetailsTable.clear().rows.add(formattedData).draw();
  822. }
  823. if (typeOfReport === "Detailed" && typeOfCategory=='1' ) {
  824. $("#cpstable").css("display", "none").css("height", "auto");
  825. $("#audittable").css("display", "none").css("height", "auto");
  826. $("#retiretable").css("display", "block").css("height", "auto");
  827. $("#familypensiontable").css("display", "none").css("height", "auto");
  828. $("#pendencytable").css("display", "none").css("height", "auto");
  829. $("#gistable").css("display", "none").css("height", "auto");
  830. $("#provisionaltable").css("display", "none").css("height", "auto");
  831. let formattedData = response.map((row, index) => ({
  832. index: index + 1,
  833. emp_no: row.emp_no,
  834. emp_name: row.emp_name,
  835. designation: row.designation,
  836. type_of_retirement: row.type_of_retirement,
  837. retirement_date: row.retirement_date,
  838. fst: row.fst,
  839. file_category_name:row.file_category_name,
  840. remarks: row.remarks,
  841. file_moved_date: row.file_moved_date,
  842. }));
  843. fileRetireTable.clear().rows.add(formattedData).draw();
  844. }
  845. if (typeOfReport === "Detailed" && typeOfCategory=='2' ) {
  846. $("#cpstable").css("display", "none").css("height", "auto");
  847. $("#audittable").css("display", "none").css("height", "auto");
  848. $("#retiretable").css("display", "none").css("height", "auto");
  849. $("#familypensiontable").css("display", "block").css("height", "auto");
  850. $("#pendencytable").css("display", "none").css("height", "auto");
  851. $("#gistable").css("display", "none").css("height", "auto");
  852. $("#provisionaltable").css("display", "none").css("height", "auto");
  853. let formattedData = response.map((row, index) => ({
  854. index: index + 1,
  855. emp_no: row.emp_no,
  856. emp_name: row.emp_name,
  857. designation: row.designation,
  858. service_death:row.service_death,
  859. relationship_deceased: row.relationship_deceased,
  860. reason_for_pending: row.reason_for_pending,
  861. fst: row.fst,
  862. file_category_name:row.file_category_name,
  863. remarks: row.remarks,
  864. file_moved_date: row.file_moved_date,
  865. }));
  866. fileFamilyPensionTable.clear().rows.add(formattedData).draw();
  867. }
  868. if (typeOfReport === "Detailed" && typeOfCategory=='3' ) {
  869. $("#cpstable").css("display", "none").css("height", "auto");
  870. $("#audittable").css("display", "none").css("height", "auto");
  871. $("#retiretable").css("display", "none").css("height", "auto");
  872. $("#familypensiontable").css("display", "none").css("height", "auto");
  873. $("#pendencytable").css("display", "block").css("height", "auto");
  874. $("#gistable").css("display", "none").css("height", "auto");
  875. $("#provisionaltable").css("display", "none").css("height", "auto");
  876. let formattedData = response.map((row, index) => ({
  877. index: index + 1,
  878. emp_no: row.emp_no,
  879. emp_name: row.emp_name,
  880. designation: row.designation,
  881. type_of_retirement: row.type_of_retirement,
  882. retirement_date: row.retirement_date,
  883. reason_for_pending:row.reason_for_pending,
  884. fst: row.fst,
  885. file_category_name:row.file_category_name,
  886. remarks: row.remarks,
  887. file_moved_date: row.file_moved_date,
  888. }));
  889. filePendencyTable.clear().rows.add(formattedData).draw();
  890. }
  891. if (typeOfReport === "Detailed" && typeOfCategory=='4' ) {
  892. $("#cpstable").css("display", "none").css("height", "auto");
  893. $("#audittable").css("display", "none").css("height", "auto");
  894. $("#retiretable").css("display", "none").css("height", "auto");
  895. $("#familypensiontable").css("display", "none").css("height", "auto");
  896. $("#pendencytable").css("display", "none").css("height", "auto");
  897. $("#gistable").css("display", "block").css("height", "auto");
  898. $("#provisionaltable").css("display", "none").css("height", "auto");
  899. let formattedData = response.map((row, index) => ({
  900. index: index + 1,
  901. emp_no: row.emp_no,
  902. emp_name: row.emp_name,
  903. designation: row.designation,
  904. service_death: row.service_death,
  905. sanctional_gis_amount: row.sanctional_gis_amount,
  906. fst: row.fst,
  907. file_category_name:row.file_category_name,
  908. remarks: row.remarks,
  909. file_moved_date: row.file_moved_date,
  910. }));
  911. fileGisTable.clear().rows.add(formattedData).draw();
  912. }
  913. if (typeOfReport === "Detailed" && typeOfCategory=='5' ) {
  914. $("#cpstable").css("display", "none").css("height", "auto");
  915. $("#audittable").css("display", "none").css("height", "auto");
  916. $("#retiretable").css("display", "none").css("height", "auto");
  917. $("#familypensiontable").css("display", "none").css("height", "auto");
  918. $("#pendencytable").css("display", "none").css("height", "auto");
  919. $("#gistable").css("display", "none").css("height", "auto");
  920. $("#provisionaltable").css("display", "block").css("height", "auto");
  921. let formattedData = response.map((row, index) => ({
  922. index: index + 1,
  923. emp_no: row.emp_no,
  924. emp_name: row.emp_name,
  925. designation: row.designation,
  926. type_of_retirement: row.type_of_retirement,
  927. retirement_date: row.retirement_date,
  928. fst: row.fst,
  929. file_category_name:row.file_category_name,
  930. remarks: row.remarks,
  931. file_moved_date: row.file_moved_date,
  932. }));
  933. fileProvisionalTable.clear().rows.add(formattedData).draw();
  934. }
  935. if(typeOfReport === "Abstract"){
  936. $("#cpstable").css("display", "none").css("height", "auto");
  937. $("#audittable").css("display", "block").css("height", "auto");
  938. $("#retiretable").css("display", "none").css("height", "auto");
  939. $("#familypensiontable").css("display", "none").css("height", "auto");
  940. $("#pendencytable").css("display", "none").css("height", "auto");
  941. $("#gistable").css("display", "none").css("height", "auto");
  942. $("#provisionaltable").css("display", "none").css("height", "auto");
  943. let formattedData = response.map((row, index) => ({
  944. index: index + 1,
  945. file_name: row.file_name,
  946. department_pending: row.department_pending,
  947. audit_pending: row.audit_pending,
  948. pension_pending: row.pension_pending,
  949. completed: row.completed,
  950. total_count: row.total_files
  951. }));
  952. fileCategoryTable.clear().rows.add(formattedData).draw();
  953. }
  954. }
  955. },
  956. error: function (xhr, status, error) {
  957. $('#pageLoader').hide();
  958. Swal.fire({
  959. icon: "error",
  960. title: "Error",
  961. text: "Failed to load data. Please try again.",
  962. confirmButtonText: "OK"
  963. });
  964. }
  965. });
  966. });
  967. });
  968. $('#startdate').on('change', function () {
  969. const fromDate = $(this).val();
  970. $('#enddate').attr('min', fromDate); // Update min attribute for To Date
  971. // If To Date is earlier than the new From Date, adjust it
  972. const toDate = $('#enddate').val();
  973. if (new Date(toDate) < new Date(fromDate)) {
  974. $('#enddate').val(fromDate);
  975. }
  976. });
  977. // Update From Date's max attribute when To Date changes
  978. $('#enddate').on('change', function () {
  979. const toDate = $(this).val();
  980. $('#startdate').attr('max', toDate); // Update max attribute for From Date
  981. // If From Date is later than the new To Date, adjust it
  982. const fromDate = $('#startdate').val();
  983. if (new Date(fromDate) > new Date(toDate)) {
  984. $('#startdate').val(toDate);
  985. }
  986. });
  987. //disable future dates
  988. document.addEventListener("DOMContentLoaded", function () {
  989. let today = new Date().toISOString().split("T")[0]; // Get today's date in YYYY-MM-DD format
  990. let startdateInput = document.getElementById("startdate");
  991. let enddateInput = document.getElementById("enddate");
  992. // Set max attribute to disable future dates
  993. startdateInput.setAttribute("max", today);
  994. enddateInput.setAttribute("max", today);
  995. // Prevent manual future date entry
  996. startdateInput.addEventListener("change", function () {
  997. if (this.value > today) {
  998. Swal.fire({
  999. icon: 'warning',
  1000. title: 'Invalid Date',
  1001. text: 'Future dates are not allowed.',
  1002. confirmButtonText: 'OK'
  1003. });
  1004. this.value = ""; // Clear the invalid input
  1005. }
  1006. });
  1007. });
  1008. </script>
  1009. </body>
  1010. </html>