Merge branch 'master' of github.com:easysoft/zentaopms

2016-04-12 17:35:08 +08:00
parent 23ee51e7ea e87801ebd1
commit ceeeb89435
11 changed files with 393 additions and 185 deletions
@@ -446,6 +446,12 @@ class deptModel extends model
        }
    }

+    /**
+     * Get full department tree
+     * @param  integer $rootDeptID
+     * @access public
+     * @return object
+     */
    public function getFullTree($rootDeptID = 0) 
    {
        $tree = array_values($this->getSons($rootDeptID));
@@ -43,6 +43,7 @@ $lang->doc->delete         = 'Delete doc';
 $lang->doc->browse         = 'Browse doc';
 $lang->doc->view           = 'View doc';
 $lang->doc->manageType     = 'Manage type';
+$lang->doc->addType        = 'Add type';

 $lang->doc->libName        = 'Library name';
 $lang->doc->createLib      = 'Create library';
@@ -43,6 +43,7 @@ $lang->doc->delete         = '删除文档';
 $lang->doc->browse         = '文档列表';
 $lang->doc->view           = '文档详情';
 $lang->doc->manageType     = '维护分类';
+$lang->doc->addType        = '增加分类';

 $lang->doc->libName        = '文档库名称';
 $lang->doc->createLib      = '创建文档库';
@@ -104,16 +104,13 @@ class tree extends control
            $position[] = $this->lang->tree->manageCustomDoc;
        }

-        $parentModules = $this->tree->getParents($currentModuleID);
        $this->view->title           = $title;
        $this->view->position        = $position;
        $this->view->rootID          = $rootID;
        $this->view->viewType        = $viewType;
-        $this->view->modules         = $this->tree->getTreeMenu($rootID, $viewType, $rooteModuleID = 0, array('treeModel', 'createManageLink'));
-        $this->view->sons            = $this->tree->getSons($rootID, $currentModuleID, $viewType, $branch);
        $this->view->currentModuleID = $currentModuleID;
-        $this->view->parentModules   = $parentModules;
        $this->view->branch          = $branch;
+        $this->view->tree            = $this->tree->getFullTree($rootID, $viewType, $branch);
        $this->display();
    }

@@ -157,10 +154,8 @@ class tree extends control
        $this->view->newModule       = $newModule;
        $this->view->currentProject  = $currentProject;
        $this->view->projectModules  = $this->tree->getTaskOptionMenu($currentProject, $productID);
-        $this->view->modules         = $this->tree->getTaskTreeMenu($rootID, $productID, $rooteModuleID = 0, array('treeModel', 'createTaskManageLink'));
-        $this->view->sons            = $this->tree->getTaskSons($rootID, $productID, $currentModuleID);
        $this->view->currentModuleID = $currentModuleID;
-        $this->view->parentModules   = $parentModules;
+        $this->view->tree            = $this->tree->getFullTaskTree($rootID, $productID);
        $this->display();
    }

@@ -9,3 +9,14 @@
 .w-260px {width: 260px!important}
 table.copy td {padding: 0!important}
 table.copy td .form-control {border-right: 0}
+
+.tree .module-name {font-weight: 500}
+.tree-toggle {cursor: pointer;}
+.tree li:hover > .tree-actions {opacity: 0}
+.tree li.hover > .tree-actions {opacity: 1}
+
+#addChildModal form > .form-control, #addChildModal form > .row-table {margin-bottom: 8px;}
+#addChildModal .modal-dialog {max-width: 500px;}
+#addChildModal form .col-table + .col-table .form-control {border-left: transparent;}
+#addChildModal .pull-right {margin-right: 15px; margin-top: -4px;}
+#addChildModal table .chosen-container .chosen-single {border-right-color: transparent}
@@ -29,6 +29,8 @@ $lang->tree->manageBugChild    = 'Manage bug child';
 $lang->tree->manageCaseChild   = 'Manage case child';
 $lang->tree->manageTaskChild   = "Manage {$lang->projectCommon} child";
 $lang->tree->syncFromProduct   = 'Copy';
+$lang->tree->dragAndSort       = "Drag and sort";
+$lang->tree->addChild          = "Add child module";

 $lang->tree->confirmDelete = 'Are you sure to delete this module and its children?';
 $lang->tree->confirmRoot   = "Modify the module {$lang->productCommon}s, modified the {$lang->productCommon}s belong to the needs of the module, bug, use case, and {$lang->projectCommon} and {$lang->productCommon} relationship. This is dangerous, please be careful. To confirm the change?";
