kaui 3.0.2 → 3.0.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/images/kaui/logo.svg +37 -0
  3. data/app/controllers/kaui/account_timelines_controller.rb +121 -0
  4. data/app/controllers/kaui/accounts_controller.rb +51 -14
  5. data/app/controllers/kaui/admin_tenants_controller.rb +19 -6
  6. data/app/controllers/kaui/audit_logs_controller.rb +40 -3
  7. data/app/controllers/kaui/bundles_controller.rb +5 -1
  8. data/app/controllers/kaui/charges_controller.rb +1 -1
  9. data/app/controllers/kaui/credits_controller.rb +1 -1
  10. data/app/controllers/kaui/custom_fields_controller.rb +3 -3
  11. data/app/controllers/kaui/engine_controller.rb +3 -28
  12. data/app/controllers/kaui/engine_controller_util.rb +8 -2
  13. data/app/controllers/kaui/home_controller.rb +5 -5
  14. data/app/controllers/kaui/invoice_items_controller.rb +1 -1
  15. data/app/controllers/kaui/invoices_controller.rb +59 -34
  16. data/app/controllers/kaui/payment_methods_controller.rb +3 -3
  17. data/app/controllers/kaui/payments_controller.rb +66 -10
  18. data/app/controllers/kaui/refunds_controller.rb +3 -2
  19. data/app/controllers/kaui/sessions_controller.rb +7 -0
  20. data/app/controllers/kaui/subscriptions_controller.rb +8 -8
  21. data/app/controllers/kaui/transactions_controller.rb +2 -2
  22. data/app/helpers/kaui/exception_helper.rb +25 -0
  23. data/app/helpers/kaui/subscription_helper.rb +4 -0
  24. data/app/models/kaui/account.rb +2 -0
  25. data/app/models/kaui/custom_field.rb +1 -1
  26. data/app/models/kaui/invoice.rb +2 -0
  27. data/app/models/kaui/payment_method.rb +4 -4
  28. data/app/views/kaui/account_timelines/_multi_functions_bar.html.erb +184 -0
  29. data/app/views/kaui/account_timelines/show.html.erb +2 -0
  30. data/app/views/kaui/accounts/_account_info.html.erb +7 -0
  31. data/app/views/kaui/accounts/_multi_functions_bar.html.erb +347 -0
  32. data/app/views/kaui/accounts/index.html.erb +46 -33
  33. data/app/views/kaui/audit_logs/_multi_functions_bar.html.erb +218 -0
  34. data/app/views/kaui/audit_logs/index.html.erb +1 -0
  35. data/app/views/kaui/bundles/index.html.erb +34 -0
  36. data/app/views/kaui/errors/500.html.erb +29 -0
  37. data/app/views/kaui/invoices/_multi_functions_bar.html.erb +340 -0
  38. data/app/views/kaui/invoices/index.html.erb +41 -19
  39. data/app/views/kaui/layouts/kaui_navbar.html.erb +1 -1
  40. data/app/views/kaui/payments/_multi_functions_bar.html.erb +344 -0
  41. data/app/views/kaui/payments/index.html.erb +64 -25
  42. data/config/locales/en.yml +3 -0
  43. data/config/routes.rb +7 -0
  44. data/lib/kaui/error_handler.rb +37 -0
  45. data/lib/kaui/version.rb +1 -1
  46. data/lib/kaui.rb +105 -29
  47. data/lib/tasks/kaui_tasks.rake +1 -0
  48. metadata +11 -3
  49. data/app/assets/images/kaui/logo.png +0 -0
