eventactions.html 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. {{template "base" .}}
  2. {{define "title"}}{{.Title}}{{end}}
  3. {{define "extra_css"}}
  4. <link href="{{.StaticURL}}/vendor/datatables/dataTables.bootstrap4.min.css" rel="stylesheet">
  5. <link href="{{.StaticURL}}/vendor/datatables/buttons.bootstrap4.min.css" rel="stylesheet">
  6. <link href="{{.StaticURL}}/vendor/datatables/fixedHeader.bootstrap4.min.css" rel="stylesheet">
  7. <link href="{{.StaticURL}}/vendor/datatables/responsive.bootstrap4.min.css" rel="stylesheet">
  8. <link href="{{.StaticURL}}/vendor/datatables/select.bootstrap4.min.css" rel="stylesheet">
  9. {{end}}
  10. {{define "page_body"}}
  11. <div id="errorMsg" class="card mb-4 border-left-warning" style="display: none;">
  12. <div id="errorTxt" class="card-body text-form-error"></div>
  13. </div>
  14. <div class="card shadow mb-4">
  15. <div class="card-header py-3">
  16. <h6 class="m-0 font-weight-bold text-primary">View and manage event actions</h6>
  17. </div>
  18. <div class="card-body">
  19. <div class="table-responsive">
  20. <table class="table table-hover nowrap" id="dataTable" width="100%" cellspacing="0">
  21. <thead>
  22. <tr>
  23. <th>Name</th>
  24. <th>Description</th>
  25. <th>Type</th>
  26. <th>Rules</th>
  27. </tr>
  28. </thead>
  29. <tbody>
  30. {{range .Actions}}
  31. <tr>
  32. <td>{{.Name}}</td>
  33. <td>{{.Description}}</td>
  34. <td>{{.GetTypeAsString}}</td>
  35. <td>{{.GetRulesAsString}}</td>
  36. </tr>
  37. {{end}}
  38. </tbody>
  39. </table>
  40. </div>
  41. </div>
  42. </div>
  43. {{end}}
  44. {{define "dialog"}}
  45. <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel"
  46. aria-hidden="true">
  47. <div class="modal-dialog" role="document">
  48. <div class="modal-content">
  49. <div class="modal-header">
  50. <h5 class="modal-title" id="deleteModalLabel">
  51. Confirmation required
  52. </h5>
  53. <button class="close" type="button" data-dismiss="modal" aria-label="Close">
  54. <span aria-hidden="true">&times;</span>
  55. </button>
  56. </div>
  57. <div class="modal-body">Do you want to delete the selected event action? A referenced action cannot be removed</div>
  58. <div class="modal-footer">
  59. <button class="btn btn-secondary" type="button" data-dismiss="modal">
  60. Cancel
  61. </button>
  62. <a class="btn btn-warning" href="#" onclick="deleteAction()">
  63. Delete
  64. </a>
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. {{end}}
  70. {{define "extra_js"}}
  71. <script src="{{.StaticURL}}/vendor/datatables/jquery.dataTables.min.js"></script>
  72. <script src="{{.StaticURL}}/vendor/datatables/dataTables.bootstrap4.min.js"></script>
  73. <script src="{{.StaticURL}}/vendor/datatables/dataTables.buttons.min.js"></script>
  74. <script src="{{.StaticURL}}/vendor/datatables/buttons.bootstrap4.min.js"></script>
  75. <script src="{{.StaticURL}}/vendor/datatables/buttons.colVis.min.js"></script>
  76. <script src="{{.StaticURL}}/vendor/datatables/dataTables.fixedHeader.min.js"></script>
  77. <script src="{{.StaticURL}}/vendor/datatables/dataTables.responsive.min.js"></script>
  78. <script src="{{.StaticURL}}/vendor/datatables/responsive.bootstrap4.min.js"></script>
  79. <script src="{{.StaticURL}}/vendor/datatables/dataTables.select.min.js"></script>
  80. <script src="{{.StaticURL}}/vendor/datatables/ellipsis.js"></script>
  81. <script type="text/javascript">
  82. function deleteAction() {
  83. var table = $('#dataTable').DataTable();
  84. table.button('delete:name').enable(false);
  85. var name = table.row({ selected: true }).data()[0];
  86. var path = '{{.EventActionURL}}' + "/" + fixedEncodeURIComponent(name);
  87. $('#deleteModal').modal('hide');
  88. $.ajax({
  89. url: path,
  90. type: 'DELETE',
  91. dataType: 'json',
  92. headers: {'X-CSRF-TOKEN' : '{{.CSRFToken}}'},
  93. timeout: 15000,
  94. success: function (result) {
  95. window.location.href = '{{.EventActionsURL}}';
  96. },
  97. error: function ($xhr, textStatus, errorThrown) {
  98. var txt = "Unable to delete the selected action";
  99. if ($xhr) {
  100. var json = $xhr.responseJSON;
  101. if (json) {
  102. if (json.message){
  103. txt += ": " + json.message;
  104. } else {
  105. txt += ": " + json.error;
  106. }
  107. }
  108. }
  109. $('#errorTxt').text(txt);
  110. $('#errorMsg').show();
  111. setTimeout(function () {
  112. $('#errorMsg').hide();
  113. }, 5000);
  114. }
  115. });
  116. }
  117. $(document).ready(function () {
  118. $.fn.dataTable.ext.buttons.add = {
  119. text: '<i class="fas fa-plus"></i>',
  120. name: 'add',
  121. titleAttr: "Add",
  122. action: function (e, dt, node, config) {
  123. window.location.href = '{{.EventActionURL}}';
  124. }
  125. };
  126. $.fn.dataTable.ext.buttons.edit = {
  127. text: '<i class="fas fa-pen"></i>',
  128. name: 'edit',
  129. titleAttr: "Edit",
  130. action: function (e, dt, node, config) {
  131. var name = table.row({ selected: true }).data()[0];
  132. var path = '{{.EventActionURL}}' + "/" + fixedEncodeURIComponent(name);
  133. window.location.href = path;
  134. },
  135. enabled: false
  136. };
  137. $.fn.dataTable.ext.buttons.delete = {
  138. text: '<i class="fas fa-trash"></i>',
  139. name: 'delete',
  140. titleAttr: "Delete",
  141. action: function (e, dt, node, config) {
  142. $('#deleteModal').modal('show');
  143. },
  144. enabled: false
  145. };
  146. var table = $('#dataTable').DataTable({
  147. "select": {
  148. "style": "single",
  149. "blurable": true
  150. },
  151. "stateSave": true,
  152. "stateDuration": 0,
  153. "buttons": [
  154. {
  155. "text": "Column visibility",
  156. "extend": "colvis",
  157. "columns": ":not(.noVis)"
  158. }
  159. ],
  160. "columnDefs": [
  161. {
  162. "targets": [0],
  163. "className": "noVis"
  164. },
  165. {
  166. "targets": [3],
  167. "render": $.fn.dataTable.render.ellipsis(100, true)
  168. },
  169. ],
  170. "scrollX": false,
  171. "scrollY": false,
  172. "responsive": true,
  173. "language": {
  174. "emptyTable": "No event actions defined"
  175. },
  176. "order": [[0, 'asc']]
  177. });
  178. new $.fn.dataTable.FixedHeader( table );
  179. table.button().add(0,'delete');
  180. table.button().add(0,'edit');
  181. table.button().add(0,'add');
  182. table.buttons().container().appendTo('.col-md-6:eq(0)', table.table().container());
  183. table.on('select deselect', function () {
  184. var selectedRows = table.rows({ selected: true }).count();
  185. table.button('delete:name').enable(selectedRows == 1);
  186. table.button('edit:name').enable(selectedRows == 1);
  187. });
  188. });
  189. </script>
  190. {{end}}