js 常用脚本

1.判断电话号码和手机号码

var tel = $("#tel").val();
if (isNotBlank($.trim(tel))) {
//不为空的情况下判断符合手机号码标准
if (!(/^1(3|4|5|7|8)\d{9}$/.test(tel))) {
//不为空的情况下判断符合电话号码标准
if (!/^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/.test(tel)) {
$.DU_showDialogError('提示', '联系方式有误,请重填!');
return;
}
}
}
View Code

 

2.判断开始日期和结束日期大小

function checkEndTime(){  
        var startTime="1900-01-01 " + $("#begintime").val();  
        var start=new Date(startTime.replace("-", "/").replace("-", "/"));  
        var endTime="1900-01-01 " + $("#endtime").val();  
        var end=new Date(endTime.replace("-", "/").replace("-", "/"));  
        if(end<start){  
            return false;  
        }  
        return true;  
    }  
View Code

 

3. Ztree 组织树
<div style="height: 100%;">
<ul id="treeDemo" class="ztree" style="height: 100%;overflow-x:scroll; "></ul>
</div>
View Code

 

4.Ztree完整代码

//控制  新增节点按钮/编辑节点按钮/删除图片按钮 是否显示

//加权限之后是否显示

//新增 修改 删除方法 是否真正执行

//节点的单击事件 这个只是判断节点层级;

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>部门与职员</title> <#include "/common/headJs.html"/> <#include
"/common/footJs.html"/>
<style>
.sys-treepd .sys-treed {
    width: 100%;
    position: inherit;
}

.sys-tables {
    overflow: visible;
}

.dropdown-menu {
    min-width: 100px;
    max-width: 200px;
}

.col-xs-10 {
    padding-right: 0px;
}

.col-xs-2 {
    padding-right: 0px;
    padding-left: 0px;
}
</style>

