ajaxgetkanbanmenu.html.php 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. <?php js::set('module', $module);?>
  2. <?php js::set('method', $method);?>
  3. <style>
  4. #navTabs {position: sticky; top: 0; background: #fff; z-index: 950;}
  5. #navTabs>li {padding: 0px 10px; display: inline-block}
  6. #navTabs>li>span {display: inline-block;}
  7. #navTabs>li>a {margin: 0!important; padding: 8px 0px; display: inline-block}
  8. #tabContent {margin-top: 5px; z-index: 900; max-width: 220px}
  9. .kanbanTree ul {list-style: none; margin: 0}
  10. .kanbanTree .kanbans>ul>li>div {display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center;}
  11. .kanbanTree .kanbans>ul>li label {background: rgba(255,255,255,0.5); line-height: unset; color: #838a9d; border: 1px solid #d8d8d8; border-radius: 2px; padding: 1px 4px;}
  12. .kanbanTree li a i.icon {font-size: 15px !important;}
  13. .kanbanTree li a i.icon:before {min-width: 16px !important;}
  14. .kanbanTree li .label {position: unset; margin-bottom: 0;}
  15. .kanbanTree li>a, div.hide-in-search>a {display: block; padding: 2px 10px 2px 5px; overflow: hidden; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; border-radius: 4px;}
  16. .kanbanTree .tree li>.list-toggle {line-height: 24px;}
  17. .kanbanTree .tree li.has-list.open:before {content: unset;}
  18. #swapper li>div.hide-in-search>a:focus, #swapper li>div.hide-in-search>a:hover {color: #838a9d; cursor: default;}
  19. #swapper li > a {margin-top: 4px; margin-bottom: 4px;}
  20. #swapper li {padding-top: 0; padding-bottom: 0;}
  21. #swapper .tree li>.list-toggle {top: -1px;}
  22. </style>
  23. <?php
  24. $kanbanCounts = array();
  25. $kanbanNames = array();
  26. $tabActive = '';
  27. $myKanbans = 0;
  28. $others = 0;
  29. $dones = 0;
  30. $currentKanban = '';
  31. foreach($kanbanList as $spaceID => $spaceKanbans)
  32. {
  33. $kanbanCounts[$spaceID]['myKanban'] = 0;
  34. $kanbanCounts[$spaceID]['others'] = 0;
  35. $kanbanCounts[$spaceID]['closed'] = 0;
  36. foreach($spaceKanbans as $kanban)
  37. {
  38. if($kanban->status != 'closed' and $kanban->owner == $this->app->user->account) $kanbanCounts[$spaceID]['myKanban'] ++;
  39. if($kanban->status != 'closed' and !($kanban->owner == $this->app->user->account)) $kanbanCounts[$spaceID]['others'] ++;
  40. if($kanban->status == 'closed') $kanbanCounts[$spaceID]['closed'] ++;
  41. $kanbanNames[] = $kanban->name;
  42. }
  43. }
  44. $kanbansPinYin = common::convert2Pinyin($kanbanNames);
  45. $myKanbansHtml = '<ul class="tree tree-angles" data-ride="tree">';
  46. $normalKanbansHtml = '<ul class="tree tree-angles" data-ride="tree">';
  47. $closedKanbansHtml = '<ul class="tree tree-angles" data-ride="tree">';
  48. foreach($kanbanList as $spaceID => $spaceKanbans)
  49. {
  50. /* Add the space name before kanban. */
  51. if(isset($spaceList[$spaceID]))
  52. {
  53. $spaceName = zget($spaceList, $spaceID);
  54. if($kanbanCounts[$spaceID]['myKanban']) $myKanbansHtml .= '<li><div class="hide-in-search"><a class="text-muted not-list-item" title="' . $spaceName . '">' . $spaceName . '</a> <label class="label">' . $lang->kanbanspace->common . '</label></div><ul>';
  55. if($kanbanCounts[$spaceID]['others']) $normalKanbansHtml .= '<li><div class="hide-in-search"><a class="text-muted not-list-item" title="' . $spaceName . '">' . $spaceName . '</a> <label class="label">' . $lang->kanbanspace->common . '</label></div><ul>';
  56. if($kanbanCounts[$spaceID]['closed']) $closedKanbansHtml .= '<li><div class="hide-in-search"><a class="text-muted not-list-item" title="' . $spaceName . '">' . $spaceName . '</a> <label class="label">' . $lang->kanbanspace->common . '</label></div><ul>';
  57. }
  58. foreach($spaceKanbans as $index => $kanban)
  59. {
  60. if($kanban->id == $kanbanID) $currentKanban = $kanban;
  61. $selected = $kanban->id == $kanbanID ? 'selected' : '';
  62. $link = helper::createLink('kanban', 'view', "kanbanID=%s", '', '', $kanban->id);
  63. $kanbanName = '<i class="icon icon-kanban"></i> ' . $kanban->name;
  64. if($kanban->status != 'closed' and $kanban->owner == $this->app->user->account)
  65. {
  66. $myKanbansHtml .= '<li>' . html::a(sprintf($link, $kanban->id), $kanbanName, '', "class='$selected clickable' title='{$kanban->name}' data-key='" . zget($kanbansPinYin, $kanban->name, '') . "'") . '</li>';
  67. if($selected == 'selected') $tabActive = 'myKanban';
  68. $myKanbans ++;
  69. }
  70. elseif($kanban->status != 'closed' and !($kanban->owner == $this->app->user->account))
  71. {
  72. $normalKanbansHtml .= '<li>' . html::a(sprintf($link, $kanban->id), $kanbanName, '', "class='$selected clickable' title='{$kanban->name}' data-key='" . zget($kanbansPinYin, $kanban->name, '') . "'") . '</li>';
  73. if($selected == 'selected') $tabActive = 'other';
  74. $others ++;
  75. }
  76. elseif($kanban->status == 'closed')
  77. {
  78. $closedKanbansHtml .= '<li>' . html::a(sprintf($link, $kanban->id), $kanbanName, '', "class='$selected clickable' title='{$kanban->name}' data-key='" . zget($kanbansPinYin, $kanban->name, '') . "'") . '</li>';
  79. if($selected == 'selected') $tabActive = 'closed';
  80. }
  81. /* If the kanban is the last one in the space, print the closed label. */
  82. if(isset($spaceList[$spaceID]) and !isset($spaceKanbans[$index + 1]))
  83. {
  84. if($kanbanCounts[$spaceID]['myKanban']) $myKanbansHtml .= '</ul></li>';
  85. if($kanbanCounts[$spaceID]['others']) $normalKanbansHtml .= '</ul></li>';
  86. if($kanbanCounts[$spaceID]['closed']) $closedKanbansHtml .= '</ul></li>';
  87. }
  88. }
  89. }
  90. $myKanbansHtml .= '</ul>';
  91. $normalKanbansHtml .= '</ul>';
  92. $closedKanbansHtml .= '</ul>';
  93. ?>
  94. <div class="table-row">
  95. <div class="table-col col-left">
  96. <div class='list-group'>
  97. <?php $tabActive = ($myKanbans and ($tabActive == 'closed' or $tabActive == 'myKanban')) ? 'myKanban' : 'other';?>
  98. <?php if($myKanbans): ?>
  99. <ul class="nav nav-tabs nav-tabs-primary" id="navTabs">
  100. <li class="<?php if($tabActive == 'myKanban') echo 'active';?>"><?php echo html::a('#myKanban', $lang->kanban->my, '', "data-toggle='tab' class='not-list-item not-clear-menu'");?><span class="label label-light label-badge"><?php echo $myKanbans;?></span><li>
  101. <li class="<?php if($tabActive == 'other') echo 'active';?>"><?php echo html::a('#other', $lang->kanban->other, '', "data-toggle='tab' class='not-list-item not-clear-menu'")?><span class="label label-light label-badge"><?php echo $others;?></span><li>
  102. </ul>
  103. <?php endif;?>
  104. <div class="tab-content kanbanTree" id="tabContent">
  105. <div class="tab-pane kanbans <?php if($tabActive == 'myKanban') echo 'active';?>" id="myKanban">
  106. <?php echo $myKanbansHtml;?>
  107. </div>
  108. <div class="tab-pane kanbans <?php if($tabActive == 'other') echo 'active';?>" id="other">
  109. <?php echo $normalKanbansHtml;?>
  110. </div>
  111. </div>
  112. </div>
  113. <div class="col-footer">
  114. <a class='pull-right toggle-right-col not-list-item'><?php echo $lang->kanban->closed;?><i class='icon icon-angle-right'></i></a>
  115. </div>
  116. </div>
  117. <div class="table-col col-right kanbanTree">
  118. <div class='list-group kanbans'><?php echo $closedKanbansHtml;?></div>
  119. </div>
  120. </div>
  121. <script>
  122. $(function()
  123. {
  124. <?php if($currentKanban->status == 'closed'):?>
  125. $('.col-footer .toggle-right-col').click(function(){ scrollToSelected(); })
  126. <?php else:?>
  127. scrollToSelected();
  128. <?php endif;?>
  129. $('#dropMenu .nav-tabs li span').hide();
  130. $('#dropMenu .nav-tabs li.active').find('span').show();
  131. $('#dropMenu .nav-tabs>li a').click(function()
  132. {
  133. if($('#swapper input[type="search"]').val() == '')
  134. {
  135. $(this).siblings().show();
  136. $(this).parent().siblings('li').find('span').hide();
  137. }
  138. })
  139. $('#swapper [data-ride="tree"]').tree('expand');
  140. $('#swapper #dropMenu .search-box').on('onSearchChange', function(event, value)
  141. {
  142. if(value != '')
  143. {
  144. $('#dropMenu div.hide-in-search').siblings('i').addClass('hide-in-search');
  145. $('#dropMenu .nav-tabs li span').hide();
  146. }
  147. else
  148. {
  149. $('#dropMenu div.hide-in-search').siblings('i').removeClass('hide-in-search');
  150. $('#dropMenu li.has-list div.hide-in-search').removeClass('hidden');
  151. $('#dropMenu .nav-tabs li.active').find('span').show();
  152. }
  153. })
  154. })
  155. </script>