@@ -29,6 +29,8 @@ $lang->tree->manageBugChild    = '维护Bug子模块';
 $lang->tree->manageCaseChild   = '维护用例子模块';
 $lang->tree->manageTaskChild   = "维护{$lang->projectCommon}子模块";
 $lang->tree->syncFromProduct   = '复制';
+$lang->tree->dragAndSort       = "拖放排序";
+$lang->tree->addChild          = "增加子模块";

 $lang->tree->confirmDelete = '该模块及其子模块都会被删除，您确定删除吗？';
 $lang->tree->confirmRoot   = "模块的所属{$lang->productCommon}修改，会关联修改该模块下的需求、Bug、用例的所属{$lang->productCommon}，以及{$lang->projectCommon}和{$lang->productCommon}的关联关系。该操作比较危险，请谨慎操作。是否确认修改？";
@@ -427,6 +427,37 @@ class treeModel extends model
        return $menu;
    }

+    /**
+     * Get full task tree
+     * @param  integer $rootID, common value is project id
+     * @param  integer $productID
+     * @param  integer $moduleID
+     * @access public
+     * @return object
+     */
+    public function getFullTaskTree($rootID, $productID, $moduleID = 0) 
+    {
+        $tree = array_values($this->getTaskSons($rootID, $productID, $moduleID));
+        if(!$moduleID)
+        {
+            // TODO: get product moduels for the project
+            $productModulesTree = array();
+            $tree = array_merge($tree, $productModulesTree);
+        }
+        if(count($tree))
+        {
+            foreach ($tree as $node)
+            {
+                $children = $this->getFullTaskTree($rootID, $productID, $node->id);
+                if(count($children))
+                {
+                    $node->children = $children;
+                }
+            }
+        }
+        return $tree; 
+    }
+
    /**
     * Get project story tree menu.
     * 
@@ -1384,4 +1415,30 @@ class treeModel extends model
        }
        return false;
    }
+
+    /**
+     * Get full modules tree
+     * @param  integer $rootID
+     * @param  integer $currentModuleID
+     * @param  string  $viewType
+     * @param  string  $branch
+     * @access public
+     * @return object
+     */
+    public function getFullTree($rootID, $viewType, $branch, $currentModuleID) 
+    {
+        $tree = array_values($this->getSons($rootID, $currentModuleID, $viewType, $branch));
+        if(count($tree))
+        {
+            foreach ($tree as $node)
+            {
+                $children = $this->getFullTree($rootID, $viewType, $branch, $node->id);
+                if(count($children))
+                {
+                    $node->children = $children;
+                }
+            }
+        }
+        return $tree; 
+    }
 }
@@ -12,106 +12,176 @@
 ?>
 <?php include '../../common/view/header.html.php';?>
 <?php $hasBranch = (strpos('story|bug|case', $viewType) !== false and $root->type != 'normal') ? true : false;?>
-<div id='titlebar'>
-  <div class='heading'><i class='icon-cogs'></i> <?php echo $lang->tree->common;?>  </div>
+<div id='featurebar'>
+  <div class='heading'><i class='icon-cogs'></i> <?php echo $title;?>  </div>
 </div>
