html/js/system-inform.js

var pageNo = 1;
var totalPages = 0;

//单位列表
getSystemListDataAjax();

//获取单位列表 ajax请求
function getSystemListDataAjax(queryParam = {}, pageNo = 1) {

    queryParam.pageNo = pageNo;
    // queryParam.pageSize = 4;

    ajaxRequest(UNIT_LIST, "POST", queryParam, function(result) {

        let data = result.pageList;
        let items = '';
        data.forEach(function(item, key) {
            let perms = item.parm;
            let permSave = JSON.stringify(perms)
            delete(item.parm)
            var systemStatus = item.status == "1" ? '启动' : '未启动';
            items += "<tr>" +
                "<td class='status' data-system='" + JSON.stringify(item) + "' data-perm=" + permSave + " data-id=" + item.id + " ></td>" +
                "<td>" + item.systemName + "</td>" +
                "<td><i class='logo-img' style='background-image:url(" + item.systemLogo + ")'></i></td>" +
                "<td>" + item.fullName + "</td>" +
                "<td>" + item.forShort + "</td>" +
                "<td>" + item.url + "</td>" +
                "<td>" + systemStatus + "</td>" +
                "<td>" + item.creatMan + "</td>" +
                "<td>" + getFormatDate(item.creatTime) + "</td>" +
                // "<td>" + item.parm + "</td>" +
                "</tr>"
        })
        $('#systemList').html(items);

        totalPages = result.totalPages;
        $('#totalPage').html(totalPages); //总共多少页
        $('#dataTotal').html(result.totalCount); //总共多少条数据
        $('#currentPage').val(pageNo); //当前页面

        let pageFrom = (pageNo - 1) * result.pageSize + 1; //开始
        let pageTo = result.pageNo * result.pageSize; //结束

        pageTo = pageTo > result.totalCount ? result.totalCount : pageTo;

        $('#pageFrom').html(pageFrom);
        $('#pageTo').html(pageTo);

        // 无数据时
        if (!data.length) {
            $('.pager.has-data').hide()
            $('.pager.no-data').show()
        } else {
            $('.pager.has-data').show()
            $('.pager.no-data').hide()
        }

        if (pageNo < totalPages) {
            $('#nextPageButton,#lastPageButton').removeClass('disabled');
        } else {
            $('#nextPageButton,#lastPageButton').addClass('disabled');
        }
        if (pageNo === 1) {
            $('#firstPageButton,#prevPageButton').addClass('disabled');
        } else {
            $('#firstPageButton,#prevPageButton').removeClass('disabled');
        }

    }, function(errorMsg) {
        alert("请求数据失败!");
    })

}

//分页操作
$('#firstPageButton').on('click', function() {
    pageNo = 1;
    getSystemListDataAjax(getSearchParamObj(), 1);
})

$('#lastPageButton').on('click', function() {

    pageNo = totalPages;
    getSystemListDataAjax(getSearchParamObj(), pageNo);
})

$('#prevPageButton').on('click', function() {
    pageNo -= 1;
    getSystemListDataAjax(getSearchParamObj(), pageNo);
})

$('#nextPageButton').on('click', function() {
    pageNo += 1;
    getSystemListDataAjax(getSearchParamObj(), pageNo);
})


//拼接搜索条件
function getSearchParamObj() {
    let queryParam = {};
    return queryParam;
}

/*新增 修改 关闭 弹框*/
var layer = layui.layer;
var layerCreateIndex = '';
var layerUpdateIndex = ''
layui.use('layer', function() {
    var layer = layui.layer;

    //新增弹框
    $('.add').click(function() {
            layerCreateIndex = layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                shadeClose: true,
                skin: 'yourclass',
                area: ['400px', '300px'],
                content: $(".addUnitOut"),
                success: function() {
                    $('.clsBtn,.cancel').click(function() {
                        layer.close(layerCreateIndex);
                    })
                }
            })
        })
        //修改弹框信息
    $('.edit').click(function() {
        if (!$('.pure-table tr').has('.checked').length) {
            layer.msg('请选择一条需要修改的信息!', { icon: 5 });

        } else {
            let dataId = $('.pure-table tr').find('.checked').data('id');
            let systemInfo = $('.pure-table tr').find('.checked').data('system');
            let perm = $('.pure-table tr').find('.checked').data('perm');
            $('.editSystemOut input[name=systemName]').val(systemInfo.systemName)
            $('.editSystemOut input[name=fullName]').val(systemInfo.fullName)
            $('.editSystemOut input[name=forShort').val(systemInfo.forShort)
            $('.editSystemOut input[name=url').val(systemInfo.url)
            $('.editSystemOut input[name=parm').val(perm)

            $('.editSystemOut input[name=id]').val(systemInfo.id)
            $('.editSystemOut input[name=creatMan').val(systemInfo.creatMan)
            $('.editSystemOut select[name=status').val(systemInfo.status)

            if (systemInfo.systemLogo) {
                $('#systemLogoShow').attr('src', systemInfo.systemLogo)
                $('#systemLogoShow').css('display', 'block')
            }

            layerUpdateIndex = layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                shadeClose: true,
                skin: 'yourclass',
                area: ['410px', '420px'],
                content: $(".editSystemOut"),
                success: function() {
                    $('.clsBtn,.cancel').click(function() {
                        layer.close(layerUpdateIndex);
                    })
                }
            });

            $('#editystemFormBox input[name=systemLogoFile]').off('change').on('change', function() {

                // 先获取用户上传的文件对象
                let fileObj = this.files[0];
                // 生成一个文件读取的内置对象
                let fileReader = new FileReader();
                // 将文件对象传递给内置对象
                fileReader.readAsDataURL(fileObj); //这是一个异步执行的过程，所以需要onload回调函数执行读取数据后的操作
                // 将读取出文件对象替换到img标签
                fileReader.onload = function() { // 等待文件阅读器读取完毕再渲染图片
                    $('#systemLogoShow').attr('src', fileReader.result)
                    $('#systemLogoShow').css('display', 'block')
                }
                uploadImg('systemLogoEdit', function(result) {
                    result = JSON.parse(result);
                    if (!result.flag) {
                        alert('上传图片失败')
                        return;
                    }
                    $('#editystemFormBox input[name=systemLogo]').val(result.data)
                });
            });
        }
    })

    //删除信息
    $('.delete').click(function() {
        if (!$('.pure-table tr').has('.checked').length) {
            layer.msg('请选择一条需要删除的信息!', { icon: 5 });
        } else {
            let dataId = $('.pure-table tr').find('.checked').data('id');
            ajaxRequest(SYSTEM_DELETE, "POST", { "id": dataId }, function(result) {
                $(".pure-table tbody tr.selected").remove()
                layer.close(layer.layerCreateIndex);
                layer.msg('删除成功!', { icon: 6 });
                getSystemListDataAjax()
            }, function(errorMsg) {
                alert("用户删除失败!");
            })



        }
    })
});


