mirror of
https://github.com/NodeBB/NodeBB.git
synced 2025-10-26 16:46:12 +01:00
feat: add ability to search groups in group details page
This commit is contained in:
@@ -7,7 +7,8 @@ define('admin/manage/group', [
|
||||
'admin/modules/colorpicker',
|
||||
'translator',
|
||||
'categorySelector',
|
||||
], function (memberList, iconSelect, colorpicker, translator, categorySelector) {
|
||||
'groupSearch',
|
||||
], function (memberList, iconSelect, colorpicker, translator, categorySelector, groupSearch) {
|
||||
var Groups = {};
|
||||
|
||||
Groups.init = function () {
|
||||
@@ -60,6 +61,8 @@ define('admin/manage/group', [
|
||||
navigateToCategory(selectedCategory.cid);
|
||||
});
|
||||
|
||||
groupSearch.init($('[component="group-selector"]'));
|
||||
|
||||
colorpicker.enable(changeGroupLabelColor, function (hsb, hex) {
|
||||
groupLabelPreview.css('background-color', '#' + hex);
|
||||
});
|
||||
|
||||
60
public/src/modules/groupSearch.js
Normal file
60
public/src/modules/groupSearch.js
Normal file
@@ -0,0 +1,60 @@
|
||||
'use strict';
|
||||
|
||||
define('groupSearch', function () {
|
||||
var groupSearch = {};
|
||||
|
||||
groupSearch.init = function (el) {
|
||||
if (utils.isTouchDevice()) {
|
||||
return;
|
||||
}
|
||||
var searchEl = el.find('[component="group-selector-search"]');
|
||||
if (!searchEl.length) {
|
||||
return;
|
||||
}
|
||||
var toggleVisibility = searchEl.parent('[component="group-selector"]').length > 0;
|
||||
|
||||
var groupEls = el.find('[component="group-list"] [data-name]');
|
||||
el.on('show.bs.dropdown', function () {
|
||||
function updateList() {
|
||||
var val = searchEl.find('input').val().toLowerCase();
|
||||
var noMatch = true;
|
||||
groupEls.each(function () {
|
||||
var liEl = $(this);
|
||||
var isMatch = liEl.attr('data-name').toLowerCase().indexOf(val) !== -1;
|
||||
if (noMatch && isMatch) {
|
||||
noMatch = false;
|
||||
}
|
||||
|
||||
liEl.toggleClass('hidden', !isMatch);
|
||||
});
|
||||
|
||||
el.find('[component="group-list"] [component="group-no-matches"]').toggleClass('hidden', !noMatch);
|
||||
}
|
||||
if (toggleVisibility) {
|
||||
el.find('.dropdown-toggle').addClass('hidden');
|
||||
searchEl.removeClass('hidden');
|
||||
}
|
||||
|
||||
searchEl.on('click', function (ev) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
});
|
||||
searchEl.find('input').val('').on('keyup', updateList);
|
||||
updateList();
|
||||
});
|
||||
|
||||
el.on('shown.bs.dropdown', function () {
|
||||
searchEl.find('input').focus();
|
||||
});
|
||||
|
||||
el.on('hide.bs.dropdown', function () {
|
||||
if (toggleVisibility) {
|
||||
el.find('.dropdown-toggle').removeClass('hidden');
|
||||
searchEl.addClass('hidden');
|
||||
}
|
||||
searchEl.off('click').find('input').off('keyup');
|
||||
});
|
||||
};
|
||||
|
||||
return groupSearch;
|
||||
});
|
||||
@@ -108,12 +108,25 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<select id="group-selector" class="form-control">
|
||||
<div component="group-selector" class="btn-group">
|
||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
|
||||
<span component="group-selector-selected">{group.displayName}</span> <span class="caret"></span>
|
||||
</button>
|
||||
<div component="group-selector-search" class="hidden">
|
||||
<input type="text" class="form-control" autocomplete="off">
|
||||
</div>
|
||||
<ul component="group-list" class="dropdown-menu group-dropdown-menu" role="menu">
|
||||
<li component="group-no-matches" role="presentation" class="group hidden">
|
||||
<a role="menu-item">[[search:no-matches]]</a>
|
||||
</li>
|
||||
<!-- BEGIN groupNames -->
|
||||
<option value="{groupNames.encodedName}" <!-- IF groupNames.selected -->selected<!-- ENDIF groupNames.selected -->>{groupNames.displayName}</option>
|
||||
<li role="presentation" class="group" data-name="{groupNames.displayName}">
|
||||
<a href="{config.relative_path}/admin/manage/groups/{groupNames.encodedName}" role="menu-item">{groupNames.displayName}</a>
|
||||
</li>
|
||||
<!-- END groupNames -->
|
||||
</select>
|
||||
<br />
|
||||
</ul>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="well">
|
||||
<strong class="pull-left">[[admin/manage/privileges:edit-privileges]]</strong><br />
|
||||
<!-- IMPORT partials/category-selector.tpl -->
|
||||
|
||||
@@ -16,9 +16,9 @@
|
||||
{{{ if user.privileges.admin:privileges }}}<li><a href="{relative_path}/admin/manage/privileges">[[admin/menu:manage/privileges]]</a></li>{{{ end }}}
|
||||
{{{ if user.privileges.admin:users }}}<li><a href="{relative_path}/admin/manage/users">[[admin/menu:manage/users]]</a></li>{{{ end }}}
|
||||
{{{ if user.privileges.superadmin }}}
|
||||
<li><a href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/groups">[[admin/menu:manage/groups]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/tags">[[admin/menu:manage/tags]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/uploads">[[admin/menu:manage/uploads]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/digest">[[admin/menu:manage/digest]]</a></li>
|
||||
@@ -183,9 +183,9 @@
|
||||
{{{ if user.privileges.admin:privileges }}}<li><a href="{relative_path}/admin/manage/privileges">[[admin/menu:manage/privileges]]</a></li>{{{ end }}}
|
||||
{{{ if user.privileges.admin:users }}}<li><a id="manage-users" href="{relative_path}/admin/manage/users">[[admin/menu:manage/users]]</a></li>{{{ end }}}
|
||||
{{{ if user.privileges.superadmin }}}
|
||||
<li><a href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/groups">[[admin/menu:manage/groups]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/tags">[[admin/menu:manage/tags]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/uploads">[[admin/menu:manage/uploads]]</a></li>
|
||||
<li><a href="{relative_path}/admin/manage/digest">[[admin/menu:manage/digest]]</a></li>
|
||||
|
||||
Reference in New Issue
Block a user