-<div class='row'>
-  <div class='col-sm-6 col-md-4 col-lg-3'>
-    <form class='form-condensed' method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'updateOrder', "root={$root->id}&viewType=$viewType");?>'>
-      <div class='panel'>
-        <div class='panel-heading'>
-          <i class='icon-cog'></i> <strong><?php echo $title;?></strong>
-        </div>
-        <div class='panel-body'>
-          <div id='main'><?php echo $modules;?></div>
+<div class='main'>
+  <div class='panel'>
+    <div class='panel-body'>
+      <div class='container'>
+        <ul class='tree-lines' id='modulesTree'></ul>
+      </div>
+    </div>
+  </div>
+</div>
+<div class='modal fade' id='addChildModal'>
+  <div class='modal-dialog'>
+    <div class='modal-content'>
+      <div class='modal-header'>
+        <button type='button' class='close' data-dismiss='modal'><span aria-hidden='true'>×</span></button>
+        <h4 class='modal-title'><i class='icon-sitemap'></i> <span class='module-name'></span> <i class="icon icon-angle-right"></i>
+        <?php echo strpos($viewType, 'doc') !== false ? $lang->doc->addType : $lang->tree->addChild;?>
+        <?php if($viewType == 'story' and $allProduct):?>
+        <div class='pull-right'><?php echo html::a('javascript:toggleCopy()', $lang->tree->syncFromProduct, '', "class='btn btn-sm'")?></div>
+        <?php endif;?>
+        </h4>
+      </div>
+      <div class='modal-body'>
+        <form method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'manageChild', "root={$root->id}&viewType=$viewType");?>' class='form-condensed'>
+          <?php
+          if($viewType == 'story' and $allProduct)
+          {
+              echo "<table class='copy w-p100'><tr>";
+              echo "<td class='w-260px'>" . html::select('allProduct', $allProduct, '', "class='form-control chosen' onchange=\"syncProductOrProject(this,'product')\"") . '</td>';
+              echo "<td class='w-200px'>" . html::select('productModule', $productModules, '', "class='form-control chosen'") . '</td>';
+              echo "<td class=''>" . html::commonButton($lang->tree->syncFromProduct, "id='copyModule' onclick='syncModule($currentProduct, \"story\")'") . '</td>';
+              echo '</tr></table>';
+          }
+          $maxOrder = 0;
+          for($i = 0; $i < TREE::NEW_CHILD_COUNT ; $i ++)
+          {
+              echo "<div class='row-table'>";
+              echo "<div class='col-table'>" . html::input("modules[]", '', "class='form-control' placeholder='{$lang->tree->name}'") . '</div>';
+              if($hasBranch) echo '<div class="col-table">' . html::select("branch[]", $branches, $branch, 'class="form-control"') . '</div>';
+              echo "<div class='col-table' style='width:120px'><div class='input-group'>" . html::input("shorts[]", '', "class='form-control' placeholder='{$lang->tree->short}'");
+              echo "<span class='input-group-addon fix-border'><a href='javascript:;' onclick='addItem(this)'><i class='icon icon-plus'></i></a></span>";
+              echo "<span class='input-group-addon'><a href='javascript:;' onclick='deleteItem(this)'><i class='icon icon-remove'></i></a></span>";
+              echo '</div></div>';
+              echo '</div>';
+          }
+          ?>
          <div class='text-center'>
-            <?php if(common::hasPriv('tree', 'updateorder')) echo html::submitButton($lang->tree->updateOrder);?>
+            <?php 
+            echo html::submitButton() . html::commonButton($lang->close, 'data-dismiss="modal"', 'btn');
+            echo html::hidden('maxOrder', $maxOrder);
+            echo html::hidden('parentModuleID', $currentModuleID);
+            ?>
          </div>
-        </div>
+        </form>
      </div>
