OrgChart 组织架构与PHP结合使用

一、OrgChart下载地址：

https://github.com/dabeng/OrgChart

二、组织架构的表设计

CREATE TABLE `org_info` (

`id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT '组织ID',

`name` varchar(36) NOT NULL DEFAULT '' COMMENT '组织名称',

`content` varchar(256) NOT NULL DEFAULT '' COMMENT '组织内容',

`pid` int(11) NOT NULL DEFAULT '0' COMMENT '父级ID',

`path` varchar(256) NOT NULL DEFAULT '' COMMENT '父级路径(逗号分割)',

PRIMARY KEY (`id`),

KEY `path` (`path`)

) ENGINE=MyISAM AUTO_INCREMENT=22 DEFAULT CHARSET=utf8 COMMENT='组织信息表';

三、index.html代码如下：

<!DOCTYPE HTML>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title></title>

    <link rel="stylesheet" href="./css/jquery.orgchart.css" />

    <style type="text/css">

    .orgchart {background-image:none; border: 1px dashed #ccc;}

    .orgchart td.left {border-left: 1px solid #518fcc;}

    .orgchart td.right {border-right: 1px solid #518fcc;}

    .orgchart td.top {border-top: 2px solid #518fcc;}

    .orgchart td>.down {background-color: #518fcc;}

    .orgchart .node .title {background-color:#518fcc;}

    .orgchart .node .content {border: 1px solid #518fcc;}

    </style>

</head>

<body>

    <div class="org-act">

        <form class="org-act-frm">

            <table>

                <tr>

                    <td>

                        当前节点：<input type="text" name="curNodeName" value="" />

                        <input type="hidden" name="curNodeId" value="" />

                    </td>

                    <td>部门名称：<input type="text" name="orgName" value="" /></td>

                </tr>

                <tr>

                    <td colspan="2">

                        <input type="radio" name="addOrgType" value="sub" />子部门

                        <input type="radio" name="addOrgType" value="sib" />同级部门

                    </td>

                </tr>

                <tr>

                    <td colspan="2">

                        <input type="button" name="addOrgAct" data="add" value="添加" />

                        <input type="button" name="addOrgAct" data="del" value="删除" />

                        <input type="button" name="addOrgAct" data="edt" value="编辑" />

                        <input type="reset" name="reset" value="重置" />

                    </td>

                </tr>

            </table>

        </form>

    </div>

    <div class="org"></div>

</body>

<script type="text/javascript" src="./js/jquery.js"></script>

<script type="text/javascript" src="./js/jquery.orgchart.js"></script>

<script type="text/javascript">

$(function() {

    $(".org-act-frm input[name='addOrgAct']").on("click", function() {

        var curNodeName = $.trim($(".org-act-frm input[name='curNodeName']").val());

        var curNodeId = $.trim($(".org-act-frm input[name='curNodeId']").val());

        var orgName = $.trim($(".org-act-frm input[name='orgName']").val());

        var addOrgType = $.trim($(".org-act-frm input[name='addOrgType']:checked").val());

        var addOrgAct = $.trim($(this).attr("data"));

        $.post("./data.php?act=orgFrm", {

            "curNodeName":curNodeName,

            "curNodeId":curNodeId,

            "orgName":orgName,

            "addOrgType":addOrgType,

            "addOrgAct":addOrgAct

        }, function(data) {

            if(data) {

                var org = $(".org");

                var selNode = $(".org .node").filter(".focused");

                if(!selNode.length) {

                    selNode = $(".org tr:eq(0)").find(".node");

                }

                data = eval("(" + data + ")");

                if(addOrgAct == "add") {

                    if(addOrgType == "sib") {

                        org.orgchart("addSiblings", selNode, {"siblings":[data]});

                    } else {

                        var hasChild = selNode.parent().attr('colspan') > 0 ? true : false;

                        if (!hasChild) {

                            org.orgchart("addChildren",

                            selNode,

                            {"children":[data]});

                        } else {

                            org.orgchart("addSiblings",

                            selNode.closest('tr').siblings('.nodes').find('.node:first'),

                            {"siblings":[data]});

                        }

                    }

                } else if(addOrgAct == "del") {

                    org.orgchart("removeNodes", selNode);

                } else if(addOrgAct == "edt") {

                    selNode.children(".title").text(orgName);

                }

            }

        });

    });

    $(".org").on("click", ".node", function() {

        var nodeId = $(this).attr("id");

        var nodeName = $(this).children("div.title").text();

        $(".org-act-frm input[name='curNodeId']").val(nodeId);

        $(".org-act-frm input[name='curNodeName']").val(nodeName);

    });

    function flushOrg() {

        $.get("./data.php?act=getData&r=" + Math.random(), function(data) {

            if(data) {

                data = eval("(" + data + ")");

            } else {

                data = {};

            }

            $(".org").orgchart({

                "data" : data,

                "nodeId": "id"

            });

        });

    }

    flushOrg();

});

</script>

</html>

四、data.php代码如下：

<?php

$db = mysql_connect('127.0.0.1', 'root', '') or die('connect error');

mysql_select_db('test') or die('select db error');

mysql_query('set names utf8') or die('set names error');

$act = !empty($_GET['act']) ? trim($_GET['act']) : '';

function genTree($items, $id = 'id', $pid = 'pid', $son = 'child') {

    $tree = array();

    $tmpMap = array();

    foreach ($items as $item) {

        $tmpMap[$item[$id]] = $item;

    }

    foreach ($items as $item) {

        if (isset($tmpMap[$item[$pid]])) {

            $tmpMap[$item[$pid]][$son][] = &$tmpMap[$item[$id]];

        } else {

            $tree[] = &$tmpMap[$item[$id]];

        }

    }

    unset($tmpMap);

    return $tree;

}

if($act == 'getData') {

    //获取组织数据

    $sql = "SELECT `id`,`name`,`pid` FROM `org_info`";

    $ret = mysql_query($sql);

    $data = array();

    while($row = mysql_fetch_assoc($ret)) {

        $data[] = $row;

    }

    $data = genTree($data, 'id', 'pid', 'children');

    $obj = new StdClass();

    $obj->name = 'xxx有限公司';

    $obj->children = $data;

    echo json_encode($obj);

} else if($act == 'orgFrm') {

    //处理组织表单

    $addOrgAct = !empty($_POST['addOrgAct']) ? trim($_POST['addOrgAct']) : '';

    //判断表单方法是否为空

    if(empty($addOrgAct)) {

        exit;

    }

    //当前节点名

    $curNodeName = !empty($_POST['curNodeName']) ? trim($_POST['curNodeName']) : '';

    //当前节点ID

    $curNodeId = !empty($_POST['curNodeId']) ? trim($_POST['curNodeId']) : 0;

    //组织名称

    $orgName = !empty($_POST['orgName']) ? trim($_POST['orgName']) : '';

    if($addOrgAct == 'add') {

        $addOrgType = !empty($_POST['addOrgType']) ? trim($_POST['addOrgType']) : '';

        if(empty($orgName)) {

            exit;

        }

        if($addOrgType == 'sib') {

            //添加兄弟节点

            if(empty($curNodeId)) {

                exit;

            }

            //获取兄弟节点的pid和path

            $sql = "SELECT `pid`,`path` FROM `org_info` WHERE `id`={$curNodeId}";

            $ret = mysql_query($sql);

            $row = mysql_fetch_assoc($ret);

            $path = $row['path'];

            $pid = $row['pid'];

            //添加节点

            $sql = "INSERT INTO `org_info`(`name`, `pid`, `path`) VALUES('{$orgName}', {$pid}, '{$path}')";

            mysql_query($sql);

            $nodeId = mysql_insert_id();

            if(mysql_affected_rows()) {

                $obj = new StdClass();

                $obj->name = $orgName;

                $obj->id = $nodeId;

                echo json_encode($obj);

                exit;

            }

        } else {

            //添加子节点

            //获取当前节点的path

            $sql = "SELECT `path` FROM `org_info` WHERE `id`={$curNodeId}";

            $ret = mysql_query($sql);

            $row = mysql_fetch_assoc($ret);

            $path = $row['path'];

            $path = !empty($path) ? (rtrim($path, ',') . ',' . $curNodeId) : $curNodeId;

            $pid = $curNodeId;

            //添加节点

            $sql = "INSERT INTO `org_info`(`name`, `pid`, `path`) VALUES('{$orgName}', {$pid}, '{$path}')";

            mysql_query($sql);

            $nodeId = mysql_insert_id();

            if(mysql_affected_rows()) {

                $obj = new StdClass();

                $obj->name = $orgName;

                $obj->id = $nodeId;

                echo json_encode($obj);

                exit;

            }

        }

    } else if($addOrgAct == 'del') {

        //删除所有有父节点中有该节点的子节点

        $sql = "DELETE FROM `org_info` WHERE FIND_IN_SET('{$curNodeId}',`path`) OR `id`={$curNodeId}";

        mysql_query($sql);

        if(mysql_affected_rows()) {

            $obj = new StdClass();

            $obj->name = $orgName;

            $obj->id = $curNodeId;

            echo json_encode($obj);

            exit;

        }

    } else if($addOrgAct == 'edt') {

        if(empty($orgName)) {

            exit;

        }

        //更新节点

        $sql = "UPDATE `org_info` SET `name`='{$orgName}' WHERE `id`={$curNodeId}";

        mysql_query($sql);

        if(mysql_affected_rows()) {

            $obj = new StdClass();

            $obj->name = $orgName;

            $obj->id = $curNodeId;

            echo json_encode($obj);

            exit;

        }

    }

}

五、效果如下：

OrgChart 组织架构与PHP结合使用的更多相关文章

PHP Yii框架开发——组织架构网站重构
最近一段时间在维护公司的组织架构网站(Org),旧版网站只是用了xampp简单搭建了一套环境部署在了windows机器上,代码结构相对简单. 整个架构如下: 整个架构没有用到复杂的结构,class里放 ...
ASP.NET MVC5+EF6+EasyUI 后台管理系统（41）-组织架构
系列目录本节开始我们要实现工作流,此工作流可以和之前的所有章节脱离关系,也可以紧密合并. 我们当初设计的项目解决方案就是可伸缩可以拆离,可共享的项目解决方案.所以我们同时要添加App.Flow文件夹 ...
Atittit.研发公司的组织架构与部门架构总结
Atittit.研发公司的组织架构与部门架构总结 1. archi组织架构与部门规划2 1.1. 最高五大组织机构2 1.2. 宗教事务部2 1.3. 制度与重大会议委员会2 1.4. 纠纷处理部: ...
使用jOrgChart插件实现组织架构图的展示
项目要做组织架构图,要把它做成自上而下的树形结构. 一.说明 (1)通过后台查询数据库,生成树形数组结构,返回到前台. (2)需要引入的js插件和css文件: ①jquery.jOrgChart.cs ...
2，SFDC 管理员篇 - 组织架构
1,组织架构 Setup | Administrator | Manage User| Role 组织层级有三种模式,基于区域划分,基于产品划分,基于公司规模划分层级(目标客户群体划分层级或渠道划分) ...
Oracle 组织架构(转)
原文地址:Oracle 组织架构我们先来看一下实际生活中的集团组织架构. 下图是一个典型的投资集团组织架构. 集团在各个国家有独立的法人. 每个法人会负责若干个业务进行,比如石油开采,汽车制造,软件 ...
两个和尚抬水有水喝，三个和尚抬水没水喝------IT项目管理之组织架构
说到项目经理岗位,一般的想法是,一个项目只能有一个项目经理,否则责任不明,互相推诿.偏偏IT项目需要有两个甚至三个项目经理.原因何在呢? 典型的IT项目(不包含纯技术或工具类项目)是把用户的需求转化成 ...
构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统（41）-组织架构
原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(41)-组织架构本节开始我们要实现工作流,此工作流可以和之前的所有章节脱离关系,也可以紧密合并. 我们当 ...
在Activiti中如何使用自定义的组织架构
1.概述我们知道,activiti是一个不错的流程引擎,它有自身的人员组织架构,但仅限于用户.用户组的管理,流程产生的任务(UserTask),就涉及到任务的所属人(Owner),任务的执行人(as ...

随机推荐

关于javascript的cookie的封装
/******************cookie*********************/ /* cookie的组成部分: 名称:唯一值,不区分大小写,必须经过URL编码值:必须经过URL编码 ...
【BZOJ】1975 [Sdoi2010]魔法猪学院（A*）
题目传送门:QWQ 分析 k短路,Astar.估价函数是终点向外跑的最短路. 显然不是正解qwq. 代码 // By noble_ // Astar algorithm // #include &l ...
PHP提取多维数组指定一列的方法大全
目录 1 array_column函数法 2 array_walk函数法 3 array_map函数法 4 foreach循环法 5 array_map变种 PHP中对多维数组特定列的提取,是个很常用 ...
selenium+python自动化91-unittest多线程生成报告（BeautifulReport）
前言 selenium多线程跑用例,这个前面一篇已经解决了,如何生成一个测试报告这个是难点,刚好在github上有个大神分享了BeautifulReport,完美的结合起来,就能生成报告了. 环境必备 ...
msq_table's methods
-- 查看有哪些用户 host: % 代表任意地址都可以登录 host: localhost 代表仅本地可以连接select host,user from mysql.user; -- 建库 crea ...
CUDA C Programming Guide 在线教程学习笔记 Part 10【坑】
▶ 动态并行. ● 动态并行直接从 GPU 上创建工作,可以减少主机和设备间数据传输,在设备线程中调整配置.有数据依赖的并行工作可以在内核运行时生成,并利用 GPU 的硬件调度和负载均衡.动态并行要求 ...
leetcode150
public class Solution { public int EvalRPN(string[] tokens) { Stack<int> ST_NUM = new Stack< ...
Win10 C盘根目录权限
cmd管理员运行 icacls c:\ /setintegritylevel M c盘属性,安全,完全控制.
AES 加密256位错误 java.security.InvalidKeyException: Illegal key size or default parameters
Java发布的运行环境包中的加解密有一定的限制.比如默认不允许256位密钥的AES加解密,解决方法就是修改策略文件. 官方网站提供了JCE无限制权限策略文件的下载: JDK8的下载地址: http:/ ...
sts，eclipse里面配置tomcat
第一步:点击window-->preferences-->server-->Runtime Environments点击add. 第二步:选择本机上面有的tomcat版本点击next ...

OrgChart 组织架构与PHP结合使用

OrgChart 组织架构与PHP结合使用的更多相关文章

随机推荐

热门专题