@@ -0,0 +1,184 @@
1
+ <div class="functions-container">
2
+ <button class="btn btn-default download-button-right" type="button" id="modalDownloadButton">
3
+ <i class="glyphicon glyphicon-download-alt"></i>
4
+ <strong>Download CSV</strong>
5
+ </button>
6
+ </div>
7
+
8
+ <div class="modal fade" id="downloadCsvModal" tabindex="-1" role="dialog" aria-labelledby="downloadCsvModalLabel" aria-hidden="true">
9
+ <div class="modal-dialog" role="document">
10
+ <div class="modal-content">
11
+ <div class="modal-header">
12
+ <h3 class="modal-title" id="downloadCsvModalLabel">Download</h3>
13
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
14
+ <span aria-hidden="true">&times;</span>
15
+ </button>
16
+ </div>
17
+ <div class="modal-body">
18
+ <form id="downloadCsvForm">
19
+ <div class="row">
20
+ <div class="col-md-6">
21
+ <div class="form-group">
22
+ <label for="startDate">Effective Date:</label>
23
+ <input type="text" class="form-control" id="startDate" name="startDate">
24
+ </div>
25
+ </div>
26
+ <div class="col-md-6">
27
+ <div class="form-group">
28
+ <label for="endDate">To:</label>
29
+ <input type="text" class="form-control" id="endDate" name="endDate">
30
+ </div>
31
+ </div>
32
+ </div>
33
+ <div class="row">
34
+ <div class="col-md-6">
35
+ <div class="form-check">
36
+ <div>
37
+ <input type="radio" id="customDate" name="download_option" value="customDate">
38
+ <label for="customDate">Custom date</label>
39
+ </div>
40
+ <div>
41
+ <input type="radio" id="allData" name="download_option" value="all">
42
+ <label for="allData">All events</label>
43
+ </div>
44
+ <div>
45
+ <input type="radio" id="thisWeek" name="download_option" value="thisWeek">
46
+ <label for="thisWeek">This week</label>
47
+ </div>
48
+ <div>
49
+ <input type="radio" id="thisMonth" name="download_option" value="thisMonth">
50
+ <label for="thisMonth">This month</label>
51
+ </div>
52
+ <div>
53
+ <input type="radio" id="thisYear" name="download_option" value="thisYear">
54
+ <label for="thisYear">This year</label>
55
+ </div>
56
+ </div>
57
+ </div>
58
+ </div>
59
+ </form>
60
+ </div>
61
+ <div class="modal-footer">
62
+ <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
63
+ <button type="button" class="btn btn-primary" id="downloadButton">Download</button>
64
+ </div>
65
+ </div>
66
+ </div>
67
+ </div>
68
+
69
+ <style>
70
+ .download-button-right {
71
+ float: right;
72
+ margin-left: 10px;
73
+ background-color: white;
74
+ color: black;
75
+ text-transform: none;
76
+ border: 1px solid #ccc;
77
+ padding: 8px 15px;
78
+ }
79
+
80
+ .functions-container {
81
+ display: flex;
82
+ justify-content: flex-end;
83
+ }
84
+ </style>
85
+
86
+ <%= javascript_tag do %>
87
+ $(document).ready(function() {
88
+ $('.dropdown-menu').on('click', 'input[type="checkbox"], label', function(event) {
89
+ event.stopPropagation();
90
+ });
91
+
92
+ $('#modalDownloadButton').click(function() {
93
+ $('#downloadCsvModal').modal('show');
94
+ });
95
+
96
+ $('#startDate, #endDate').datepicker({
97
+ dateFormat: 'yy-mm-dd'
98
+ });
99
+
100
+ $('#downloadCsvModal').on('show.bs.modal', function (e) {
101
+ $('#allData').prop('checked', true);
102
+ $('#startDate, #endDate').prop('disabled', true);
103
+ $('#startDate').val(null);
104
+ $('#endDate').val(null);
105
+ });
106
+
107
+ $('#allData').change(function() {
108
+ $('#startDate').val(null);
109
+ $('#endDate').val(null);
110
+ var isChecked = $(this).is(':checked');
111
+ $('#startDate, #endDate').prop('disabled', true);
112
+ });
113
+
114
+ function setDateRange(option) {
115
+ var currentDate = new Date();
116
+ var startDate, endDate;
117
+
118
+ if (option === "day") {
119
+ startDate = new Date();
120
+ endDate = new Date();
121
+ endDate.setDate(endDate.getDate() + 1);
122
+ } else if (option === "week") {
123
+ startDate = new Date(currentDate.setDate(currentDate.getDate() - currentDate.getDay() + 1));
124
+ currentDate = new Date();
125
+ endDate = new Date(currentDate.setDate(currentDate.getDate() - currentDate.getDay() + 7));
126
+ } else if (option === "month") {
127
+ startDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
128
+ endDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
129
+ } else if (option === "year") {
130
+ startDate = new Date(currentDate.getFullYear(), 0, 1);
131
+ endDate = new Date(currentDate.getFullYear(), 11, 31);
132
+ }
133
+
134
+ var startDateFormatted = startDate.toISOString().split('T')[0];
135
+ var endDateFormatted = endDate.toISOString().split('T')[0];
136
+
137
+ $('#startDate').val(startDateFormatted);
138
+ $('#endDate').val(endDateFormatted);
139
+ $('#startDate, #endDate').prop('disabled', true);
140
+ }
141
+
142
+ $('#thisWeek').change(function() {
143
+ if ($(this).is(':checked')) {
144
+ setDateRange("week");
145
+ }
146
+ });
147
+
148
+ $('#thisMonth').change(function() {
149
+ if ($(this).is(':checked')) {
150
+ setDateRange("month");
151
+ }
152
+ });
153
+
154
+ $('#thisYear').change(function() {
155
+ if ($(this).is(':checked')) {
156
+ setDateRange("year");
157
+ }
158
+ });
159
+
160
+ $('#customDate').change(function() {
161
+ if ($(this).is(':checked')) {
162
+ setDateRange("day");
163
+ $('#startDate, #endDate').prop('disabled', false);
164
+ }
165
+ });
166
+
167
+ var downloadButton = document.getElementById('downloadButton');
168
+ if (downloadButton) {
169
+ downloadButton.addEventListener('click', function() {
170
+ event.preventDefault();
171
+ var startDate = $('#startDate').val();
172
+ var endDate = $('#endDate').val();
173
+ var downloadAll = $('#allData').is(':checked');
174
+ var eventToFilter = $('#event_types').val().toUpperCase()
175
+
176
+ if (downloadAll) {
177
+ window.open("<%= download_account_timeline_path %>?account_id=<%=@account.account_id%>&eventType="+eventToFilter, '_blank');
178
+ } else {
179
+ window.open("<%= download_account_timeline_path %>?account_id=<%=@account.account_id%>&startDate="+startDate+"&endDate="+endDate+"&eventType="+eventToFilter, '_blank');
180
+ }
181
+ });
182
+ }
183
+ });
184
+ <% end %>
@@ -21,6 +21,8 @@
21
21
  </div>