-    </form>
-  </div>
-  <div class='col-sm-6 col-md-8 col-lg-9'>
-    <form class='form-condensed' method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'manageChild', "root={$root->id}&viewType=$viewType");?>'>
-      <div class='panel'>
-        <div class='panel-heading'>
-          <i class='icon-sitemap'></i> 
-          <?php $manageChild = 'manage' . ucfirst($viewType) . 'Child';?>
-          <?php echo strpos($viewType, 'doc') !== false ? $lang->doc->manageType : $lang->tree->$manageChild;?>
-          <?php if($viewType == 'story' and $allProduct):?>
-          <div class='panel-actions pull-right'><?php echo html::a('javascript:toggleCopy()', $lang->tree->syncFromProduct, '', "class='btn btn-sm'")?></div>
-          <?php endif;?>
-        </div>
-        <div class='panel-body'>
-          <table class='table table-form'>
-            <tr>
-              <td class='parentModule'>
-                <nobr>
-                <?php
-                echo html::a($this->createLink('tree', 'browse', "root={$root->id}&viewType=$viewType"), $root->name);
-                echo $lang->arrow;
-                foreach($parentModules as $module)
-                {
-                    echo html::a($this->createLink('tree', 'browse', "root={$root->id}&viewType=$viewType&moduleID=$module->id"), $module->name);
-                    echo $lang->arrow;
-                }
-                ?>
-                </nobr>
-              </td>
-              <td id='moduleBox'> 
-                <?php
-                if($viewType == 'story' and $allProduct)
-                {
-                    echo "<table class='copy w-p100'><tr>";
-                    echo "<td class='w-260px'>" . html::select('allProduct', $allProduct, '', "class='form-control chosen' onchange=\"syncProductOrProject(this,'product')\"") . '</td>';
-                    echo "<td class='w-200px'>" . html::select('productModule', $productModules, '', "class='form-control chosen'") . '</td>';
-                    echo "<td class=''>" . html::commonButton($lang->tree->syncFromProduct, "id='copyModule' onclick='syncModule($currentProduct, \"story\")'") . '</td>';
-                    echo '</tr></table>';
-                }
-                $maxOrder = 0;
-                echo '<div id="sonModule">';
-                foreach($sons as $sonModule)
-                {
-                    if($sonModule->order > $maxOrder) $maxOrder = $sonModule->order;
-                    $disabled = $sonModule->type == $viewType ? '' : 'disabled';
-                    echo "<div class='row-table' style='margin-bottom:5px'>";
-                    echo "<div class='col-table'>" . html::input("modules[id$sonModule->id]", $sonModule->name, 'class="form-control"' . $disabled) . '</div>';
-                    if($hasBranch) echo "<div class='col-table'>" . html::select("branch[id$sonModule->id]", $branches, $sonModule->branch, 'class="form-control" disabled') . '</div>';
-                    echo "<div class='col-table' style='width:70px'>" . html::input("shorts[id$sonModule->id]", $sonModule->short, "class='form-control' placeholder='{$lang->tree->short}' $disabled") . '</div>';
-                    echo '</div>';
-                }
-                for($i = 0; $i < TREE::NEW_CHILD_COUNT ; $i ++)
-                {
-                    echo "<div class='row-table' style='margin-bottom:5px'>";
-                    echo "<div class='col-table'>" . html::input("modules[]", '', "class='form-control' placeholder='{$lang->tree->name}'") . '</div>';
-                    if($hasBranch) echo '<div class="col-table">' . html::select("branch[]", $branches, $branch, 'class="form-control"') . '</div>';
-                    echo "<div class='col-table' style='width:120px'><div class='input-group'>" . html::input("shorts[]", '', "class='form-control' placeholder='{$lang->tree->short}'");
-                    echo "<span class='input-group-addon fix-border'><a href='javascript:;' onclick='addItem(this)'><i class='icon icon-plus'></i></a></span>";
-                    echo "<span class='input-group-addon'><a href='javascript:;' onclick='deleteItem(this)'><i class='icon icon-remove'></i></a></span>";
-                    echo '</div></div>';
-                    echo '</div>';
-                }
-                ?>
-                </div>
-              </td>
-            </tr>
-            <tr>
-              <td></td>
-              <td colspan='2'>
-                <?php 
-                echo html::submitButton() . html::backButton();
-                echo html::hidden('parentModuleID', $currentModuleID);
-                echo html::hidden('maxOrder', $maxOrder);
-                ?>      
-                <input type='hidden' value='<?php echo $currentModuleID;?>' name='parentModuleID' />
-              </td>
-            </tr>
-          </table>
-        </div>
-      </div>
-    </form>
+    </div>
  </div>
 </div>
