Use bootstrap table for user list, giving us sortable columns and we can use mobile table/card

pull/3778/head
Isaac Connor 2023-10-11 13:34:38 -04:00
parent 7762e882b1
commit ad35eba013
1 changed files with 28 additions and 16 deletions
web/skins/classic/views

View File

@ -7,23 +7,30 @@
<button type="submit" class="btn-danger" name="deleteBtn" value="Delete" disabled="disabled"><?php echo translate('Delete') ?></button>
</div>
<div id="options">
<table id="contentTable" class="table table-striped">
<table id="contentTable"
class="table-sm table-striped"
style="display:none;"
data-click-to-select="true"
data-check-on-init="true"
data-mobile-responsive="true"
data-min-width="562"
>
<thead class="thead-highlight">
<tr>
<th class="colUsername"><?php echo translate('Username') ?></th>
<th class="colLanguage"><?php echo translate('Language') ?></th>
<th class="colEnabled"><?php echo translate('Enabled') ?></th>
<th class="colStream"><?php echo translate('Stream') ?></th>
<th class="colEvents"><?php echo translate('Events') ?></th>
<th class="colControl"><?php echo translate('Control') ?></th>
<th class="colMonitors"><?php echo translate('Monitors') ?></th>
<th class="colGroups"><?php echo translate('Groups') ?></th>
<th class="colSnapshots"><?php echo translate('Snapshots') ?></th>
<th class="colSystem"><?php echo translate('System') ?></th>
<th class="colDevices"><?php echo translate('Devices') ?></th>
<th class="colBandwidth"><?php echo translate('Bandwidth') ?></th>
<?php if ( ZM_OPT_USE_API ) { ?><th class="colAPIEnabled"><?php echo translate('APIEnabled') ?></th><?php } ?>
<th class="colMark"><?php echo translate('Mark') ?></th>
<th data-sortable="true" class="colUsername"><?php echo translate('Username') ?></th>
<th data-sortable="true" class="colLanguage"><?php echo translate('Language') ?></th>
<th data-sortable="true" class="colEnabled"><?php echo translate('Enabled') ?></th>
<th data-sortable="true" class="colStream"><?php echo translate('Stream') ?></th>
<th data-sortable="true" class="colEvents"><?php echo translate('Events') ?></th>
<th data-sortable="true" class="colControl"><?php echo translate('Control') ?></th>
<th data-sortable="true" class="colMonitors"><?php echo translate('Monitors') ?></th>
<th data-sortable="true" class="colGroups"><?php echo translate('Groups') ?></th>
<th data-sortable="true" class="colSnapshots"><?php echo translate('Snapshots') ?></th>
<th data-sortable="true" class="colSystem"><?php echo translate('System') ?></th>
<th data-sortable="true" class="colDevices"><?php echo translate('Devices') ?></th>
<th data-sortable="true" class="colBandwidth"><?php echo translate('Bandwidth') ?></th>
<?php if ( ZM_OPT_USE_API ) { ?><th class="colAPIEnabled"><?php echo translate('APIEnabled') ?></th><?php } ?>
</tr>
</thead>
<tbody>
@ -31,6 +38,7 @@
foreach (ZM\User::find([], ['order'=>'Username']) as $user_row) {
?>
<tr>
<td class="colMark"><input type="checkbox" name="markUids[]" value="<?php echo $user_row->Id() ?>" data-on-click-this="configureDeleteButton"<?php echo (!$canEdit) ? ' disabled="disabled"' : '' ?>/></td>
<td class="colUsername"><?php echo makeLink('?view=user&amp;uid='.$user_row->Id(), validHtmlStr($user_row->Username()).($user->Username()==$user_row->Username()?'*':''), $canEdit) ?></td>
<td class="colLanguage"><?php echo $user_row->Language()?validHtmlStr($user_row->Language()):'default' ?></td>
<td class="colEnabled"><?php echo translate($user_row->Enabled()?'Yes':'No') ?></td>
@ -44,7 +52,6 @@
<td class="colDevices"><?php echo validHtmlStr($user_row->Devices()) ?></td>
<td class="colBandwidth"><?php echo $user_row->MaxBandwidth()?$bandwidth_options[$user_row->MaxBandwidth()]:'&nbsp;' ?></td>
<?php if ( ZM_OPT_USE_API ) { ?><td class="colAPIEnabled"><?php echo translate($user_row->APIEnabled()?'Yes':'No') ?></td><?php } ?>
<td class="colMark"><input type="checkbox" name="markUids[]" value="<?php echo $user_row->Id() ?>" data-on-click-this="configureDeleteButton"<?php echo (!$canEdit) ? ' disabled="disabled"' : '' ?>/></td>
</tr>
<?php
}
@ -52,4 +59,9 @@
</tbody>
</table>
</div>
</form>
<script nonce="<?php echo $cspNonce ?>">
window.addEventListener("DOMContentLoaded",
function() {
$j('#contentTable').bootstrapTable({icons: icons}).show();
});
</script></form>