mirror of
https://github.com/Oreolek/ifhub.club.git
synced 2024-05-19 09:18:18 +03:00
Доработка механизма выбора пользователей
This commit is contained in:
Denis Shakhov
parent
b34499347e
commit
cfd7a2155f
|
|
@ -10,12 +10,12 @@
|
|||
{component 'field' template='hidden.security-key'}
|
||||
|
||||
{* Получатели *}
|
||||
{component 'field' template='text'
|
||||
name = 'talk_users'
|
||||
rules = [ 'required' => true, 'rangetags' => '[1,99]' ]
|
||||
label = $aLang.talk.add.fields.users.label
|
||||
inputClasses = 'autocomplete-users-sep js-input-talk-users'
|
||||
note = "<a href=\"#\" class=\"link-dotted js-modal-toggle-default\" data-lsmodaltoggle-url=\"{router page='ajax/modal-friend-list'}\" data-param-selectable=\"true\" data-param-target=\".js-input-talk-users\">{lang 'talk.add.choose_friends'}</a>"}
|
||||
{component 'user' template='choose'
|
||||
name = 'talk_users'
|
||||
rules = [ 'required' => true, 'rangetags' => '[1,99]' ]
|
||||
classes = 'js-talk-add-user-choose'
|
||||
label = {lang 'talk.add.fields.users.label'}
|
||||
lang_choose = {lang 'talk.add.choose_friends'}}
|
||||
|
||||
{* Заголовок *}
|
||||
{component 'field' template='text'
|
||||
|
|
|
|||
|
|
@ -29,6 +29,13 @@ ls.talk = (function ($) {
|
|||
$('.js-talk-form-action').on('click', function (e) {
|
||||
_this.formAction( $(this).data('action') );
|
||||
});
|
||||
|
||||
// Выбор получателей в форме добавления
|
||||
$('.js-talk-add-user-choose').lsUserFieldChoose({
|
||||
urls: {
|
||||
modal: aRouter.ajax + 'modal-friend-list'
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -33,8 +33,6 @@
|
|||
empty: '.js-user-list-small-empty',
|
||||
// Форма добавления
|
||||
form: '.js-user-list-add-form',
|
||||
// Форма добавления
|
||||
form_text: '.js-user-list-add-form input[type=text]',
|
||||
// Выбор пользователей
|
||||
choose: '.js-user-list-add-choose'
|
||||
},
|
||||
|
|
@ -67,7 +65,7 @@
|
|||
|
||||
// Добавление пользователя в список
|
||||
this.elements.form.on('submit' + this.eventNamespace, function (e) {
|
||||
var items = _this.getItems();
|
||||
var items = _this.elements.choose.lsUserFieldChoose( 'getUsers' );
|
||||
|
||||
if ( items.length ) {
|
||||
ls.utils.formLock( _this.elements.form );
|
||||
|
|
@ -77,50 +75,11 @@
|
|||
e.preventDefault();
|
||||
});
|
||||
|
||||
// Показывает модальное окно со списком пользователей
|
||||
// и принимает от него список выбранных пользователей
|
||||
this.elements.choose.on( 'click', function (e) {
|
||||
ls.userModalList.show( this.option( 'urls.list' ), true, this.onModalListAdd.bind(this) );
|
||||
|
||||
e.preventDefault();
|
||||
}.bind(this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Коллбэк вызываемый при отправке формы в мод. окне
|
||||
*
|
||||
* @param {Array} users Список выбранных пользователей
|
||||
*/
|
||||
onModalListAdd: function (users) {
|
||||
// Получаем логины для добавления
|
||||
var loginsNew = $.map(users, function(user) {
|
||||
return user.login;
|
||||
});
|
||||
|
||||
// Получаем логины которые уже прописаны
|
||||
var loginsOld = $.map(this.elements.form_text.val().split(','), function(login) {
|
||||
return $.trim(login) || null;
|
||||
});
|
||||
|
||||
// Мержим логины
|
||||
var logins = $.merge(loginsOld, loginsNew);
|
||||
|
||||
// Убираем дубликаты
|
||||
logins = $.grep(logins, function(value, key) {
|
||||
return $.inArray(value, logins) === key;
|
||||
});
|
||||
|
||||
this.elements.form_text.val( logins.join(', ') );
|
||||
},
|
||||
|
||||
/**
|
||||
* Получает объекты для добавления
|
||||
*
|
||||
* @return {Array} Массив с объектами
|
||||
*/
|
||||
getItems: function () {
|
||||
return $.map( this.elements.form_text.val().split( ',' ), function( item ) {
|
||||
return $.trim( item ) || null;
|
||||
// Выбор пользователей
|
||||
this.elements.choose.lsUserFieldChoose({
|
||||
urls: {
|
||||
modal: this.option( 'urls.list' )
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
|
|
@ -161,7 +120,7 @@
|
|||
}
|
||||
|
||||
ls.utils.formUnlock( this.elements.form );
|
||||
this.elements.form_text.focus().val('');
|
||||
this.elements.choose.lsUserFieldChoose( 'empty' );
|
||||
|
||||
this._trigger( "afteradd", null, { context: this, response: response } );
|
||||
},
|
||||
|
|
|
|||
|
|
@ -28,21 +28,14 @@
|
|||
<p class="{$component}-note">{$smarty.local.note}</p>
|
||||
{/if}
|
||||
|
||||
{* Ссылка показывающая мод. окно со списком пользователей *}
|
||||
{capture 'user_list_add_choose'}
|
||||
<a href="#" class="link-dotted js-{$component}-choose">
|
||||
{lang 'user_list_add.choose'}
|
||||
</a>
|
||||
{/capture}
|
||||
|
||||
{* Форма добавления *}
|
||||
{if $smarty.local.editable|default:true}
|
||||
<form class="{$component}-form js-{$component}-form">
|
||||
{component 'field' template='text'
|
||||
{component 'user' template='choose'
|
||||
name = 'add'
|
||||
inputClasses = "autocomplete-users-sep"
|
||||
classes = "js-{$component}-choose"
|
||||
label = $aLang.user_list_add.form.fields.add.label
|
||||
note = $smarty.capture.user_list_add_choose}
|
||||
lang_choose = {lang 'user_list_add.choose'}}
|
||||
|
||||
{component 'button' text=$aLang.common.add mods='primary' classes="js-$component-form-submit"}
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@
|
|||
"search-form": "search-form.users.tpl",
|
||||
"stat": "stat.tpl",
|
||||
"nav": "nav.user.tpl",
|
||||
"choose": "user-field-choose.tpl",
|
||||
|
||||
"avatar": "avatar/user-avatar.tpl",
|
||||
"avatar-list": "avatar/user-avatar-list.tpl",
|
||||
|
|
@ -52,6 +53,7 @@
|
|||
"fields": "js/user-fields.js",
|
||||
"follow": "js/user-follow.js",
|
||||
"friend": "js/user-friend.js",
|
||||
"choose": "js/user-field-choose.js",
|
||||
"modal-list": "js/user-modal-list.js",
|
||||
"user": "js/user.js"
|
||||
},
|
||||
|
|
|
|||
95
application/frontend/components/user/js/user-field-choose.js
Normal file
95
application/frontend/components/user/js/user-field-choose.js
Normal file
|
|
@ -0,0 +1,95 @@
|
|||
/**
|
||||
* Выбор пользователей
|
||||
*
|
||||
* @module ls/user/field-choose
|
||||
*
|
||||
* @license GNU General Public License, version 2
|
||||
* @copyright 2013 OOO "ЛС-СОФТ" {@link http://livestreetcms.com}
|
||||
* @author Denis Shakhov <denis.shakhov@gmail.com>
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
"use strict";
|
||||
|
||||
$.widget( "livestreet.lsUserFieldChoose", $.livestreet.lsComponent, {
|
||||
/**
|
||||
* Дефолтные опции
|
||||
*/
|
||||
options: {
|
||||
// Ссылки
|
||||
urls: {
|
||||
modal: null
|
||||
},
|
||||
// Селекторы
|
||||
selectors: {
|
||||
// Текствое поле
|
||||
text: '.js-user-field-choose-text',
|
||||
// Выбор пользователей
|
||||
button: '.js-user-field-choose-button'
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Конструктор
|
||||
*
|
||||
* @constructor
|
||||
* @private
|
||||
*/
|
||||
_create: function () {
|
||||
this._super();
|
||||
|
||||
// Показывает модальное окно со списком пользователей
|
||||
// и принимает от него список выбранных пользователей
|
||||
this.elements.button.on( 'click', function (e) {
|
||||
ls.userModalList.show( this.option( 'urls.modal' ), true, this.onModalListAdd.bind(this) );
|
||||
|
||||
e.preventDefault();
|
||||
}.bind(this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Получает список выбранных пользователей
|
||||
*
|
||||
* @return {Array} Массив с выбранными пользователями
|
||||
*/
|
||||
getUsers: function () {
|
||||
return $.map( this.elements.text.val().split( ',' ), function( item ) {
|
||||
return $.trim( item ) || null;
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Очищает поле со списком пользователей
|
||||
*/
|
||||
empty: function () {
|
||||
this.elements.text.val('');
|
||||
},
|
||||
|
||||
/**
|
||||
* Коллбэк вызываемый при отправке формы в мод. окне
|
||||
*
|
||||
* @param {Array} users Список выбранных пользователей
|
||||
*/
|
||||
onModalListAdd: function (users) {
|
||||
// Получаем логины для добавления
|
||||
var loginsNew = $.map(users, function(user) {
|
||||
return user.login;
|
||||
});
|
||||
|
||||
// Получаем логины которые уже прописаны
|
||||
var loginsOld = $.map(this.elements.text.val().split(','), function(login) {
|
||||
return $.trim(login) || null;
|
||||
});
|
||||
|
||||
// Мержим логины
|
||||
var logins = $.merge(loginsOld, loginsNew);
|
||||
|
||||
// Убираем дубликаты
|
||||
logins = $.grep(logins, function(value, key) {
|
||||
return $.inArray(value, logins) === key;
|
||||
});
|
||||
|
||||
this.elements.text.val( logins.join(', ') );
|
||||
},
|
||||
});
|
||||
})(jQuery);
|
||||
31
application/frontend/components/user/user-field-choose.tpl
Normal file
31
application/frontend/components/user/user-field-choose.tpl
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
{**
|
||||
* Выбор пользователей
|
||||
*
|
||||
* @param string $lang_choose
|
||||
*}
|
||||
|
||||
{$component = 'user-field-choose'}
|
||||
|
||||
{* Генерируем копии локальных переменных, *}
|
||||
{* чтобы их можно было изменять в дочерних шаблонах *}
|
||||
{foreach [ 'name', 'label', 'lang_choose', 'mods', 'classes', 'attributes' ] as $param}
|
||||
{assign var="$param" value=$smarty.local.$param}
|
||||
{/foreach}
|
||||
|
||||
{* TODO: i18n *}
|
||||
{$label = $label|default:{lang 'user_list_add.form.fields.add.label'}}
|
||||
{$lang_choose = $lang_choose|default:{lang 'user_list_add.choose'}}
|
||||
|
||||
{* Ссылка показывающая мод. окно со списком пользователей *}
|
||||
{capture 'user_list_add_choose'}
|
||||
<a href="#" class="link-dotted js-{$component}-button">
|
||||
{$lang_choose}
|
||||
</a>
|
||||
{/capture}
|
||||
|
||||
{component 'field' template='text'
|
||||
name = $name
|
||||
inputClasses = "js-{$component}-text autocomplete-users-sep"
|
||||
label = $label
|
||||
note = $smarty.capture.user_list_add_choose
|
||||
params = $smarty.local.params}
|
||||
Loading…
Reference in a new issue