+<script>
+$(function()
+{
+    var data = $.parseJSON('<?php echo json_encode($tree);?>');
+    var options = {
+        initialState: 'preserve',
+        data: data,
+        itemCreator: function($li, item)
+        {
+            var $toggle = $('<span class="tree-toggle"><span class="module-name" data-id="' + item.id + '">' + item.name + '</span></span>');
+            if(item.short)
+            {
+                $toggle.append('&nbsp; <span class="module-manager text-muted">(' + item.short + ')</span>');
+            }
+            $li.append($toggle);
+            return true;
+        },
+        actions: 
+        {
+            sort:
+            {
+                title: '<?php echo $lang->tree->dragAndSort ?>',
+                template: '<a class="sort-handler" data-toggle="tooltip" href="javascript:;"><i class="icon icon-move"></i>'
+            },
+            edit:
+            {
+                linkTemplate: '<?php echo helper::createLink('tree', 'edit', "moduleID={0}&type=$viewType"); ?>',
+                title: '<?php echo $lang->tree->edit ?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-pencil"></i>'
+            },
+            add:
+            {
+                title: '<?php echo strpos($viewType, 'doc') !== false ? $lang->doc->addType : $lang->tree->addChild;?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-plus"></i>',
+                templateInList: '<a href="javascript:;"><i class="icon icon-plus"></i> <?php echo strpos($viewType, 'doc') !== false ? $lang->doc->addType : $lang->tree->addChild;?></a>'
+            },
+            "delete":
+            {
+                linkTemplate: '<?php echo helper::createLink('tree', 'delete', "rootID=$rootID&moduleID={0}"); ?>',
+                title: '<?php echo $lang->tree->delete ?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-trash"></i>'
+            }
+        },
+        action: function(event)
+        {
+            var action = event.action, $target = $(event.target), item = event.item;
+            if(action.type === 'edit')
+            {
+                $target.modalTrigger(
+                {
+                    type: 'ajax',
+                    url: action.linkTemplate.format(item.id)
+                }).trigger('click');
+            }
+            else if(action.type === 'delete')
+            {
+                window.open(action.linkTemplate.format(item.id), 'hiddenwin');
+            }
+            else if(action.type === 'add')
+            {
+                var $modal = $('#addChildModal');
+                var $ul = $target.parent().is('.tree-action-item') ? $target.closest('ul') : $target.closest('li').children('ul');
+                var maxOrder = 0;
+                $ul.children('li:not(.tree-action-item)').each(function() {
+                    maxOrder = Math.max(maxOrder, $(this).data('order'));
+                });
+                $modal.find('input[name="parentModuleID"]').val(item ? item.id : 0);
+                $modal.find('input[name="maxOrder"]').val(maxOrder);
+                $modal.find('.module-name').text(item ? item.name : '');
+                $modal.modal('show');
+            }
+            else if(action.type === 'sort')
+            {
+                var orders = {};
+                $('#modulesTree').find('li:not(.tree-action-item)').each(function()
+                {
+                    var $li = $(this);
+                    var item = $li.data();
+                    orders['orders[' + item.id + ']'] = $li.attr('data-order') || item.order;
+                });
+                $.post('<?php echo $this->createLink('tree', 'updateOrder', "root={$root->id}&viewType=$viewType");?>', orders).error(function()
+                {
+                    bootbox.alert(lang.timeout);
+                });
+            }
+        }
+    };
+
+    if(<?php echo common::hasPriv('tree', 'updateorder') ? 'false' : 'true' ?>) options.actions["sort"] = false;
+
+    var $tree = $('#modulesTree').tree(options);
+
+    var tree = $tree.data('zui.tree');
+    if(!tree.store.time) tree.expand($tree.find('li:not(.tree-action-item)').first());
+    if(<?php echo $currentModuleID ?>)
+    {
+        var $currentLi = $tree.find('.module-name[data-id=' + <?php echo $currentModuleID ?> + ']').closest('li');
+        if($currentLi.length) tree.show($currentLi);
+    }
+
+    $tree.on('mouseenter', 'li:not(.tree-action-item)', function(e)
+    {
+        $('#modulesTree').find('li.hover').removeClass('hover');
+        $(this).addClass('hover');
+        e.stopPropagation();
+    });
+
+    $tree.find('[data-toggle="tooltip"]').tooltip();
+});
+</script>
 <?php 
 if(strpos($viewType, 'doc') !== false) 
 {
@@ -12,92 +12,155 @@
 ?>
 <?php include '../../common/view/header.html.php';?>
 <div id='featurebar'>
-  <div class='heading'><i class='icon-cogs'></i> <?php echo $lang->tree->common;?>  </div>
+  <div class='heading'><i class='icon-cogs'></i> <?php echo $title;?>  </div>
 </div>
-<div class='row'>
-  <div class='col-sm-6 col-md-4 col-lg-3'>
-    <form class='form-condensed' method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'updateOrder', "root={$root->id}&viewType=task");?>'>
-      <div class='panel'>
-        <div class='panel-heading'>
-          <i class='icon-cog'></i> <strong><?php echo $title;?></strong>
-        </div>
-        <div class='panel-body'>
-          <div id='main'><?php echo $modules;?></div>
+<div class='main'>
+  <div class='panel'>
+    <div class='panel-body'>
+      <div class='container'>
+        <ul class='tree-lines' id='modulesTree'></ul>
+      </div>
+    </div>
+  </div>
+</div>
+<div class='modal fade' id='addChildModal'>
+  <div class='modal-dialog'>
+    <div class='modal-content'>
+      <div class='modal-header'>
+        <button type='button' class='close' data-dismiss='modal'><span aria-hidden='true'>×</span></button>
+        <h4 class='modal-title'><span class='module-name'></span> <i class="icon icon-angle-right"></i> <?php echo $lang->tree->addChild;?></h4>
+      </div>
+      <div class='modal-body'>
+        <form method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'manageChild', "root={$root->id}&viewType=task");?>' class='form-condensed'>
+          <?php
+            for($i = 0; $i < TREE::NEW_CHILD_COUNT ; $i ++)
+            {
+                echo "<div class='row-table'>";
+                echo "<div class='col-table'>" . html::input("modules[]", '', "class='form-control' placeholder='{$lang->tree->name}'") . '</div>';
+                echo "<div class='col-table' style='width:70px'>";
+                echo html::input("shorts[]", '', "class='form-control' placeholder='{$lang->tree->short}'");
+                echo html::hidden('branch[]', empty($module) ? 0 : $module->branch);
+                echo '</div></div>';
+            }
+          ?>
          <div class='text-center'>
