文件管理器

        因为项目需要，最近写了一个文件管理器（即管理本地文件的模块）。

        刚开始写这个模块的时候，想到的是用jQuery的文件管理器插件jqueryFileTree。写完以后，发现一些问题，比如模块的样式和按钮功能都不好控制，改起来相当麻烦。后来想想，写这个模块也不是很难，下面是两次的对比图：

 

 

 

        前者是用jQuery的插件做出的效果，后者是自己写的，当然也用到了jQueryeasyui的东西。

        主要是左边树的实现，说白了，也就是遍历文件夹，拼成easyui tree需要的json根式的数据，上代码

package com.fable.fbs.fileUtil;


import java.util.ArrayList;


public class FileTreeNode {
	private String id;
	private String pid;
	private String text;
	private String state;
	private ArrayList<FileTreeNode> children = new ArrayList<FileTreeNode>();
	
	public FileTreeNode(String id,String pid,String text,String state){
		this.id = id;
		this.pid = pid;
		this.text = text;
		this.state = state;
	}
	
	public void add(FileTreeNode node){
		if(node.pid.equals(this.id)) {
			this.children.add(node);
		}else {
			for (FileTreeNode tmp_node : children) {
				tmp_node.add(node);
			}
		}
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPid() {
		return pid;
	}

	public void setPid(String pid) {
		this.pid = pid;
	}


	public String getText() {
		return text;
	}

	public void setText(String text) {
		this.text = text;
	}

	public String getState() {
		return state;
	}

	public void setState(String state) {
		this.state = state;
	}

	public ArrayList<FileTreeNode> getChildren() {
		return children;
	}

	public void setChildren(ArrayList<FileTreeNode> children) {
		this.children = children;
	}
	
	
}

 

public final List<FileTreeNode> showDirectory(File file,
			List<FileTreeNode> list) throws Exception {
		File[] f = file.listFiles();
		FileTreeNode node = null;
		for (int i = 0; i < f.length; i++) {
			String state = "open"; //文件夹是否展示，默认展开
			if (f[i].isDirectory()) {
				File[] f1 = f[i].listFiles();
				for (int j = 0; j < f1.length; j++) {
					if (f1[j].isDirectory()) {
						state = "closed"; //判断文件夹是否存在子文件夹，不存在状态 关闭
						// node = new FileTreeNode(f[i].getAbsolutePath(),
						// f[i].getParent(), f[i].getName(), "closed");
					}
				}
				node = new FileTreeNode(f[i].getAbsolutePath(),
						f[i].getParent(), f[i].getName(), state);
				list.add(node);
				showDirectory(new File(f[i].getAbsolutePath()), list);//递归 不断add子文件夹
			}
		}
		return list;
	}

 

      

@RequestMapping(value = "List/fileTree")
	@ResponseBody
	public String fileTree(HttpServletRequest request,HttpServletResponse response){
		FileUtil fileUtil = new FileUtil();
		String path = this.getSystemPhysicalPath();
		path.subSequence(0, path.length()-1);
//		String path = "d:\\test";
		File file = new File(path);
		FileTreeNode root = new FileTreeNode(file.getAbsolutePath(), file.getParent(), "根目录", "open");
		List<FileTreeNode> list1 = new ArrayList<FileTreeNode>();
		JSONObject obj = null;
//		JSONArray obj = null;
		String s;
		try {
			List<FileTreeNode> list = fileUtil.showDirectory(file,list1);
			if (list != null) {
				for (int i = 0; i < list.size(); i++) {
					root.add(list.get(i));
				}
			}
			obj = JSONObject.fromObject(root);
//			obj = JSONArray.fromObject(root.getChildren());
		} catch (Exception e) {
			e.printStackTrace();
		}
		s = "["+obj.toString()+"]";
		return s;//返回easyui tree所需的json串
	}

 

         前台代码如下

$("#fileTree").tree({
		url:"........",
   		onClick: function(node){
   			var nodeId = encodeURI(encodeURI(node.id));
			$('#grid').datagrid('load','../../Admin/Files/List/getFileByDir?dir='+nodeId); 
		}, 
		animate:true
	});

 $("#fileTree") 是获取需要展示树的HTML元素，url对应后台返回easyui tree的json的url（整个框架用的是spring mvc）。$('#grid').datagrid('load','../../Admin/Files/List/getFileByDir?dir='+nodeId);这句话是加载某个文件夹下的文件列表，文件夹列表的json比较容易，这里不写了 。

 

    整个过程就是这样，写的有点粗糙，不知道我的意思有没有表达清楚，如有不足，请各位多多指教，我也好学习