22
22
  </form>
23
23
 
24
+ <%= render :partial => 'multi_functions_bar' %>
25
+
24
26
  <hr/>
25
27
 
26
28
  <table id="timeline-table" class="table table-condensed mobile-data">
@@ -18,6 +18,13 @@
18
18
  :class => 'btn btn-xs text-danger',
19
19
  data: {toggle: 'modal', name: @account.name || '(not set)', account_id: @account.account_id}) %>
20
20
  <% end %>
21
+
22
+ <% if can? :export, Kaui::AdminTenant %>
23
+ <%= link_to '<i class="fa fa-arrow-down" aria-hidden="true"></i>Export'.html_safe,
24
+ kaui_engine.export_account_path(@account.account_id),
25
+ :class => 'btn btn-xs', :id => 'download_link', :title => 'Export Account Data' %>
26
+ <% end %>
27
+
21
28
  <% unless @account.parent_account_id.nil? %>
22
29
  <span class="label label-info account-child-label">Child</span>
23
30
  <% end %>
@@ -0,0 +1,347 @@
1
+ <div class="dropdown-container">
2
+ <button class="btn btn-default download-button-right" type="button" id="modalDownloadButton">
3
+ <i class="glyphicon glyphicon-download-alt"></i>
4
+ <strong>Download CSV</strong>
5
+ </button>
6
+ <div class="dropdown">
7
+ <button class="btn btn-default dropdown-toggle toggle-button-right" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
8
+ <i class="glyphicon glyphicon-cog"></i>
9
+ <strong>Edit Columns</strong>
10
+ </button>
11
+ <ul class="dropdown-menu" id="column-visibility" aria-labelledby="v">
12
+ <% Kaui.account_search_columns.call[0].each_with_index do |title, index| %>
13
+ <li class="list-group-item-manual" data-id="<%= index %>">
14
+ <label class="label-group-item-manual">
15
+ <input type="checkbox" class="column-toggle" draggable="true" data-column="<%= index %>" <%= 'checked' if @dropdown_default[index][:visible] %> > <%= title %>
16
+ <span class="glyphicon glyphicon-option-vertical icon-drag" aria-hidden="true"></span>
17
+ </label>
18
+ </li>
19
+ <% end %>
20
+ </ul>
21
+ </div>
22
+ </div>
23
+
24
+ <div class="modal fade" id="downloadCsvModal" tabindex="-1" role="dialog" aria-labelledby="downloadCsvModalLabel" aria-hidden="true">
25
+ <div class="modal-dialog" role="document">
26
+ <div class="modal-content">
27
+ <div class="modal-header">
28
+ <h3 class="modal-title" id="downloadCsvModalLabel">Download</h3>
29
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
30
+ <span aria-hidden="true">&times;</span>
31
+ </button>
32
+ </div>
33
+ <div class="modal-body">
34
+ <form id="downloadCsvForm">
35
+ <div class="row">
36
+ <div class="col-md-6">
37
+ <div class="form-group">
38
+ <label for="startDate">Account Creation Date From:</label>
39
+ <input type="text" class="form-control" id="startDate" name="startDate">
40
+ </div>
41
+ </div>
42
+ <div class="col-md-6">
43
+ <div class="form-group">
44
+ <label for="endDate">To:</label>
45
+ <input type="text" class="form-control" id="endDate" name="endDate">
46
+ </div>
47
+ </div>
48
+ </div>
49
+ <div class="row">
50
+ <div class="col-md-6">
51
+ <div class="form-check">
52
+ <div>
53
+ <input type="radio" id="customDate" name="download_option" value="customDate">
54
+ <label for="customDate">Custom date</label>
55
+ </div>
56
+ <div>
57
+ <input type="radio" id="allData" name="download_option" value="all">
58
+ <label for="allData">All accounts</label>
59
+ </div>
60
+ <div>
61
+ <input type="radio" id="thisWeek" name="download_option" value="thisWeek">
62
+ <label for="thisWeek">This week</label>
63
+ </div>
64
+ <div>
65
+ <input type="radio" id="thisMonth" name="download_option" value="thisMonth">
66
+ <label for="thisMonth">This month</label>
67
+ </div>
68
+ <div>
69
+ <input type="radio" id="thisYear" name="download_option" value="thisYear">
70
+ <label for="thisYear">This year</label>
71
+ </div>
72
+ </div>
73
+ </div>
74
+ </div>
75
+ <div class="row">
76
+ <div class="col-md-12">
77
+ <h5>Additional Options</h5>
78
+ </div>
79
+ </div>
80
+ <div class="row">
81
+ <div class="col-md-6">
82
+ <div class="form-check">
83
+ <input type="checkbox" class="form-check-input" id="allFields" name="allFields">
84
+ <label class="form-check-label" for="allFields">All fields</label>
85
+ </div>
86
+ </div>
87
+ </div>
88
+ </form>
89
+ </div>
90
+ <div class="modal-footer">
91
+ <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
92
+ <button type="button" class="btn btn-primary" id="downloadButton">Download</button>
93
+ </div>
94
+ </div>
95
+ </div>
96
+ </div>
97
+
98
+ <style>
99
+ .dropdown-menu#column-visibility {
100
+ max-height: 300px;
101
+ width: 200px;
102
+ overflow-y: auto;
103
+ }
104
+
105
+ .dropdown-menu {
106
+ padding: 5px;
107
+ }
108
+
109
+ .toggle-button-right {
110
+ float: right;
111
+ margin-bottom: 10px;
112
+ margin-left: 10px;
113
+ background-color: white;
114
+ color: black;
115
+ text-transform: none;
116
+ border: 1px solid #ccc;
117
+ padding: 8px 15px;
118
+ }
119
+
120
+ .download-button-right {
121
+ float: right;
122
+ margin-bottom: 10px;
123
+ margin-left: 10px;
124
+ background-color: white;
125
+ color: black;
126
+ text-transform: none;
127
+ border: 1px solid #ccc;
128
+ padding: 8px 15px;
129
+ }
130
+
131
+ .icon-drag {
132
+ float: right;
133
+ padding: 5px;
134
+ }
135
+
136
+ .dropdown-container {
137
+ display: flex;
138
+ justify-content: flex-end;
139
+ }
140
+
141
+ .label-group-item-manual {
142
+ margin: 5px;
143
+ width: -webkit-fill-available;
144
+ cursor: grab;
145
+ }
146
+ .label-group-item-manual:active {
147
+ cursor: grabbing;
148
+ }
149
+ </style>
150
+
151
+ <%= javascript_tag do %>
152
+ $(document).ready(function() {
153
+ $('.dropdown-menu').on('click', 'input[type="checkbox"], label', function(event) {
154
+ event.stopPropagation();
155
+ });
156
+
157
+ $('#modalDownloadButton').click(function() {
158
+ $('#downloadCsvModal').modal('show');
159
+ });
160
+
161
+ $('#startDate, #endDate').datepicker({
162
+ dateFormat: 'yy-mm-dd'
163
+ });
164
+
165
+ $('#downloadCsvModal').on('show.bs.modal', function (e) {
166
+ $('#allData').prop('checked', true);
167
+ $('#startDate, #endDate').prop('disabled', true);
168
+ $('#startDate').val(null);
169
+ $('#endDate').val(null);
170
+ });
171
+
172
+ $('#allData').change(function() {
173
+ var isChecked = $(this).is(':checked');
174
+ $('#startDate, #endDate').prop('disabled', true);
175
+ });
176
+
177
+ function setDateRange(option) {
178
+ var currentDate = new Date();
179
+ var startDate, endDate;
180
+
181
+ if (option === "day") {
182
+ startDate = new Date();
183
+ endDate = new Date();
184
+ endDate.setDate(endDate.getDate() + 1);
185
+ } else if (option === "week") {
186
+ startDate = new Date(currentDate.setDate(currentDate.getDate() - currentDate.getDay() + 1));
187
+ currentDate = new Date();
188
+ endDate = new Date(currentDate.setDate(currentDate.getDate() - currentDate.getDay() + 7));
189
+ } else if (option === "month") {
190
+ startDate = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
191
+ endDate = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
192
+ } else if (option === "year") {
193
+ startDate = new Date(currentDate.getFullYear(), 0, 1);
194
+ endDate = new Date(currentDate.getFullYear(), 11, 31);
195
+ }
196
+
197
+ var startDateFormatted = startDate.toISOString().split('T')[0];
198
+ var endDateFormatted = endDate.toISOString().split('T')[0];
199
+
200
+ $('#startDate').val(startDateFormatted);
201
+ $('#endDate').val(endDateFormatted);
202
+ $('#startDate, #endDate').prop('disabled', true);
203
+ }
204
+
205
+ $('#thisWeek').change(function() {
206
+ if ($(this).is(':checked')) {
207
+ setDateRange("week");
208
+ }
209
+ });
210
+
211
+ $('#thisMonth').change(function() {
212
+ if ($(this).is(':checked')) {
213
+ setDateRange("month");
214
+ }
215
+ });
216
+
217
+ $('#thisYear').change(function() {
218
+ if ($(this).is(':checked')) {
219
+ setDateRange("year");
220
+ }
221
+ });
222
+
223
+ $('#customDate').change(function() {
224
+ if ($(this).is(':checked')) {
225
+ setDateRange("day");
226
+ $('#startDate, #endDate').prop('disabled', false);
227
+ }
228
+ });
229
+
230
+ var downloadButton = document.getElementById('downloadButton');
231
+ if (downloadButton) {
232
+ downloadButton.addEventListener('click', function() {
233
+ event.preventDefault();
234
+
235
+ var allFieldsChecked = document.getElementById('allFields').checked;
236
+ var startDate = $('#startDate').val();
237
+ var endDate = $('#endDate').val();
238
+ var downloadAll = $('#allData').is(':checked');
239
+ var thElements = document.querySelectorAll('#accounts-table th');
240
+ var columnTitles = Array.from(thElements).map(function(th) {
241
+ return th.textContent.trim();
242
+ });
243
+ var columnsString = columnTitles.join(',')
244
+ var url = new URL("<%= download_accounts_path %>", window.location.origin);
245
+ var params = new URLSearchParams();
246
+ params.append('columnsString', columnsString);
247
+ if (!downloadAll) {
248
+ params.append('startDate', startDate);
249
+ params.append('endDate', endDate);
250
+ }
251
+ params.append('allFieldsChecked', allFieldsChecked);
252
+ url.search = params.toString();
253
+ console.log(url.toString());
254
+ window.open(url.toString(), '_blank');
255
+ });
256
+ }
257
+
258
+ updateDropdownOrder();
259
+
260
+ function updateDropdownOrder() {
261
+ var state = JSON.parse(localStorage.getItem('DataTables_accounts-table_' + window.location.pathname));
262
+ if (state === null) {
263
+ return;
264
+ }
265
+ var columnOrder = state.ColReorder;
266
+ var $list = $('#column-visibility');
267
+ var thElements = document.querySelectorAll('#accounts-table th');
268
+ var $columnTitles = Array.from(thElements).map(function(th) {
269
+ return th.textContent.trim();
270
+ });
271
+
272
+ if (columnOrder !== undefined) {
273
+ $list.empty();
274
+ var state = JSON.parse(localStorage.getItem('DataTables_accounts-table_' + window.location.pathname));
275
+ if (state !== null) {
276
+ var colsOrder = state.ColReorder;
277
+ }
278
+ columnOrder.forEach(function(colIdx, index) {
279
+ if (colsOrder) {
280
+ var data_id = colsOrder[index];
281
+ } else {
282
+ var data_id = index;
283
+ }
284
+ var $item = $('<li>', { class: "list-group-item-manual", "data-id": data_id });
285
+ var column = state.columns[colIdx];
286
+ var col_name = $columnTitles[colIdx];
287
+ var $label = $('<label>', {
288
+ class: "label-group-item-manual",
289
+ });
290
+ var $checkbox = $("<input>", {
291
+ type: "checkbox",
292
+ value: colIdx,
293
+ checked: column.visible,
294
+ "data-column": colIdx,
295
+ class: "column-toggle"
296
+ });
297
+ $label.append($checkbox).append(" " + col_name);
298
+ var $icon = $("<span>", { class: "glyphicon glyphicon-option-vertical icon-drag"});
299
+ $label.append($icon);
300
+ $item.append($label);
301
+ $list.append($item);
302
+ });
303
+ }
304
+ resetDataColumn();
305
+ resetDataId();
306
+ }
307
+
308
+ $("#column-visibility").sortable({
309
+ axis: "y",
310
+ containment: "parent",
311
+ stop: function(event, ui) {
312
+ var order = $("#column-visibility").sortable('toArray', {attribute: 'data-id'});
313
+ reorderTableColumns(order);
314
+ }
315
+ });
316
+ $("#column-visibility").disableSelection();
317
+
318
+ function reorderTableColumns(order) {
319
+ var table = $('#accounts-table').DataTable();
320
+ var columnIndexes = order.map(Number);
321
+ console.log('New column order:', columnIndexes);
322
+ table.colReorder.order(columnIndexes);
323
+ resetDataColumn();
324
+ resetDataId();
325
+ }
326
+
327
+ function resetDataId() {
328
+ var elements = document.querySelectorAll('.list-group-item-manual');
329
+ elements.forEach(function(element, index) {
330
+ element.setAttribute('data-id', index);
331
+ });
332
+ }
333
+
334
+ function resetDataColumn() {
335
+ var elements = document.querySelectorAll('.column-toggle');
336
+ elements.forEach(function(element, index) {
337
+ element.setAttribute('data-column', index);
338
+ });
339
+ }
340
+
341
+ $('.column-toggle').on('change', function() {
342
+ var table = $('#accounts-table').DataTable();
343
+ var column = table.column($(this).attr('data-column'));
344
+ column.visible(!column.visible());
345
+ });
346
+ });
347
+ <% end %>
@@ -7,13 +7,12 @@
7
7
  <% else %>