-            <?php if(common::hasPriv('tree', 'updateorder')) echo html::submitButton($lang->tree->updateOrder);?>
+            <?php 
+            echo html::submitButton() . html::commonButton($lang->close, 'data-dismiss="modal"', 'btn');
+            echo html::hidden('maxOrder', $maxOrder);
+            echo html::hidden('parentModuleID', $currentModuleID);
+            ?>
          </div>
-        </div>
+        </form>
      </div>
-    </form>
-  </div>
-  <div class='col-sm-6 col-md-8 col-lg-9'>
-    <form class='form-condensed' method='post' target='hiddenwin' action='<?php echo $this->createLink('tree', 'manageChild', "root={$root->id}&viewType=task");?>'>
-      <div class='panel'>
-        <div class='panel-heading'>
-          <i class='icon-sitemap'></i> 
-          <?php $manageChild = 'manageTaskChild';?>
-          <?php echo $lang->tree->$manageChild;?>
-        </div>
-        <div class='panel-body'>
-          <table class='table table-form'>
-            <tr>
-              <td class='parentModule'>
-                <nobr>
-                <?php
-                echo html::a($this->createLink('tree', 'browsetask', "root={$root->id}&productID=$productID&viewType=task"), $root->name);
-                echo $lang->arrow;
-                foreach($parentModules as $module)
-                {
-                    echo html::a($this->createLink('tree', 'browsetask', "root={$root->id}&productID=$productID&moduleID=$module->id"), $module->name);
-                    echo $lang->arrow;
-                }
-                ?>
-                </nobr>
-              </td>
-              <td id='moduleBox'> 
-                <?php
-                $maxOrder = 0;
-                if($newModule and !$productID)
-                {
-                    foreach($products as $product)
-                    {
-                        echo '<span>' . html::input("products[id$product->id]", $product->name, 'class=form-control disabled="true"') . '</span>';
-                    }
-                }
-                foreach($sons as $sonModule)
-                {
-                    if($sonModule->order > $maxOrder) $maxOrder = $sonModule->order;
-                    $disabled = $sonModule->type == 'task' ? '' : 'disabled';
-                    echo "<div class='row-table' style='margin-bottom:5px;'>";
-                    echo "<div class='col-table'>" . html::input("modules[id$sonModule->id]", $sonModule->name, "class='form-control' placeholder='{$lang->tree->name}' " . $disabled) . '</div>';
-                    echo "<div class='col-table' style='width:70px'>" . html::input("shorts[id$sonModule->id]", $sonModule->short, "class='form-control' placeholder='{$lang->tree->short}' " . $disabled) . '</div>';
-                    echo "</div>";
-                }
-                for($i = 0; $i < TREE::NEW_CHILD_COUNT ; $i ++)
-                {
-                    echo "<div class='row-table' style='margin-bottom:5px;'>";
-                    echo "<div class='col-table'>" . html::input("modules[]", '', "class='form-control' placeholder='{$lang->tree->name}'") . '</div>';
-                    echo "<div class='col-table' style='width:70px'>" . html::input("shorts[]", '', "class='form-control' placeholder='{$lang->tree->short}'") . '</div>';
-                    echo html::hidden('branch[]', empty($module) ? 0 : $module->branch) . '</div>';
-                }
-                ?>
-              </td>
-            </tr>
-            <tr>
-              <td></td>
-              <td colspan='2'>
-                <?php 
-                echo html::submitButton() . html::backButton();
-                echo html::hidden('parentModuleID', $currentModuleID);
-                echo html::hidden('maxOrder', $maxOrder);
-                ?>      
-                <input type='hidden' value='<?php echo $currentModuleID;?>' name='parentModuleID' />
-              </td>
-            </tr>
-          </table>
-        </div>
-      </div>
-    </form>
+    </div>
  </div>
 </div>