</head>
<body>
    <div class="wrapper">
        <!-- Main -->
        <div class="sys-main">

            <!-- Main Nav -->
            <div class="sys-nav">
                <div class="minibtnd">
                    <a id="sys-navMiniBtn" href="javascript:;"><i
                        class="fa fa-bars"></i></a>
                </div>
                <ul class="nav navul" id="side-menu">

                </ul>
            </div>
            <script type="text/javascript">
                var currentURL = '';
            </script>
            <!-- ./Main Nav -->

            <!-- Main Block -->
            <div class="sys-block">
                <!--sys-toold-->
                <div class="sys-nav2">
                    <div class="posr">
                        <div class="titd">企业管理</div>
                        <ul id="side-menu2">

                        </ul>
                        <div class="minibtnd2">
                            <a href="javascript:;"><i class="fa fa-outdent"></i></a>
                        </div>
                    </div>
                </div>

                <!--sys-toold-->
                <div class="sys-toold">
                    <div class="sys-table-show">
                        <i class="fa fa-university fa-fw"></i>&nbsp;企业管理<span>/</span>部门与职员
                    </div>

                    <div class="rbtnd">
                        <div class="sys-btnd">
                            <@shiro.hasPermission name="system:staff:add">
                            <button type="button" class="btn btn-primary"
                                onClick="clickpeopleAddBtn();">
                                &nbsp;<i class="fa fa-plus"></i> 新增&nbsp;
                            </button>
                            </@shiro.hasPermission>
                            <@shiro.hasPermission name="system:staff:delete">
                            <button type="button" class="btn btn-danger"
                                onClick="delRecordTop();">
                                &nbsp;<i class="fa fa-trash-o"></i> 批量删除&nbsp;
                            </button>
                            </@shiro.hasPermission>
                        </div>
                    </div>
                </div>

                <!--./sys-toold-->

                <!-- Main Parent -->
                <div class="sys-parent">

                    <!-- Search Form  -->
                    <div class="sys-table-search">
                        <form class="form-inline" role="form" id="cardSearchForm"
                            name="cardSearchForm" onSubmit="return false;">
                            <div class="form-group" style="padding-right: 15px;">
                                <input id="hiddenText" type="text" style="display: none" />

                                <div class="input-group w300">
                                    <input type="text" class="form-control" id="keyword"
                                        name="keyword" placeholder="工号、姓名、手机号">
                                </div>
                            </div>

                            <button type="submit" class="btn btn-primary"
                                onClick="getTableData()">
                                <i class="fa fa-search"></i> 查询
                            </button>

                            <button type="reset" class="btn btn-default" onclick="Reset()">
                                <i class="fa fa-eraser"></i> 清除
                            </button>
                        </form>
                    </div>

                    <!--sys-treepd-->
                    <div class="sys-treepd">


                        <div class="row">
                            <div class="col-xs-2">
                                <div class="sys-treed" style="height: 700px;">
                                    <div style="height: 100%;">
                                        <ul id="treeDemo" class="ztree"
                                            style="height: 100%; width: 100%; overflow-x: scroll;"></ul>
                                    </div>
                                </div>
                            </div>

                            <div class="col-xs-10">
                                <!--sys-treercond-->
                                <div class="sys-treercond" style="padding-left: 0px !important;">

                                    <div class="sys-tables">
                                        <table class="table table-bordered table-hover">
                                            <thead>
                                                <tr class="bg">
                                                    <th width="6%"><label class="ckall"> <input
                                                            type="checkbox" id="ckCidAll" name="ckCidAll" value="1">
                                                            全选
                                                    </label></th>
                                                    <th width="5%">序号</th>
                                                    <th width="10%">工号</th>
                                                    <th width="10%">姓名</th>
                                                    <th width="15%">手机号码</th>
                                                    <th width="10%">职位</th>
                                                    <th width="20%">部门</th>
                                                    <th width="15%">操作</th>
                                                </tr>
                                            </thead>
                                            <tbody id="mytbody">

                                            </tbody>
                                        </table>
                                    </div>
                                    <!-- ./Table -->
                                    <div id="page" class="m-pagination"></div>

                                </div>
                            </div>
                        </div>
                        <!--./sys-treercond-->
                    </div>
                    <!--./sys-treepd-->

                </div>
                <!-- ./Main Parent -->
            </div>
            <!-- ./Main Block -->
        </div>
        
        <@shiro.hasPermission name="system:organization:add">
                            <button type="button" id="systemorganizationadd"
                            </button>
                            </@shiro.hasPermission>
                            <@shiro.hasPermission name="system:organization:update">
                            <button type="button" id="systemorganizationupdate"
                            </button>
                            </@shiro.hasPermission>
                            <@shiro.hasPermission name="system:organization:delete">
                                <button type="button" id="systemorganizationdelete"
                            </button>
                            </@shiro.hasPermission>
        <!-- ./Main -->
    </div>

    <SCRIPT type="text/javascript">
        var BigClassesARR = [];

        var setting = {
            view : {
                addHoverDom : addHoverDom,
                removeHoverDom : removeHoverDom,
                selectedMulti : false,
            },
            check : {
                enable : false
            },
            data : {
                simpleData : {
                    enable : true,
                    idKey : "id",
                    pIdKey : "pId",
                    rootPId : "0"
                }
            },
            edit : {
                enable : true,
                showRemoveBtn : setRemoveBtn,
                showRenameBtn : setRenameBtn,
                removeTitle: "删除",
                renameTitle: "编辑"
            },
            callback : {
                beforeClick : zTreeOnCheck,
                beforeEditName : beforeEditName,
                beforeRemove : beforeremove,
                onRemove : zTreeOnRemove
                
            }
        };

        //调用API接口
        function getTableData(pageNumber, pageSize, treeNode) {
            //清空原有数据
            $("#mytbody").html("");

            //获取文本框的值                 
            var querycdtn0 = "";
            if (isNotBlank($("#keyword").val())) {
                querycdtn0 += "keywords=" + encodeURI($("#keyword").val());
            }

            //组织机构节点
            if (isNotBlank(treeNode) && isNotBlank(treeNode.id)) {
                querycdtn0 += "organizationid=" + treeNode.id;
            }

            //调用API接口
            var apiurl = $.ServerURL.SiteDomain + $.ServerURL.SysStaffList;

            apiurl = Concat(apiurl, pageNumber, "pageNumber=" + pageNumber);
            apiurl = Concat(apiurl, pageSize, "pageSize=" + pageSize);
            apiurl = Concat(apiurl, querycdtn0, querycdtn0);

            $.ajax({
                url : apiurl, // url,
                type : "GET",
                dataType : "html",
                cache : false,
                async : false,//这里必须非异步,不然数据还没有请求到就执行下面的方法了
                success : function(data) {
                    if (data != null && data != undefined) {
                        $("#mytbody").append(data);
                        tableScrollUpdate();
                        ListCheckboxSelect("mytbody", true);
                    } else {
                        $.DU_showDialogError('提示', '获取职员信息出错!');
                        console.log(data);
                    }
                }

            })
            var _this = $("#mytbody > tr");
            $("#page").page({
                debug : true,
                showInfo : true,
                showJump : true,
                showPageSizes : true,
                totals : _this.data("total"),
                currentPages : _this.attr("data-pageNum"),
                pageSize : _this.attr("data-pageSize"),
                remote : {
                    url : '',
                    success : function(data) {
                    }
                }
            });
        }

        $("#page").on(
                "pageClicked",
                function(event, pageIndex) {
                    $("#eventLog").append(
                            'EventName = pageClicked , pageIndex = '
                                    + pageIndex + '<br />');
                    var pageSize = $("#mytbody > tr").attr("data-pageSize");
                    getTableData(Number(pageIndex) + 1, Number(pageSize));
                }).on(
                'jumpClicked',
                function(event, pageIndex) {
                    $("#eventLog").append(
                            'EventName = jumpClicked , pageIndex = '
                                    + pageIndex + '<br />');
                    var pageSize = $("#mytbody > tr").attr("data-pageSize");
                    getTableData(Number(pageIndex) + 1, Number(pageSize));
                }).on(
                'pageSizeChanged',
                function(event, pageSize) {
                    $("#eventLog").append(
                            'EventName = pageSizeChanged , pageSize = '
                                    + pageSize + '<br />');
                    getTableData(1, Number(pageSize));
                });

        // 弹出部门窗口
        function moveapartment(id) {
            $.jDialog({
                ___title : "部门列表",
                ___content : "iframe:${basepath}/system/staff/moveapartment/"
                        + id,

                /* ___content : "iframe:dialog_editdept.html?id=" + id, */
                ___width : "620",
                ___height : "560"
            });
        }

        //点击节点的时候触发查询事件 获取当前组织节点下的所有员工
        function zTreeOnCheck(treeId, treeNode) {
            getTableData(null, null, treeNode);
        }
        var newCount = 1;
        function addHoverDom(treeId, treeNode) {
            if($("#systemorganizationadd").length<=0)
                return ;
            
            var sObj = $("#" + treeNode.tId + "_span");
            if (treeNode.editNameFlag
                    || $("#addBtn_" + treeNode.tId).length > 0)
                return;
            var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
                    + "' title='添加' onfocus='this.blur();'></span>";
            sObj.after(addStr);
            var btn = $("#addBtn_" + treeNode.tId);
            if (btn)
                btn
                        .bind(
                                "click",
                                function() {
                                    $
                                            .jDialog({
                                                ___title : "新增部门",
                                                ___content : "iframe:${basepath}/system/organization/add"
                                                        + "?parentid="
                                                        + treeNode.id
                                                        + "&level="
                                                        + treeNode.level
                                                        + "&organizationtypeid="
                                                        + treeNode.type,

                                                /*     ___content : "iframe:organization_add.html?parentid="
                                                            + treeNode.id + "&level=" + treeNode.level
                                                            + "&organizationtypeid=" + treeNode.type, */
                                                ___width : "400",
                                                ___height : "440"
                                            });

                                });
        };
        function removeHoverDom(treeId, treeNode) {
            $("#addBtn_" + treeNode.tId).unbind().remove();
        };

        //设置所有的父节点不显示删除按钮
        function setRemoveBtn(treeId, treeNode) {
            
            if($("#systemorganizationdelete").length<=0)
                return false;
            if (treeNode.getParentNode() == null) {
                return false;
            }

            return !treeNode.isParent;
        }

        //设置根节点不显示 修改按钮
        function setRenameBtn(treeId, treeNode) {
            if($("#systemorganizationupdate").length<=0)
                return false;
            
            return !(treeNode.getParentNode() == null);
        }

        //调用组织机构删除方法
        function beforeremove(treeId, treeNode) {

            //根节点禁止删除
            if (treeNode.level == 0)
                return false;
            //return confirm("确认删除 节点 -- " + treeNode.name + " 吗?");
            $.DU_showDialogConfirm("提示", "确认删除" + treeNode.name + "吗?",
                    "dialogCallback('" + treeNode.realid + "')")

            return false;

        }
        function dialogCallback(realid) {
            var id = realid;
            var url = $.ServerURL.SiteDomain
                    + $.ServerURL.SysOrganizationDelete;
            url = url + "/" + id;
            $.ajax({
                url : url, // url,
                type : "GET",
                dataType : "json",
                cache : false,
                success : function(msg) {
                    if (msg == null || msg == undefined) {
                        $.DU_showDialogError("提示", "操作失败!");
                        return false;
                    } else if (msg.status == 0) {
                        getTreeData();
                        $.DU_showDialogSuccess('提示', "删除成功!");
                        return true;
                    } else {
                        $.DU_showDialogError("提示", msg.message);
                        return false;
                    }
                }
            });

        }

        function zTreeOnRemove(e, treeId, treeNode) {
            //var id = treeNode.realid;
            //delOrgExe(id);//调用删除具体执行方法...
        }

        //组织机构删除方法
        function delOrgExe(id) {
            var url = $.ServerURL.SiteDomain
                    + $.ServerURL.SysOrganizationDelete;
            url = url + "/" + id;
            $.ajax({
                url : url, // url,
                type : "GET",
                dataType : "json",
                cache : false,
                success : function(msg) {
                    if (msg == null || msg == undefined) {
                        $.DU_showDialogError("提示", "操作失败!");
                    } else if (msg.status == 0) {
                        getTreeData();
                        $.DU_showDialogSuccess('提示', "删除成功!");
                    } else {
                        $.DU_showDialogError("提示", msg.message);
                    }
                }
            });
        }

        //调用组织机构修改方法
        function beforeEditName(treeId, treeNode) {
            //根节点不允许修改
            if (treeNode.level == 0)
                return false;

            $.jDialog({
                ___title : "修改部门",

                ___content : "iframe:${basepath}/system/organization/update"
                        + "/" + treeNode.realid,

                ___width : "400",
                ___height : "440"
            });
        }
    </SCRIPT>
    <script type="text/javascript">
        /**页面加载执行**/
        $(function() {
            /*复选框全选方法*/
            $("#ckCidAll").click(function() {
                $.DU_checkedCheckbox("ckCidAll", "ckCid");
            });

            //jstree
            $('#sys-tree li').addClass("jstree-open");
            $('#sys-tree').jstree();

            /*header*/
            //ManagerUtil.headerInit(2);
            /*菜单实例化*/
            //ManagerUtil.menuInit("side-menu", "side-menu2", "brandsettings",
            //"clerkManagerment", menuData.company,
            //menuData.company[0].items);
            InitMenus("clerkManagerment");
            initPage();
            getTreeData();
            tableScroll(700);
            //获取查询条件
            //zTreeOnCheck();
        });

        /*点击新增职员按钮*/
        function clickpeopleAddBtn() {
            var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
            var nodes = treeObj.getSelectedNodes();
            if (nodes == null || nodes == undefined || nodes[0] == null
                    || nodes[0] == undefined) {
                $.DU_showDialogWarning('提示', '请先选择部门!');
                return;
            }

            $.jDialog({
                ___title : "新增员工",
                ___content : "iframe:${basepath}/system/staff/add"
                        + "?organizationid=" + nodes[0].id,
                ___width : "600",
                ___height : "450"
            });
        }

        /*编辑信息-顶部按钮*/
        function editRecordTop() {
            var checkedCid = $.DU_getCKCheckedValOne("ckCid");
            editRecord(checkedCid);
        }

        /*编辑职员信息-右侧操作按钮*/
        function editRecord(id) {

            var idStr = id.toString();
            if (idStr.length > 0) {
                $.jDialog({
                    ___title : "编辑职员信息",

                    ___content : "iframe:${basepath}/system/staff/update/"
                            + idStr,
                    ___width : "600",
                    ___height : "450"
                });
            } else {
                $.DU_showDialogWarning('提示', '请先选择要编辑的记录');
            }
        }

        /*删除职员记录-顶部按钮*/
        function delRecordTop() {
            var checkedCid = $.DU_getCKCheckedVals("ckCid");
            delRecord(checkedCid);
        }

        /*删除职员记录-右侧操作按钮*/
        function delRecord(id) {
            var idStr = id.toString();
            if (idStr.length > 0) {
                var infoContent = '您确定要删除记录吗?'; //提示框内容
                try {
                    dialog(
                            {
                                title : "确认提示",
                                content : '<div><p style="float:left;"><i class="fa fa-question-circle" style="font-size:50px;color:red;"></i></p><p style="float:left;line-height:30px;padding:10px 0 10px 10px;">'
                                        + infoContent + '</p></div>',
                                button : [ {
                                    value : '确认',
                                    autofocus : true,
                                    callback : function() {
                                        delRecordExe(id);//调用删除具体执行方法...
                                    }
                                }, {
                                    value : '取消',
                                } ]
                            }).showModal();
                } catch (e) {
                    if (confirm(infoContent)) {
                        delRecordExe(id);//调用删除具体执行方法...
                    }
                }
            } else {
                $.DU_showDialogWarning('提示', '请先选择要删除的记录');
            }
        }

        /*删除职员记录-具体执行方法*/
        function delRecordExe(id) {
            var url = $.ServerURL.SiteDomain + $.ServerURL.SysStaffDelete;
            url = url + "/" + id;
            $.ajax({
                url : url, // url,
                type : "GET",
                dataType : "json",
                cache : false,
                success : function(data) {
                    if (data == null || data == undefined) {
                        $.DU_showDialogError("确认提示", "操作失败!");
                    } else if (data.status == 0) {
                        //把选中的树节点传送过去
                        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                        var nodes = treeObj.getSelectedNodes();
                        if (nodes == null || nodes == undefined
                                || nodes[0] == null || nodes[0] == undefined) {
                            getTableData();
                        } else {
                            getTableData(null, null, nodes[0]);
                        }

                        $.DU_showDialogSuccess('提示', "删除成功!");
                    } else {

                        $.DU_showDialogError("确认提示", data.message);
                    }
                }
            });

        }

        /* 获取左侧组织机构数据 */
        function getTreeData() {
            $
                    .ajax({
                        url : $.ServerURL.SiteDomain
                                + $.ServerURL.SysOrganizationList, // url,
                        type : "GET",
                        dataType : "json",
                        cache : false,
                        success : function(data) {
                            if (data != null && data != null
                                    && data != undefined) {
                                //根节点
                                var zNodes = [];
                                BigClassesARR = [];
                                //第一级
                                var i = 1;
                                $
                                        .each(
                                                data,
                                                function(i, SysOrganization) {

                                                    BigClassesARR[SysOrganization.organizationid] = SysOrganization.organizationname;
                                                    //console.log(BigClassesARR[SysOrganization.organizationid]);
                                                    zNodes
                                                            .push({
                                                                id : SysOrganization.organizationid,
                                                                pId : SysOrganization.parentid,
                                                                 name : escape2Html(SysOrganization.organizationname), 
                                                                realid : SysOrganization.id,
                                                                type : SysOrganization.organizationtypeid,
                                                                open : true
                                                            });
                                                });

                                $.fn.zTree
                                        .init($("#treeDemo"), setting, zNodes);
                                getTableData();
                            } else {
                                $.DU_showDialogError("提示", "获取客户类别数据异常");
                            }
                        }
                    });
        }

        //清空查询条件并刷新
        function Reset() {
            $("#keyword").val("");
            getTableData();
        }
    </script>