8
8
  <h1>Showing all accounts</h1>
9
9
  <% end %>
10
+ <%= render :partial => 'multi_functions_bar' %>
10
11
 
11
- <table id="accounts-table" class="table table-condensed mobile-data">
12
+ <table id="accounts-table" class="table table-condensed mobile-data" style="width:100%">
12
13
  <thead>
13
14
  <tr>
14
- <th></th>
15
- <th>ID</th>
16
- <% Kaui.account_search_columns.call()[0].each do |title| %>
15
+ <% Kaui.account_search_columns.call[0].each do |title| %>
17
16
  <th><%= title %></th>
18
17
  <% end %>
19
18
  </tr>
@@ -24,41 +23,55 @@
24
23
  </tr>
25
24
  </tbody>
26
25
  </table>
27
-
28
26
  </div>
29
-
30
27
  </div>
31
28
 
32
29
  <%= javascript_tag do %>
33
30
  $(document).ready(function() {
31
+ $.ajax({
32
+ url: "<%= accounts_pagination_path(:ordering => @ordering, :format => :json) %>",
33
+ type: "GET",
34
+ success: function(response) {
35
+ const visibleColumns = response.columns;
34
36
 
35
- var table = $('#accounts-table').DataTable({
36
- "dom": "<'row'r>t<'row'<'col-md-6'i><'col-md-6'p>>",
37
- "pagingType": <% if @max_nb_records.nil? -%>"simple"<% else -%>"full_numbers"<% end -%>,
38
- "language": {
39
- <!-- See DefaultPaginationSqlDaoHelper.java -->
40
- "info": <% if @max_nb_records.nil? -%>"Showing _START_ to _END_ of <%= number_with_delimiter(Kaui::EngineControllerUtil::SIMPLE_PAGINATION_THRESHOLD) -%>+ entries"<% else -%>"Showing _START_ to _END_ of _TOTAL_ entries"<% end -%>
41
- },
42
- "pageLength": <%= @limit %>,
43
- "displayStart": <%= @offset %>,
44
- <% if @search_query.blank? %>
45
- "ordering": false,
46
- <% elsif !@ordering.blank? %>
47
- "order": [[ 1, "<%= @ordering %>" ]],
48
- <% end %>
49
- "processing": true,
50
- "serverSide": true,
51
- "search": {"search": "<%= @search_query %>"},
52
- "ajax": "<%= accounts_pagination_path(:ordering => @ordering, :format => :json) %>",
53
- "columnDefs": [
54
- { "orderable": false, "targets": 0, "createdCell": function (td, cellData, rowData, row, col) {
55
- $(td).css('padding-left', '20px');
56
- $(td).css('width', '60px');
57
-
58
- } }
59
- ],
60
- drawCallback: function() {
61
- setObjectIdPopover();
37
+ var table = $('#accounts-table').DataTable({
38
+ "colReorder": {
39
+ "enable": false
40
+ },
41
+ "stateSave": true,
42
+ "scrollX": true,
43
+ "dom": "<'row'r>t<'row'<'col-md-6'i><'col-md-6'p>>",
44
+ "pagingType": <% if @max_nb_records.nil? -%>"simple"<% else -%>"full_numbers"<% end -%>,
45
+ "language": {
46
+ <!-- See DefaultPaginationSqlDaoHelper.java -->
47
+ "info": <% if @max_nb_records.nil? -%>"Showing _START_ to _END_ of <%= number_with_delimiter(Kaui::EngineControllerUtil::SIMPLE_PAGINATION_THRESHOLD) -%>+ entries"<% else -%>"Showing _START_ to _END_ of _TOTAL_ entries"<% end -%>
48
+ },
49
+ "pageLength": <%= @limit %>,
50
+ "displayStart": <%= @offset %>,
51
+ <% if @search_query.blank? %>
52
+ "ordering": false,
53
+ <% elsif !@ordering.blank? %>
54
+ "order": [[ 1, "<%= @ordering %>" ]],
55
+ <% end %>
56
+ "processing": true,
57
+ "serverSide": true,
58
+ "search": {"search": "<%= @search_query %>"},
59
+ "ajax": {
60
+ url: "<%= accounts_pagination_path(:ordering => @ordering, :format => :json) %>",
61
+ dataSrc: function(json) {
62
+ var colOrder = $('#accounts-table').DataTable().colReorder.order();
63
+ var reorderedData = json.data.map(function(row) {
64
+ var newRow = [];
65
+ for (var i = 0; i < colOrder.length; i++) {
66
+ newRow.push(row[colOrder[i]]);
67
+ }
68
+ return newRow;
69
+ });
70
+ return reorderedData;
71
+ }
72
+ },
73
+ "columns": visibleColumns
74
+ });
62
75
  }
63
76
  });
64
77