用户注册



邮箱:

密码:

用户登录


邮箱:

密码:
记住登录一个月忘记密码?

发表随想


还能输入:200字
云代码 - javascript代码库

iframe + accordion + shortcut 实例(基于Ext)

2014-02-11 作者: Screat举报

[javascript]代码库

var loadMask =null;
var _MAXMODULE = 10;
var _ACTIVENODE=null;
var task = new Ext.util.DelayedTask(function(){
    if(!_ACTIVENODE) return;
    loadModel(_ACTIVENODE);
});
 
 
function initShortcuts(){
     
    //清空所有快捷方式
    Ext.select('.block').remove();
     
    //回收站域默认隐藏
    Ext.get('delDiv').hide();
     
    _Ajax.request({
        url:'system/Common_loadByEntity.action',
        params:{
            clazz:'com.tbyf.health.entity.XtShortcut'
        },
        xmlData:{
            userid : top._APP.operator.id
        },
        result : function(obj) {
            var res = Ext.decode(obj.detail);
             
            res.each(function(obj, i){
                 
                //简化长字符串
                var shortcutname = obj.shortcutname.length > 6 ? obj.shortcutname.substring(0,3) + '...' + obj.shortcutname.substring(obj.shortcutname.length - 3, obj.shortcutname.length) : obj.shortcutname
                 
                //构建可视的DOM元素
                var shortcut = Ext.get('shortcut').createChild({
                    html :
                        '<li id="srt'+ obj.shortcutid +'" class="block" title="'+ obj.shortcutname +'" index="3" style="margin-left: 16px; margin-right: 16px;">' +
                        '   <div class="img">' +
                        '       <p><img src="../images/project.png"></img></p>' +
                        '   </div>' +
                        '   <a class="icon-text" href="'+ obj.shortcuturl +'">' +
                        '       <span>'+ shortcutname +'</span>' +
                        '   </a>' +
                        '</li>'
                });
                 
                shortcut.on('click', function(){
                    loadMod(obj.shortcutcode);
                });
                 
                //委派拖拽
                var proxy=new Ext.dd.DragSource("srt" + obj.shortcutid, {group:'dt'});
                var target=new Ext.dd.DDTarget('delDiv','dt');
                 
                //拖拽时显示回收站
                proxy.onDrag = function(){
                    Ext.get('delDiv').show();
                }
                 
                //拖拽结束隐藏回收站
                proxy.endDrag = function(){
                    Ext.get('delDiv').hide();
                }
                 
                //完成拖拽后触发的事件
                proxy.afterDragDrop = function(target, e, idc) {
                    top.deleteShortcut(obj.id);
                }
            });
        }
    });
}
 
function deleteShortcut(id){
    _Ajax.request({
        url:'system/Common_deleteEntity.action',
        params:{clazz:'com.tbyf.health.entity.XtShortcut'},
        xmlData: {
            id: Number(id)
        },
        result:function(obj){
            top.initShortcuts();
        }
    });
}
 
function triggerDrag(){
    var node=null;
     
    Ext.each(Ext.getCmp('left_panel'),function(accrd){
        Ext.each(accrd.items.items,function(tree){
            tree.getRootNode().cascade(function(node) {
                if (!node.isLeaf() && !node.isLoaded()) {
                     
                    //重写reload方法,避免遍历每一个菜单项导致所有菜单展开的情况
                    node.collapse(false,false);
                    while(node.firstChild){
                        node.removeChild(node.firstChild).destroy()
                    }
                    node.childrenRendered=false;
                    node.loaded=false;
                    if(node.isHiddenRoot()){
                        node.expanded=false;
                    }
                    node.expand(false,false,function(){
                        node.collapse();
                    },null);
                    return true;
                }
                if (node.attributes['url'] && node.attributes['url'].indexOf('HealthReport') > 0) {
                     
                    //委派拖拽
                    var proxy=new Ext.dd.DragSource(node.getUI().getEl(),{group:'dd'});
                    var target=new Ext.dd.DDTarget('dargDiv','dd');
                     
                    //完成拖拽后触发的事件
                    proxy.afterDragDrop = function(target, e, idc) {
                         
                        if(Ext.get("srt" + node.attributes.id)){
                            Ext.Msg.alert('提示','此快捷方式您已经添加!');
                            return;
                        }
                         
                        //构造快捷方式持久化对象
                        var obj = {
                            shortcutname : node.attributes.text,
                            shortcuttype : '0',
                            shortcutcode : node.attributes.code,
                            shortcutid : Number(node.attributes.id),
                            shortcuturl : node.attributes.url,
                            userid : top._APP.operator.id
                        };
                         
                        //持久快捷方式对象
                        _Ajax.request({
                            url : 'system/Common_saveObj.action',
                            params:{
                                clazz:'com.tbyf.health.entity.XtShortcut'
                            },
                            xmlData: obj,
                            result : function(obj) {
                                initShortcuts();
                            }
                        });
                    };
                }
                return true;
            });
        });
    });
}
 