/* 新增发送请求 */
$('#addSystem').click(function() {

    //获取表单的值 并转换成对象
    let allParam = serializeArrayToObj($("#addSystemFormBox").serializeArray());

    //验证数据是否为空
    let res = validParamIsEmpty(allParam, {
        "systemName": "请填写系统名称",
        "fullName": "请填写系统全称",
        "forShort": "请填写系统简称",
        "url": "请填写官网地址",
        "parm": "请填写参数",
    });

    if (res.code == -1) {
        alert(res.msg);
        return;
    }

    //验证文件

    // 判断文件是否为空 
    var file = $("input[name='systemLogo']").val(); //用户文件内容(文件)
    if (file == "") {
        alert("请选择上传的目标文件! ")
        return false;
    }

    //判断文件类型
    var fileExtension = file.substring(file.lastIndexOf(".") + 1).toLowerCase();

    let allowExtension = ['jpg', 'jpeg', 'png', 'gif'];
    if (allowExtension.indexOf(fileExtension.toLowerCase()) < 0) {
        alert("请选择图片文件!");
        return false;
    }

    //上传文件
    uploadImg('systemLogoAdd', function(data) {

        data = JSON.parse(data); //aa json字符串转对象

        //console.log(data.flag + 'flag')
        if (data.flag) {
            //将返回的路径 拼接到提交的数据对象里
            allParam['systemLogo'] = data.data;

            ajaxRequest(SYSTEM_ADD, "POST", allParam, function(result) {

                let data = result.data;
                layer.close(layer.index);
                layer.msg('添加成功!', { icon: 6 });
                getSystemListDataAjax();

            }, function(errorMsg) {
                alert("系统信息添加失败!");
            })


        } else {
            //这里应该弹出删除失败的 后台返回的原因
            alert('上传图片失败');
            return;
        }
    });

    // document.getElementById("addSystemFormBox").reset();
    $('#addSystemFormBox')[0].reset();
})

/* 修改发送请求 */
$('#dataUpdate').click(function() {
    //获取表单的值 并转换成对象
    let allParam = serializeArrayToObj($("#editystemFormBox").serializeArray());

    //验证数据是否为空
    let res = validParamIsEmpty(allParam, {
        "systemName": "请填写系统名称",
        "fullName": "请填写系统全称",
        "forShort": "请填写系统简称",
        "url": "请填写官网地址",
        "parm": "请填写参数",
    });

    if (res.code == -1) {
        alert(res.msg);
        return;
    }

    //验证文件
    // 判断文件是否为空 
    if ($("input[name='systemLogoFile']").val()) {
        var file = $("input[name='systemLogoFile']").val(); //用户文件内容(文件)
        //判断文件类型
        var fileExtension = file.substring(file.lastIndexOf(".") + 1).toLowerCase();

        let allowExtension = ['jpg', 'jpeg', 'png', 'gif'];
        if (allowExtension.indexOf(fileExtension.toLowerCase()) < 0) {
            alert("请选择图片文件!");
            return false;
        }
    }

    ajaxRequest(SYSTEM_UPDATE, "POST", allParam, function(result) {
        if (result.flag) {
            layer.close(layerUpdateIndex);
            layer.msg('修改成功!', { icon: 6 });
            getSystemListDataAjax();
            //将返回的路径 拼接到提交的数据对象里
            // layer.close(layer.index);
        } else {
            //这里应该弹出删除失败的 后台返回的原因
            alert("系统信息添加失败!");
            alert(result.msg);
            return;
        }
    }, function(errorMsg) {
        alert("系统错误!");
        return;
    })
})