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.
12 Commits
1 Branch
0 Tags
244 MiB
Tree: d66445f20d
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'd66445f20d'
${ noResults }
communityhallv22/src/main/resources/templates/headquarters/reports.html

2483 lines
126 KiB
Raw Normal View History

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