platform-project/src/productcenter/js/backend/userManage.js

平台项目

var Util = require('../util');

$(function () {
    if ($('.user-manage-content').length === 0) {
        return;
    }
    var userData = {};
    var isSeach = false;

    $('.user-manage-li a').addClass('active').parent().siblings().find('a').removeClass('active');
    $('.title-b').html('后台管理 - 用户管理');


    // getUserList(1, isSeach);

    //取筛选元素
    // var searchText = '',
    //     searchTimeOut,
    //     sortName, sortOrder;
    // $('.handle-area input.id').on('input', function () {
    //     if (searchTimeOut) {
    //         clearTimeout(searchTimeOut);
    //     }
    //     searchTimeOut = setTimeout(function () {
    //         searchText = $('.handle-area input.id').val();
    //         isSeach = true;
    //         getUserList(1, isSeach);
    //     }, 1000)
    // })

    // 获取用户列表

    // function getUserList(pageNum, isSeach) {
    //     Util.doAjax({
    //         url: '/api/admin/users',
    //         method: 'POST',
    //         data: {
    //             pageSize: 10,
    //             pageNumber: pageNum,
    //             searchText: searchText,
    //         },
    //         success: function (data) {
    //             //处理页码
    //             var total = +data.totalPages;

    //             if (total > 1) {
    //                 if ($('.page-area .vo_pagination').length === 0) {
    //                     var pagination = new Virgo.pagination({
    //                         node: $(".list-area .page-area"),
    //                         isNeedInput: false,
    //                         callback: function (cur) {
    //                             getUserList(cur, isSeach);
    //                         }
    //                     });
    //                     pagination.trigger(1, total);
    //                 } else if (isSeach) {
    //                     isSeach = false;
    //                     var pagination = new Virgo.pagination({
    //                         node: $(".list-area .page-area"),
    //                         isNeedInput: false,
    //                         callback: function (cur) {
    //                             getUserList(cur, isSeach);
    //                         }
    //                     });
    //                     pagination.trigger(1, total);
    //                 }
    //             } else {
    //                 $(".list-area .page-area").html('');
    //             }
    //             // if(total===1){
    //             //     $('.page-area').html('');
    //             // }
    //             $('tbody').empty();
    //             //填充基本信息
    //             var users = data.users;
    //             for (var i = 0; i < users.length; i++) {
    //                 var user = users[i];

    //                 var userTypeText = user.userType === 0 ? 'ADMIN' : (user.userType === 1 ? 'USER' : 'API_USER');
    //                 var statusClass = user.status === 0 ? 'use' : 'unuse'; //0启用
    //                 var statusText = user.status === 0 ? '启用' : '禁用';
    //                 var createdate = Util.formatTime(user.createdate, '<br />');
    //                 var lastupdate = Util.formatTime(user.lastupdate, '<br />');

    //                 var tr = $('<tr>' +
    //                     '    <td data-name="user-id" data-value="' + user.userid + '">' + user.userid + '</td>' +
    //                     '    <td data-name="username" data-value="' + user.username + '">' + user.username + '</td>' +
    //                     '    <td data-name="name" data-value="' + user.userfullname + '">' + user.userfullname + '</td>' +
    //                     '    <td data-name="email" data-value="' + user.useremail + '">' + user.useremail + '</td>' +
    //                     '    <td data-name="type" data-value="' + user.userType + '">' + userTypeText + '</td>' +
    //                     '    <td data-name="state" data-value="' + user.status + '" class="type ' + statusClass + '">' + statusText + '</td>' +
    //                     '    <td data-name="create-time" class="create-time">' + createdate + '</td>' +
    //                     '    <td data-name="update-time" class="update-time">' + lastupdate + '</td>' +
    //                     '    <td data-name="handlers" class="handlers">' +
    //                     '        <span>' +
    //                     '            <a href="javascript:;" class="edit-btn btn">' +
    //                     '                <span class="tip shadow short-tip">编辑</span>' +
    //                     '            </a>' +
    //                     '            <a href="javascript:;" class="certificates-btn btn">' +
    //                     '                <span class="tip shadow short-tip">凭证</span>' +
    //                     '            </a>' +
    //                     '        </span>' +
    //                     '    </td>' +
    //                     '</tr>');

    //                 $('tbody').append(tr);


    //             }

    //         }
    //     });
    // }

    //点击某个用户的编辑操作
    $("body").on('click', ".edit-btn", function () {
        editUser($(this));
    })

    //点击某个用户的凭证操作
    $('body').on('click', ".certificates-btn", function () {
        certificate($(this));

    })

    //点击新增
    $('.add-user-btn').click(function () {
        var $prompt = $('.edit-user-mask');
        if ($prompt) {
            $prompt.find('.title').html('新增用户');
            $prompt.removeClass('hidden');

            $prompt.find('.userName input').val('');
            $prompt.find('.userFullName input').val('');
            $prompt.find('.email input').val('');
            $prompt.find('.userType ul').find('li[data-value="0"]').click();
            $prompt.find('.status ul').find('li[data-value="0"]').click();
            userData.userId = '';
        }
    })

    //点击保存用户
    $('.edit-user-prompt .save-btn').click(function () {
        var $prompt = $('.edit-user-mask');
        userData.userName = $prompt.find('.userName input').val();
        userData.userFullName = $prompt.find('.userFullName input').val();
        userData.email = $prompt.find('.email input').val();
        userData.userType = $prompt.find('.userType input').val();
        userData.status = $prompt.find('.status input').val();
        // console.log(userData);
        Util.doAjax({
            url: '/api/admin/user/save',
            method: 'POST',
            data: userData,
            success: function (data) {
                // Util.prompt(data.message);
                $prompt.addClass('hidden');
                Util.prompt('修改成功！');
                $('#table').bootstrapTable('refresh');
                // var pageNum = parseInt($('.page-area a.on').attr('data-page')) || 1;
                // getUserList(pageNum, isSeach);
            }
        });
    })

    function certificate($this) {
        var $prompt = $('.certificate-manage-mask');
        if ($prompt) {
            $prompt.removeClass('hidden');
            userData.userId = $this.parent().parent().parent().find('td[data-name="user-id"]').eq(0).html();
            $prompt.find('span.username').html($this.parent().parent().parent().find('td[data-name="username"]').attr('data-value'));
            $prompt.find('.reset-btn').click(function () {
                var $prompt = $('.reset-passwrod-mask');
                $prompt.find('.new-passwrod input').val('');
                $prompt.find('.sure-passwrod input').val('');
                if ($prompt) {
                    $prompt.removeClass('hidden');
                }
            })
            $prompt.find('.add-btn').click(function () {
                var ip = $prompt.find('.ip-item input').val()
                Util.doAjax({
                    url: '/api/admin/user/add_cred',
                    method: 'POST',
                    data: {
                        uid: userData.userId,
                        ctype: 2,
                        ip: ip
                    },
                    success: function (data) {
                        $('.reset-passwrod-mask').addClass('hidden');
                        Util.prompt('修改成功！');
                    }
                });
            })
        }
    }

    //重置密码
    $('.reset-passwrod-mask').find('.save-btn').click(function () {
        var password = $('.reset-passwrod-mask').find('.new-passwrod input').val();
        var passwordConfirm = $('.reset-passwrod-mask').find('.sure-passwrod input').val();
        Util.doAjax({
            url: '/api/admin/user/reset_password',
            method: 'POST',
            data: {
                uid: userData.userId,
                password: password,
                passwordConfirm: passwordConfirm
            },
            success: function (data) {
                $('.reset-passwrod-mask').addClass('hidden');
                Util.prompt('修改成功！');
            }
        });
    })

    function editUser($this) {
        var $prompt = $('.edit-user-mask');
        if ($prompt) {
            $prompt.find('.title').html('编辑用户');
            $prompt.removeClass('hidden');
            userData.userId = $this.parent().parent().parent().find('td').eq(0).html();
            Util.doAjax({
                url: '/api/admin/user/edit',
                method: 'POST',
                data: {
                    userId: userData.userId
                },
                success: function (data) {
                    // console.log(data);
                    $prompt.find('.userName input').val(data.userName);
                    $prompt.find('.userFullName input').val(data.userFullName);
                    $prompt.find('.email input').val(data.email);
                    $prompt.find('.userType ul').find('li[data-value="' + data.userType + '"]').click();
                    $prompt.find('.status ul').find('li[data-value="' + data.status + '"]').click();
                }
            });
        }
    }

    $("#table").bootstrapTable({ // 对应table标签的id
        url: '/api/admin/users', //AJAX获取表格数据的url
        method: 'post',
        striped: true, //是否显示行间隔色(斑马线)
        pagination: true, //是否显示分页（*）
        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
        paginationLoop: false, //当前页是边界时是否可以继续按

        queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
            // console.log(params);
            return {
                pageSize: 10, // 每页要显示的数据条数
                pageNumber: params.offset / params.limit + 1, // 每页显示数据的开始行号
                //sort: params.sort, // 要排序的字段
                //sortOrder: params.order, // 排序规则
                //dataId: $("#dataId").val() // 额外添加的参数
                searchText: $('.form-control').val()
            }
        }, //传递参数（*）
        pageNumber: 1, //初始化加载第一页，默认第一页
        pageSize: 10, //每页的记录行数（*）
        // pageList: [10, 25, 50, 100, 'all'], //可供选择的每页的行数（*）
        contentType: "application/x-www-form-urlencoded", //一种编码。在post请求的时候需要用到。这里用的get请求，注释掉这句话也能拿到数据
        search: true, //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
        strictSearch: false, //是否全局匹配,false模糊匹配
        showColumns: true, //是否显示所有的列
        showRefresh: false, //是否显示刷新按钮
        minimumCountColumns: 2, //最少允许的列数
        clickToSelect: false, //是否启用点击选中行
        checkboxHeader: false,
        //height: 500, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
        //uniqueId: "id", //每一行的唯一标识，一般为主键列
        showToggle: false, //是否显示详细视图和列表视图的切换按钮
        showPaginationSwitch: false,
        onlyInfoPagination: false,
        paginationPreText: '<',
        paginationNextText: '>',
        cardView: false, //是否显示详细视图
        detailView: false, //是否显示父子表
        toolbar: '#toolbar',
        toolbarAlign: 'right',
        buttonsAlign: 'right',
        cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
        sortable: false, //是否启用排序
        responseHandler: function (data) { //如果后台返回的数据格式与bootstrapTable的数据格式不同在这里调整
            // console.log(data.data);
            return {
                "page": data.data.totalPages,
                "total": data.data.totalCount,
                "rows": data.data.users
            };
        },
        sortOrder: "asc", //排序方式
        sortName: 'userid', // 要排序的字段
        columns: [{
            field: 'userid', // 返回json数据中的name
            title: 'ID', // 表格表头显示文字
            align: 'center', // 左右居中
            valign: 'middle', // 上下居中
            sortable: true
        }, {
            field: 'username',
            title: '用户名',
            align: 'center',
            valign: 'middle'
        }, {
            field: 'userfullname',
            title: '姓名',
            align: 'center',
            valign: 'middle'
            // sortable: true
        }, {
            field: 'useremail',
            title: 'Email',
            align: 'center',
            valign: 'middle',
        }, {
            field: 'userType',
            title: '类型',
            align: 'center',
            valign: 'middle',
            formatter: function (value, row, index) {
                return value === 0 ? 'ADMIN' : (value === 1 ? 'USER' : 'API_USER');
            }
        }, {
            field: 'status',
            title: '状态',
            align: 'center',
            valign: 'middle',
            class: 'type',
            formatter: function (value, row, index) {
                return value === 0 ? '启用' : '禁用';
            },
            cellStyle: function (value, row, index) {
                if (value === 0) {
                    return {
                        css: {
                            'color': '#1fbc48;'
                        }
                    }
                } else {
                    return {
                        css: {
                            'color': '#ff4444'
                        }
                    }
                }
            }
        }, {
            field: 'createdate',
            title: '创建时间',
            align: 'center',
            valign: 'middle',
            formatter: function (value, row, index) {
                return Util.formatTime(value, '<br />');
            }
        }, {
            field: 'lastupdate',
            title: '更新时间',
            align: 'center',
            valign: 'middle',
            formatter: function (value, row, index) {
                return Util.formatTime(value, '<br />');
            }
        }, {
            field: 'userid',
            title: '操作',
            align: 'center',
            valign: 'middle',
            class: 'handlers',
            formatter: function (value, row, index) {
                return '        <span>' +
                    '            <a href="javascript:;" class="edit-btn btn">' +
                    '                <span class="tip shadow short-tip">编辑</span>' +
                    '            </a>' +
                    '            <a href="javascript:;" class="certificates-btn btn">' +
                    '                <span class="tip shadow short-tip">凭证</span>' +
                    '            </a>' +
                    '        </span>';
            }
        }],
        onColumnSwitch: function () {
            $('.pagination-detail').css('display', 'none');
        },
        onLoadSuccess: function () { //加载成功时执行
            console.info("加载成功");
            $('.pagination-detail').css('display', 'none');
            $('.btn-group ul').addClass('shadow');
            $('.btn-group.keep-open button span').html('维度');
            $('.btn-group.export button span').html('导出');
        },
        onLoadError: function () { //加载失败时执行
            console.info("加载数据失败");
        },

        //>>>>>>>>>>>>>>导出excel表格设置
        showExport: true, //是否显示导出按钮(此方法是自己写的目的是判断终端是电脑还是手机,电脑则返回true,手机返回falsee,手机不显示按钮)
        exportDataType: "basic", //basic', 'all', 'selected'.
        exportTypes: ['json', 'xml', 'csv', 'txt', 'sql', 'excel'], //导出类型
        //exportButton: $('#btn_export'), //为按钮btn_export 绑定导出事件 自定义导出按钮(可以不用)
        exportOptions: {
            //ignoreColumn: [0,0], //忽略某一列的索引
            fileName: 'tableExport', //文件名称设置
            worksheetName: 'Sheet1', //表格工作区名称
            tableName: 'tableExport',
            excelstyles: ['background-color', 'color', 'font-size', 'font-weight'],
            //onMsoNumberFormat: DoOnMsoNumberFormat
        }
        //导出excel表格设置<<<<<<<<<<<<<<<<
    });
});