treePanel

之前在考勤系统中使用到了菜单树的实现,由于使用了extjs的框架,所以菜单树的实现自然是用treePanel,在此记录一下用法。

//菜单
var root = new Ext.tree.AsyncTreeNode({
    id: '',
    loader: new Ext.tree.TreeLoader({
        url: 'WEBForm/GetMenu.aspx',
        listeners: {
            "beforeload": function(treeloader, node) {
                treeloader.baseParams = {
                    id: node.id,
                    method: 'POST'
                };
            }
        }
    })
});

var treenode = new Ext.tree.TreePanel({
    id:"treenode1",
    title: "菜单",
    root: root,
    //默认根目录不显示
    rootVisible: false,
    border: false,
    animate: true,
    lines: true,
    enableDD: true,
    //如果超出范围带自动滚动条
    autoScroll: true,
    frame: true, // 美化界面
    listeners:
    {
        "click": function(node, event) {
            //叶子节点点击不进入链接
            if (node.isLeaf()) {
                // 显示叶子节点菜单
                event.stopEvent();
                ALLEvents(node);
            } else {
                //不是叶子节点不触发事件
                event.stopEvent();
                //点击时展开
                node.toggle();
            }
        }
    }
});
//展开菜单
treenode.expandAll();

注意:如果将treepanel放到panel中,要是菜单出现滚动条,需要再页面加载完后添加控制,我是这样实现的:
Ext.onReady(function() {
    new Ext.Viewport({
        layout: "border",
        items: [north, west, center, south]
    });
    //调整菜单的高度以显示滚动条
    var treeHeight = document.body.clientHeight - 250;
    Ext.getCmp("treenode1").setHeight(treeHeight);
    //动态调整菜单高度
    Ext.EventManager.addListener(window, "resize", function() {
        var treeHeight = document.body.clientHeight - 250;
        Ext.getCmp("treenode1").setHeight(treeHeight);
    });
});

GetMenu.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GetMenu.aspx.cs" Inherits="WEBForm_GetMenu" %>
<%= Jsons%>

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
//
using VCSOA;
using System.Text;
using System.Data;

public partial class WEBForm_GetMenu : System.Web.UI.Page
{
    public string Jsons = "";
    protected void Page_Load(object sender, EventArgs e)
    {
        GetDTreeJSON();
    }
    public void GetDTreeJSON()
    {
        string staffid = "";
        HttpCookie cookie = Request.Cookies["StaffID"];
        if (cookie != null)
        {
            staffid = cookie.Values["StaffID"].ToString();
            Jsons = CreateExtTreeJSON(staffid);
        }
        else
        {
            Response.Redirect("../Default.aspx");
        }
    }
    //获取json
    public string CreateExtTreeJSON(string staffid)
    {
        StringBuilder sb = new StringBuilder();
        AddNode(sb, staffid);
        string s = sb.ToString();
        return s.Replace("}{", "},{");
    }
    //获取节点
    public void AddNode(StringBuilder sb, string staffid)
    {
        MenuBAL menuService = new MenuBAL();
        DataTable dt = menuService.GetMenu(staffid);

        DataView dv = new DataView(dt);
        //循环显示父节点,并显示子节点
        dv.RowFilter = "parentid = ''";
        sb.Append("[");
        foreach (DataRowView dr in dv)
        {
            sb.Append("{");
            sb.Append("text:'" + dr["title"].ToString() + "',");
            sb.Append("id:'node" + dr["id"].ToString() + "'");
            //获取子节点
            AddChildNode(dt, sb, dr["id"].ToString());
            sb.Append("}");
        }
        sb.Append("]");
    }
    //递归获取子节点
    public void AddChildNode(DataTable dt, StringBuilder sb, string id)
    {
        DataView dv = new DataView(dt);//建立dt的表视图
        dv.RowFilter = "parentid = '" + id + "'"; //过滤
        if(dv.Count>0)
        {
            sb.Append(",leaf:false,children:[");
            foreach (DataRowView dr in dv)
            {
                sb.Append("{");
                sb.Append("text:'" + dr["title"].ToString() + "',");
                sb.Append("id:'node" + dr["id"].ToString() + "',");
                sb.Append("href:'" + dr["url"].ToString() + "',");
                sb.Append("hrefTarget:'main'");
                AddChildNode(dt, sb, dr["id"].ToString());//递归
                sb.Append("}");
            }
            sb.Append("]");
        }
        else
        {
            sb.Append(",leaf:true");
        }
    }

}

create PROCEDURE [dbo].[GetMenu]
	@staffid	varchar(20)			---工号
AS
If @staffid ='admin' 
	Begin
		Select * From T_Menu Order By Id
	End
Else
	Begin
		Select * From T_Menu 
		Where Id like '01%'			--个人信息
		Or ActorId In (Select Distinct ActorId From T_Authority Where StaffId=@staffid)  --根据权限显示子菜单
		Or Id In (
			Select distinct ParentId From T_Menu 
			Where ActorId In (Select Distinct ActorId from T_Authority Where StaffId=@staffid)
			Or Id In(Select distinct ParentId From T_Menu 
				Where ActorId In (Select Distinct ActorId from T_Authority Where StaffId=@staffid)
			)
		)		--获取子菜单的父亲,需要考虑有几级菜单
		Order By Id
	End

附件中有menu表结构数据

你可能感兴趣的:(UI,json,Web,ext,webform)