kanimozhi
/
communityhallv22
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
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.
19 Commits
1 Branch
0 Tags
244 MiB
Tree: ce436b2b2e
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'ce436b2b2e'
${ noResults }
communityhallv22/target/classes/templates/admin/reports.html

2726 lines
140 KiB
Raw Normal View History

scheduler flag
1 year ago
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
  1. <!DOCTYPE html>
  2. <html xmlns:th="http://www.thymeleaf.org">
  4. <head th:replace="~{fragments/head-admin :: head}"></head>
  5. <meta charset="ISO-8859-1">
  6. <!-- Include DataTables CSS -->
  7. </head>
  8. <style>
  9. .block-content {
  10. padding-bottom: 10px;
  11. }
  13. .small-input {
  14. width: 150px;
  15. /* Adjust the width as needed */
  16. }
  18. .small-table th,
  19. .small-table td {
  20. font-size: 14px;
  21. /* Adjust font size as needed */
  22. }
  24. /* Reduce padding for table cells */
  25. .small-table td,
  26. .small-table th {
  27. padding: 5px;
  28. /* Adjust padding as needed */
  29. }
  31. .card-body table {
  32. width: 100%;
  33. padding: 100px;
  34. }
  36. .card-body th,
  37. td {
  38. padding: 8px;
  39. text-align: left;
  40. }
  42. .amount-cell {
  43. text-align: right;
  44. padding-right: 1rem;
  45. /* Adjust padding as needed */
  46. }
  48. .table {
  49. width: 100% !important;
  50. }
  52. .hidden {
  53. display: none;
  54. }
  56. .modal-fullscreen-custom {
  57. max-width: 98% !important;
  58. width: 98%;
  59. margin: 0 auto;
  60. }
  62. /* Ensure second modal is on top of the first modal */
  63. .modal-backdrop.show:nth-of-type(2) {
  64. z-index: 1055 !important; /* slightly above the first modal */
  65. }
  67. #showBookingDetails.modal {
  68. z-index: 1060 !important; /* higher than .modal-backdrop */
  69. }
  70. </style>
  72. <body>
  73. <!-- Page Container -->
  74. <div id="page-container"
  75. class="sidebar-o sidebar-dark enable-page-overlay side-scroll page-header-fixed page-header-dark">
  76. <!-- Side Overlay aside (right)-->
  77. <aside th:replace="~{fragments/aside-right :: aside}"></aside>
  78. <!-- END Side Overlay (right)-->
  79. <!-- Sidebar Nav-->
  80. <nav th:replace="~{fragments/nav-admin :: nav}"></nav>
  81. <!-- END Sidebar -->
  82. <!-- Header -->
  83. <header th:replace="~{fragments/header-admin :: header}"></header>
  84. <!-- END Header -->
  85. <!-- Main Container -->
  86. <main id="main-container">
  88. <!-- Page Content -->
  89. <!-- Card Container -->
  90. <div class="content">
  91. <div class="block block-rounded">
  92. <form id="myForm" th:action="@{/communityhall/admin/getReport}" onsubmit="return validateme()"
  93. method="post">
  94. <div class="block-header bg-primary text-white">
  95. <h3 class="block-title">Community Hall Reports</h3>
  96. </div>
  97. <div class="block-content">
  98. <div class="row">
  99. <div class="col-sm-3 mb-2">
  100. <label class="form-label" for="fromdate">From:<span
  101. class="text-danger">*</span></label> <input type="date"
  102. th:value="${fromdate}"
  103. class="form-control" name="FromDate"
  104. id="fromdate"
  105. placeholder="From Date"
  106. required="required"
  107. data-date-format="yyyy-mm-dd"/>
  108. </div>
  109. <div class="col-sm-3 mb-2">
  110. <label class="form-label" for="todate">To:<span class="text-danger">*</span></label>
  111. <input type="date" th:value="${todate}" class="form-control" name="ToDate"
  112. id="todate" placeholder="To Date" required="required"
  113. data-date-format="yyyy-mm-dd"/>
  114. </div>
  115. <div class="col-sm-3 mb-2">
  116. <label class="form-label" for="request">Get Info:<span
  117. class="text-danger">*</span></label>
  118. <select type="text" class="form-control text-center" id="request" name="request"
  119. onchange="myRequest()" required>
  120. <option value="">Select</option>
  121. <option value="1" th:selected="${request=='1'}">Users</option>
  122. <option value="2" th:selected="${request=='2'}">Booking Details</option>
  123. <option value="3" th:selected="${request=='3'}">Payment Info</option>
  124. <option value="8" th:selected="${request=='8'}">Extra Payments Info</option>
  125. <option value="4" th:selected="${request=='4'}">Users Booking List</option>
  126. <option value="5" th:selected="${request=='5'}">Hall Booking List</option>
  127. <option value="6" th:selected="${request=='6'}">Refund Details</option>
  128. <option value="7" th:selected="${request=='7'}">Total Count</option>
  129. <option value="9" th:selected="${request=='9'}">Counter Details</option>
  130. <option value="10" th:selected="${request=='10'}">Review Report</option>
  131. </select>
  132. </div>
  134. <div class="col-sm-3 mb-2" id="bookingcountbasedonDropdown" style="display: none;">
  135. <label class="form-label" for="basedon">Based On: <span
  136. class="text-danger">*</span></label>
  137. <select class="form-control text-center" id="basedon" name="basedon"
  138. th:value="${basedon}">
  139. <option value="">Select</option>
  140. <option value="zone" th:selected="${basedon == 'zone'}">Zone
  141. </option>
  142. <option value="division" th:selected="${basedon == 'division'}">Division
  143. </option>
  144. </select>
  145. <span id="basedonError" class="text-danger"></span>
  146. </div>
  148. <!-- UsersDropdown2 -->
  149. <div class="col-sm-3 mb-2" id="userDropdown2" style="display: none;">
  150. <label class="form-label" for="usertype">User Type: </label>
  151. <select class="form-control text-center" id="usertype" name="usertype"
  152. th:value="${usertype}">
  153. <option value="">Select User Type</option>
  154. <option value="PENSIONER" th:selected="${usertype == 'PENSIONER'}">PENSIONER
  155. </option>
  156. <option value="GCC_EMPLOYEE" th:selected="${usertype == 'GCC_EMPLOYEE'}">GCC
  157. EMPLOYEE
  158. </option>
  159. <option value="COUNCILLOR" th:selected="${usertype == 'COUNCILLOR'}">COUNCILLOR
  160. </option>
  161. <option value="PUBLIC" th:selected="${usertype == 'PUBLIC'}">PUBLIC</option>
  162. <!-- Add more options as needed -->
  163. </select>
  164. </div>
  165. <!-- UsersDropdown1 -->
  166. <div class="col-sm-3 mb-2" id="userDropdown1" style="display: none;">
  167. <label class="form-label" for="userstatus">User Status: </label>
  168. <select class="form-control text-center" id="userstatus" name="userstatus"
  169. th:value="${userstatus}">
  170. <option value="">Select a User Status</option>
  171. <option value="PENDING" th:selected="${userstatus == 'PENDING'}">PENDING
  172. </option>
  173. <option value="APPROVED" th:selected="${userstatus == 'APPROVED'}">APPROVED
  174. </option>
  175. <option value="REJECTED" th:selected="${userstatus == 'REJECTED'}">REJECTED
  176. </option>
  177. <!-- Add more options as needed -->
  178. </select>
  179. </div>
  182. <!-- bookingDetailsDropdown1 -->
  183. <div class="col-sm-3 mb-2" id="bookingDetailsDropdown1" style="display: none;">
  184. <label class="form-label" for="bookingId">Booking Id: </label>
  185. <input type="number" class="form-control" id="bookingId" name="bookingId"
  186. th:value="${bookingId}" placeholder="BookingId">
  187. </div>
  189. <div class="col-sm-3 mb-2" id="zoneDropdown" style="display: none;">
  190. <label class="form-label" for="zone1">Select Zone: </label>
  191. <select class="form-select custom-select" name="zone1" id="zone1">
  192. <option value="ALL">--Select Zone--</option>
  193. <option th:each="zone : ${zones}" th:value="${zone}" th:text="${zone}"
  194. th:selected="${zone == selectedZone}"></option>
  197. </select>
  198. </div>
  200. <div class="col-sm-3 mb-2 hidden" id="divisionContainer" style="display: none;">
  201. <label class="form-label" for="division1">Select division: </label>
  202. <select class="form-select custom-select" name="division1" id="division1">
  203. <option value="ALL">--Select division--</option>
  204. <option th:each="division : ${divisions}" th:value="${division}"
  205. th:text="${division}" th:selected="${division == selectedDivision}">
  206. </option>
  209. </select>
  210. </div>
  212. <div class="col-sm-3 mb-2 hidden" id="hallContainer" style="display: none;">
  213. <label class="form-label" for="hall1">Select Hall: </label>
  214. <select class="form-select custom-select" name="hall1" id="hall1">
  215. <option value="1000">--Select Hall--</option>
  216. <option th:each="hall : ${halls}" th:value="${hall.id}" th:text="${hall.name}"
  217. th:selected="${hall.id == selectedHall}"></option>
  220. </select>
  221. </div>
  224. <!-- bookingDetailsDropdown 3-->
  225. <div class="col-sm-3 mb-2" id="bookingDetailsDropdown3" style="display: none;">
  226. <label class="form-label" for="filterby">Filter by:</label>
  227. <select class="form-control text-center" id="filterby" name="filterby"
  228. th:value="${filterby}">
  229. <option value="">Select Filterby</option>
  230. <option value="1" th:selected="${filterby == '1'}">Booking Date</option>
  231. <option value="2" th:selected="${filterby == '2'}">Event Date</option>
  232. <!-- Add more options as needed -->
  233. </select>
  234. </div>
  236. <!-- bookingDetailsDropdown2 -->
  237. <div class="col-sm-3 mb-2" id="bookingDetailsDropdown2" style="display: none;">
  238. <label class="form-label" for="bookingStatus">Booking Status: </label>
  239. <select class="form-control text-center" id="bookingStatus" name="bookingStatus"
  240. th:value="${bookingStatus}">
  241. <option value="">Select Booking Status</option>
  242. <option value="PENDING" th:selected="${bookingStatus == 'PENDING'}">PENDING
  243. </option>
  244. <option value="APPROVED" th:selected="${bookingStatus == 'APPROVED'}">APPROVED
  245. </option>
  246. <option value="REJECTED" th:selected="${bookingStatus == 'REJECTED'}">REJECTED
  247. </option>
  248. <option value="CANCELED" th:selected="${bookingStatus == 'CANCELED'}">CANCELLED
  249. </option>
  250. <option value="COMPLETED" th:selected="${bookingStatus == 'COMPLETED'}">COMPLETED
  251. </option>
  252. <option value="PAYMENT_FAILURE"
  253. th:selected="${bookingStatus == 'PAYMENT_FAILURE'}">PAYMENT_FAILURE
  254. </option>
  255. <option value="GCC_BLOCKED" th:selected="${bookingStatus == 'GCC_BLOCKED'}">
  256. GCC_BLOCKED
  257. </option>
  258. <option value="REFUNDED" th:selected="${bookingStatus == 'REFUNDED'}">REFUNDED
  259. </option>
  260. <option value="WAITING_FOR_NOC" th:selected="${bookingStatus == 'WAITING_FOR_NOC'}">
  261. WAITING FOR NOC
  262. </option>
  263. <option value="WAITING_FOR_NOC_APPROVAL"
  264. th:selected="${bookingStatus == 'WAITING_FOR_NOC_APPROVAL'}">WAITING FOR NOC
  265. APPROVAL
  266. </option>
  267. </select>
  268. </div>
  270. <!--Payment Dropdown -->
  271. <div class="col-sm-3" id="paymentInfoDropdown1" style="display: none;">
  272. <label class="form-label" for="paymentStatus">Payment Status:</label>
  273. <select class="form-control text-center" id="paymentStatus" name="paymentStatus"
  274. th:value="${paymentStatus}">
  275. <option value="">Select Payment Status</option>
  276. <option value="SUCCESS" th:selected="${paymentStatus == 'SUCCESS'}">SUCCESS</option>
  277. <option value="NOT COMPLETED" th:selected="${paymentStatus == 'NOT COMPLETED'}">NOT
  278. COMPLETED
  279. </option>
  280. </select>
  281. </div>
  283. <div class="col-sm-3 mb-2" id="refundDetailsDropdown" style="display: none;">
  284. <label class="form-label" for="refundStatus">Refund Status: </label>
  285. <select class="form-control text-center" id="refundStatus" name="refundStatus"
  286. th:value="${refundStatus}">
  287. <option value="">Select Refund Status</option>
  288. <option value="WAITING" th:selected="${refundStatus == 'WAITING'}">WAITING
  289. </option>
  290. <option value="APPROVED" th:selected="${refundStatus == 'APPROVED'}">APPROVED
  291. </option>
  292. <option value="INITIATED" th:selected="${refundStatus == 'INITIATED'}">INITIATED
  293. </option>
  294. <option value="REJECTED" th:selected="${refundStatus == 'REJECTED'}">REJECTED
  295. </option>
  296. <option value="COMPLETED" th:selected="${refundStatus == 'COMPLETED'}">COMPLETED
  297. </option>
  298. <option value="NA" th:selected="${refundStatus == 'NA'}">NA
  299. </option>
  300. <option value="CLOSED" th:selected="${refundStatus == 'CLOSED'}">CLOSED
  301. </option>
  302. <option value="FAILURE" th:selected="${refundStatus == 'FAILURE'}">FAILURE
  303. </option>
  304. <!-- Add more options as needed -->
  305. </select>
  306. </div>
  308. <div class="col-sm-3 mb-2" id="counterreportDropdown" style="display: none;">
  309. <label class="form-label" for="reporttype">Report Type: <span
  310. class="text-danger">*</span></label>
  311. <select class="form-control text-center" id="reporttype" name="reporttype"
  312. th:value="${reporttype}">
  313. <option value="">Select</option>
  314. <option value="abstract" th:selected="${reporttype == 'abstract'}">Abstract
  315. </option>
  316. <option value="detailed" th:selected="${reporttype == 'detailed'}">Detailed Report
  317. </option>
  318. </select>
  319. <span id="reportTypeError" class="text-danger"></span>
  320. </div>
  323. <div class="col-sm-3">
  324. <br>
  325. <button type="submit" class="btn btn-sm btn-primary mt-2" name="submit"
  326. id="submit">Submit
  327. </button>
  328. <button class="btn btn-danger mt-2" onclick="resetDate()" name="reset"
  329. type="reset">Reset
  330. </button>
  331. </div>
  332. </div>
  334. </div>
  335. </form>
  336. </div>
  337. <div class="table-responsive" id="usertable" th:if="${request}==1">
  338. <table id="requestTable1" class="table table-striped table-bordered table-hover dataTable"
  339. role="grid" width="99.5%">
  340. <thead class="thead-dark">
  341. <tr role="row">
  342. <th>S.No</th>
  343. <th width="130px">User Id</th>
  344. <th>Name</th>
  345. <th>Mobile</th>
  346. <th>Address</th>
  347. <th>UserType</th>
  348. <th>UserStatus</th>
  349. </tr>
  350. </thead>
  351. <tr th:each="user, iterStat : ${users}">
  352. <td th:text="${iterStat.count}">0</td>
  353. <td th:text="${user.userId}"></td>
  354. <td th:text="${user.name}"></td>
  355. <td th:text="${user.mobileNo}"></td>
  356. <td
  357. th:text="${user.DoorNo + ', ' + user.Street + ', ' + user.Area + ', ' + user.Location + ', ' + user.PinCode}">
  358. </td>
  359. <td th:text="${user.usertype}"></td>
  360. <td th:text="${user.userstatus}"></td>
  361. </tr>
  363. </table>
  364. </div>
  367. <div class="table-responsive" id="Bookingtable" th:if="${request}==2">
  368. <table id="requestTable2" class="table table-striped table-bordered table-hover dataTable"
  369. role="grid" width="99.5%">
  370. <thead class="thead-dark">
  371. <tr role="row">
  372. <th>S.No</th>
  373. <th>Booking Id</th>
  374. <th>Booking Date</th>
  375. <th>Hall Name</th>
  376. <th>User Name</th>
  377. <th>Mobile</th>
  378. <th>Address</th>
  379. <th>User type</th>
  380. <th>Reason</th>
  381. <th>Startdate_Enddate</th>
  382. <th>Deposit Amount</th>
  383. <th>Hall Amount</th>
  384. <th>GST</th>
  385. <th>Amount Paid</th>
  386. <th>Booking Status</th>
  387. <th>Action</th>
  388. </tr>
  389. </thead>
  390. <tbody>
  391. <tr th:each="booking, iterStat : ${bookings}">
  392. <td th:text="${iterStat.count}">0</td>
  393. <td th:text="${booking[0]}"></td>
  394. <td th:text="${booking[1]}"></td>
  395. <td th:text="${booking[2]}"></td>
  396. <td th:text="${booking[3]}"></td>
  397. <td th:text="${booking[4]}"></td>
  398. <td th:text="${booking[5]}"></td>
  399. <td th:text="${booking[6]}"></td>
  400. <td th:text="${booking[7]}"></td>
  401. <td th:text="${booking[8] + ' to ' + booking[9]}"></td>
  402. <td th:text="${booking[10]}"></td>
  403. <td th:text="${booking[11]}"></td>
  404. <td th:text="${booking[12]}"></td>
  405. <td th:text="${(T(java.lang.Math).round(booking[13] * 100.0) / 100.0)}"></td>
  406. <!--<td th:text="${booking[10]}"></td>-->
  407. <td th:text="${booking[14]}"></td>
  408. <td>
  409. <p>
  410. <span class="badge bg-warning" style="cursor: pointer;"
  411. th:onclick="viewDetails([[${booking[0]}]])">View</span>
  412. </p>
  413. </td>
  414. </tr>
  415. </tbody>
  416. </table>
  417. </div>
  420. <div class="table-responsive" id="Paymenttable" th:if="${request}==3">
  421. <table id="requestTable3" class="table table-striped table-bordered table-hover dataTable"
  422. role="grid" width="99.5%">
  423. <thead class="thead-dark">
  424. <tr role="row">
  425. <th>S.No</th>
  426. <th>Booking Id</th>
  427. <th>Booking Date</th>
  428. <th>Hall Name</th>
  429. <th>User Name</th>
  430. <th>User type</th>
  431. <th>Transaction ID</th>
  432. <th>Payment Type</th>
  433. <th>Deposit Amount</th>
  434. <th>Hall Amount</th>
  435. <th>GST</th>
  436. <th>Amount received</th>
  437. <th>Reason</th>
  438. <th width="1000px">Start date & end Date</th>
  439. <th>status</th>
  440. </tr>
  441. </thead>
  442. <tr th:each="payment, iterStat : ${paymentLists}">
  443. <td th:text="${iterStat.count}">0</td>
  444. <td th:text="${payment[0]}"></td>
  445. <td th:text="${payment[1]}"></td>
  446. <td th:text="${payment[2]}"></td>
  447. <td th:text="${payment[3]}"></td>
  448. <td th:text="${payment[4]}"></td>
  449. <td th:text="${payment[5]}"></td>
  450. <td th:text="${payment[6]}"></td>
  451. <td th:text="${payment[7]}"></td>
  452. <td th:text="${payment[8]}"></td>
  453. <td th:text="${payment[9]}"></td>
  454. <td th:text="${payment[10]}"></td>
  455. <td th:text="${payment[11]}"></td>
  456. <td th:text="${payment[12] + ' to ' + payment[13]}" width="1000px"></td>
  457. <td th:text="${payment[14]}"></td>
  458. </tr>
  460. </table>
  461. </div>
  463. <div class="table-responsive" id="extraPaymenttable" th:if="${request}==8">
  464. <table id="requestTable8" class="table table-striped table-bordered table-hover dataTable"
  465. role="grid" width="99.5%">
  466. <thead class="thead-dark">
  467. <tr role="row">
  468. <th>S.No</th>
  469. <th>Booking Id</th>
  470. <th>Booking Date</th>
  471. <th>Hall Name</th>
  472. <th>User Name</th>
  473. <th>User type</th>
  474. <th>Transaction ID</th>
  475. <th>Payment Type</th>
  476. <th>Deposit Amount</th>
  477. <th>Hall Amount</th>
  478. <th>GST</th>
  479. <th>Amount received</th>
  480. <th>Reason</th>
  481. <th width="1000px">Start date & end Date</th>
  482. <th>status</th>
  483. </tr>
  484. </thead>
  485. <tr th:each="payment, iterStat : ${extrapaymentLists}">
  486. <td th:text="${iterStat.count}">0</td>
  487. <td th:text="${payment[0]}"></td>
  488. <td th:text="${payment[1]}"></td>
  489. <td th:text="${payment[2]}"></td>
  490. <td th:text="${payment[3]}"></td>
  491. <td th:text="${payment[4]}"></td>
  492. <td th:text="${payment[5]}"></td>
  493. <td th:text="${payment[6]}"></td>
  494. <td th:text="${payment[7]}"></td>
  495. <td th:text="${payment[8]}"></td>
  496. <td th:text="${payment[9]}"></td>
  497. <td th:text="${payment[10]}"></td>
  498. <td th:text="${payment[11]}"></td>
  499. <td th:text="${payment[12] + ' to ' + payment[13]}" width="1000px"></td>
  500. <td th:text="${payment[14]}"></td>
  501. </tr>
  503. </table>
  504. </div>
  506. <div class="table-responsive" id="userBookingtable" th:if="${request}==4">
  507. <table id="requestTable4" class="table table-striped table-bordered table-hover dataTable"
  508. role="grid" width="99.5%">
  509. <thead class="thead-dark">
  510. <tr role="row">
  511. <th>S.No</th>
  512. <th width="110px">User Id</th>
  513. <th>Name</th>
  514. <th>Mobile</th>
  515. <th>Address</th>
  516. <th>Total Bookings</th>
  517. </tr>
  518. </thead>
  519. <tr th:each="userbookingList, iterStat : ${userbookingLists}">
  521. <td th:text="${iterStat.count}">0</td>
  522. <td th:text="${userbookingList[0]}"></td>
  523. <td th:text="${userbookingList[1]}"></td>
  524. <td th:text="${userbookingList[2]}"></td>
  525. <td th:text="${userbookingList[3]}"></td>
  526. <td th:text="${userbookingList[4]}"
  527. th:onclick="viewbookingDetails([[${userbookingList[0]}]])" style="cursor:pointer;"></td>
  528. </tr>
  530. </table>
  531. </div>
  533. <div class="table-responsive" id="hallBookingtable" th:if="${request}==5">
  534. <table id="requestTable5" class="table table-striped table-bordered table-hover dataTable"
  535. role="grid" width="99.5%">
  536. <thead class="thead-dark">
  537. <tr role="row">
  538. <th>S.No</th>
  539. <th>Hall Id</th>
  540. <th>Hall Name</th>
  541. <th>Zone/Division</th>
  542. <th>Caretaker Name</th>
  543. <th>Caretaker Mobile</th>
  544. <th>Total Bookings</th>
  545. <th>Deposit Amount</th>
  546. <th>Hall Amount</th>
  547. <th>GST</th>
  548. <th>Amount Received</th>
  549. <th>Amount Refund</th>
  550. <th>Net Revenue</th>
  551. </tr>
  552. </thead>
  553. <tbody>
  554. <tr th:each="hallbookingList, iterStat : ${hallbookingLists}">
  555. <td th:text="${iterStat.count}">0</td>
  556. <td th:text="${hallbookingList[11]}"></td>
  557. <td th:text="${hallbookingList[0]}"></td>
  558. <td th:text="${hallbookingList[3]}"></td> <!-- Combined Zone/Division -->
  559. <td th:text="${hallbookingList[1]}"></td>
  560. <td th:text="${hallbookingList[2]}"></td>
  561. <td th:text="${hallbookingList[4]}"></td>
  562. <td th:text="${(T(java.lang.Math).round(hallbookingList[5] * 100.0) / 100.0)}"></td>
  563. <td th:text="${(T(java.lang.Math).round(hallbookingList[6] * 100.0) / 100.0)}"></td>
  564. <td th:text="${(T(java.lang.Math).round(hallbookingList[7] * 100.0) / 100.0)}"></td>
  565. <td th:text="${(T(java.lang.Math).round(hallbookingList[8] * 100.0) / 100.0)}"></td>
  566. <td th:text="${(T(java.lang.Math).round(hallbookingList[9] * 100.0) / 100.0)}"></td>
  567. <td th:text="${(T(java.lang.Math).round(hallbookingList[10] * 100.0) / 100.0)}"></td>
  568. </tr>
  569. </tbody>
  570. </table>
  571. </div>
  573. <div class="table-responsive" id="BookingSettlementtable" th:if="${request}==6">
  574. <table id="requestTable6" class="table table-striped table-bordered table-hover dataTable"
  575. role="grid" width="99.5%">
  576. <thead class="thead-dark">
  577. <tr role="row">
  578. <th>S.No</th>
  579. <th>Name</th>
  580. <th>Mobile</th>
  581. <th>Booking Id</th>
  582. <th>Booked Hall</th>
  583. <th>Reason</th>
  584. <th>Booking Date</th>
  585. <th>Event Date</th>
  586. <th>No of Days</th>
  587. <th>User type</th>
  588. <th>Refund Status</th>
  589. <th>Booking Status</th>
  590. </tr>
  591. </thead>
  592. <tr th:each="settlementlist, iterStat : ${bookingSettlementList}">
  594. <td th:text="${iterStat.count}">0</td>
  595. <td th:text="${settlementlist.users.name}"></td>
  596. <td th:text="${settlementlist.users.mobileNo}"></td>
  597. <td th:text="${settlementlist.bookingId}"></td>
  598. <td th:text="${settlementlist.hallDetails.hallName}"></td>
  599. <td th:text="${settlementlist.reason}"></td>
  600. <td th:text="${settlementlist.bookingDate}"></td>
  601. <td th:text="${settlementlist.startDate +' to '+ settlementlist.endDate}"></td>
  602. <td th:text="${settlementlist.noOfDays}"></td>
  603. <td th:text="${settlementlist.users.usertype}"></td>
  604. <td th:text="${settlementlist.refundStatus}"></td>
  605. <td th:text="${settlementlist.bookingStatus}"></td>
  606. </tr>
  608. </table>
  609. </div>
  610. <div class="table-responsive" id="totalCounttable" th:if="${request == '7'}">
  611. <table id="requestTable7" class="table table-striped table-bordered table-hover dataTable"
  612. role="grid" width="99.5%">
  613. <thead class="thead-dark">
  614. <tr role="row">
  615. <th>S.No</th>
  616. <th th:text="${basedon == 'zone' ? 'Zone' : 'Division'}"></th>
  617. <th>Bookings Count</th>
  618. </tr>
  619. </thead>
  620. <tbody>
  621. <tr th:each="data, stat : ${totalcount}">
  622. <td th:text="${stat.index + 1}"></td> <!-- Serial number -->
  623. <td th:text="${data[0]}"></td> <!-- Zone or Division -->
  624. <td th:text="${data[1]}"></td> <!-- Bookings Count -->
  625. </tr>
  626. </tbody>
  627. <tfoot>
  628. <tr>
  629. <th></th>
  630. <td><strong>Total Bookings :</strong></td>
  631. <td th:text="${totalBookings}"></td> <!-- Total bookings -->
  632. </tr>
  633. </tfoot>
  634. </table>
  635. </div>
  636. <!--<div class="table-responsive" id="countertable" th:if="${request == '9'}">-->
  637. <div class="table-responsive" id="countertable" th:if="${request}==9">
  638. <div th:if="${reporttype == 'abstract'}">
  639. <table id="requestTable9" class="table table-striped table-bordered table-hover dataTable"
  640. role="grid" width="99.5%">
  641. <thead class="thead-dark">
  642. <tr role="row">
  643. <th>S.No</th>
  644. <th>Counter ID</th>
  645. <th>Total Bookings</th>
  646. </tr>
  647. </thead>
  648. <tbody>
  649. <tr th:each="counterdata, iterstat : ${counterBookingList}">
  650. <td th:text="${iterstat.index + 1}"></td>
  651. <td th:text="${counterdata[0]}"></td>
  652. <td>
  653. <button href="#"
  654. th:attr="data-counter-id=${counterdata[0]}"
  655. data-bs-toggle="modal"
  656. data-bs-target="#bookingModal"
  657. style="background-color: #2a807f; color: white; border: none; padding: 6px 12px; border-radius: 4px;"
  659. onclick="showCounterTable(this)">
  660. <span th:text="${counterdata[1]}"></span>
  661. </button>
  662. </td>
  663. </tr>
  664. </tbody>
  665. </table>
  666. </div>
  667. <div th:if="${reporttype == 'detailed'}">
  668. <table id="detailedrequestTable" class="table table-striped table-bordered table-hover dataTable"
  669. role="grid" width="99.5%">
  670. <thead class="thead-dark">
  671. <tr role="row">
  672. <th>S.No</th>
  673. <th>Booking ID</th>
  674. <th>Hall Name</th>
  675. <th>Booking Date</th>
  676. <th>Start Date</th>
  677. <th>End Date</th>
  678. <th>Starting Slot</th>
  679. <th>Ending Slot</th>
  680. <th>No.of.Days</th>
  681. <th>Reason for Booking</th>
  682. <th>Hall Amount</th>
  683. <th>Deposit Amount</th>
  684. <th>GSt</th>
  685. <th>Amount Received</th>
  686. <th>Booking Status</th>
  687. <th>Booking Type</th>
  688. <th>Counter Id</th>
  689. <th>View</th>
  690. </tr>
  691. </thead>
  692. <tbody>
  693. <tr th:each="counterdata, iterstat : ${counterBookingList}">
  694. <td th:text="${iterstat.index + 1}"></td>
  695. <td th:text="${counterdata[0]}"></td>
  696. <td th:text="${counterdata[1]}"></td>
  697. <td th:text="${counterdata[2]}"></td>
  698. <td th:text="${counterdata[3]}"></td>
  699. <td th:text="${counterdata[4]}"></td>
  700. <td th:text="${counterdata[5]}"></td>
  701. <td th:text="${counterdata[6]}"></td>
  702. <td th:text="${counterdata[7]}"></td>
  703. <td th:text="${counterdata[8]}"></td>
  704. <td th:text="${counterdata[9]}"></td>
  705. <td th:text="${counterdata[10]}"></td>
  706. <td th:text="${counterdata[11]}"></td>
  707. <td th:text="${counterdata[12]}"></td>
  708. <td th:text="${counterdata[13]}"></td>
  709. <td th:text="${counterdata[14]}"></td>
  710. <td th:text="${counterdata[15]}"></td>
  711. <td>
  712. <p>
  713. <span class="badge bg-warning" style="cursor: pointer;"
  714. th:onclick="viewDetails([[${counterdata[0]}]])">View</span>
  715. </p>
  716. </td>
  717. </tr>
  718. </tbody>
  719. </table>
  720. </div>
  721. </div>
  723. <div class="table-responsive" id="zoneWiseBookingTable" th:if="${request}==10">
  724. <table id="requestTable10" class="table table-striped table-bordered table-hover dataTable"
  725. role="grid" width="99.5%">
  726. <thead class="thead-dark">
  727. <tr role="row">
  728. <th>S.No</th>
  729. <th>Zone</th>
  730. <th>Hall Count</th>
  731. <th>Online Booking Count</th>
  732. <th>Counter Booking Count</th>
  733. <th>Total Count</th>
  734. </tr>
  735. </thead>
  736. <tr th:each="zoneList, iterStat : ${zoneWiseBookingList}">
  737. <td th:text="${iterStat.count}">0</td>
  738. <td>
  739. <button href="#"
  740. th:attr="data-zone-id=${zoneList[0]}"
  741. data-bs-toggle="modal"
  742. data-bs-target="#hallModal"
  743. style="background-color: #2a807f; color: white; border: none; padding: 6px 12px; border-radius: 4px;"
  744. onclick="showHallDetailsTable(this)">
  745. <span th:text="${zoneList[0]}"></span>
  746. </button>
  747. </td>
  748. <td th:text="${zoneList[1]}"></td>
  749. <td th:text="${zoneList[3]}"></td>
  750. <td th:text="${zoneList[4]}"></td>
  751. <td th:text="${zoneList[2]}"></td>
  752. </tr>
  753. </table>
  754. </div>
  756. </div>
  758. <div class="modal fade backdrop" id="showBookingDetails" data-backdrop="static"
  759. tabindex="-1" role="dialog" aria-labelledby="staticBackdropLabel"
  760. aria-hidden="true">
  761. <div class="modal-dialog modal-lg" role="document">
  762. <div class="modal-content" id="printableContent">
  764. <form id="regform" onsubmit="return rejectsubmit();">
  765. <div
  766. class="block block-rounded block-themed block-transparent mb-0">
  768. <div class="block-header bg-primary-dark">
  769. <h3 class="block-title" id="2mtitle">Booking
  770. Information</h3>
  771. <div class="block-options">
  772. <button type="button" class="btn-block-option"
  773. data-bs-dismiss="modal" aria-label="Close">
  774. <i class="fa fa-fw fa-times"></i>
  775. </button>
  776. </div>
  777. </div>
  779. <div class="block-content row"
  780. style="margin-right:0px;margin:0;padding:0;">
  781. <div class="col-md-12 col-lg-12 col-sm-12">
  782. <div class="card-body">
  783. <table>
  784. <tr>
  785. <th colspan="10"
  786. style="background-color: lightgrey;">
  787. User Details
  788. </th>
  789. </tr>
  790. <tr>
  791. <th
  792. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  793. User Name:
  794. </th>
  795. <td class="fw-semibold"
  796. style="padding: 0.45rem 0.45rem;"
  797. id="td_userName"></td>
  798. <th
  799. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  800. Mobile Number:
  801. </th>
  802. <td class="fw-semibold"
  803. style="padding: 0.45rem 0.45rem;"
  804. id="td_mobileNumber"></td>
  806. <th
  807. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  808. User Type:
  809. </th>
  810. <td class="fw-semibold"
  811. style="padding: 0.45rem 0.45rem;"
  812. id="td_usertype"></td>
  814. </tr>
  815. <tr>
  816. <th
  817. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  818. User Address:
  819. </th>
  820. <td colspan="5" class="fw-semibold"
  821. style="padding: 0.45rem 0.45rem;text-wrap: pretty;"
  822. id="td_useraddress"></td>
  824. </tr>
  825. <input type="hidden"
  826. class="form-control text-center"
  827. name="bookingid" id="bookingid" disabled/>
  828. <tr>
  829. <th colspan="10"
  830. style="background-color: lightgrey;">
  831. Hall Details
  832. </th>
  833. </tr>
  835. <tr>
  836. <th
  837. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  838. Hall Name:
  839. </th>
  840. <td colspan="10" class="fw-semibold"
  841. style="padding: 0.45rem 0.45rem;text-wrap:pretty;"
  842. id="td_hallName"></td>
  844. </tr>
  845. <th
  846. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  847. Hall Address:
  848. </th>
  849. <td colspan="10" class="fw-semibold"
  850. style="padding: 0.45rem 0.45rem;text-wrap: pretty;"
  851. id="td_halladdress"></td>
  853. </tr>
  854. <tr>
  855. <th
  856. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  857. Caretaker Name:
  858. </th>
  859. <td colspan="2" class="fw-semibold"
  860. style="padding: 0.45rem 0.45rem;"
  861. id="td_caretakername"></td>
  862. <th
  863. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  864. Caretaker Mobile Number:
  865. </th>
  866. <td colspan="2" class="fw-semibold"
  867. style="padding: 0.45rem 0.45rem;"
  868. id="td_caretakermobileNumber"></td>
  870. </tr>
  871. <tr>
  872. <th colspan="10"
  873. style="background-color: lightgrey;">
  874. Booking
  875. Details (Booking Id:-<span
  876. id="booking_id"
  877. style="color:blue"></span>)
  878. </th>
  879. </tr>
  880. <tr>
  881. <th
  882. style="padding: 0.45rem 0.45rem;font-weight: normal">
  883. Booking Date:
  884. </th>
  885. <td colspan="2" class="fw-semibold"
  886. style="padding: 0.45rem 0.45rem;"
  887. id="td_bookingDate"></td>
  888. <th
  889. style="padding: 0.45rem 0.45rem;font-weight: normal">
  890. Deposit Amount (in Rs):
  891. </th>
  892. <td colspan="2"
  893. class="fw-semibold amount-cell"
  894. style="padding: 0.45rem 0.45rem;"
  895. id="td_depositeAmount"></td>
  896. </tr>
  897. <tr>
  898. <th
  899. style="padding: 0.45rem 0.45rem;font-weight: normal">
  900. Start Date:
  901. </th>
  902. <td colspan="2" class="fw-semibold"
  903. style="padding: 0.45rem 0.45rem;"
  904. id="td_startDate"></td>
  905. <th
  906. style="padding: 0.45rem 0.45rem;font-weight: normal">
  907. Hall Amount (in Rs):
  908. </th>
  909. <td colspan="2"
  910. class="fw-semibold amount-cell"
  911. style="padding: 0.45rem 0.45rem;"
  912. id="td_hallAmount"></td>
  913. </tr>
  914. <tr>
  915. <th
  916. style="padding: 0.45rem 0.45rem;font-weight: normal">
  917. END Date:
  918. </th>
  919. <td colspan="2" class="fw-semibold"
  920. style="padding: 0.45rem 0.45rem;"
  921. id="td_endDate"></td>
  922. <th
  923. style="padding: 0.45rem 0.45rem;font-weight: normal">
  924. GST @18% (in Rs):
  925. </th>
  926. <td colspan="2"
  927. class="fw-semibold amount-cell"
  928. style="padding: 0.45rem 0.45rem;"
  929. id="td_gst"></td>
  930. </tr>
  931. <tr>
  932. <th
  933. style="padding: 0.45rem 0.45rem;font-weight: normal">
  934. Starting Slot:
  935. </th>
  936. <td colspan="2" class="fw-semibold"
  937. style="padding: 0.45rem 0.45rem;"
  938. id="td_startingSlot"></td>
  939. <th
  940. style="padding: 0.45rem 0.45rem;font-weight: normal">
  941. Total Amount (in Rs):
  942. </th>
  943. <td colspan="2"
  944. class="fw-semibold amount-cell"
  945. style="padding: 0.45rem 0.45rem;"
  946. id="td_totalAmount"></td>
  947. </tr>
  948. <tr>
  949. <th
  950. style="padding: 0.45rem 0.45rem;font-weight: normal">
  951. Ending Slot:
  952. </th>
  953. <td colspan="2" class="fw-semibold"
  954. style="padding: 0.45rem 0.45rem;"
  955. id="td_endingSlot"></td>
  956. <!--<th style="display:none;padding: 0.45rem 0.45rem;border:none"
  957. id="rejectionreasondiv">Rejection
  958. Reason:</th>
  959. <td class="fw-semibold"
  960. style="padding: 0.45rem 0.45rem;"
  961. id="reasonforrejection"></td>-->
  963. <th
  964. style="padding: 0.45rem 0.45rem;border:none">
  965. Booking Status:
  966. </th>
  967. <td colspan="2" class="fw-semibold"
  968. style="padding: 0.45rem 0.45rem;text-wrap: pretty;"
  969. id="bookingstatus_td"></td>
  970. </tr>
  971. <tr>
  972. <th style="display:none;padding: 0.45rem 0.45rem;border:none"
  973. id="rejectionreasondiv">Rejection
  974. Reason:
  975. </th>
  976. <td class="fw-semibold"
  977. style="padding: 0.45rem 0.45rem;text-wrap: pretty;"
  978. id="reasonforrejection"></td>
  979. </tr>
  980. </table>
  981. </div>
  982. </div>
  983. <div class="row col-md-12 col-lg-12 col-sm-12">
  984. <div class="documents" id="documents"></div>
  985. </div>
  986. <div class="col-md-12 col-lg-12 col-sm-12 mb-2"
  987. id="paymentsdetails"
  988. style="display:none; margin-top: -16px;">
  989. <div class="card-body">
  990. <table>
  991. <tr>
  992. <th colspan="10"
  993. style="background-color: lightgrey;">
  994. Booking Payment Details
  995. </th>
  996. </tr>
  997. <tr>
  998. <th
  999. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  1000. Transaction ID:
  1001. </th>
  1002. <td colspan="10" class="fw-semibold"
  1003. style="padding: 0.45rem 0.45rem;"
  1004. id="td_transactionId"></td>
  1006. </tr>
  1007. <th
  1008. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  1009. Amount Received (in Rs):
  1010. </th>
  1011. <td colspan="10" class="fw-semibold"
  1012. style="padding: 0.45rem 0.45rem;"
  1013. id="td_payamountReceived"></td>
  1015. </tr>
  1016. <tr>
  1017. <th
  1018. style="padding: 0.45rem 0.45rem;font-weight: normal;">
  1019. Transaction Status:
  1020. </th>
  1021. <td class="fw-semibold"
  1022. style="padding: 0.45rem 0.45rem;"
  1023. id="td_paymentStatus"></td>
  1024. </tr>
  1025. </table>
  1026. </div>
  1027. </div>
  1029. <!--Newly added for Reschedule Details-->
  1031. <!--<div class="row col-md-12 col-lg-12 col-sm-12"
  1032. id="rescheduleDetails"
  1033. style="display:none;margin-left: 0px;margin-top: -10px">
  1034. <div class="card-body">
  1035. <table>
  1036. <tr>
  1037. <th colspan="4"
  1038. style="background-color: lightgrey;">Reschedule
  1039. Details
  1040. </th>
  1041. </tr>
  1042. <tr>
  1043. <th
  1044. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1045. Event Start Date:
  1046. </th>
  1047. <td class="fw-semibold"
  1048. style="padding: 0.45rem 0.45rem;"
  1049. id="td_res_start_date"></td>
  1050. <th
  1051. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1052. Event End Date:
  1053. </th>
  1054. <td class="fw-semibold"
  1055. style="padding: 0.45rem 0.45rem;"
  1056. id="td_res_end_date"></td>
  1057. </tr>
  1058. <tr>
  1059. <th
  1060. style="padding: 0.45rem 0.45rem;font-weight: normal;text-wrap: pretty;">
  1061. Rescheduled Date:
  1062. </th>
  1063. <td class="fw-semibold" colspan="5"
  1064. style="padding: 0.45rem 0.45rem;"
  1065. id="td_res_date"></td>
  1066. </tr>
  1067. </tbody>
  1068. </table>
  1069. </div>
  1070. </div>-->
  1073. <div class="row col-md-12 col-lg-12 col-sm-12"
  1074. id="ebdetails"
  1075. style="display:none;margin-left: 0px;margin-top: -10px">
  1076. <div class="card-body">
  1077. <table>
  1078. <tr>
  1079. <th colspan="4"
  1080. style="background-color: lightgrey;">EB
  1081. Details
  1082. </th>
  1083. </tr>
  1084. <tr>
  1085. <th
  1086. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1087. Consumer Number:
  1088. </th>
  1089. <td class="fw-semibold"
  1090. style="padding: 0.45rem 0.45rem;"
  1091. id="td_EBNumber"></td>
  1092. <th
  1093. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1094. EB Amount Per Unit (in Rs):
  1095. </th>
  1096. <td class="fw-semibold"
  1097. style="padding: 0.45rem 0.45rem;"
  1098. id="td_ebamountperunit"></td>
  1099. </tr>
  1100. <tr>
  1101. <th
  1102. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1103. Start Reading:
  1104. </th>
  1105. <td class="fw-semibold"
  1106. style="padding: 0.45rem 0.45rem;"
  1107. id="td_startingReading"></td>
  1108. <th
  1109. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1110. Unit Consumed:
  1111. </th>
  1112. <td class="fw-semibold"
  1113. style="padding: 0.45rem 0.45rem;"
  1114. id="td_usedunit"></td>
  1115. </tr>
  1116. <tr>
  1117. <th
  1118. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1119. END Reading:
  1120. </th>
  1121. <td class="fw-semibold"
  1122. style="padding: 0.45rem 0.45rem;"
  1123. id="td_endingReading"></td>
  1124. <th
  1125. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1126. EB Amount (in Rs):
  1127. </th>
  1128. <td class="fw-semibold"
  1129. style="padding: 0.45rem 0.45rem;"
  1130. id="td_electricityamount"></td>
  1131. </tr>
  1132. </tbody>
  1133. </table>
  1134. </div>
  1135. </div>
  1136. <div class="row col-md-12 col-lg-12 col-sm-12"
  1137. id="damagelist" style="disaply:none">
  1138. <div id="damageDetails"></div>
  1139. </div>
  1141. <div class="col-md-12 col-lg-12 col-sm-12"
  1142. id="refunddetails" style="margin-top:-1px">
  1143. <div class="card-body">
  1144. <table>
  1145. <tr>
  1146. <th colspan="2"
  1147. style="background-color: lightgrey;">
  1148. Amount to be Refunded (in Rs)
  1149. </th>
  1150. </tr>
  1151. <tr>
  1152. <th
  1153. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1154. Deposit Amount:
  1155. </th>
  1156. <td class="fw-semibold amount-cell"
  1157. style="padding: 0.45rem 0.45rem;"
  1158. id="td_depositeamountforrefund">0
  1159. </td>
  1160. </tr>
  1161. <tr>
  1162. <th
  1163. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1164. EB Amount:
  1165. </th>
  1166. <td class="fw-semibold amount-cell"
  1167. style="padding: 0.45rem 0.45rem;"
  1168. id="td_ebAmount"></td>
  1169. </tr>
  1170. <tr>
  1171. <th
  1172. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1173. Damage Amount:
  1174. </th>
  1175. <td class="fw-semibold amount-cell"
  1176. style="padding: 0.45rem 0.45rem;"
  1177. id="td_damage"></td>
  1178. </tr>
  1179. <tr id="pendingcolumn">
  1180. <th id="th_settel_label"
  1181. style="padding: 0.45rem 0.45rem; background-color: #f2f2f2;font-weight: normal">
  1182. Collection Pending Amount:
  1183. </th>
  1184. <td class="fw-semibold amount-cell"
  1185. style="padding: 0.45rem 0.45rem; color: green;"
  1186. id="td_pending_amt">0
  1187. </td>
  1188. </tr>
  1189. <tr id="collectionstatuscolumn">
  1190. <th id="label"
  1191. style="padding: 0.45rem 0.45rem;font-weight: normal">Collection
  1192. Pending Status
  1193. :
  1194. </th>
  1195. <td class="fw-semibold amount-cell"
  1196. style="padding: 0.45rem 0.45rem; color: green;"
  1197. id="td_collection_status">
  1198. </td>
  1199. </tr>
  1200. <tr>
  1201. <th
  1202. style="padding: 0.45rem 0.45rem; background-color: #f2f2f2;font-weight: normal">
  1203. Actual refundable Amount:
  1204. </th>
  1205. <td class="fw-semibold amount-cell"
  1206. style="padding: 0.45rem 0.45rem; color: green;"
  1207. id="td_settel_amt">0
  1208. </td>
  1209. </tr>
  1210. </table>
  1211. </div>
  1212. </div>
  1213. <div class="row col-md-12 col-lg-12 col-sm-12"
  1214. id="refundamountDetails"
  1215. style="display:none;margin-left: 0px;margin-top: -49px">
  1216. <div class="card-body">
  1217. <table>
  1218. <tr>
  1219. <th colspan="4"
  1220. style="background-color: lightgrey;">
  1221. Refund Details
  1222. </th>
  1223. </tr>
  1224. <tr>
  1225. <th
  1226. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1227. Booking Status:
  1228. </th>
  1229. <td class="fw-semibold"
  1230. style="padding: 0.45rem 0.45rem;"
  1231. id="td_bookingStatus"></td>
  1232. <th
  1233. style="padding: 0.45rem 0.45rem;font-weight: normal">
  1234. Refund Status:
  1235. </th>
  1236. <td class="fw-semibold"
  1237. style="padding: 0.45rem 0.45rem;"
  1238. id="td_refundStatus"></td>
  1239. </tr>
  1240. <tr>
  1241. <th
  1242. style="padding: 0.45rem 0.45rem;font-weight: normal;text-wrap: pretty;">
  1243. Refund amount:
  1244. </th>
  1245. <td class="fw-semibold" colspan="5"
  1246. style="padding: 0.45rem 0.45rem;"
  1247. id="td_refundamount"></td>
  1248. </tr>
  1249. </tbody>
  1250. </table>
  1251. </div>
  1252. </div>
  1253. <div id="refundMessage" style="display: none;">
  1254. <h1 id="refundText"
  1255. style="font-size: 17px;margin-left: 20px;color: darkgreen;">
  1256. </h1>
  1257. </div>
  1258. <div id="rejectrefundMessage" style="display: none;">
  1259. <h1 id="rejectrefundText"
  1260. style="font-size: 17px;margin-left: 20px;color: darkgreen;">
  1261. </h1>
  1262. </div>
  1263. <div id="blockedrefundMessage" style="display: none;">
  1264. <h1 id="blockedrefundText"
  1265. style="font-size: 17px;margin-left: 20px;color: darkgreen;">
  1266. </h1>
  1267. </div>
  1268. </div>
  1270. </div>
  1271. <div class="block-content block-content-full text-end bg-body"
  1272. id="mbutton">
  1273. <button type="button"
  1274. style="background-color: rgb(21,69,93);color: white;"
  1275. class="btn btn-sm btn-alt-secondary"
  1276. data-bs-dismiss="modal">Close
  1277. </button>
  1278. </div>
  1279. </form>
  1280. </div>
  1281. </div>
  1282. </div>
  1284. <div class="modal fade" id="fileModal" tabindex="-1" role="dialog" aria-labelledby="fileModalLabel"
  1285. aria-hidden="true">
  1286. <div class="modal-dialog modal-lg" role="document">
  1287. <div class="modal-content">
  1288. <div class="modal-header">
  1289. <h5 class="modal-title" id="fileModalLabel">File Preview</h5>
  1290. <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
  1291. <span aria-hidden="true">&times;</span>
  1292. </button>
  1293. </div>
  1294. <div class="modal-body">
  1295. <embed id="filePreview" src="" width="100%" height="600px">
  1296. </div>
  1297. <div class="modal-footer">
  1298. <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
  1299. </div>
  1300. </div>
  1301. </div>
  1302. </div>
  1304. <div class="modal fade" id="viewbookingDetailsdetails">
  1305. <div class="modal-dialog modal-xl">
  1306. <div class="modal-content">
  1307. <!-- Modal Header -->
  1308. <div class="modal-header">
  1309. <h4 class="modal-title">List of Bookings</h4>
  1310. <button type="button" class="btn" data-bs-dismiss="modal">&times;</button>
  1311. </div>
  1312. <!-- Modal Body -->
  1313. <div class="modal-body">
  1314. <div class="content">
  1315. <div class="block block-rounded">
  1316. <div class="block-content p-0">
  1317. <div class="p-sm-4 p-0">
  1318. <div class="table-responsive">
  1319. <table id="bookinglistdataTable"
  1320. class="table table-bordered table-striped table-vcenter js-dataTable-responsive">
  1321. <thead class="thead-light">
  1322. <tr class="table-bordered">
  1323. <th class="text-center no-sort">S.No</th>
  1324. <th class="text-center no-sort">Booking Id</th>
  1325. <th class="text-center no-sort">Booking Date</th>
  1326. <th class="text-center no-sort">Start Date</th>
  1327. <th class="text-center no-sort">End Date</th>
  1328. <th class="text-center no-sort">Starting Slot</th>
  1329. <th class="text-center no-sort">Ending Slot</th>
  1330. <th class="text-center no-sort">Reason For Booking</th>
  1331. <th class="text-center no-sort">No of days</th>
  1332. <th class="text-center no-sort">Booking Status</th>
  1333. <th class="text-center no-sort">Hall Amount</th>
  1334. <th class="text-center no-sort">Total Amount Paid</th>
  1335. </tr>
  1336. </thead>
  1337. <tbody id="bookingTableBody"></tbody>
  1338. </table>
  1339. </div>
  1340. </div>
  1341. </div>
  1342. </div>
  1343. </div>
  1344. </div>
  1345. <!-- Modal Footer -->
  1346. <div class="modal-footer">
  1347. <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
  1348. </div>
  1349. </div>
  1350. </div>
  1351. </div>
  1353. <div class="modal fade" id="viewbookingDetailsbyzone">
  1354. <div class="modal-dialog modal-xl">
  1355. <div class="modal-content">
  1356. <!-- Modal Header -->
  1357. <div class="modal-header">
  1358. <h4 class="modal-title">List of Bookings Based on Zone</h4>
  1359. <button type="button" class="btn" data-bs-dismiss="modal">&times;</button>
  1360. </div>
  1361. <!-- Modal Body -->
  1362. <div class="modal-body">
  1363. <div class="content">
  1364. <div class="block block-rounded">
  1365. <div class="block-content p-0">
  1366. <div class="p-sm-4 p-0">
  1367. <div class="table-responsive">
  1368. <table id="bookinglistdataTablebyzone"
  1369. class="table table-bordered table-striped table-vcenter js-dataTable-responsive">
  1370. <thead class="thead-light">
  1371. <tr class="table-bordered">
  1372. <th class="text-center no-sort">S.No</th>
  1373. <th class="text-center no-sort">Booking Id</th>
  1374. <th class="text-center no-sort">Booking Date</th>
  1375. <th class="text-center no-sort">Start Date</th>
  1376. <th class="text-center no-sort">End Date</th>
  1377. <th class="text-center no-sort">Starting Slot</th>
  1378. <th class="text-center no-sort">Ending Slot</th>
  1379. <th class="text-center no-sort">Reason For Booking</th>
  1380. <th class="text-center no-sort">No of Days</th>
  1381. <th class="text-center no-sort">Booking Status</th>
  1382. <th class="text-center no-sort">Hall Amount</th>
  1383. <th class="text-center no-sort">Total Amount Paid</th>
  1384. </tr>
  1385. </thead>
  1386. <tbody id="bookingTableBodybyzone"></tbody>
  1387. </table>
  1388. </div>
  1389. </div>
  1390. </div>
  1391. </div>
  1392. </div>
  1393. </div>
  1394. <!-- Modal Footer -->
  1395. <div class="modal-footer">
  1396. <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
  1397. </div>
  1398. </div>
  1399. </div>
  1400. </div>
  1401. <!-- Modal -->
  1402. <div class="modal fade" id="bookingModal" tabindex="-1" aria-labelledby="bookingModalLabel" aria-hidden="true">
  1403. <div class="modal-dialog modal-xl modal-dialog-scrollable">
  1404. <div class="modal-content">
  1405. <div class="modal-header">
  1406. <h5 class="modal-title">Hall-wise Booking Details</h5>
  1407. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  1408. </div>
  1409. <div class="modal-body">
  1410. <!--
  1411. <table id="modalBookingTable" class="table table-bordered table-striped dataTable" style="width: 100%;">
  1412. -->
  1413. <table id="modalBookingTable" class="table table-striped table-bordered table-hover dataTable"
  1414. role="grid" width="99.5%">
  1415. <input type="hidden" id="hallBookingJsonInput" th:value="${hallBookingJson}">
  1417. <thead>
  1418. <tr>
  1419. <th>S.No</th>
  1420. <th>Zone</th>
  1421. <th>Division</th>
  1422. <th>Hall Name</th>
  1423. <th>Total Bookings</th>
  1424. </tr>
  1425. </thead>
  1426. <tbody id="modalBookingDetails"></tbody>
  1427. </table>
  1428. </div>
  1429. </div>
  1430. </div>
  1431. </div>
  1433. <div class="modal fade" id="hallDetailModal" tabindex="-1" aria-hidden="true">
  1434. <div class="modal-dialog modal-fullscreen-custom modal-dialog-scrollable">
  1435. <div class="modal-content">
  1436. <div class="modal-header">
  1437. <h5 class="modal-title">Booking Details for Hall</h5>
  1438. <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
  1439. </div>
  1440. <div class="modal-body">
  1441. <table id="hallDetailsTable" class="table table-bordered table-striped">
  1442. <input type="hidden" id="hallBookingDetailsJsonInput" th:value="${hallBookingDetailsJson}">
  1444. <thead>
  1445. <tr>
  1446. <th>S.No</th>
  1447. <th>Booking ID</th>
  1448. <th>Hall Name</th>
  1449. <th>Booking Date</th>
  1450. <th>Start Date</th>
  1451. <th>End Date</th>
  1452. <th>Starting Slot</th>
  1453. <th>Ending Slot</th>
  1454. <th>No.of.Days</th>
  1455. <th>Reason for Booking</th>
  1456. <th>Hall Amount</th>
  1457. <th>Deposit Amount</th>
  1458. <th>GSt</th>
  1459. <th>Amount Received</th>
  1460. <th>Booking Status</th>
  1461. <th>Booking Type</th>
  1462. <th>View</th>
  1463. </tr>
  1464. </thead>
  1465. <tbody id="hallDetailsTableBody"></tbody>
  1466. </table>
  1467. </div>
  1468. </div>
  1469. </div>
  1470. </div>
  1471. <!--Modal For Review Report-->
  1472. <div class="modal fade" id="hallModal" tabindex="-1" aria-labelledby="hallModalLabel" aria-hidden="true">
  1473. <div class="modal-dialog modal-xl modal-dialog-scrollable">
  1474. <div class="modal-content">
  1475. <div class="modal-header">
  1476. <h5 class="modal-title">Hall-wise Booking Details</h5>
  1477. <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  1478. </div>
  1479. <div class="modal-body">
  1480. <!--
  1481. <table id="modalBookingTable" class="table table-bordered table-striped dataTable" style="width: 100%;">
  1482. -->
  1483. <table id="hallwiseBookingTable"
  1484. class="table table-striped table-bordered table-hover dataTable"
  1485. role="grid" width="99.5%">
  1486. <input type="hidden" id="hallWiseBookingList" th:value="${hallWiseBookingList}" />
  1488. <thead>
  1489. <tr>
  1490. <th>S.No</th>
  1491. <th>Hall Name</th>
  1492. <th>Online Booking Count</th>
  1493. <th>Counter Booking Count</th>
  1494. <th>Total Count</th>
  1495. </tr>
  1496. </thead>
  1497. <tbody id="hallwiseBookingDetails"></tbody>
  1498. </table>
  1499. </div>
  1500. </div>
  1501. </div>
  1502. </div>
  1504. <div class="modal fade" id="counterDetailModal" tabindex="-1" aria-hidden="true">
  1505. <div class="modal-dialog modal-fullscreen-custom modal-dialog-scrollable">
  1506. <div class="modal-content">
  1507. <div class="modal-header">
  1508. <h5 class="modal-title">Booking Details for Hall</h5>
  1509. <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
  1510. </div>
  1511. <div class="modal-body">
  1512. <table id="counterDetailsTable" class="table table-bordered table-striped">
  1513. <input type="hidden" id="counterWiseBookingList" th:value="${counterWiseBookingList}" />
  1515. <thead>
  1516. <tr>
  1517. <th>S.No</th>
  1518. <th>Counter ID</th>
  1519. <th>No.of Booking</th>
  1520. </tr>
  1521. </thead>
  1522. <tbody id="counterDetailsTableBody"></tbody>
  1523. </table>
  1524. </div>
  1525. </div>
  1526. </div>
  1527. </div>
  1529. <div class="modal fade" id="bookingInfoModal" tabindex="-1" aria-labelledby="bookingInfoModalLabel"
  1530. aria-hidden="true">
  1531. <div class="modal-dialog modal-xl">
  1532. <div class="modal-content">
  1533. <div class="modal-header bg-dark text-white">
  1534. <h5 class="modal-title">Booking Information</h5>
  1535. <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
  1536. </div>
  1537. <div class="modal-body" id="bookingInfoContent">
  1538. <!-- Filled by JS -->
  1539. </div>
  1540. </div>
  1541. </div>
  1542. </div>
  1544. </main>
  1545. <footer th:replace="~{fragments/footer2 :: footer}"></footer>
  1546. </div>
  1549. <div th:replace="~{fragments/resetpassword :: div}"></div>
  1550. <script th:replace="~{fragments/loginscript :: script}"></script>
  1553. <script>
  1554. /*$(document).ready(function () {
  1555. // Common buttons configuration
  1556. var buttons = [{
  1557. extend: 'pageLength',
  1558. className: 'btn btn-primary'
  1559. }, {
  1560. title: 'Data export',
  1561. extend: 'copyHtml5',
  1562. text: 'Copy',
  1563. className: 'btn btn-primary',
  1564. id: 'copyBtn'
  1565. }, {
  1566. extend: 'excelHtml5',
  1567. text: 'Excel',
  1568. className: 'btn btn-primary',
  1569. id: 'excelBtn'
  1570. }, {
  1571. extend: 'csvHtml5',
  1572. text: 'CSV',
  1573. className: 'btn btn-primary',
  1574. id: 'csvBtn'
  1575. }, {
  1576. extend: 'pdfHtml5',
  1577. text: 'PDF',
  1578. className: 'btn btn-primary',
  1579. id: 'pdfBtn'
  1580. }];
  1582. // DataTables initialization
  1583. $('#requestTable1, #requestTable2, #requestTable3, #requestTable8, #requestTable4, #requestTable5, #requestTable6, #requestTable7,#requestTable9,#modalBookingTable,#hallDetailsTable').DataTable({
  1584. dom: 'Bftip',
  1585. columnDefs: [{
  1586. targets: 'no-sort',
  1587. orderable: false
  1588. }],
  1589. lengthMenu: [
  1590. [50, 100, 200, 500, -1],
  1591. ['50 rows', '100 rows', '200 rows', '500 rows', 'Show all']
  1592. ],
  1593. // scrollY: '50vh',
  1594. fixedColumns: {
  1595. left: 1,
  1596. right: 1
  1597. },
  1598. buttons: buttons,
  1599. responsive: true,
  1600. searching: true, // Enable search
  1601. select: false,
  1602. processing: false,
  1603. order: [] // Remove any default sorting
  1604. });
  1606. // Link the search input to DataTable
  1607. $('#searchInput').on('keyup', function () {
  1608. $('#bookinglistdataTable').DataTable().search(this.value).draw();
  1609. });
  1610. });*/
  1612. $(document).ready(function () {
  1613. // Common buttons (default for most tables)
  1614. var commonButtons = [{
  1615. extend: 'pageLength',
  1616. className: 'btn btn-primary'
  1617. }, {
  1618. title: 'Data export',
  1619. extend: 'copyHtml5',
  1620. text: 'Copy',
  1621. className: 'btn btn-primary',
  1622. id: 'copyBtn'
  1623. }, {
  1624. extend: 'excelHtml5',
  1625. text: 'Excel',
  1626. className: 'btn btn-primary',
  1627. id: 'excelBtn'
  1628. }, {
  1629. extend: 'csvHtml5',
  1630. text: 'CSV',
  1631. className: 'btn btn-primary',
  1632. id: 'csvBtn'
  1633. }, {
  1634. extend: 'pdfHtml5',
  1635. text: 'PDF',
  1636. className: 'btn btn-primary',
  1637. id: 'pdfBtn'
  1638. }];
  1640. // Custom PDF buttons for specific tables
  1641. function getCustomButtons(tableId) {
  1642. let orientation = 'portrait';
  1643. let pageSize = 'A4';
  1645. if (tableId === 'modalBookingTable') {
  1646. orientation = 'landscape';
  1647. pageSize = 'A4';
  1648. } else if (tableId === 'hallDetailsTable') {
  1649. orientation = 'landscape';
  1650. pageSize = 'A3';
  1651. } else if (tableId === 'detailedrequestTable') {
  1652. orientation = 'landscape';
  1653. pageSize = 'A3';
  1654. }
  1656. return [{
  1657. extend: 'pageLength',
  1658. className: 'btn btn-primary'
  1659. }, {
  1660. title: 'Data export',
  1661. extend: 'copyHtml5',
  1662. text: 'Copy',
  1663. className: 'btn btn-primary'
  1664. }, {
  1665. extend: 'excelHtml5',
  1666. text: 'Excel',
  1667. className: 'btn btn-primary'
  1668. }, {
  1669. extend: 'csvHtml5',
  1670. text: 'CSV',
  1671. className: 'btn btn-primary'
  1672. }, {
  1673. extend: 'pdfHtml5',
  1674. text: 'PDF',
  1675. className: 'btn btn-primary',
  1676. orientation: orientation,
  1677. pageSize: pageSize
  1678. }];
  1679. }
  1681. // Tables using default buttons
  1682. $('#requestTable1, #requestTable2, #requestTable3, #requestTable8, #requestTable4, #requestTable5, #requestTable6, #requestTable7, #requestTable10, #hallwiseBookingTable, #counterDetailsTable').DataTable({
  1683. dom: 'Bftip',
  1684. columnDefs: [{
  1685. targets: 'no-sort',
  1686. orderable: false
  1687. }],
  1688. lengthMenu: [
  1689. [50, 100, 200, 500, -1],
  1690. ['50 rows', '100 rows', '200 rows', '500 rows', 'Show all']
  1691. ],
  1692. fixedColumns: {
  1693. left: 1,
  1694. right: 1
  1695. },
  1696. buttons: commonButtons,
  1697. responsive: true,
  1698. searching: true,
  1699. select: false,
  1700. processing: false,
  1701. order: []
  1702. });
  1704. // Tables with custom PDF buttons
  1705. ['requestTable9', 'modalBookingTable', 'hallDetailsTable', 'detailedrequestTable'].forEach(function (tableId) {
  1706. $('#' + tableId).DataTable({
  1707. dom: 'Bftip',
  1708. columnDefs: [{
  1709. targets: 'no-sort',
  1710. orderable: false
  1711. }],
  1712. lengthMenu: [
  1713. [50, 100, 200, 500, -1],
  1714. ['50 rows', '100 rows', '200 rows', '500 rows', 'Show all']
  1715. ],
  1716. fixedColumns: {
  1717. left: 1,
  1718. right: 1
  1719. },
  1720. buttons: getCustomButtons(tableId),
  1721. responsive: true,
  1722. searching: true,
  1723. select: false,
  1724. processing: false,
  1725. order: []
  1726. });
  1727. });
  1729. // Link the search input to DataTable
  1730. $('#searchInput').on('keyup', function () {
  1731. $('#bookinglistdataTable').DataTable().search(this.value).draw();
  1732. });
  1733. });
  1736. function validateme() {
  1737. // checkTodateCon();
  1738. return true;
  1739. }
  1741. var fromdate = document.getElementById("fromdate"), todate = document
  1742. .getElementById("todate");
  1744. function validateDate() {
  1745. if ($("#fromdate").val() == "" || $("#todate").val() == "") {
  1746. todate.setCustomValidity("FromDate and ToDate Must");
  1747. } else {
  1748. todate.setCustomValidity('');
  1749. }
  1750. }
  1752. fromdate.onchange = validateDate;
  1753. todate.onchange = validateDate;
  1756. $(document).ready(function () {
  1757. var today = new Date();
  1758. $('.datepicker').datepicker({
  1759. dateFormat: 'yy-mm-dd',
  1760. maxDate: '1'
  1761. })
  1762. $('.datepicker').keyup(function () {
  1763. if (this.value.match(/[^0-9]/g)) {
  1764. this.value = this.value.replace(/[^0-9^-]/g, '');
  1765. }
  1766. });
  1767. });
  1769. document.addEventListener("DOMContentLoaded", function () {
  1770. myRequest(); // Initial call to set dropdowns based on initial value
  1771. });
  1773. document.addEventListener("DOMContentLoaded", function () {
  1774. checkTodateCon();
  1775. });
  1777. function checkTodateCon() {
  1778. var today = new Date();
  1779. var sixMonthsLater = new Date();
  1780. sixMonthsLater.setMonth(today.getMonth() + 6);
  1782. var minDate = today.toISOString().split('T')[0];
  1783. var maxDate = sixMonthsLater.toISOString().split('T')[0];
  1784. let fromDateInput = document.getElementById('fromdate');
  1785. let toDateInput = document.getElementById('todate');
  1786. let selectedFromDate = document.getElementById('fromdate').value;
  1787. fromDateInput.setAttribute('max', maxDate);
  1788. toDateInput.setAttribute('min', selectedFromDate);
  1789. toDateInput.setAttribute('max', maxDate);
  1790. fromDateInput.addEventListener('change', function () {
  1791. let selectedFromDate = this.value;
  1792. let toDateInput = document.getElementById('todate');
  1793. toDateInput.setAttribute('min', selectedFromDate);
  1794. toDateInput.value = ''; // Reset the value of toDate
  1795. });
  1797. }
  1799. document.addEventListener("DOMContentLoaded", function () {
  1800. const form = document.getElementById('myForm');
  1801. const basedonSelect = document.getElementById('basedon');
  1802. const errorSpan = document.getElementById('basedonError');
  1803. const request = document.getElementById('request');
  1804. const reportTypeSelect = document.getElementById('reporttype');
  1805. const reportTypeerror = document.getElementById('reportTypeError');
  1807. form.addEventListener("submit", function (event) {
  1808. const requestValue = request.value;
  1810. if (requestValue === "7") {
  1811. console.log("inside 7");
  1812. console.log("basedonSelect.value=====" + basedonSelect.value);
  1814. if (basedonSelect.value === "") {
  1815. event.preventDefault(); // Stop form submission
  1816. errorSpan.textContent = "Please select a value.";
  1817. basedonSelect.classList.add("is-invalid");
  1818. } else {
  1819. errorSpan.textContent = "";
  1820. basedonSelect.classList.remove("is-invalid");
  1821. }
  1822. } else if (requestValue === "9") {
  1823. console.log("inside 9");
  1824. console.log("reportTypeSelect.value=====" + reportTypeSelect.value);
  1826. if (reportTypeSelect.value === "") {
  1827. event.preventDefault(); // Stop form submission
  1828. reportTypeerror.textContent = "Please select a value.";
  1829. reportTypeSelect.classList.add("is-invalid");
  1830. } else {
  1831. reportTypeerror.textContent = "";
  1832. reportTypeSelect.classList.remove("is-invalid");
  1833. }
  1834. }
  1835. });
  1837. document.getElementById("basedon").addEventListener("change", function () {
  1838. this.classList.remove("is-invalid");
  1839. document.getElementById("basedonError").textContent = "";
  1840. });
  1841. document.getElementById("reporttype").addEventListener("change", function () {
  1842. this.classList.remove("is-invalid");
  1843. document.getElementById("reportTypeError").textContent = "";
  1844. });
  1845. });
  1848. // Function to manage the display of dropdowns based on the request type
  1849. function myRequest() {
  1850. var requestValue = document.getElementById("request").value;
  1852. // Hide all dropdowns initially
  1853. document.getElementById("userDropdown1").style.display = "none";
  1854. document.getElementById("userDropdown2").style.display = "none";
  1855. document.getElementById("bookingDetailsDropdown1").style.display = "none";
  1856. document.getElementById("bookingDetailsDropdown2").style.display = "none";
  1857. document.getElementById("bookingDetailsDropdown3").style.display = "none";
  1858. document.getElementById("refundDetailsDropdown").style.display = "none";
  1859. document.getElementById("zoneDropdown").style.display = "none";
  1860. document.getElementById("divisionContainer").style.display = "none";
  1861. document.getElementById("hallContainer").style.display = "none";
  1862. document.getElementById("bookingcountbasedonDropdown").style.display = "none";
  1863. document.getElementById("paymentInfoDropdown1").style.display = "none";
  1864. document.getElementById("counterreportDropdown").style.display = "none";
  1867. // Reset dropdown values
  1868. document.getElementById('zone1').value = 'ALL';
  1869. document.getElementById('division1').value = '';
  1870. document.getElementById('hall1').value = '';
  1873. // Show relevant dropdowns based on the selected request value
  1874. if (requestValue === "1") {
  1875. document.getElementById("userDropdown1").style.display = "block";
  1876. document.getElementById("userDropdown2").style.display = "block";
  1878. // Add event listener to handle "User Type" selection
  1879. document.getElementById("usertype").addEventListener("change", function () {
  1880. var userTypeValue = document.getElementById("usertype").value;
  1881. if (userTypeValue === "PUBLIC") {
  1882. document.getElementById("userDropdown1").style.display = "none"; // Hide "User Status" dropdown
  1883. } else {
  1884. document.getElementById("userDropdown1").style.display = "block"; // Show "User Status" dropdown
  1885. }
  1886. });
  1888. // Trigger the change event to apply the logic on initial load if "PUBLIC" is already selected
  1889. document.getElementById("usertype").dispatchEvent(new Event('change'));
  1891. } else if (requestValue === "2") {
  1892. document.getElementById("bookingDetailsDropdown1").style.display = "block";
  1893. document.getElementById("bookingDetailsDropdown2").style.display = "block";
  1894. document.getElementById("bookingDetailsDropdown3").style.display = "block";
  1895. document.getElementById("zoneDropdown").style.display = "block";
  1896. document.getElementById("divisionContainer").style.display = "block";
  1897. document.getElementById("hallContainer").style.display = "block";
  1899. } else if (requestValue === "6") {
  1900. document.getElementById("refundDetailsDropdown").style.display = "block";
  1901. document.getElementById("bookingDetailsDropdown3").style.display = "block";
  1903. } else if (requestValue === "3") {
  1904. document.getElementById("zoneDropdown").style.display = "block";
  1905. document.getElementById("divisionContainer").style.display = "block";
  1906. document.getElementById("hallContainer").style.display = "block";
  1907. document.getElementById("paymentInfoDropdown1").style.display = "block";
  1908. } else if (requestValue === "5") {
  1909. document.getElementById("bookingDetailsDropdown3").style.display = "block";
  1910. document.getElementById("zoneDropdown").style.display = "block";
  1911. document.getElementById("divisionContainer").style.display = "block";
  1912. document.getElementById("hallContainer").style.display = "block";
  1913. } else if (requestValue === "7") {
  1914. document.getElementById("bookingcountbasedonDropdown").style.display = "block";
  1915. } else if (requestValue === "8") {
  1916. document.getElementById("zoneDropdown").style.display = "block";
  1917. document.getElementById("divisionContainer").style.display = "block";
  1918. document.getElementById("hallContainer").style.display = "block";
  1919. document.getElementById("paymentInfoDropdown1").style.display = "block";
  1920. } else if (requestValue === "9") {
  1921. document.getElementById("counterreportDropdown").style.display = "block";
  1922. }
  1924. }
  1926. document.addEventListener("DOMContentLoaded", function () {
  1927. document.getElementById("basedon").addEventListener("change", function () {
  1928. const selectedValue = this.value;
  1929. document.getElementById("bookingcountbasedonDropdown").style.display = selectedValue ? "block" : "none";
  1930. });
  1931. });
  1933. document.addEventListener("DOMContentLoaded", function () {
  1934. document.getElementById("reporttype").addEventListener("change", function () {
  1935. const selectedValue = this.value;
  1936. document.getElementById("counterreportDropdown").style.display = selectedValue ? "block" : "none";
  1937. });
  1938. });
  1940. // Function to reset date fields
  1941. function resetDate() {
  1943. window.location.href = "/communityhall/admin/Reports";
  1945. document.getElementById('fromdate').value = '';
  1946. document.getElementById('todate').value = '';
  1947. }
  1949. function viewDetails(bookingId) {
  1950. $.ajax({
  1951. url: '/communityhall/user/api/viewAllBookingDetails',
  1952. method: 'GET',
  1953. data: {bookingId: bookingId},
  1954. success: function (response) {
  1955. document.getElementById("td_userName").innerHTML = response.users.name;
  1956. document.getElementById("td_mobileNumber").innerHTML = response.users.mobileNo;
  1957. document.getElementById("td_usertype").innerHTML = response.users.usertype;
  1958. var userDetails = response.users;
  1959. var userDetailsString =
  1960. userDetails.doorNo + ", " +
  1961. userDetails.street + ", " +
  1962. userDetails.area + ", " +
  1963. userDetails.location + " ,Chennai- " +
  1964. userDetails.pinCode;
  1965. document.getElementById("td_useraddress").innerHTML = userDetailsString;
  1966. document.getElementById("td_hallName").innerHTML = response.hallDetails.hallName;
  1967. var hallDetails = response.hallDetails;
  1968. var hallDetailsString =
  1969. hallDetails.doorNo + ", " +
  1970. hallDetails.street + ", " +
  1971. hallDetails.area + ", " +
  1972. hallDetails.city + "- " +
  1973. hallDetails.pinCode;
  1974. document.getElementById("td_halladdress").innerHTML = hallDetailsString;
  1975. document.getElementById("td_caretakername").innerHTML = response.hallDetails.hallInchargeName;
  1976. document.getElementById("td_caretakermobileNumber").innerHTML = response.hallDetails.hallInchargeMobno;
  1977. document.getElementById("td_bookingDate").innerHTML = response.bookingDate;
  1978. document.getElementById("td_depositeAmount").innerHTML = parseFloat(response.depositAmount).toFixed(2);
  1979. document.getElementById("td_hallAmount").innerHTML = parseFloat(response.hallAmount).toFixed(2);
  1980. // Calculate GST and total amount
  1981. var gstAmount = (parseFloat(response.hallAmount) * (response.hallDetails.gst / 100)).toFixed(2);
  1982. var totalAmount = parseFloat(response.amountReceived).toFixed(2);
  1984. document.getElementById("td_gst").innerHTML = gstAmount;
  1985. document.getElementById("td_totalAmount").innerHTML = totalAmount;
  1987. document.getElementById("td_startDate").innerHTML = response.startDate;
  1988. document.getElementById("td_endDate").innerHTML = response.endDate;
  1989. document.getElementById("booking_id").innerHTML = response.bookingId;
  1991. function getTimeSlot(slotValue) {
  1992. var timeSlot;
  1993. var trimmedSlotValue = String(slotValue).trim(); // Convert to string and then trim
  1994. if (trimmedSlotValue === '1') {
  1995. timeSlot = 'Morning';
  1996. } else if (trimmedSlotValue === '2') {
  1997. timeSlot = 'Evening';
  1998. } else {
  1999. timeSlot = 'Unknown';
  2000. }
  2001. return timeSlot;
  2002. }
  2004. document.getElementById("td_startingSlot").innerHTML = getTimeSlot(response.startingSlot);
  2005. document.getElementById("td_endingSlot").innerHTML = getTimeSlot(response.endingSlot);
  2006. document.getElementById("bookingstatus_td").innerHTML = response.bookingStatus;
  2008. console.log("before comments admin...");
  2009. console.log("Comments..." + response.comments);
  2010. if (response.bookingStatus === 'REJECTED' && response.comments) {
  2011. document.getElementById("rejectionreasondiv").style.display = "block";
  2012. const rejectionCell = document.getElementById("reasonforrejection");
  2013. rejectionCell.innerHTML = response.comments;
  2014. } else {
  2015. document.getElementById("rejectionreasondiv").style.display = "none";
  2016. document.getElementById("reasonforrejection").style.display = "none";
  2017. }
  2018. showReasonDocuments(response);
  2020. if (response.payments) {
  2021. document.getElementById("paymentsdetails").style.display = "block";
  2022. document.getElementById("td_transactionId").innerHTML = response.payments.transactionId;
  2023. document.getElementById("td_payamountReceived").innerHTML = response.payments.amountReceived;
  2024. document.getElementById("td_paymentStatus").innerHTML = response.payments.paymentStatus;
  2025. } else {
  2026. document.getElementById("paymentsdetails").style.display = "none";
  2027. }
  2028. if (response.ebDetails) {
  2029. document.getElementById("ebdetails").style.display = "block";
  2030. document.getElementById("td_EBNumber").innerHTML = response.hallDetails.ebNumber;
  2031. document.getElementById("td_startingReading").innerHTML = response.ebDetails.startingReading;
  2032. document.getElementById("td_endingReading").innerHTML = response.ebDetails.endingReading;
  2033. document.getElementById("td_usedunit").innerHTML = response.ebDetails.usedUnit;
  2034. document.getElementById("td_ebamountperunit").innerHTML = parseFloat(response.hallDetails.ebCostPerUnit).toFixed(2);
  2035. document.getElementById("td_electricityamount").innerHTML = parseFloat(response.ebDetails.ebAmount).toFixed(2);
  2037. } else {
  2038. document.getElementById("ebdetails").style.display = "none";
  2039. }
  2040. if (response.damageList && response.damageList.length > 0) {
  2041. document.getElementById("damagelist").style.display = "block";
  2043. } else {
  2044. document.getElementById("damagelist").style.display = "none";
  2045. }
  2046. if (response.settlement) {
  2047. document.getElementById("refunddetails").style.display = "block";
  2048. document.getElementById("td_depositeamountforrefund").innerHTML = parseFloat(response.depositAmount).toFixed(2);
  2049. document.getElementById("td_electricityamount").innerHTML = parseFloat(response.ebDetails.ebAmount).toFixed(2);
  2050. document.getElementById("td_ebAmount").innerHTML = parseFloat(response.ebDetails.ebAmount).toFixed(2);
  2051. document.getElementById("td_damage").innerHTML = parseFloat(response.settlement.damageAmount).toFixed(2);
  2053. var eb_amt = parseFloat(response.ebDetails.ebAmount).toFixed(2);
  2054. var deposit_amt = parseFloat(response.depositAmount).toFixed(2);
  2055. var tem_total = (deposit_amt - eb_amt).toFixed(2);
  2056. $("#td_settel_amt").html(tem_total);
  2057. } else {
  2058. document.getElementById("refunddetails").style.display = "none";
  2059. }
  2061. /*if (response.scheduleCount === 1) {
  2062. document.getElementById("rescheduleDetails").style.display = "block";
  2063. document.getElementById("td_res_start_date").innerHTML = response.startDate;
  2064. document.getElementById("td_res_end_date").innerHTML = response.endDate;
  2065. document.getElementById("td_res_date").innerHTML = response.updatedDate;
  2066. } else {
  2067. document.getElementById("rescheduleDetails").style.display = "none";
  2068. }*/
  2070. showDamageDetails(response);
  2071. if (response.bookingStatus === 'CANCELED' && ['WAITING', 'APPROVED', 'INITIATED'].includes(response.refundStatus)) {
  2072. document.getElementById("td_refundamount").innerHTML = `Your booking has been cancelled. Deposit amount of ₹ ${parseFloat(response.depositAmount).toFixed(2)} will be refund 3 to 15 Days`;
  2073. document.getElementById("refundamountDetails").style.display = "block";
  2074. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2075. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2076. } else if (response.bookingStatus === 'CANCELED' && response.refundStatus === 'COMPLETED') {
  2077. document.getElementById("td_refundamount").innerHTML = `Deposit amount of ₹ ${parseFloat(response.depositAmount).toFixed(2)} refunded successfully`;
  2078. document.getElementById("refundamountDetails").style.display = "block";
  2079. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2080. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2081. } else if (response.bookingStatus === 'REJECTED' && ['WAITING', 'APPROVED', 'INITIATED'].includes(response.refundStatus) && response.amountReceived == 0) {
  2082. document.getElementById("refundamountDetails").style.display = "none";
  2083. } else if (response.bookingStatus === 'REJECTED' && ['WAITING', 'APPROVED', 'INITIATED'].includes(response.refundStatus)) {
  2084. document.getElementById("td_refundamount").innerHTML = `Your booking has been Rejected by GCC. Full amount of ₹ ${parseFloat(response.amountReceived).toFixed(2)} will be refunded shortly`;
  2085. document.getElementById("refundamountDetails").style.display = "block";
  2086. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2087. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2088. } else if (response.bookingStatus === 'REJECTED' && response.refundStatus === 'COMPLETED') {
  2089. document.getElementById("td_refundamount").innerHTML = `Full amount of ₹${parseFloat(response.amountReceived).toFixed(2)} refunded successfully`;
  2090. document.getElementById("refundamountDetails").style.display = "block";
  2091. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2092. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2093. } else if (response.bookingStatus === 'REJECTED' && response.refundStatus === 'NA') {
  2094. document.getElementById("td_refundamount").innerHTML = `Your Booking has been rejected by GCC`;
  2095. document.getElementById("refundamountDetails").style.display = "block";
  2096. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2097. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2098. } else if (response.bookingStatus === 'GCC_BLOCKED' && ['WAITING', 'APPROVED', 'INITIATED'].includes(response.refundStatus)) {
  2099. document.getElementById("td_refundamount").innerHTML = `Your booking has been Blocked by GCC. Full amount of ₹ ${parseFloat(response.amountReceived).toFixed(2)} will be refunded shortly`;
  2100. document.getElementById("refundamountDetails").style.display = "block";
  2101. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2102. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2103. } else if (response.bookingStatus === 'GCC_BLOCKED' && response.refundStatus === 'COMPLETED') {
  2104. document.getElementById("td_refundamount").innerHTML = `Full amount of ₹${parseFloat(response.amountReceived).toFixed(2)} refunded successfully`;
  2105. document.getElementById("refundamountDetails").style.display = "block";
  2106. document.getElementById("td_bookingStatus").innerHTML = response.bookingStatus;
  2107. document.getElementById("td_refundStatus").innerHTML = response.refundStatus;
  2108. } else {
  2109. document.getElementById("refundamountDetails").style.display = "none";
  2110. }
  2111. // Show the modal
  2112. $('#showBookingDetails').modal('show');
  2113. },
  2114. error: function () {
  2115. console.error("An error occurred while fetching booking details.");
  2116. }
  2117. });
  2118. }
  2120. function showDamageDetails(data) {
  2121. var damageFieldContainer = $('#damageDetails');
  2122. damageFieldContainer.empty();
  2124. // Create a div for table responsiveness
  2125. var tableResponsiveDiv = $('<div>').addClass('table-responsive').css({'width': '770px'});
  2127. // Create table with similar classes and styles to the modal table
  2128. var table = $('<table>').addClass('table table-bordered table-striped').css({
  2129. 'width': '97%',
  2130. 'border-color': 'black',
  2131. 'border-top-color': 'white'
  2132. });
  2133. var thead = $('<thead>').addClass('thead-light');
  2134. var tbody = $('<tbody>');
  2136. // Create Damage Details header row
  2137. var headerRow = $('<tr>').appendTo(thead);
  2138. $('<th>').attr('colspan', '6').text('Damage Details (if any)').css({
  2139. 'padding': '0.45rem 0.45rem',
  2140. 'background-color': 'lightgrey',
  2141. 'font-weight': 'bold',
  2142. 'color': 'black',
  2143. }).appendTo(headerRow);
  2145. // Create table header row
  2146. var columnHeadersRow = $('<tr>').css('background-color', 'white').appendTo(thead);
  2147. $('<th>').text('S.No').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2148. $('<th>').text('Asset Name').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2149. $('<th>').text('Damage Img').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2150. $('<th>').text('Cost').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2151. $('<th>').text('Qty').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2152. $('<th>').text('Amount').css('padding', '0.45rem 0.45rem').appendTo(columnHeadersRow);
  2154. var totalAmount = 0;
  2155. $.each(data.damageList, function (index, detail) {
  2156. var row = $('<tr>').appendTo(tbody);
  2157. $('<td>').text(index + 1).css('padding', '0.45rem 0.45rem').appendTo(row);
  2158. $('<td>').text(detail.assetName).css('padding', '0.45rem 0.45rem').appendTo(row);
  2159. var viewLink = $('<a>').attr('href', 'javascript:void(0)').text('View').on('click', function () {
  2160. showDamageImage(detail.damageImageUrl);
  2161. });
  2162. var assetamt = (detail.assetAmount / detail.quantity).toFixed(2);
  2163. $('<td>').css('padding', '0.45rem 0.45rem').append(viewLink).appendTo(row);
  2164. $('<td>').text(assetamt).css('padding', '0.45rem 0.45rem').appendTo(row);
  2165. $('<td>').text(detail.quantity).css('padding', '0.45rem 0.45rem').appendTo(row);
  2166. var amount = detail.assetAmount;
  2167. totalAmount += amount;
  2168. $('<td>').text(amount.toFixed(2)).css('padding', '0.45rem 0.45rem').appendTo(row);
  2169. $("#td_dam_amt").html(totalAmount.toFixed(2));
  2170. });
  2171. // Add row for total amount
  2172. var totalRow = $('<tr>').appendTo(tbody);
  2173. $('<td>').attr('colspan', '5').text('Total Amount').css('padding', '0.45rem 0.45rem; font-weight: bold; background-color: #f2f2f2').appendTo(totalRow);
  2174. $('<td>').text(totalAmount.toFixed(2)).css('padding', '0.45rem 0.45rem').appendTo(totalRow);
  2176. // Append the table elements to the container div
  2177. table.append(thead, tbody);
  2178. tableResponsiveDiv.append(table);
  2179. damageFieldContainer.append(tableResponsiveDiv);
  2181. var temp_total = parseFloat($("#td_settel_amt").html());
  2182. var settleAmount = temp_total - totalAmount;
  2183. if (settleAmount < 0) {
  2184. var pendingstatus = data.settlement.collectionStatus
  2185. $("#td_settel_amt").html(0.00);
  2186. $("#pendingcolumn").show();
  2187. $("#collectionstatuscolumn").show();
  2188. $('#td_collection_status').html(pendingstatus);
  2189. $("#td_pending_amt").html(Math.abs(settleAmount).toFixed(2));
  2190. $("#td_pending_amt").css("color", "red");
  2191. } else {
  2192. $("#td_settel_amt").html(settleAmount.toFixed(2));
  2193. $("#pendingcolumn").hide();
  2194. $("#collectionstatuscolumn").hide();
  2195. $("#td_settel_amt").css("color", "green"); // Set color to green for positive amounts
  2196. }
  2197. }
  2199. function showReasonDocuments(list) {
  2200. $.ajax({
  2201. type: "GET",
  2202. url: '/communityhall/api/officer/getReasonByName',
  2203. data: {
  2204. 'reasonName': list.reason
  2205. },
  2206. success: function (x) {
  2207. // console.log(x);
  2208. showReasonWithDocument(x, list);
  2209. }
  2210. });
  2211. }
  2213. // Display booking documents
  2214. function showReasonWithDocument(reasonData, list) {
  2215. var reasonDocumentData = reasonData.reasonDocumentMasterList;
  2216. var bookingDocumentsList = list.bookingDocumentsList;
  2218. const reasonFieldsContainer = $('#documents');
  2219. reasonFieldsContainer.empty();
  2221. // Create a responsive table container
  2222. var tableResponsiveDiv = $('<div>').addClass('table-responsive').css({'width': '770px', 'border': 'black'});
  2224. // Create the table with Bootstrap classes and custom styles
  2225. var table = $('<table>').addClass('table table-bordered table-striped table-vcenter js-dataTable-responsive').css({
  2226. 'width': '100%',
  2227. 'height': 'auto',
  2228. 'border': '1px solid black'
  2229. });
  2231. // Create the table header (thead)
  2232. var thead = $('<thead>').appendTo(table);
  2233. var headerRow = $('<tr>').appendTo(thead);
  2234. $('<th>').attr('colspan', '3').text('Document Details').css({
  2235. 'color': 'black',
  2236. 'background-color': '#f2f2f2',
  2237. 'padding': '0.45rem 0.45rem'
  2238. }).appendTo(headerRow);
  2240. // Create header row for columns
  2241. var columnHeadersRow = $('<tr>').appendTo(thead);
  2242. $('<th>').text('S.No').appendTo(columnHeadersRow);
  2243. $('<th>').text('Required Info').appendTo(columnHeadersRow);
  2244. $('<th>').text('Required Documents').appendTo(columnHeadersRow);
  2246. // Create the table body (tbody)
  2247. var tbody = $('<tbody>').appendTo(table);
  2249. // Iterate through the documents list and populate rows
  2250. for (var i = 0; i < bookingDocumentsList.length; i++) {
  2251. (function (index) {
  2252. var row = $('<tr>').appendTo(tbody);
  2253. $('<td>').text(index + 1).appendTo(row);
  2254. $('<td>').text(reasonDocumentData[index].fieldName + ': ' + bookingDocumentsList[index].name).appendTo(row);
  2256. // Create a link to view document image
  2257. var viewLink = $('<a>').attr('href', 'javascript:void(0)').text(reasonDocumentData[index].docFieldName).on('click', function () {
  2258. showDocumentImage(bookingDocumentsList[index].bookingDocUrl);
  2259. });
  2260. $('<td>').append(viewLink).appendTo(row);
  2261. })(i);
  2262. }
  2264. // Append table to the responsive container
  2265. tableResponsiveDiv.append(table);
  2267. // Append table to the container in the DOM
  2268. reasonFieldsContainer.append(tableResponsiveDiv);
  2269. }
  2272. function showDocumentImage(fileURL) {
  2273. //console.log(fileURL);
  2274. openFileModal(fileURL);
  2275. }
  2277. // Event delegation for dynamically added elements
  2278. $(document).on('click', '.view-document', function () {
  2279. const fileURL = $(this).data('url');
  2280. openFileModal(fileURL);
  2281. });
  2283. function openFileModal(fileURL) {
  2284. $('#filePreview').attr('src', fileURL);
  2285. $('#fileModal').modal('show');
  2286. }
  2288. $('#fileModal').on('shown.bs.modal', function () {
  2289. // boost the last backdrop above everything else
  2290. $('.modal-backdrop').last().css({
  2291. 'z-index': 1095,
  2292. 'pointer-events': 'none'
  2293. });
  2294. // boost this modal
  2295. $(this).css('z-index', 1100);
  2296. });
  2298. function viewbookingDetails(userId) {
  2299. $.ajax({
  2300. type: "GET",
  2301. url: '/communityhall/admin/api/bookingdetailsByuserId',
  2302. data: {'userId': userId},
  2303. success: function (response) {
  2304. // console.log(response);
  2305. $("#bookingTableBody").empty(); // Ensure bookingTableBody is the correct ID of the table body
  2306. $.each(response, function (index, booking) {
  2307. // Create table row with the data from response
  2308. var row = '<tr>' + // Added <tr> tag
  2309. '<td class="text-center">' + (index + 1) + '</td>' +
  2310. '<td class="text-center">' + booking.bookingId + '</td>' +
  2311. '<td class="text-center">' + booking.bookingDate + '</td>' +
  2312. '<td class="text-center">' + booking.startDate + '</td>' +
  2313. '<td class="text-center">' + booking.endDate + '</td>' +
  2314. '<td class="text-center">' + booking.startingSlot + '</td>' +
  2315. '<td class="text-center">' + booking.endingSlot + '</td>' +
  2316. '<td class="text-center">' + booking.reason + '</td>' +
  2317. '<td class="text-center">' + booking.noOfDays + '</td>' +
  2318. '<td class="text-center">' + booking.bookingStatus + '</td>' +
  2319. '<td class="text-center">' + booking.hallAmount + '</td>' +
  2320. '<td class="text-center">' + booking.amountReceived + '</td>' +
  2321. '</tr>'; // Close <tr> tag
  2323. // Append the row to the table body
  2324. $("#bookingTableBody").append(row);
  2325. });
  2326. $('#viewbookingDetailsdetails').modal('show');
  2327. },
  2328. error: function (xhr, status, error) {
  2329. console.error(xhr.responseText);
  2330. // Handle error here
  2331. }
  2332. });
  2333. }
  2335. function viewbookingDetailsbasedonzone(zone) {
  2336. $.ajax({
  2337. type: "GET",
  2338. url: '/communityhall/admin/api/bookingdetailsByzone',
  2339. data: {'zone': zone},
  2340. success: function (response) {
  2341. // console.log(response);
  2343. // Clear existing table data and destroy DataTable instance if it exists
  2344. var table = $('#bookinglistdataTablebyzone').DataTable();
  2345. if (table) {
  2346. table.clear().destroy();
  2347. }
  2349. // Populate table with new data
  2350. var tableBody = $("#bookingTableBodybyzone");
  2351. tableBody.empty(); // Clear the table body
  2353. $.each(response, function (index, booking) {
  2354. var row = '<tr>' +
  2355. '<td class="text-center">' + (index + 1) + '</td>' +
  2356. '<td class="text-center">' + booking.bookingId + '</td>' +
  2357. '<td class="text-center">' + booking.bookingDate + '</td>' +
  2358. '<td class="text-center">' + booking.startDate + '</td>' +
  2359. '<td class="text-center">' + booking.endDate + '</td>' +
  2360. '<td class="text-center">' + booking.startingSlot + '</td>' +
  2361. '<td class="text-center">' + booking.endingSlot + '</td>' +
  2362. '<td class="text-center">' + booking.reason + '</td>' +
  2363. '<td class="text-center">' + booking.noOfDays + '</td>' +
  2364. '<td class="text-center">' + booking.bookingStatus + '</td>' +
  2365. '<td class="text-center">' + booking.hallAmount + '</td>' +
  2366. '<td class="text-center">' + booking.amountReceived + '</td>' +
  2367. '</tr>';
  2369. tableBody.append(row);
  2370. });
  2372. // Initialize DataTable
  2373. $('#bookinglistdataTablebyzone').DataTable({
  2374. "paging": true,
  2375. "searching": true,
  2376. "ordering": true,
  2377. "info": true
  2378. });
  2380. // Show the modal
  2381. $('#viewbookingDetailsbyzone').modal('show');
  2382. },
  2383. error: function (xhr, status, error) {
  2384. console.error(xhr.responseText);
  2385. // Handle error here
  2386. }
  2387. });
  2388. }
  2390. document.addEventListener('DOMContentLoaded', function () {
  2391. fetchData();
  2393. restoreSelectedValues();
  2394. document.getElementById('request').addEventListener('change', function () {
  2395. myRequest(); // Handle request change
  2396. });
  2398. document.getElementById('zone1').addEventListener('change', function () {
  2399. updateDivisions();
  2400. });
  2401. document.getElementById('division1').addEventListener('change', function () {
  2402. updateHalls();
  2403. });
  2404. });
  2406. function fetchData() {
  2407. fetch('/communityhall/user/api/getZonehalls') // Replace with your actual API endpoint
  2408. .then(response => response.json())
  2409. .then(data => {
  2410. populateDropdowns(data);
  2411. restoreSelectedValues();
  2412. })
  2413. .catch(error => console.error('Error fetching data:', error));
  2414. }
  2416. function populateDropdowns(data) {
  2417. const zoneDropdown = document.getElementById('zone1');
  2418. const divisionDropdown = document.getElementById('division1');
  2419. const hallDropdown = document.getElementById('hall1');
  2421. const zones = new Set();
  2422. const divisionsByZone = {};
  2423. const hallsByDivision = {};
  2425. data.forEach(item => {
  2426. zones.add(item.zone);
  2427. if (!divisionsByZone[item.zone]) {
  2428. divisionsByZone[item.zone] = [];
  2429. }
  2430. if (!divisionsByZone[item.zone].includes(item.division)) {
  2431. divisionsByZone[item.zone].push(item.division);
  2432. }
  2433. if (!hallsByDivision[item.division]) {
  2434. hallsByDivision[item.division] = [];
  2435. }
  2436. hallsByDivision[item.division].push({hallName: item.hall_name, hallId: item.hall_id});
  2437. });
  2439. // Populate zones
  2440. zones.forEach(zone => {
  2441. const option = document.createElement('option');
  2442. option.value = zone;
  2443. option.textContent = zone;
  2444. zoneDropdown.appendChild(option);
  2445. });
  2447. zoneDropdown.dataset.divisionsByZone = JSON.stringify(divisionsByZone);
  2448. divisionDropdown.dataset.hallsByDivision = JSON.stringify(hallsByDivision);
  2450. // Initialize divisions and halls
  2451. updateDivisions();
  2452. }
  2454. function updateDivisions() {
  2455. const zoneDropdown = document.getElementById('zone1');
  2456. const selectedZone = zoneDropdown.value;
  2457. const divisionsByZone = JSON.parse(zoneDropdown.dataset.divisionsByZone || '{}');
  2459. const divisionDropdown = document.getElementById('division1');
  2460. divisionDropdown.innerHTML = '';
  2462. const allOption = document.createElement('option');
  2463. allOption.value = '';
  2464. allOption.textContent = '--Select Division--';
  2465. divisionDropdown.appendChild(allOption);
  2467. if (selectedZone === '') {
  2468. document.getElementById('divisionContainer').classList.add('hidden');
  2469. } else {
  2470. document.getElementById('divisionContainer').classList.remove('hidden');
  2471. (divisionsByZone[selectedZone] || []).forEach(division => {
  2472. const option = document.createElement('option');
  2473. option.value = division;
  2474. option.textContent = division;
  2475. divisionDropdown.appendChild(option);
  2476. });
  2477. updateHalls();
  2478. }
  2479. }
  2481. function updateHalls() {
  2482. const divisionDropdown = document.getElementById('division1');
  2483. const selectedDivision = divisionDropdown.value;
  2484. const hallsByDivision = JSON.parse(divisionDropdown.dataset.hallsByDivision || '{}');
  2486. const hallDropdown = document.getElementById('hall1');
  2487. hallDropdown.innerHTML = '';
  2489. const allOption = document.createElement('option');
  2490. allOption.value = '';
  2491. allOption.textContent = '--Select Hall--';
  2492. hallDropdown.appendChild(allOption);
  2494. if (selectedDivision === '') {
  2495. document.getElementById('hallContainer').classList.add('hidden');
  2496. } else {
  2497. document.getElementById('hallContainer').classList.remove('hidden');
  2498. (hallsByDivision[selectedDivision] || []).forEach(hall => {
  2499. const option = document.createElement('option');
  2500. option.value = hall.hallId;
  2501. option.textContent = hall.hallName;
  2502. hallDropdown.appendChild(option);
  2503. });
  2504. }
  2505. }
  2507. function restoreSelectedValues() {
  2508. const selectedZone = localStorage.getItem('selectedZone') || '';
  2509. const selectedDivision = localStorage.getItem('selectedDivision') || '';
  2510. const selectedHall = localStorage.getItem('selectedHall') || '';
  2512. const zoneDropdown = document.getElementById('zone1');
  2513. const divisionDropdown = document.getElementById('division1');
  2514. const hallDropdown = document.getElementById('hall1');
  2516. zoneDropdown.value = selectedZone;
  2517. updateDivisions(); // Populate divisions based on selected zone
  2519. // Make sure to set the division and hall values after the dropdowns are populated
  2520. divisionDropdown.value = selectedDivision;
  2521. updateHalls(); // Populate halls based on selected division
  2523. hallDropdown.value = selectedHall;
  2524. }
  2526. // Store selected values before form submission
  2527. function storeSelectedValues() {
  2528. const zoneDropdown = document.getElementById('zone1');
  2529. const divisionDropdown = document.getElementById('division1');
  2530. const hallDropdown = document.getElementById('hall1');
  2532. localStorage.setItem('selectedZone', zoneDropdown.value);
  2533. localStorage.setItem('selectedDivision', divisionDropdown.value);
  2534. localStorage.setItem('selectedHall', hallDropdown.value);
  2535. }
  2537. document.getElementById('myForm').addEventListener('submit', function () {
  2538. storeSelectedValues();
  2539. });
  2541. let hallBookingData = [];
  2542. let hallDetailsData = [];
  2544. window.addEventListener("DOMContentLoaded", () => {
  2545. try {
  2546. const jsonString1 = document.getElementById("hallBookingJsonInput")?.value;
  2547. if (jsonString1) {
  2548. hallBookingData = JSON.parse(jsonString1);
  2549. console.log("Parsed hallBookingData:", hallBookingData);
  2550. }
  2552. const jsonString2 = document.getElementById("hallBookingDetailsJsonInput")?.value;
  2553. if (jsonString2) {
  2554. hallDetailsData = JSON.parse(jsonString2);
  2555. console.log("Parsed hallDetailsData:", hallDetailsData);
  2556. }
  2557. } catch (e) {
  2558. console.error("Failed to parse JSON inputs", e);
  2559. }
  2560. // Delegate click event for dynamically added booking links
  2561. $(document).on('click', '.hall-detail-link', function (e) {
  2562. e.preventDefault();
  2563. const hallName = $(this).data('hall-name');
  2564. showHallBookingDetails(hallName);
  2565. });
  2566. });
  2568. function showCounterTable(elem) {
  2569. const counterId = elem.getAttribute("data-counter-id");
  2570. const filtered = hallBookingData.filter(row => row[0] == counterId);
  2572. const table = $('#modalBookingTable').DataTable();
  2573. table.clear();
  2575. filtered.forEach((row, index) => {
  2576. table.row.add([
  2577. index + 1,
  2578. row[1], // Zone
  2579. row[2], // Division
  2580. row[3], // Hall Name
  2581. `<button href="#" class="hall-detail-link"
  2582. style="background-color: #2a807f; color: white; border: none; padding: 6px 12px; border-radius: 4px;"
  2583. data-hall-name="${row[3]}">${row[4]}</button>`
  2584. ]);
  2585. });
  2587. table.draw();
  2588. table.columns.adjust().responsive.recalc();
  2590. // Show modal after data is loaded
  2591. $('#bookingModal').modal('show');
  2592. }
  2594. function formatDateFromTimestamp(timestamp) {
  2595. const date = new Date(parseInt(timestamp));
  2596. const year = date.getFullYear();
  2597. const month = String(date.getMonth() + 1).padStart(2, '0');
  2598. const day = String(date.getDate()).padStart(2, '0');
  2599. return `${year}-${month}-${day}`;
  2600. }
  2602. function getSlotLabel(slot) {
  2603. return slot === 1 ? 'Morning' : (slot === 2 ? 'Evening' : '');
  2604. }
  2606. function showHallBookingDetails(hallName) {
  2607. const filtered = hallDetailsData.filter(row => row[1] === hallName);
  2609. const table = $('#hallDetailsTable').DataTable();
  2610. table.clear();
  2612. filtered.forEach((row, index) => {
  2613. table.row.add([
  2614. index + 1,
  2615. row[0],
  2616. row[1],
  2617. formatDateFromTimestamp(row[2]),
  2618. row[3],
  2619. row[4],
  2620. getSlotLabel(row[5]),
  2621. getSlotLabel(row[6]),
  2622. row[7],
  2623. row[8],
  2624. row[9],
  2625. row[10],
  2626. row[11],
  2627. row[12],
  2628. row[13],
  2629. row[14],
  2630. ` <button class="btn btn-sm btn-primary" onclick="viewDetails('${row[0]}')">View</button>`
  2631. ]);
  2632. });
  2633. table.draw();
  2634. table.columns.adjust().responsive.recalc();
  2635. $('#hallDetailModal').modal('show');
  2636. }
  2638. function viewCounterBookingDetails(bookingId) {
  2639. viewDetails(bookingId);
  2640. }
  2642. // for review report
  2644. let halldetailcount = [];
  2645. let counterdetailcount = [];
  2647. window.addEventListener("DOMContentLoaded", () => {
  2648. try {
  2649. const jsonString1 = document.getElementById("hallWiseBookingList")?.value;
  2650. if (jsonString1) {
  2651. halldetailcount = JSON.parse(jsonString1);
  2652. console.log("Parsed hall wise count data:", halldetailcount);
  2653. }
  2655. const jsonString2 = document.getElementById("counterWiseBookingList")?.value;
  2656. if (jsonString2) {
  2657. counterdetailcount = JSON.parse(jsonString2);
  2658. console.log("Parsed counter wise count data:", counterdetailcount);
  2659. }
  2660. } catch (e) {
  2661. console.error("Failed to parse JSON inputs", e);
  2662. }
  2664. $(document).on('click', '.counter-booking-link', function (e) {
  2665. e.preventDefault();
  2666. const hallId = $(this).data('hall-id');
  2667. showCounterCountDetails(hallId);
  2668. });
  2670. });
  2672. function showHallDetailsTable(elem) {
  2673. const zoneId = elem.getAttribute("data-zone-id");
  2674. console.log("Selected Zone:", zoneId);
  2675. console.log("Full Data:", halldetailcount);
  2677. // FIX: Compare correct column (zoneId might be at index 5)
  2678. const filtered = halldetailcount.filter(row => String(row[5]) === String(zoneId));
  2679. console.log("Filtered Data:", filtered);
  2681. const table = $('#hallwiseBookingTable').DataTable();
  2682. table.clear();
  2684. filtered.forEach((row, index) => {
  2685. table.row.add([
  2686. index + 1,
  2687. row[1], // hall name
  2688. row[3], // online booking
  2689. `<button type="button" class="btn btn-sm btn-info counter-booking-link"
  2690. data-hall-id="${row[0]}">${row[4]}</button>`, // clickable counter count
  2691. row[2] // total count
  2692. ]);
  2693. });
  2695. table.draw();
  2696. $('#hallModal').modal('show');
  2697. }
  2700. function showCounterCountDetails(hallId) {
  2701. console.log("Looking for hallId:", hallId);
  2702. console.log("All Counter Data:", counterdetailcount);
  2704. const filtered = counterdetailcount.filter(row => String(row[1]) === String(hallId));
  2705. console.log("Filtered Counter Data:", filtered);
  2707. const table = $('#counterDetailsTable').DataTable();
  2708. table.clear();
  2710. filtered.forEach((row, index) => {
  2711. table.row.add([
  2712. index + 1,
  2713. row[0], // Counter ID
  2714. row[2] // Booking count
  2715. ]);
  2716. });
  2718. table.draw();
  2719. $('#counterDetailModal').modal('show');
  2720. }
  2724. </script>
  2725. </body>
  2727. </html>