function loadModbak(id,params,title){
    alert(_ACTIVENODE.getOwnerTree());
    var node=_ACTIVENODE.getOwnerTree().getNodeById(id);
    if (!node) {
        Ext.each(Ext.getCmp('accordion'),function(accrd){
            Ext.each(accrd.items.items,function(tree){
                if (tree.getNodeById(id)) {
                    node=tree.getNodeById(id);
                    return false;
                }
            });
        });
    }
    Ext.apply(node.attributes,{params:params});
    loadModel(node,true,title);       
}
function loadMod(id,params,title,url,text,iconCls){
    var node=new Ext.data.Node({
     id:id,
     url:url
    });
    Ext.apply(node.attributes,{text:text});
    Ext.apply(node.attributes,{iconCls:iconCls});
    Ext.apply(node.attributes,{params:params});
    loadModel(node,true,title);       
}
function loadMod(code,params,title){
    var nodeMod=null;
    Ext.each(Ext.getCmp('left_panel'),function(accrd){
        Ext.each(accrd.items.items,function(tree){
            tree.getRootNode().cascade(function(node) {
                if (!node.isLeaf() && !node.isLoaded()) {
                    node.reload();
                    return true;
                }
                if (node.attributes['code'] && node.attributes['code'] == code) {
                    nodeMod = node;
                }
                return true;
            });
        });
    });
    if (!nodeMod) {
        Ext.Msg.alert('提示','您未被授权访问该功能<br>菜单编码:'+code);
        return;
    }
    Ext.apply(nodeMod.attributes,{params:params});
    loadModel(nodeMod,true,title);
}
function loadModel(node,des,title){
     
    var centerTab = Ext.getCmp('centerTab');
    var id = node.id + "_subTab";
    var items = centerTab.items;
    var panel=null;
    for(var i=0;i<items.length;i++){
        var item = items.get(i);
        if(item.id==id){
            panel= item;
        }
    }
    if (des && panel) {
        panel.destroy();
        panel=undefined;
    }
    if (!panel && node.attributes.url!=null && node.attributes.url!="null"){
        if(items.length>_MAXMODULE){
            return Ext.Msg.alert("警告","超出模块加载最大数量,请关闭某些模块后重试!");
        }
        if (!title)
            title='';
        else
            title='【'+title+'】';
        if (node.attributes.params && !des)
            node.attributes.params=undefined;
          //  var htmlStr = '<iframe style="width:100%;height:100%" allowTransparency=true frameborder=0 name="detailframe" src="'+node.attributes.url+'?id='+node.id+'"></iframe>';
          var url=node.attributes.url;
          if(node.attributes.url.indexOf("?")>=0){
          url=node.attributes.url+"&usercode="+top._APP.operator.usercode;
          }
            var htmlStr = '<iframe style="width:100%;height:100%" allowTransparency=true frameborder=0 name="detailframe" src="'+url+'"></iframe>';//增加报表时去掉id参数
 
            if(node.text == '电子地图管理') {
                Ext.getCmp('left_panel').collapse(true);
                htmlStr = '<iframe style="width:100%;height:100%" allowTransparency=true frameborder=0 name="detailframe" src="http://www.hbredcross.org:8888/baseLine/jsp/googleEarth.html?sid=ABQIAAAApYwcWsoSiQ3WKySJxNfm1xSVmppIo2nBU5ROoP2QZFdzZe9JphT5DoyAF1vW-ujuHzHDhkjtgeg0NQ"></iframe>';
            }
        panel = new Ext.Panel({
                id:id,
                title:title+node.attributes.text,
                iconCls:node.attributes.iconCls,
                closable: true,
                html:htmlStr//'<iframe style="width:100%;height:100%" allowTransparency=true frameborder=0 name="detailframe" src="'+node.attributes.url+'?id='+node.id+'"></iframe>'
            });
        centerTab.add(panel);
       
    }
    centerTab.setActiveTab(panel);
    _ACTIVENODE=node;
}
 
