基于WebForm+EasyUI的业务管理系统形成之旅 -- 首页Portal界面拖拽(Ⅵ)上篇《基于WebForm+EasyUI的业务管理系统形成之旅 -- 构建Web界面》，主要介绍系统界面布局、导出数据等。
本篇将介绍首页Portal界面拖拽。
一、首页Portal界面拖拽效果效果对比，如下图所示。
具体实现代码
1 //在一起的用，分割，不在一起的用：分割 2 var local = 'p1,p4,p2:p3'; 3 if ($.cookie("panelStates")) { 4 local = $.cookie("panelStates"); 5 } 6 function getPanelById(id) { 7 for (var i = 0; i < panels.length; i++) { 8 if (panels[i].id == id) { 9 return panels[i];10 }11 }12 return undefined;13 }14 //渲染panel15 function renderPanel() {16 var cols = local.split(":");17 for (var i = 0; i < cols.length; i++) {18 var rows = cols[i].split(",");19 for (var j = 0; j < rows.length; j++) {20 var op = getPanelById(rows[j]);21 var p = $('<div><div/>').attr('id', op.id).appendTo('body');22 p.panel(op);23 portal.portal('add', {24 panel: p,25 columnIndex: i26 });27 }28 }29 }30 renderPanel();31 portal.portal('resize');
实现随用户自己定义首页功能区块位置。