+<script>
+$(function()
+{
+    var data = $.parseJSON('<?php echo json_encode($tree);?>');
+    console.log('DATA', data);
+    var $tree = $('#modulesTree').tree(
+    {
+        initialState: 'preserve',
+        data: data,
+        itemCreator: function($li, item)
+        {
+            var $toggle = $('<span class="tree-toggle"><span class="module-name" data-id="' + item.id + '">' + item.name + '</span></span>');
+            if(item.short)
+            {
+                $toggle.append('&nbsp; <span class="module-manager text-muted">(' + item.short + ')</span>');
+            }
+            $li.append($toggle);
+            return true;
+        },
+        actions: 
+        {
+            sort:
+            {
+                title: '<?php echo $lang->tree->dragAndSort ?>',
+                template: '<a class="sort-handler" data-toggle="tooltip" href="javascript:;"><i class="icon icon-move"></i>'
+            },
+            edit:
+            {
+                linkTemplate: '<?php echo helper::createLink('tree', 'edit', "moduleID={0}&type=task"); ?>',
+                title: '<?php echo $lang->tree->edit ?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-pencil"></i>'
+            },
+            add:
+            {
+                title: '<?php echo $lang->tree->addChild ?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-plus"></i>',
+                templateInList: '<a href="javascript:;"><i class="icon icon-plus"></i> <?php echo $lang->tree->addChild ?></a>'
+            },
+            "delete":
+            {
+                linkTemplate: '<?php echo helper::createLink('tree', 'delete', "rootID=$rootID&moduleID={0}"); ?>',
+                title: '<?php echo $lang->tree->delete ?>',
+                template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-trash"></i>'
+            }
+        },
+        action: function(event)
+        {
+            var action = event.action, $target = $(event.target), item = event.item;
+            if(action.type === 'edit')
+            {
+                $target.modalTrigger(
+                {
+                    type: 'ajax',
+                    url: action.linkTemplate.format(item.id)
+                }).trigger('click');
+            }
+            else if(action.type === 'delete')
+            {
+                window.open(action.linkTemplate.format(item.id), 'hiddenwin');
+            }
+            else if(action.type === 'add')
+            {
+                var $modal = $('#addChildModal');
+                var $ul = $target.parent().is('.tree-action-item') ? $target.closest('ul') : $target.closest('li').children('ul');
+                var maxOrder = 0;
+                $ul.children('li:not(.tree-action-item)').each(function() {
+                    maxOrder = Math.max(maxOrder, $(this).data('order'));
+                });
+                $modal.find('input[name="parentModuleID"]').val(item ? item.id : 0);
+                $modal.find('input[name="maxOrder"]').val(maxOrder);
+                $modal.find('.module-name').text(item ? item.name : '');
+                $modal.modal('show');
+            }
+            else if(action.type === 'sort')
+            {
+                var orders = {};
+                $('#modulesTree').find('li:not(.tree-action-item)').each(function()
+                {
+                    var $li = $(this);
+                    var item = $li.data();
+                    orders['orders[' + item.id + ']'] = $li.attr('data-order') || item.order;
+                });
+                $.post('<?php echo $this->createLink('tree', 'updateOrder', "root={$root->id}&viewType=task");?>', orders).error(function()
+                {
+                    bootbox.alert(lang.timeout);
+                });
+            }
+        }
+    });
+
+    var tree = $tree.data('zui.tree');
+    if(!tree.store.time) tree.expand($tree.find('li:not(.tree-action-item)').first());
+    if(<?php echo $currentModuleID ?>)
+    {
+        var $currentLi = $tree.find('.module-name[data-id=' + <?php echo $currentModuleID ?> + ']').closest('li');
+        if($currentLi.length) tree.show($currentLi);
+    }
+
+    $tree.on('mouseenter', 'li:not(.tree-action-item)', function(e)
+    {
+        $('#modulesTree').find('li.hover').removeClass('hover');
+        $(this).addClass('hover');
+        e.stopPropagation();
+    });
+
+    $tree.find('[data-toggle="tooltip"]').tooltip();
+});
+</script>
 <?php include '../../common/view/footer.html.php';?>