function layOutPage(objRight){
    var menu = Ext.decode(objRight.MENU).children;
    var items = [];
    if(menu)
        for(var i =0;i<menu.length;i++){
            var menuitem = menu[i];
            if(i==0 && menuitem.children && menuitem.children[0])menuitem.children[0].expanded=true;
 
            items.push({
                border:true,
                title:menuitem.text,
                xtype:'treepanel',
                autoScroll: true,
                animate: true,
                containerScroll: true,
                rootVisible: false,
                iconCls:menuitem.iconCls,
                root: {
                    nodeType: 'async',
                    text: 'root',
                    draggable: false,
                    children:menuitem.children
                },
                listeners:{
                    click  : function(node,e){
                        _ACTIVENODE=node;
                        task.delay(200);
                    }
                }
            });
        }
    var viewport = new Ext.Viewport({
        layout: 'border',
        items: [
            new Ext.BoxComponent({
                region: 'north',
                el: 'north',
                minSize: 1,
                layout:'fit',
                height:50
            }),
//              {
//              region:'south',
//              contentEl: 'south',
//              split:true,
//              height: 28,
//              minSize: 28,
//              maxSize: 28,
//              margins:'0 0 0 0'
//          },
                {
                title:"系统菜单",
                region:'west',
                id:'left_panel',
                layout:'accordion',
                split:true,
                width: 175,
                minSize: 175,
                maxSize: 400,
                collapseMode:'mini',
                collapsibleSplitTip:'点击展开菜单',
                useSplitTips:true,
                splitTip:'点击收缩菜单',
                layoutConfig:{animate:true},
                //tbar:[{
                //  xtype:'textfield',
                //  emptyText:'请输入',
                //  width:150
                //},'-',{
                //  iconCls:'q-search',
                //  tooltip:'检索'
                //},'-'],
                items:items,
                items1:[{
                    id:'menuPanel',
                    title:'系统菜单',
                    margins:'0 0 0 5',
                    border:false,
                     
                    iconCls:'q-aplction_cscde',
                    layoutConfig:{animate:true},
                    items:items
                }]
            }, new Ext.TabPanel({
                id:'centerTab',
                region: 'center',
                deferredRender: false,
                activeTab: 0,
                enableTabScroll:true,
                plugins: new Ext.ux.TabCloseMenu(),
                items: [{
                    title: '首页',
                    iconCls:'q-home_blue',
                    closable: false,
                    autoScroll: true,
                    html:'<iframe  style="width:100%;height:100%" allowTransparency=true frameborder=0 name="welcome_frame" src="welcome.html"></iframe>'
                },{
                    title: '报表快捷方式',
                    closable: true,
                    autoScroll: true,
                    html:
                        '<div id="dargDiv" style="left: 0px; top: 10px; position: absolute; width: 100%; height: 100%;">' +
                        '   <ul id="shortcut">' +
                        '   </ul>' +
                        '<div id="delDiv" style="height: 128px; width:128px; position:absolute; bottom:50px; right:10px;"><img src="../images/Recycle_Bin.png"></img></div>' +
                        '</div>'
                }]
            })
        ]
    });
}
 
function initAction(data){
 
    if(data.ENTERPRISE)
        _APP.setEnterprise(Ext.decode(data.ENTERPRISE));
    if(data.OPERATE)
        _APP.operator=Ext.decode(data.OPERATE);
    if(data.REGIONRIGHT)
        _APP.setRgionR(Ext.decode(data.REGIONRIGHT));
    if(data.REGION)
        _APP.setRegion(Ext.decode(data.REGION));
    _APP.setRight(Ext.decode(data.URIGHT));
    if(data.NOWTIME) _APP.nowTime=data.NOWTIME;
    if(data.BEGIN) _APP.BEGIN = data.BEGIN;
    if(data.TYPE) _APP.ASSTYPE = data.TYPE;
    if(data.END) _APP.END = data.END;
    if(data.YEAR) _APP.YEAR = data.YEAR;
    if(data.FUND) _APP.FUND = data.FUND;
    if(data.USERROLE) _APP.USERROLE = data.USERROLE;
    if(data.PARENTID) _APP.PARENTID = data.PARENTID;
    if(data.PARENTNAME) _APP.PARENTNAME = data.PARENTNAME;
    var App = Ext.decode(data.APP);
    _APP.setAppList(App);
    document.getElementById('operate_info').innerHTML="&nbsp;操作员:"+_APP.operator.username;
    if(_APP.ENTERPRISE.groupname!=null)document.getElementById('enterprise_info').innerHTML=_APP.ENTERPRISE.groupname+"&nbsp;&nbsp;&nbsp;";
 
    top.initShortcuts();
    top.triggerDrag();
}
 
function _initApp(){
    if(loginInfo){
        var obj = Ext.decode(loginInfo);
        layOutPage(obj);
        initAction(obj);
    }else{
        loadMask = new Ext.LoadMask(document.body,{msg:"加载中,请稍候..."});
        loadMask.show();
        _Ajax.request({
            url:'system/Login_loadInfo.action',
            result:function(obj){
                var detail = Ext.decode(obj.detail);
                layOutPage(detail);
                initAction(detail);
                var task = new Ext.util.DelayedTask(function(){
                    loadMask.hide();
                });
 
                task.delay(500);
            }
        });
    }
}


网友评论    (发表评论)


发表评论:

评论须知:

  • 1、评论每次加2分,每天上限为30;
  • 2、请文明用语,共同创建干净的技术交流环境;
  • 3、若被发现提交非法信息,评论将会被删除,并且给予扣分处理,严重者给予封号处理;
  • 4、请勿发布广告信息或其他无关评论,否则将会删除评论并扣分,严重者给予封号处理。


扫码下载

加载中,请稍后...

输入口令后可复制整站源码

加载中,请稍后...