</body>
</html>
View Code

 

5.弹出窗体设计1

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>弹出窗口 单位列表</title>
<!-- public css -->
<#include "/common/headJs.html">
<style type="text/css">
.input-group-addon {
    font-size: 12px;
}

.sys-tables {
    clear: both;
    height: 426px;
    margin-bottom: 10px;     
}

.sys-tables .table {
    margin-bottom: 0;
}

.sys-treepd .sys-treed {
    left: auto;
    right: 0;
    width: 400px;
    height: 100%;
}

.sys-treepd .sys-treercond {
    padding-left: 0;
}

.sys-form-colbtn {
    clear: both;
    padding-bottom: 20px;
    overflow: hidden;
    zoom: 1;
}

.sys-form-colbtn button {
    padding-left: 15px;
    padding-right: 15px;
}

.sys-form-colbtn .fr button {
    margin-left: 5px;
}

.sys-pag {
    font-size: 12px;
}

.sys-pag .leftlabel {
    padding-top: 6px;
}
</style>
</head>
<body class="sys-bg-white">
    <div class="wrapper_win">

        <!-- Search Form -->
        <div class="sys-table-search fs12">
            <form class="form-inline" role="form" id="cardSearchForm"
                name="cardSearchForm" onSubmit="return false;">
                <div class="form-group" style="margin-right: 10px;">
                    <div class="input-group w300">
                        <input type="text" class="form-control" id="validdate"
                            name="validdate" placeholder="计量编码、计量名称">
                    </div>
                </div>
                <button type="submit" class="btn btn-primary btn-sm"
                    onClick="getTableData()">
                    <i class="fa fa-search"></i> 查询
                </button>
            </form>
        </div>
        <!-- ./Search Form -->

        <!--sys-treepd-->
        <div class="sys-treepd">
            <div class="row">
                <div class="col-xs-9" style="width:100%" >
                    <div class="sys-treercond">
                        <!-- Table -->

                        <div class="sys-tables" style="width: 100%">
                            <table class="table table-bordered table-hover">
                                <thead>
                                    <tr class="bg">
                                        <th width="70"><label class="ckall"> <input
                                                type="checkbox" id="ckCidAll" name="ckCidAll" value="1">
                                                全选
                                        </label></th>                                 
                                        <th width="100">编码</th>
                                        <th width="150">名称</th>
                                          <th width="100">状态</th>                                 
                                    </tr>
                                </thead>
                                <tbody id="mytbody">

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div id="page" class="m-pagination"></div>
                </div>
            </div>
        </div>
        <!--./sys-treepd-->

        <div class="sys-form-colbtn">
            <div class="fr">
                <button type="button" class="btn btn-primary btn-sm" id="btnSub"
                    onClick="getIdAndName();">
                    <i class="fa fa-check"></i> 选中并关闭
                </button>
                <button type="button" class="btn btn-default btn-sm" id="btnCancel"
                    onClick="$.DU_closejDialog();">
                    <i class="fa fa-close"></i> 关闭
                </button>
            </div>
        </div>
        <!--./sys-form-colbtn-->

    </div>
    <!-- public js -->
    <#include "/common/footJs.html">
    <script type="text/javascript">
        $(function() {
            //多选变成单选
            $("input[type=checkbox]").click(function() {
                var flag = $(this).prop("checked"); //先记录下点击后应该的状态
                $("input[type=checkbox]").prop("checked", false);
                $(this).prop("checked", flag);
            });

            //复选/单选框样式加强
            $('#ckboxgroup').iCheck({
                checkboxClass : 'icheckbox_square-blue',
                radioClass : 'iradio_square-blue',
                increaseArea : '20%' // optional
            });
             
            getTableData();
            //固定首行  另外需要修改 .sys-tables  去掉auto属性
            tableScroll(426);
        });

        function getIdAndNameTwo(id, name) {
            if (isNotBlank(id) && id != '' && isNotBlank(name) && name != '') {
                console.log(id);
                console.log(name);
                parent.putUnitInfo(id, name);
                $.DU_closejDialog();
            } else {
                this.$.DU_showDialogWarning("提示", "请选择一个单位!");
            }
        }
        function dbClickEvent(){
            getIdAndNameTwo(_input.attr("s_value"),_input.attr("s_name"));
        }
         
        /*具体执行方法*/
        function getIdAndName() {
            var id;
            var name;
            $("input[name=ckCid]").each(function() {
                if ($(this).attr("checked")) {
                    id = $(this).attr('s_value');
                    name = $(this).attr('s_name');
                    return false;//跳出循环
                }
            });
            if (isNotBlank(id) && id != '' && isNotBlank(name) && name != '') {
                console.log(id);
                console.log(name);
                /*TODO  下面的函数是调用窗体需要完成的*/
                parent.putUnitInfo(id, name);
                $.DU_closejDialog();
            } else {             
                this.$.DU_showDialogWarning("提示", "请选择一个单位!");
            }
        }

        //调用API接口
        function getTableData(pageNumber, pageSize) {
            $("#mytbody").html("");

            //获取文本框的值                 
            var querycdtn0="";
            if(isNotBlank($("#validdate").val())) {
                querycdtn0 = "keyword=" +  encodeURI($("#validdate").val());
            }
            
            //调用API接口
            var apiurl = "${basepath}" + $.ServerURL.UnitListDialog;
            apiurl +="?state=1";
            
            if (isNotBlank(pageNumber)) {    
                if(apiurl.indexOf("?") < 0){    
                    apiurl += "?pageNumber=" + pageNumber;
                }
                else{
                    apiurl += "&pageNumber=" + pageNumber;
                }
            }
            
            if (isNotBlank(pageSize)) {
                if(apiurl.indexOf("?") < 0){                         
                        apiurl +="?pageSize=" + pageSize;     
                }
                else{
                        apiurl += "&pageSize=" + pageSize;     
                }
            }
            
            if (isNotBlank(querycdtn0)) {
                if(apiurl.indexOf("?") < 0){                     
                        apiurl += "?" + querycdtn0;                 
                }
                else{
                        apiurl += "&" + querycdtn0;
                }
            }
             
            $.ajax({
                url : apiurl, // url,
                type : "POST",                 
                dataType : "html",
                cache : false,
                async : false,
                success : function(data) {
                    $("#mytbody").append(data);
                    ListCheckboxSelect("mytbody",false);
                }
            });
            
            var _this = $("#mytbody > tr");
            $("#page").page({
                debug : true,
                showInfo : true,
                showJump : true,
                showPageSizes : true,
                totals : _this.data("total"),
                currentPages : _this.attr("data-pageNum"),
                pageSize : _this.attr("data-pageSize"),
                remote : {
                    url : '',
                    success : function(data) {
                    }
                }
            });
        }

        $("#page").on(
                "pageClicked",
                function(event, pageIndex) {
                    $("#eventLog").append(
                            'EventName = pageClicked , pageIndex = '
                                    + pageIndex + '<br />');
                    var pageSize = $("#mytbody > tr").attr("data-pageSize");
                    getTableData(Number(pageIndex) + 1, Number(pageSize));
                }).on(
                'jumpClicked',
                function(event, pageIndex) {
                    $("#eventLog").append(
                            'EventName = jumpClicked , pageIndex = '
                                    + pageIndex + '<br />');
                    var pageSize = $("#mytbody > tr").attr("data-pageSize");
                    getTableData(Number(pageIndex) + 1, Number(pageSize));
                }).on(
                'pageSizeChanged',
                function(event, pageSize) {
                    $("#eventLog").append(
                            'EventName = pageSizeChanged , pageSize = '
                                    + pageSize + '<br />');
                    getTableData(1, Number(pageSize));
                });
  
    </script>
