Web功能之组织结构图
前提：由于项目需要显示组织结构图的形式
工具：VS2010
项目：ASP.NET 自带的web项目 （带模板页）
插件：OrgChart（依赖：OrgChart.dll）、JOrgChart
不多说 先看效果
1、OrgChart实现效果
2、JOrgChart效果
基础实体类代码：
public class SysUserModel : OrgNode
{
public int SysUserId { get; set; }
public string SysUserName { get; set; }
public int SysUserParentId { get; set; } public override string OrgNodeHtml()
{
this.SysUserName = this.Text; string str = "<table align='center' border=0 bgcolor='#f0f8ff'><tr>";
//str += "<td><img src='" + this.ImageUrl + "'></td>";
str += "<td><table align=top width=80 border=1 bordercolor=Silver cellspacing=0 style='border-collapse:collapse;'>";
//str += "<tr><td > " + this.SysUserGroupId + "</td></tr>";
str += "<tr bgcolor=white><td > <a href='" + this.NavigateUrl + "' title='详细档案'></a></td></tr>";//" + this.SysUserGroupId + "
str += "<tr><td > " + this.SysUserName + "</td></tr>";
// str += "<tr bgcolor=white><td > </td></tr>";
//str += "<tr><td > </td></tr>"; str += "</table>"; str += "</td></tr></table>"; return str;
}
}
1、OrgChart前台实现代码：
<%@ Page Title="OrgChart" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %> <%@ Register Assembly="OrgChart" Namespace="OrgCharDesigner" TagPrefix="cc1" %> <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <cc1:OrgChart ID="OrgChart1" runat="server" style="z-index: 101; left: 104px; position: absolute; top: 188px"
LineColor="Silver" Width="80%" Height="80%"
ChartStyle="Vertical" ToolTip="我的组织结构"/> </asp:Content>
OrgChart后台实现代码：
SysUserModel sysUserModel = new SysUserModel();
DataTable dt;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ListBind();
}
} protected void ListBind()
{
try
{
dt = dtList();
SysUserModel root = new SysUserModel();
root.SysUserId = ;
root.Text = "CEO";
root.SysUserParentId = ;
SetNodeChild(dt, root);
OrgChart1.Node = root;
}
catch (Exception ex)
{
throw ex;
} } private void SetNodeChild(DataTable dt, SysUserModel root)
{
DataRow[] rows = dt.Select(" SysUserParentId = '" + root.SysUserId + "'");// 选出所有子节点
foreach (DataRow drChild in rows)
{
SysUserModel node = new SysUserModel();
node.Text = drChild["SysUserName"].ToString();
node.SysUserId = int.Parse(drChild["SysUserId"].ToString());
node.SysUserParentId = int.Parse(drChild["SysUserParentId"].ToString());
SetNodeChild(dt, node);
root.Nodes.Add(node);
}
} private DataTable dtList()
{
DataTable dt = new DataTable(); dt.Columns.Add("SysUserId");
dt.Columns.Add("SysUserName");
dt.Columns.Add("SysUserParentId"); dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "CEO";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "副总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "项目一组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "项目二组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营副总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营一组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营二组";
dt.Rows[]["SysUserParentId"] = ""; return dt;
}
2、JOrgChart 前台实现代码：
<%@ Page Title="jOrgChart" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="About.aspx.cs" Inherits="WebApplication1.About" %> <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<link rel="stylesheet" href="Styles/jquery.jOrgChart.css" />
<link rel="stylesheet" href="Styles/custom.css" />
<script type="text/javascript" src="Scripts/prettify.js"></script>
<script type="text/javascript" src="Scripts/jquery.min.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui.min.js"></script>
<script src="Scripts/jquery.jOrgChart.js"></script>
<script>
jQuery(document).ready(function () {
$("#org").jOrgChart({
chartElement: '#chart',
dragAndDrop: true,
drop: function (aim, to) { // $.ajax({
// url: '', //请求的URL
// cache: false, //不从缓存中取数据
// data: { Id: aim.attr("id"), parentId: to.attr("id") }, //发送的参数
// type: 'Get', //请求类型
// dataType: 'json', //返回类型是JSON
// timeout: 20000, //超时
// error: function ()//出错处理
// {
// alert("程序出错!");
// },
// success: function (json)//成功处理
// {
//
// }
// });
alert("目标：" + aim.attr("id") + "被拖动到了:" + to.attr("id"));
}
});
});
</script> <script>
jQuery(document).ready(function () { /* Custom jQuery for the example */
$("#show-list").click(function (e) {
e.preventDefault(); $('#list-html').toggle('fast', function () {
if ($(this).is(':visible')) {
$('#show-list').text('Hide underlying list.');
$(".topbar").fadeTo('fast', 0.9);
} else {
$('#show-list').text('Show underlying list.');
$(".topbar").fadeTo('fast', 1);
}
});
}); $('#list-html').text($('#org').html()); $("#org").bind("DOMSubtreeModified", function () {
$('#list-html').text(''); $('#list-html').text($('#org').html()); prettyPrint();
});
});
</script> </asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<div>
<%=html%>
<div id="chart" class="orgChart">
</div>
</div>
</asp:Content>
JOrgChart 后台实现代码：
StringBuilder str = new StringBuilder();
DataTable dt;
protected string html;
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
html = ListBind();
}
} protected string ListBind()
{
try
{
dt = dtList();
SysUserModel root = new SysUserModel();
str.Append(" <ul id=\"org\" style=\"display: none\"> <li id ='1'>CEO ");
root.SysUserId = ;
root.Text = "CEO";
root.SysUserParentId = ;
SetNodeChild(dt, root);
str.AppendLine(" </li> </ul> ");
return str.ToString();
}
catch (Exception ex)
{ throw ex;
} } private void SetNodeChild(DataTable dt, SysUserModel root)
{
DataRow[] rows = dt.Select(" SysUserParentId = '" + root.SysUserId + "'");// 选出所有子节点
if (rows.Length > )
{
str.Append(" <ul> ");
foreach (DataRow drChild in rows)
{
str.AppendFormat(" <li id='{0}'>{1}", drChild["SysUserId"].ToString(), drChild["SysUserName"].ToString());
SysUserModel node = new SysUserModel();
node.Text = drChild["SysUserName"].ToString();
node.SysUserId = int.Parse(drChild["SysUserId"].ToString());
node.SysUserParentId = int.Parse(drChild["SysUserParentId"].ToString());
SetNodeChild(dt, node);
str.Append("</li>");
}
str.Append(" </ul>");
}
} private DataTable dtList()
{
DataTable dt = new DataTable(); dt.Columns.Add("SysUserId");
dt.Columns.Add("SysUserName");
dt.Columns.Add("SysUserParentId"); dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "CEO";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "副总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "项目一组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "项目二组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营副总经理";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营一组";
dt.Rows[]["SysUserParentId"] = ""; dt.Rows.Add();
dt.Rows[]["SysUserId"] = "";
dt.Rows[]["SysUserName"] = "运营二组";
dt.Rows[]["SysUserParentId"] = ""; return dt;
}
以上是本人对于组织结构图的总结 如有好的建议 请您留下 以便新手学习 利人利自！
项目下载地址：点我要项目
Web功能之组织结构图的更多相关文章
- web功能模块测试用例(模板)
web功能模块测试用例(模板): https://wenku.baidu.com/view/4ada3464ddccda38376baff8.html 如图所示:
- Node.js基于Express框架搭建一个简单的注册登录Web功能
这个小应用使用到了node.js bootstrap express 以及数据库的操作 :使用mongoose对象模型来操作 mongodb 如果没了解过的可以先去基本了解一下相关概念~ 首先注 ...
- web功能测试之表单、搜索测试
初入职场接触功能测试老是碰到以下情况不知道怎么写测试用例: 一个界面很多搜索条件怎么写用例?下拉框测试如何考虑测试点?上传要考虑哪些验证点?...... 所以这篇主要是整理关于web测试之表单.搜索测 ...
- H3C 模拟器 防火墙开启Web功能
最近在搞运维的一些事情,由于缺少实体的机器来进行操作,先在模拟器里面进行 环境 windows 10,模拟器 HCL_V2.1.1 防火墙 1 在windows添加虚拟网卡 我的电脑--管理--设备管 ...
- 常用的web功能测试方法
功能测试就是对产品各功能进行验证,根据功能测试用例,逐项测试,检查产品是否达到用户要求功能,即是否满足需求.常用的测试方法如下: 1.页面连接检查:每一个连接是否都有对应的页面,并且页面之间切换正确. ...
- 典藏版Web功能测试用例库
界面显示 初始界面元素:title.内容,默认值.必填项(红*) 样式美观 排版规范 字体统一 编辑页面有光标,定位在第一个可编辑文本框 内容过多时,滚动条 loading ...
- casperjs进行web功能自动化测试demo
通过一周多的学习和总结,终于掌握了casperjs用于自动化的方法,填平了大大小小的各种坑. casperjs是一个新兴的测试框架,网上资料很少,基本上靠翻译英文资料. 贡献出来,供大家参考: / ...
- 利用js日期控件重构WEB功能
开发需求:网页中的日期部门(注册页面和查询条件)都用js日期控件重写 页面一:更新员工页面 empUpdate.jsp 中增加 onfocus 事件 入职日期:<input id="h ...
- node 开发web 登陆功能
node.js基于express框架搭建一个简单的注册登录Web功能 这个小应用使用到了node.js bootstrap express 以及数据库的操作 :使用mongoose对象模型来操作 ...
随机推荐
- RabbitMQ（二） -- Work Queues
RabbitMQ(一) -- Work Queues RabbitMQ使用Work Queues的主要目的是为了避免资源使用密集的任务,它不同于定时任务处理的方式,而是把任务封装为消息添加到队列中.而 ...
- 狗日的js的闭包
一.变量的作用域 要懂得闭包,起首必须懂得Javascript特别的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript说话的特别之处,就在于函数内部可以直接读取全局变量 ...
- inline-block使标签间出现空白
HTML Markup <ul> <li>item1</li> <li>item2</li> <li>item3</li& ...
- 利用模拟退火提高Kmeans的聚类精度
http://www.cnblogs.com/LBSer/p/4605904.html Kmeans算法是一种非监督聚类算法,由于原理简单而在业界被广泛使用,一般在实践中遇到聚类问题往往会优先使用Km ...
- iOS开发---集成百度地图，位置偏移问题
iOS 集成百度SDK 请参考 百度地图官方文档 ,这里不就多啰嗦了 本文介绍的是在百度地图上根据经纬度,自定义气泡时,气泡位置的偏移,在我们天朝这种事是很常见的,也见怪不怪了,在项目中使用的百度地图 ...
- iOS开发- 三步快速集成社交化分享工具ShareSDK
1.前言 作为现在App里必不可少的用户分享需要,社交化分享显然是我们开发app里较为常用的. 最近因为公司App有社交化分享的需要,就特此研究了会,拿出来与大家分享. 想要集成社交会分享,我们可以使 ...
- Java插件开发-取插件下的某个文件
//找到插件所在处 Bundle bundle = Activator.getDefault().getBundle(); //根据插件转义成URL路径 URL url = FileLocator.t ...
- UIBarButtonItem-添加自定义Left或者Right按钮
为UINavigationController添加UINavigationItem,我们可以这样写: 1.添加返回导航按钮backBarButtonItem 1.用系统自带的返回按钮 UIBa ...
- 最近碰到了一个病毒木马：virus.win32.ramnit.B
由于 使用了 简单游 平台上的挂机工具: 番茄-自动人机对战免费版1217 ,使用了很久,头段时间家里电脑 360提示有病毒,本来我一直忽略的,但 我扫描了一下,大量的这个木马,于是 吧 简单游卸载 ...
- checkbox的三种状态处理
checkbox只有两种值:选中(checked)或未选中(unchecked).它可以有任何值,但是表单提交时checkbox的值只能是checked或unchecked.它的默认值是uncheck ...