Yezb
/
ss_new_ui_skin_and_page


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514
							<!DOCTYPE html>
<html>

<head>

    <style>
        #savemb {
            display: none;
        }

        #delmb {
            display: none;
        }
    </style>
</head>

<body>
    <form name="ddpOptionForm" action="<serv.ss dest='menuDefOptList'/>" method="post"> <!-- "cdOptionForm"。Lin -->
        <input type="hidden" name="cdOptionHtml" value="" id="cdOptionHtml" />
        <!-- <input type='submit' id="cx" value="查询" class="content-invertButton" /> -->
    </form>
    <form name="shortcutForm" action='' method="post">

        <input name="bjid" type="hidden" value="${bjid}" />
        <div class="search-div">
            <div style="padding: 15px 25px 12px 25px;">
                <input type='button' value="增加菜单组" onclick="addGroup();" class="content-button" />
                <!-- 业务分类 <select id="yy" name="yy" onchange="">
                <option value="-1">请选择</option>
            </select> -->

                &nbsp;
                <%--<select id="cdmbselected" class="sel"  onchange="selectMB(this.options[this.options.selectedIndex].value);"  style="float: right;">
                <option value="0">空白模板</option>
                <wd:option name="grcdmb"  />
            </select>--%>

                    <input type='button' id="savemb" value="保存当前模板" class="content-button" />
                    <input type='button' id="delmb" value="删除该模板" class="content-button" />
                    <input type='button' id="addmb" value="另存为新模板" class="content-button" />
                    <input name="grcdmbid" id="grcdmbid" type="hidden" class="sel" onchange="selectMB(this.value)"/>
                    <input name="grcdmbName" type="text" style="width: 140px;" />
                    <objp.ss name="grcdmb" cb="grcdmb" inp="true" /> <%-- 原 cb="grcdmb_all"，去掉 根模板 了。Lin --%>
            </div>
        </div>
        <div id="container" class="dragList-div">
            <div class="box">
                <p class="label">已选<span id="ddpDropAll" class="icon-allRight"></span></p> <!-- "cdDropAll"。Lin -->
                <div class="list-body" style="position: relative;overflow-x: hidden;width: 100%;height: 380px;">
                    <div id="ddpSelected" ssSelClazz="list-checkedIcon" class="scrollbar" style="height:100%"> <!-- "cdSelected"。Lin -->
                    </div>
                </div>
            </div>
            <div class="box">
                <p class="label">备选<span id="ddpPickAll" class="icon-allLeft"></span></p> <!-- "cdPickAll"。Lin -->
                <div class="list-body" style="position: relative;overflow-x: hidden;width: 100%;height: 380px;">
                    <div id="ddpOption" ssSelClazz="list-checkedIcon" class="scrollbar" style="height:100%"> <!-- "cdOption"。Lin -->
                    </div>
                </div>
            </div>
            <input type="hidden" value="" name="ddpSelectedId" /> <%-- name="cdSelectedId"。再改为统一的名字 -- 同一页面，不会有多个拖放选择。Lin --%>


        </div>
    </form>
    <!-- <div class='bottom-div'>
    <input type="button" name="button" onclick="wd.display.closeDialog();" value="取消" class="bottom-button" />
</div> -->
</body>