</body>
</html>


//ajax
<!--单位列表-->
[#if page.list ?? && page.list?size>0]
    [#list page.list as info]
        <tr data-total='${page.total}' data-pageNum='${page.pageNum}' data-pageSize='${page.pageSize}'>          
            <td><input type="checkbox" id="ckCid" name="ckCid" s_value="${info.unitcode}" s_name='${info.unitname}'></td>             
            <td>${info.unitcode!}</td>
            <td>${info.unitname!}</td>        
         <td>[#if info.state == "0"]<span class="label label-default">禁用</span>[#else]<span class="label label-success">启用</span>[/#if]</td> 
        </tr>
    [/#list]
[#else]
  <tr data-total='${page.total}' data-pageNum='${page.pageNum}' data-pageSize='${page.pageSize}'>
    <td colspan="12">没有找到任何数据</td>
  </tr>
[/#if]
View Code

 

6.弹出窗体设计部门列表

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>弹出窗口 部门列表</title> <#include "/common/headJs.html">
<style type="text/css">
.input-group-addon {
    font-size: 12px;
}

.sys-tables {
    clear: both;
    height: 426px;
    margin-bottom: 10px;
}

.sys-tables .table {
    margin-bottom: 0;
}

.sys-treepd .sys-treed {
    left: auto;
    right: 0;
    width: 400px;
    height: 100%;
}

.sys-treepd .sys-treercond {
    padding-left: 0;
}

.sys-form-colbtn {
    clear: both;
    padding-bottom: 20px;
    overflow: hidden;
    zoom: 1;
}

.sys-form-colbtn button {
    padding-left: 15px;
    padding-right: 15px;
}

.sys-form-colbtn .fr button {
    margin-left: 5px;
}

.fr{
     padding:40px 0px 40px 0px;
}

.sys-pag {
    font-size: 12px;
}

.sys-pag .leftlabel {
    padding-top: 6px;
}
</style>
</head>
<body class="sys-bg-white">
    <div class="wrapper_win">

        <!-- Search Form -->
        <div class="sys-table-search fs12">
            <form class="form-inline" role="form" id="cardSearchForm"
                name="cardSearchForm" onSubmit="return false;">
                <div class="form-group" style="margin-right: 10px;">
                    <div class="input-group w300">
                        <input type="text" class="form-control" id="querytext"
                            name="querytext" placeholder="部门名称">
                    </div>
                </div>
                <button type="submit" class="btn btn-primary btn-sm"
                    onClick="getTreeData()">
                    <i class="fa fa-search"></i> 查询
                </button>
            </form>
        </div>
        <!-- ./Search Form -->

        <!-- Search Form -->
        <div class="sys-table-search fs12"></div>
        <!-- ./Search Form -->

        <div class="sys-treepd">
            <div style="height: 85%; width: 100%;border:1px solid #e7e7e7;">
                <ul id="treeDemo" class="ztree"
                    style="width: 100%; height: 387px; overflow-x: auto; overflow-y: auto;"></ul>
            </div>
        </div>

        <!-- <div class="sys-treed" style="height: 500px;">
            <div class="ztree-wrap">
                <ul id="treeDemo" class="ztree" style="width: 550px;"></ul>
            </div>
        </div> -->

        <div class="fr">
            <button type="button" class="btn btn-primary btn-sm" id="btnSub"
                onClick="getIdAndName();">
                <i class="fa fa-check"></i> 选中并关闭
            </button>
            <button type="button" class="btn btn-default btn-sm" id="btnCancel"
                onClick="$.DU_closejDialog();">
                <i class="fa fa-close"></i> 关闭
            </button>
        </div>
    </div>
    <!--./sys-form-colbtn-->
    <#include "/common/footJs.html">
    <script type="text/javascript">
        var setting = {
            view : {
                selectedMulti : false
            },
            check : {
                enable : true,
                chkboxType : {
                    "Y" : "",
                    "N" : ""
                },
                chkStyle : "radio",
                radioType: "all"
            /*     chkStyle: "checkbox" */
            },
            data : {
                simpleData : {
                    enable : true,
                    idKey : "id",
                    pIdKey : "pId",
                    rootPId : "0"
                }
            },
            edit : {
                enable : false
            },
            callback : {
                /* onCheck: zTreeOnCheck,*/
                onClick : zTreeOnCheck
            }
        };

        function zTreeOnCheck(event, treeId, treeNode) {
            var treeObj = $.fn.zTree.getZTreeObj("treeDemo");

            treeObj.checkNode(treeNode, !treeNode.checked, false);

            /* treeObj.updateNode(treeNode,"checkTrue"); */
            /* alert(treeNode.checked); */
            /* treeNode.checked = true;
            alert(treeNode.checked); */
        };

        /*function zTreeBeforeCheck(treeId, treeNode) {
            alert(111);
            return true;
        }; */

        /* function zTreeOnClick(event, treeId, treeNode) {
         
        }; */

        $(function() {
            //多选变成单选
            $("input[type=checkbox]").click(function() {
                var flag = $(this).prop("checked"); //先记录下点击后应该的状态
                $("input[type=checkbox]").prop("checked", false);
                $(this).prop("checked", flag);
            });

            //jstree
            $('#sys-tree li').addClass("jstree-open");
            $('#sys-tree').jstree();

            getTreeData();

        });

        /*具体执行方法*/
        function getIdAndName() {
            var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
            var nodes = treeObj.getCheckedNodes(true);

            //此弹出框供2种类型的地方调用
            if (!isNotBlank("${calltype!}") || "${calltype!}" != "move") {

                if (isNotBlank(nodes) && nodes[0].type == '2') {
                    //F7弹出框使用
                    var nodee = nodes[0].getParentNode();

                    while (isNotBlank(nodee) && nodee.type == '2') {
                        nodee = nodee.getParentNode();
                    }
                    console.log(nodes[0].id + nodes[0].name);
                    /*TODO 调用窗体需要完善下面的方法*/
                    parent.putDeptInfo(nodes[0].id, nodes[0].name, nodee.name,
                            nodes[0].realid);
                    $.DU_closejDialog();
                } else {
                    this.$.DU_showDialogWarning("提示", "请选择一个部门信息!");
                }
            } else {
                //移动部门使用
                if (isNotBlank(nodes)) {
                    //这里判断如果是移动职员,那么不限制type=='2'
                    var l_strjson = "id=" + "${id!}";
                    l_strjson += "&organizationid=" + nodes[0].id;
                    l_strjson += "&createuser=" + "#@";
                    console.log(l_strjson);

                    var url = $.ServerURL.SiteDomain
                            + $.ServerURL.SysStaffMovedept;

                    $.ajax({
                        url : url,
                        type : "POST",
                        dataType : "json",
                        cache : false,
                        data : l_strjson,
                        success : function(data) {
                            if (data == null || data != undefined) {
                                parent.$.DU_showDialogSuccessReload("提示",
                                        "操作成功!");
                                $.DU_closejDialog(); //关闭窗口                         
                            } else {
                                $.DU_showDialogError("确认提示", "操作失败!");
                                //取消按钮锁定
                                $("#btnSub").removeAttr("disabled");
                                $("#btnCancel").removeAttr("disabled");
                            }
                        }
                    });
                } else {
                    this.$.DU_showDialogWarning("提示", "请选择一个部门信息!");
                }

            }

        }

        /* 获取左侧组织机构数据 */
        function getTreeData() {
            console.log($.ServerURL.SysOrganizationList)
            var url = "${basepath}" + $.ServerURL.SysOrganizationList;

            //添加查询条件
            if (isNotBlank($("#querytext").val())) {
                url += "?keywords=" + encodeURI($("#querytext").val());
            }

            $.ajax({
                url : url, // url,
                type : "GET",
                dataType : "json",
                cache : false,
                success : function(data) {
                    if (data != null && data != null && data != undefined) {
                        //根节点
                        var zNodes = [];

                        //第一级
                        var i = 1;
                        $.each(data, function(i, SysOrganization) {
                            zNodes.push({
                                id : SysOrganization.organizationid,
                                pId : SysOrganization.parentid,
                                name : SysOrganization.organizationname,
                                realid : SysOrganization.id,
                                type : SysOrganization.organizationtypeid,
                                open : true

                            });
                        });

                        $.fn.zTree.init($("#treeDemo"), setting, zNodes);
                    } else {
                        $.DU_showDialogError("提示", "获取组织机构数据异常!");
                    }
                }
            });
        }
    </script>
</body>
</html>
View Code

 

7.全部替换  把引号转换为#号保存到mysql数据库中,需要的时候再替换过来

jsondata = jsondata.replace(/\"/g, "#");

 

 

posted @ 2017-01-19 11:49  maanshancss  阅读(335)  评论(0编辑  收藏  举报