* change tree UI.

This commit is contained in:
Catouse
2016-04-27 11:39:13 +08:00
parent dfe818bd11
commit 1b4639d5f9
4 changed files with 194 additions and 120 deletions
+21 -2
View File
@@ -104,12 +104,15 @@ 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->branch = $branch;
$this->view->parentModules = $parentModules;
$this->view->tree = $this->tree->getFullTrees($rootID, $viewType);
$this->display();
}
@@ -128,11 +131,20 @@ class tree extends control
$project = $this->loadModel('project')->getById($rootID);
$this->view->root = $project;
$products = $this->project->getProducts($rootID);
$this->view->products = $products;
$this->lang->set('menugroup.tree', 'project');
$this->project->setMenu($this->project->getPairs(), $rootID);
$this->lang->tree->menu = $this->lang->project->menu;
$this->lang->tree->menuOrder = $this->lang->project->menuOrder;
$projects = $this->project->getPairs();
unset($projects[$rootID]);
$currentProject = key($projects);
$parentModules = $this->tree->getParents($currentModuleID);
$newModule = (version_compare($project->openedVersion, '4.1', '>') and $products) ? true : false;
$title = $project->name . $this->lang->colon . $this->lang->tree->manageProject;
$position[] = html::a($this->createLink('project', 'task', "projectID=$rootID"), $project->name);
$position[] = $this->lang->tree->manageProject;
@@ -141,10 +153,17 @@ class tree extends control
$this->view->position = $position;
$this->view->rootID = $rootID;
$this->view->productID = $productID;
$this->view->allProject = $projects;
$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->parentModules = $parentModules;
$this->view->currentModuleID = $currentModuleID;
$this->view->tree = $this->tree->getFullTaskTree($rootID, $productID);
$this->display();
}
}
/**
* Edit a module.
+3 -5
View File
@@ -15,8 +15,6 @@ table.copy td .form-control {border-right: 0}
.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}
#childrenForm table .chosen-container .chosen-single {border-right-color: transparent}
#childrenForm table .chosen-container .chosen-single {border-right-color: transparent}
#childrenForm .col-table + .col-table .form-control {border-left: transparent;}
+92 -65
View File
@@ -13,65 +13,100 @@
<?php include '../../common/view/header.html.php';?>
<?php $hasBranch = (strpos('story|bug|case', $viewType) !== false and $root->type != 'normal') ? true : false;?>
<div id='featurebar'>
<div class='heading'><i class='icon-cogs'></i> <?php echo $title;?> </div>
<div class='heading'><?php echo $lang->tree->common;?></div>
</div>
<div class='main'>
<div class='panel'>
<div class='panel-body'>
<div class='container'>
<ul class='tree-lines' id='modulesTree'></ul>
<div class='row'>
<div class='col-sm-6 col-md-4 col-lg-3'>
<div class='panel'>
<div class='panel-heading'><i class='icon-cog'></i> <strong><?php echo $title;?></div>
<div class='panel-body'>
<div class='container'>
<ul class='tree-lines' id='modulesTree'></ul>
</div>
</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 class='col-sm-6 col-md-8 col-lg-9'>
<form id='childrenForm' 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>
<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
echo html::submitButton() . html::commonButton($lang->close, 'data-dismiss="modal"', 'btn');
echo html::hidden('maxOrder', $maxOrder);
echo html::hidden('parentModuleID', $currentModuleID);
?>
</div>
</form>
</div>
</div>
</form>
</div>
</div>
</div>
<script>
$(function()
{
@@ -105,8 +140,9 @@ $(function()
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>'
template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-sitemap"></i>',
linkTemplate: '<?php echo helper::createLink('tree', 'browse', "rootID=$rootID&viewType=$viewType&currentModuleID={0}"); ?>',
templateInList: false
},
"delete":
{
@@ -132,16 +168,7 @@ $(function()
}
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');
window.location.href = action.linkTemplate.format(item.id);
}
else if(action.type === 'sort')
{
+78 -48
View File
@@ -12,47 +12,85 @@
?>
<?php include '../../common/view/header.html.php';?>
<div id='featurebar'>
<div class='heading'><i class='icon-cogs'></i> <?php echo $title;?> </div>
<div class='heading'><?php echo $lang->tree->common;?></div>
</div>
<div class='main'>
<div class='panel'>
<div class='panel-body'>
<div class='container'>
<div class='row'>
<div class='col-sm-6 col-md-4 col-lg-3'>
<div class='panel'>
<div class='panel-heading'><i class='icon-cog'></i> <strong><?php echo $title;?></strong></div>
<div class='panel-body'>
<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 class='col-sm-6 col-md-8 col-lg-9'>
<form id='childrenForm' 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>
<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
echo html::submitButton() . html::commonButton($lang->close, 'data-dismiss="modal"', 'btn');
echo html::hidden('maxOrder', 0);
echo html::hidden('parentModuleID', $currentModuleID);
?>
</div>
</form>
</div>
</div>
</form>
</div>
</div>
<style>
@@ -102,9 +140,10 @@ $(function()
},
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>'
title: '<?php echo $lang->tree->manageChild ?>',
template: '<a data-toggle="tooltip" href="javascript:;"><i class="icon icon-sitemap"></i>',
linkTemplate: '<?php echo helper::createLink('tree', 'browsetask', "rootID=$rootID&productID=$productID&currentModuleID={0}"); ?>',
templateInList: false
},
"delete":
{
@@ -130,16 +169,7 @@ $(function()
}
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');
window.location.href = action.linkTemplate.format(item.id);
}
else if(action.type === 'sort')
{