MyNote笔记系统(三)笔记管理篇
来源:互联网 发布:淘宝微淘直播 编辑:程序博客网 时间:2024/04/29 04:07
工程源码:http://download.csdn.net/detail/my_session/4846364
整体架构 index.jsp
/** Open the quick tips */Ext.QuickTips.init();Ext.form.Field.prototype.msgTarget = 'side';/** redefine the blank image url */var imagePath = 'http://localhost:8080/notepro/ext/resources/images';Ext.BLANK_IMAGE_URL = imagePath+'/default/s.gif';var tools = [{ id:'gear', handler: function(){ Ext.Msg.alert('Message', 'This function need to be modified.'); }},{ id:'close', handler: function(e, target, panel){ panel.ownerCt.remove(panel, true); }}];/** 定义中心区域, 本系统的核心区域, 所有打开的Tab都将在该区域展示 */var centerRegion = new Ext.TabPanel({ region:'center', deferredRender:false, activeTab:0, enableTabScroll:true, listeners:{ remove: function(tp, c){ c.hide(); } }, hideBorders:true, autoDestroy: false, items:[{xtype:'tabpanel' ,title: '办公桌面',iconCls: 'tabs',closable: false,frame:false,html:"<iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='users/desktool/desktop.jsp'> </iframe>",items:[]} ]});/** 这里是页面展示的开始 */Ext.onReady(function(){/** 处理ie提交数据中文乱码问题 */ Ext.lib.Ajax.defaultPostHeader += '; charset=utf-8'; new Ext.Viewport({ //实例化布局对象 layout:'border', items:[ { region:'west', title:'管理界面', id:'west-panel', split:true, width: 200, minSize: 170, maxSize: 400, collapsible: true, margins:'35 0 5 5', cmargins:'35 5 5 5', layout:'accordion', layoutConfig:{ animate:true }, items: [ { title:'笔记管理', border:false, autoScroll:true, iconCls:'notes', items: [treepanel] },{ title:'我的群组', border:false, autoScroll:true, iconCls:'group', items: [grouppanel] },{ title:'日常工具', layout:'absolute', border:false, autoScroll:true, iconCls:'tools', items: [{ xtype:'button', text: '<h1><font color="red"><center>日程日历</center></font></h1>', iconCls: 'calendar', tooltip:"这是一个日程管理工具,您可以在这里安排您的一切", tooltipType:"title", height:'20%', width : '70%', x:'15%', y:'5%', handler: function(){if(centerRegion.findById("calendartab")){centerRegion.setActiveTab("calendartab");return ;}centerRegion.add({title:"NoteBook日历",id:"calendartab",html:"<iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='users/toolbar/calendar.jsp'> </iframe>",closable:true});centerRegion.setActiveTab("calendartab"); }},{xtype:'button', text: '<h1><font color="red"><center>天气指南</center></font></h1>', tooltip:"这是一个天气预报工具", tooltipType:"title", iconCls: 'calendar', height:'20%', width : '70%', x:'15%', y:'28%', handler: function(){if(centerRegion.findById("weathertap")){centerRegion.setActiveTab("weathertap");return ;}centerRegion.add({title:"天气指南",id:"weathertap",html:"<iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='dailylife/weather.action'> </iframe>",closable:true});centerRegion.setActiveTab("weathertap"); }},{xtype:'button', text: '我的游戏', iconCls: 'calendar', height:'20%', width : '70%', x:'15%', y:'51%'},{xtype:'button', text: '我的e家', iconCls: 'calendar', height:'20%', width : '70%', x:'15%', y:'74%'} ] }, { title:'程序设置', html: '<html><body> 设置:<input type="text" name="firstname" /></body></html>', border:false, autoScroll:true, iconCls:'settings' } ] }, centerRegion ] }); //设置皮肤的核心代码 //Ext.util.CSS.swapStyleSheet('viewport','ext/resources/css/reset-min.css'); });
笔记管理 部分代码:
var Tree = Ext.tree;var treeloader = new Tree.TreeLoader( {dataUrl : "users/treepanelload.action"});var treepanel = new Tree.TreePanel( {rootVisible : true, // 设为false将隐藏根节点,很多情况下,我们选择隐藏根节点增加美观性border : true, // 有边框animate : true, // 动画效果autoScroll : true, // 自动滚动width:'100%',height:parent.height,enableDD : true, // 拖拽节点containerScroll : true,loader : treeloader,useArrows : true,checkModel : 'cascade', // 对树的级联多选onlyLeafCheckable : false});// 异步加载根节点var rootnode = new Tree.AsyncTreeNode( { id : 'p0', text : '我的笔记', draggable : false});treepanel.setRootNode(rootnode);treepanel.on('beforeload', function(node) {treepanel.loader.dataUrl = 'users/treepanelload.action?id=' + node.id; });var contextMenu = new Ext.menu.Menu( { items : [ { text : '新建笔记', handler : newFileHandler }, { text : '新建文件夹', handler : addFloderHandler }, { text : '删除文件夹', handler : deleteHandler }, { text : '重命名', handler : modifyHandler }] });var fileMenu = new Ext.menu.Menu( { items : [{ text : '编辑', handler : editHandler }, { text : '查看', handler : viewHandler }, { text: '删除', handler : deleteHandler },{text: '重命名', handler : modifyHandler }] });treepanel.on('contextmenu', treeContextHandler); function treeContextHandler(node, event) { event.preventDefault(); node.select();if(node.leaf) {fileMenu.show(node.ui.getAnchor());fileMenu.showAt(event.getPoint());}else {contextMenu.show(node.ui.getAnchor()); contextMenu.showAt(event.getPoint());} } /*菜单选项处理函数:新建文件*/function newFileHandler() {var newNode = new Ext.tree.TreeNode({ text : '新建文档',leaf: true});var selectedNode = treepanel.getSelectionModel().getSelectedNode(); var pid = selectedNode.id;Ext.Ajax.request({ url:"users/treehandle!newFile", params:{ title:'新建文档', //flag:'newfile', categoryid:pid }, success: function(resp,opts) { var respText = Ext.util.JSON.decode(resp.responseText); newNode.setId(respText.id); selectedNode.appendChild(newNode); }, failure: function(resp,opts) { var respText = Ext.util.JSON.decode(resp.responseText); Ext.Msg.alert('错误', respText.error); } }); } /*菜单选项处理函数:编辑*/function editHandler() { var selectedNode = treepanel.getSelectionModel().getSelectedNode();var id = selectedNode.id;var text = selectedNode.text;if(centerRegion.findById("edittab"+id)){centerRegion.setActiveTab("edittab"+id);return ;}centerRegion.add({title:text,id:"edittab"+id,html:"<iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='users/treehandle!editFile?id="+id+"'> </iframe>",closable:true});centerRegion.setActiveTab("edittab"+id);}/*菜单选项处理函数:新建文件夹*/function addFloderHandler() { var newNode = new Ext.tree.TreeNode( { text : '新建文件夹',leaf: false}); var selectedNode = treepanel.getSelectionModel().getSelectedNode(); var pid=selectedNode.id; Ext.Ajax.request({ url:"users/treehandle!newFloder", params:{ name:'新建文件夹', //flag:'newfloder', id:pid }, success: function(resp,opts) { var respText = Ext.util.JSON.decode(resp.responseText); newNode.setId(respText.id); selectedNode.appendChild(newNode); }, failure: function(resp,opts) { var respText = Ext.util.JSON.decode(resp.responseText); Ext.Msg.alert('错误', respText.error); } }); }/*菜单选项处理函数:查看*/function viewHandler (){var selectedNode = treepanel.getSelectionModel().getSelectedNode(); var id = selectedNode.id;var text = selectedNode.text;if(centerRegion.findById("viewtab"+id)){centerRegion.setActiveTab("viewtab"+id);return ;}centerRegion.add({title:text,id:"viewtab"+id,html:"<iframe scrolling='auto' frameborder='0' width='100%' height='100%' src='users/treehandle!viewFile?id="+id+"'> </iframe>",closable:true});centerRegion.setActiveTab("viewtab"+id);}/*菜单选项处理函数:删除文件 删除文件夹*/ function deleteHandler() {var treenode = treepanel.getSelectionModel().getSelectedNode();if(treenode.hasChildNodes()) {Ext.Msg.alert('提示', '不能删除非空文件夹');return ;}var nodeid= treenode.id; Ext.Ajax.request({ url:'users/treehandle!delete', params:{ id:nodeid //flag:'delete'} }); treepanel.getSelectionModel().getSelectedNode().remove(); } /*菜单选项处理函数:重命名*/function modifyHandler() { var treeEditor = new Ext.tree.TreeEditor(treepanel, { allowBlank : false, // 允许出现空白 cancelOnEsc : true,// 按下ESC建自动取消空白 selectOnFocus : true }); var selectedNode = treepanel.getSelectionModel().getSelectedNode();// 得到选中的节点 pid=selectedNode.id; treeEditor.editNode = selectedNode; treeEditor.startEdit(selectedNode.ui.textNode);treeEditor.on("complete", function(treeEditor){Ext.Ajax.request({ url:"users/treehandle!modify", params:{ title:treeEditor.editNode.text, id:pid //flag:'modify' } }); }); } //定义并构造西部面板var westRegion = { region:'west', id:'west-panel', iconCls: 'tabs', title:'笔记之家', split:true, width: 200, minSize: 175, maxSize: 400, collapsible: true, margins:'0 0 0 5', layout:'column', layoutConfig:{ animate:true }, items: [ { items:treepanel } ]};
- MyNote笔记系统(三)笔记管理篇
- MyNote笔记系统(四)日程管理篇
- MyNote笔记系统(五)天气预报篇
- MyNote笔记系统(一) 简介
- MyNote笔记系统(二)登陆与注册
- 交通灯管理系统笔记
- 课本笔记--运营管理(三)
- Hbase 学习笔记(三):管理模块
- Activiti流程管理学习笔记(三)
- Hbase 学习笔记(三):管理模块
- Java笔记-内存管理(三)
- Git学习笔记(三) - 分支管理
- myNote
- myNote
- myNote
- 电影记录管理系统代码(笔记)
- 笔记53 | 管理系统UI(一)
- 笔记54 | 管理系统UI(二)
- 启用IIS服务,并利用visual studio创建简单网页同过IIS发布
- Android 自定义标题栏(title栏)
- 代码引用优酷的播放器
- filter过滤器之自动登录代码
- 一些命令
- MyNote笔记系统(三)笔记管理篇
- 关于 android RIL 调试
- oracle数据类型
- iBATIS框架batch处理优化浅析
- HTML5与视频传输
- 还原NtTerminateProcess
- 把数据从gridview导出到execl中的一点小收获
- hive查询优化总结
- Windows (wince、 windows mobile、windows phone)错误代码大全