WEBUI/WMS.BZWeb/Areas/UserCenterManager/Views/UserRelation/SelectForm.js

/*
 * 描 述：成员添加
 */
var objectno = request('objectno');
var objecttype = request('objecttype');

var acceptClick;
var bootstrap = function ($, learun) {
    "use strict";


    var userlist = {};
    var userlistselected = [];
    var userlistselectedobj = {};

    // 渲染用户列表
    function renderUserlist(list) {
        var $warp = $('<div></div>');
        for (var i = 0, l = list.length; i < l; i++) {
            var item = list[i];
            var active = "";
            var imgName = "UserCard02.png";
            if (item.SexNum == 2) {
                imgName = "UserCard01.png";
            }
            if (userlistselected.indexOf(item.Id) != -1) {
                active = "active";
            }
            var _cardbox = "";
            _cardbox += '<div class="card-box ' + active + '" data-value="' + item.Id + '" >';
            _cardbox += '    <div class="card-box-img">';
            _cardbox += '        <img src="' + top.$.rootUrl + '/Content/images/' + imgName + '" />';
            _cardbox += '    </div>';
            _cardbox += '    <div class="card-box-content">';
            _cardbox += '        <p>账户：' + item.Code + '</p>';
            _cardbox += '        <p>姓名：' + item.Name + '</p>';
            _cardbox += '        <p>部门：<span data-id="' + item.DeptId + '"></span></p>';
            _cardbox += '    </div>';
            _cardbox += '</div>';
            var $cardbox = $(_cardbox);
            $cardbox[0].userinfo = item;
            $warp.append($cardbox);
            learun.clientdata.getAsync('userdepartment', {
                key: item.DeptId,
                callback: function (_data, op) {
                    $warp.find('[data-id="' + op.key + '"]').text(_data.Name);
                }
            });
        }
        $warp.find('.card-box').on('click', function () {
            var $this = $(this);
            var userid = $this.attr('data-value');
            if ($this.hasClass('active')) {
                $this.removeClass('active');
                removeUser(userid);
                userlistselected.splice(userlistselected.indexOf(userid), 1);

            }
            else {
                $this.addClass('active');
                userlistselectedobj[userid] = $this[0].userinfo;
                userlistselected.push(userid);
                addUser($this[0].userinfo);
            }
        });

        $('#user_list').html($warp);
    };

    function addUser(useritem) {
        var $warp = $('#selected_user_list');
        var _html = '<div class="user-selected-box" data-value="' + useritem.Id + '" >';
        _html += '<p><span data-id="' + useritem.DeptId + '"></span>【' + useritem.Name + '】</p>';
        _html += '<span class="user-reomve" title="移除选中人员"></span>';
        _html += '</div>';
        $warp.append(_html);
        learun.clientdata.getAsync('userdepartment', {
            key: useritem.DeptId,
            callback: function (_data,op) {
                $warp.find('[data-id="' + op.key + '"]').text(_data.name);
            }
        });
    };
    function removeUser(userid) {
        var $warp = $('#selected_user_list');
        $warp.find('[data-value="' + userid + '"]').remove();
    };

    var page = {
        init: function () {
            page.bind();
            page.initData();
        },
        bind: function () {

            // 已选人员按钮
            $('#user_selected_btn').on('click', function () {
                $('#form_warp_right').animate({ right: '0px' }, 300);
            });
            $('#user_selected_btn_close').on('click', function () {
                $('#form_warp_right').animate({ right: '-180px' }, 300);
            });
            // 搜索
            $("#txt_keyword").keydown(function (event) {
                if (event.keyCode == 13) {
                    var keyword = $(this).val();
                    learun.httpAsync('GET', top.$.rootUrl + '/UserCenterManager/UserInfo/GetList', { keyword: keyword }, function (res) {
                        if (res.code > 0) {
                            renderUserlist(res.data || []);
                        }
                    });
                }
            });

            // 选中人员按钮点击事件
            $('#selected_user_list').on('click', function (e) {
                var et = e.target || e.srcElement;
                var $et = $(et);
                if ($et.hasClass('user-reomve')) {
                    var userid = $et.parent().attr('data-value');
                    removeUser(userid);
                    userlistselected.splice(userlistselected.indexOf(userid), 1);
                    $('#user_list').find('[data-value="' + userid + '"]').removeClass('active');
                }
            });

            // 滚动条
            $('#user_list_warp').lrscroll();
            $('#selected_user_list_warp').lrscroll();
        },
        initData: function () {
            
            learun.httpAsync('GET', top.$.rootUrl + '/UserCenterManager/UserInfo/GetList', { keyword: "" }, function (res) {
                if (res.code > 0) {
                    renderUserlist(res.data || []);
                }
            });

                $.lrSetForm(top.$.rootUrl + '/UserCenterManager/UserRelation/GetUserIdList?objectno=' + objectno + "&objecttype=" + objecttype, function (data) {
                if (data.usernos == "") {
                    return false;
                }
                var $warp = $('#selected_user_list');
                $.each(data.userInfoList, function (id, item) {
                    if (item) {
                        userlistselectedobj[item.Id] = item;
                    }
                });
                var userList = data.usernos.split(',');
                for (var i = 0, l = userList.length; i < l; i++) {
                    var userId = userList[i];
                    var item = userlistselectedobj[userId];
                    if (!!item) {
                        if (userlistselected.indexOf(userId) == -1) {
                            userlistselected.push(userId);
                        }

                        var _html = '<div class="user-selected-box" data-value="' + item.Id + '" >';
                        _html += '<p><span data-id="' + item.DeptId + '"></span>【' + item.Name + '】</p>';
                        _html += '<span class="user-reomve" title="移除选中人员"></span>';
                        _html += '</div>';
                        $warp.append($(_html));
                        learun.clientdata.getAsync('userdepartment', {
                            key: item.DeptId,
                            callback: function (_data,op) {
                                $warp.find('[data-id="' + op.key + '"]').text(_data.Name);
                            }
                        });
                        $('#user_list').find('[data-value="' + item.Id + '"]').addClass('active');
                    }
                }
            });
        }
    };
    // 保存数据
    acceptClick = function () {
        $.lrSaveForm(top.$.rootUrl + '/UserCenterManager/UserRelation/SaveForm', { objectno: objectno, objecttype: objecttype, usernos: userlistselected }, function (res) { });
        return true;
    };
    page.init();
}