<%-- 去掉，母体也没找到。Lin
<script type="text/javascript" src="ajaxFunc.js"></script>
--%>
<script type="text/javascript">
    wd.edit.objectPicker.getInstance("grcdmb").onchange = function () {
        console.log($("#grcdmbid").val());
        selectMB($("#grcdmbid").val());
    }
    //从请求中获得
    var oridata = '${mbdata}';
    var mbdata = (oridata == '' ? '' : JSON.parse(oridata));
    var bjid = "${bjid}";
    var menuRootGroupId = "${menuRootGroupId}";

    var parent1 = window.parent;
    //从上个页面（菜单页面），获取到需要的数据
    /**
     * menuTree节点内数据的含义
     * [0]--lmid（两种情况，1.数字，2.英文缩写）
     * [1]--name，名字代号
     * [2]--上级id
     * [3]--跳转页
     */
    var personaldata = "${personalTree}";
    var personalTree = (personaldata == '' ? '' : eval(personaldata));
    //这是所有的菜单选项（人员、校务那些），是个二维数组
    //for(var i = 0; i < 10 && parent.personalTree == undefined; i++)
    //    parent = parent.parent
    //if(parent.personalTree != undefined)
    //    personalTree = parent.personalTree;
    /**
     * 自定义菜单
     * 1--shortcutMenuInfo(各个自定义id(不清楚来源)，menuRoot)
     * 2--groupId(上级id)；member（子栏目成员）;name（名字代号）
     * 3，member--groupId（上级id）;memberId（自身id为#序号#lmid）;name（名字代号）;url（跳转页）
     *
     * example:shortcutMenuInfo[440112878].members["#0#44014346"].name
     */
    var shortcutStartInfo;//这是快捷组的数据，也就是最顶上那一排，这是个三层键值对？
    for (var i = 0; i < 10 && parent1.shortcutStartInfo == undefined; i++)
        parent2 = parent1.parent
    if (parent2.shortcutStartInfo != undefined)
        shortcutStartInfo = parent2.shortcutStartInfo;

    //自定义栏目的子栏目的根id
    var shortcutGroup = [];
    var personalRootSize = 0;//见名知意
    var selectedMenuMenber = [];
    function isNumber(o) {
        var reg = /^[0-9]*$/;
        if (!reg.test(o)) {
            return false;
        }
        return true;
    }
    function isLeft(shortcutStartInfo) {
        for (var item in shortcutStartInfo) {
            if (isNumber(item)) {
                for (var item2 in shortcutStartInfo[item].members) {
                    if (shortcutStartInfo[item].members[item2].memberId) {
                        var arr = shortcutStartInfo[item].members[item2].memberId.split('#');
                        selectedMenuMenber.push(arr[arr.length - 1]);
                    }
                }
            } else {
                for (var item2 in shortcutStartInfo[item].members) {
                    if (!isNumber(shortcutStartInfo[item].members[item2].memberId)) {
                        selectedMenuMenber.push(shortcutStartInfo[item].members[item2].memberId);
                    }
                }
            }
        }
    }

    function load() {
        //初始化右边应用的下拉框select
        // $.each(menuTree,function(i){//遍历整个菜单二维数组，拿出里面的每个数组
        //     var menu1 = menuTree[i];
        //     //每个一维数组的四个数据依次是：id，名字，上级菜单id，url
        //     if (menu1[2] == "env" && menu1[3] == "null") {//当上级id为env时，那么这就是个根菜单（人员、校务这些），把它放到下拉框中
        //         $('#yy').append("<option value='" + menu1[0]+"'>"+menu1[1]+"</option>");
        //     }
        // });

        //初始化左边的选项和下拉框
        //初始化要将子栏目下的栏目页放进去
        var menuRoot;

        //给右边下拉框绑定事件，用来在右边显示选中的子项
        // $('#yy').change(function(){
        //     console.log(menuTree);
        //     //alert($(this).val());
        //     selectByParentId($(this).val());
        // });

        for (var groupId in shortcutStartInfo) {     //在addOption前先得出组菜单id数组，做样式区分时用到
            if ("menuRoot" != groupId) {
                shortcutGroup.push(groupId);    //纪录快捷组id,在后台使用
            }
        }
    };
    load();
    $(function () { selectByParentId(); })
    /**
     * 根据父id查询出对应的子对象
     * @param  {[type]} id [description]
     * @return {[type]}    [description]
     */
    function selectByParentId() {
        //用来加载出右边拖拽框的所有选项
        var cdOptionHtml = "";
        $.each(personalTree, function (i) { //遍历整个菜单二维数组，拿出里面的每个数组
            var menu = personalTree[i];
            if (selectedMenuMenber.indexOf(menu[0]) == -1&&menu[0].indexOf("plugin_")==-1) {


                // if (menu[2] != ""&&menu[2] != "env") {//当上级id 等于传进来的id（也就是右边下拉框此时选中的值）时，那么加把此项放到右边的拖拽框
                var parentDiv = "<div class='list-background list' style='min-height: 41px;line-height: 41px;width: calc(100% - 4px);box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;' ssObjId='" + menu[0] + "' memberid='" + menu[0] + "' name='" + menu[1] + "' groupId='" + menu[2] + "' url='" + menu[3] + "'><span>" + menu[1] + "</ span ></div>";
                var parentId = menu[0];
                $.each(personalTree, function (j) {//由于存在两级，所以再次遍历，把第二级放进自己的父级中
                    var menu2 = personalTree[j];
                    if (menu2[2] == menu[0]&&menu2[0].indexOf("plugin_")==-1) { //上级id等于第一级的id时
                        parentDiv += '<div class="list-background list" style="min-height: 41px;line-height: 41px;width: calc(100% - 4px);box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" ssObjId="' + menu2[0] + '" ssPobjId="' + parentId + '" memberid="' + menu2[0] + '"name="' + menu2[1] + '" groupId="' + menu2[2] + '" url="' + menu[3] + '" ><span>' + menu2[1] + '</ span ></div>';
                    }
                });
                cdOptionHtml += parentDiv;
                // }
            }
        });
        cdOptionHtml = cdOptionHtml.replace(/&/g, '%26');
        // $("#cdOption").html(cdOptionHtml);//把整个div放进拖拽框           
        $("#cdOptionHtml").val(cdOptionHtml);//把整个div放进拖拽框
        $('form[name="ddpOptionForm"]')[0].submit();	// "cdOptionForm"。Lin
    };

    /**
     * 创建一个新的快捷组，也就是顶上一排那种有第二层的东西
     */
    function addGroup() {
        //全都是快捷组这东西惹的祸   因为它既是shortcutMenuInfo中menuRoot的成员，也是shortcutMenuInfo的成员
        //var groupSel = document.getElementById('cdwz');
        var groupDivs = $('#ddpSelected').children();	// '#cdSelected'。Lin

        //下面这段都是用来判断为空或者重复
        var newname = prompt("新菜单名称", "未定义");
        if ('' == newname || null == newname) {
            alert('名称不能为空!!\n');
            return false;
        }

        var hasGroupName = false;
        /*for(var i=0;i<groupSel.options.length;i++){
         if(newname==groupSel.options[i].text){
         hasGroupName = true;
         break;
         }
         }*/
        $.each(groupDivs, function (i) {
            var name = $(groupDivs[i]).attr('name');
            if (newname == name) {
                hasGroupName = true;
                return true;
            }
        });
        if (hasGroupName) {
            alert('菜单名称' + newname + '已存在');
            return false;
        }

        //用当前系统的毫秒值作为groupId
        var groupId = new Date().getTime() + '';
        //console.info("测试组id: "+groupId);
        //shortcutMenuInfo中新建一个键值对，键为groupId
        shortcutStartInfo[groupId] = {
            'groupId': groupId,
            'name': newname,//输入的名字
            'members': {} //成员为空
        }

        shortcutGroup.push(groupId);
        DM.addItem(groupId, '<div class="list-background list" style="min-height: 41px;line-height: 41px;width: calc(100% - 4px);box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" ssObjId="' + groupId + '" memberid="' + groupId + '" name="' + newname + '" groupId="menuRoot" url="null" ><span >' + newname + '</span></div>', null, true);

    }


    /**
     * 保存准备方法，将新增的数据封装好
     * @return {[type]} [description]
     */
    function beforeSubmit() {

        //有shortcutGroup就行了
        //直接用左div的元素来做个shortcutmenuinfo！！！


        var dragList = $('#ddpSelected');	// '#cdSelected'。Lin
        //下级div
        var groupDivs = dragList.children();
        console.log(groupDivs.size());
        var personalRootMembers = {};

        /**
         * 初始化菜单根部menuRoot
         */
        var menuRoot = {};
        //copy
        $.extend(menuRoot, shortcutStartInfo['menuRoot']);
        personalRootMembers['menuRoot'] = menuRoot;
        menuRoot['members'] = {};

        $.each(groupDivs, function (i) {

            //或条件
            //改为li
            if (shortcutGroup.indexOf($(groupDivs[i]).attr('memberid')) != -1 || $(groupDivs[i]).find('div div[ssObjId]').size() != 0) {
                var personalRootMember = {};
                var members = {};
                personalRootMember['groupId'] = $(groupDivs[i]).attr('memberid');
                personalRootMember['name'] = $(groupDivs[i]).attr('name');

                if ($(groupDivs[i]).find('div div[ssObjId]').size() != 0) {
                    //下级div的再下级
                    var childDivs = $(groupDivs[i]).find('div div[ssObjId]');

                    $.each(childDivs, function (j) {
                        var member = {};
                        member['groupId'] = $(childDivs[j]).attr('groupid');
                        member['memberId'] = $(childDivs[j]).attr('memberid');
                        member['name'] = $(childDivs[j]).attr('name');
                        member['url'] = $(childDivs[j]).attr('url');

                        members['#' + j + '#' + $(childDivs[j]).attr('memberid')] = member;
                    });
                }

                personalRootMember['members'] = members;

                personalRootMembers[$(groupDivs[i]).attr('memberid')] = personalRootMember;

            }

            /**
             * menuRoot 添加member
             * 如果$(groupDivs[i])有子节点，默认groupId 为 menuRoot url为null 且插入 shortcutGroup 的一条id
             */
            var member = {};

            member['memberId'] = $(groupDivs[i]).attr('memberId');
            member['name'] = $(groupDivs[i]).attr('name');
            if ($(groupDivs[i]).find('div div[ssObjId]').size() != 0) {
                member['groupId'] = "menuRoot";
                member['url'] = "null";
                shortcutGroup.push($(groupDivs[i]).attr('memberId'));
            } else {
                member['groupId'] = $(groupDivs[i]).attr('groupId');
                member['url'] = $(groupDivs[i]).attr('url');
            }

            menuRoot['members']['#' + i + '#' + $(groupDivs[i]).attr('memberId')] = member;
        });

        shortcutStartInfo = {};
        shortcutStartInfo = personalRootMembers;
    }

    /**
     * 选择模板触发方法
     * @param  {[type]} value [description]
     * @return {[type]}       [description]
     */
    function selectMB(value) {
        //拿到 mbdata
        if (value == "0") {
            value = "null";
        }
        shortcutStartInfo = (mbdata[value] == undefined) ? {} : mbdata[value];

        //清空左边菜单组元素
        $("#ddpSelected").empty();	// "#cdSelected"。Lin

        if (value != '0') {
            //生成左边菜单组
            selectedMenuMenber.splice(0, selectedMenuMenber.length);
            isLeft(shortcutStartInfo);
            initShortCutMenu(shortcutStartInfo);

            $('#delmb').css('display', 'inline');
            $('#savemb').css('display', 'inline');
        } else {
            $('#delmb').css('display', 'none');
            $('#savemb').css('display', 'none');
        }
    }

    /**
     * 设值到表单中
     * @param  {[type]} _form [description]
     * @param  {[type]} name  [description]
     * @param  {[type]} value [description]
     * @return {[type]}       [description]
     */
    function generateHiddenForm(_form, name, value) {
        var hiddenInput = document.createElement('input');
        hiddenInput.type = 'hidden';
        hiddenInput.name = name;
        hiddenInput.value = value;
        _form.appendChild(hiddenInput);
    }

    /**
     * 生成菜单显示数据
     * @param  {[type]} shortcutMenuInfo [description]
     * @return {[type]}                  [description]
     */
    function initShortCutMenu(shortcutStartInfo) {

        var menuRoot;
        if (typeof (shortcutStartInfo.menuRoot) == 'undefined')
            menuRoot = [];
        else
            menuRoot = shortcutStartInfo.menuRoot.members;
        DM.getDrager().selectedList.empty();
        $.each(menuRoot, function (i) {
            //menuRootSize++；
            var personalRootMember = menuRoot[i];

            //
            var isItem = false;
            if (personalRootMember.url != "null") {
                isItem = true;
            } else {
                if (shortcutStartInfo[personalRootMember.memberId] != undefined) {
                    var j = 0;
                    $.each(shortcutStartInfo[personalRootMember.memberId].members, function (i) {
                        j++;
                    });
                    if (j > 0) {
                        isItem = true;
                    }
                }
            }

            if (isItem) {
                var ele = $('<div class="list-background list" style="min-height: 41px;line-height: 41px;width: calc(100% - 4px);box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" ssObjId="' + personalRootMember.memberId + '" memberid="' + personalRootMember.memberId
                    + '"  name="' + personalRootMember.name + '" groupId="' + personalRootMember.groupId
                    + '" url="' + personalRootMember.url + '" class="item dragList"><span>' + personalRootMember.name + '</ span ></div>');
                DM.getDrager().selectedList.append(ele[0]);
                var parentId = personalRootMember.memberId;
                //放入子栏目,子栏目不为dragList
                if (shortcutStartInfo[personalRootMember.memberId] != null) {
                    $.each(shortcutStartInfo[personalRootMember.memberId].members, function (j) {
                        var member = shortcutStartInfo[personalRootMember.memberId].members[j];
                        var cele = $('<div class="list-background list" style="min-height: 41px;line-height: 41px;width: calc(100% - 4px);box-sizing: border-box;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;" ssObjId="' + j.split("#")[2] + '" ssPobjId="' + parentId
                            + '" memberid="' + j.split("#")[2] + '" name="' + member.name + '" groupId="' + member.groupId
                            + '" url="' + member.url + '" ><span>' + member.name + '</ span ></div>');
                        DM.getDrager().selectedList.append(cele[0]);
                    });
                }
            }
        });
        DM.getDrager().selectedList.reload();
        selectByParentId();
    }

    /**
     * 删除菜单组模板
     * @param  {[type]} ){  } [description]
     * @return {[type]}        [description]
     */
    $('#delmb').click(function () {
        var mbid = $('#grcdmbid').val();

        var json = JSON.parse('{"mbid":"' + mbid + '"}');
        var url = "<serv.ss name='initMenuDef' dest='menuDefSaveOk' parm='{del:"ssVal{mbid}",mblx:5}'/>";
        url = wd.display.replaceDynamicParam(url, json);

        $('form[name="shortcutForm"]').attr('action', url);
        $('form[name="shortcutForm"]').submit();

    });

    /**
     * 保存菜单组模板
     * @param  {[type]} ){  } [description]
     * @return {[type]}        [description]
     */
    $('#savemb').click(function () {
        //封装
        beforeSubmit();

        var _form = document.forms['shortcutForm'];
        var cdmbid = $('#cdmbselected').val();
        var shortcutInfoStr = JSON.stringify(shortcutStartInfo);
        var shortcutGroupStr = JSON.stringify(shortcutGroup);

        generateHiddenForm(_form, 'grcdmbid', cdmbid);
        generateHiddenForm(_form, 'shortcutGroup', shortcutGroupStr);
        generateHiddenForm(_form, 'shortcutMenuInfo', shortcutInfoStr);
        generateHiddenForm(_form, 'cdz', '5');

        $('form[name="shortcutForm"]').attr('action', "<serv.ss name='saveMenuDef' dest='menuDefSaveOk' parm='{mblx:5}'/>");
        $('form[name="shortcutForm"]').submit();
    });

    /**
     * 新增菜单组模板
     * @param  {[type]} ){  } [description]
     * @return {[type]}        [description]
     */
    var addcallback = (function (t) {
        var THIS = t;
        return function (data) {
            if (data.newMc != null && data.newMc != "") {
                //封装
                beforeSubmit();

                var _form = document.forms['shortcutForm'];
                //添加newMc 表单元素
                generateHiddenForm(_form, "newMc", data.newMc);
                generateHiddenForm(_form, "ms", data.ms);
                generateHiddenForm(_form, "grcdmbh", data.grcdmbh);

                var cdmbid = $('#cdmbselected').val();
                var shortcutInfoStr = JSON.stringify(shortcutStartInfo);
                var shortcutGroupStr = JSON.stringify(shortcutGroup);

                generateHiddenForm(_form, 'grcdmbid', cdmbid);
                generateHiddenForm(_form, 'shortcutGroup', shortcutGroupStr);
                generateHiddenForm(_form, 'shortcutMenuInfo', shortcutInfoStr);
                generateHiddenForm(_form, 'cdz', '2');  // 为什么是 2(start)，而不是 5(pers)？？？Lin

                $('form[name="shortcutForm"]').attr('action', "<serv.ss name='saveMenuDef' dest='menuDefSaveOk' parm='{mblx:5}'/>");
                $('form[name="shortcutForm"]').submit();
            }
        }
    })(this);
    $('#addmb').click(function () {
        wd.display.confirm({ title: "另存为新模板", url: "<serv.ss dest='menuDefAdd'/>", width: 300, height: 240, callback:function(){} });
    });

</script>
<drag.ss name="ddp" grp="true" func="editGroup,editOrder"/> <%-- name="cd"。再改为统一的名字 -- 同一页面，不会有多个拖放选择。Lin --%>

</html>