* Finish task #79625.

module/block/control.php

@@ -424,9 +424,9 @@ class block extends control
         {
             $html = $this->fetch('block', 'dynamic');
         }
-        elseif($block->block == 'flowchart')
+        elseif($block->block == 'guide')
         {
-            $html = $this->fetch('block', 'flowchart');
+            $html = $this->fetch('block', 'guide');
         }
         elseif($block->block == 'assigntome')
         {
@@ -1999,11 +1999,11 @@ class block extends control
     }
 
     /**
-     * Print flow chart block
+     * Print guide block
      * @access public
      * @return void
      */
-    public function flowchart()
+    public function guide()
     {
         $this->display();
     }

module/block/lang/zh-cn.php

@@ -592,3 +592,11 @@ $lang->block->zentaoapp->notSupportKanban     = '移动端暂不支持研发看
 $lang->block->zentaoapp->notSupportVersion    = '移动端暂不支持该禅道版本';
 $lang->block->zentaoapp->incompatibleVersion  = '当前禅道版本较低，请升级至最新版本后再试';
 $lang->block->zentaoapp->canNotGetVersion     = '获取禅道版本失败，请确认网址是否正确';
+
+$lang->block->guideTabs['flowchart']      = '流程图';
+$lang->block->guideTabs['systemMode']     = '运行模式';
+$lang->block->guideTabs['visionSwitch']   = '界面切换';
+$lang->block->guideTabs['themeSwitch']    = '主题切换';
+$lang->block->guideTabs['preference']     = '个性化设置';
+$lang->block->guideTabs['downloadClient'] = '客户端下载';
+$lang->block->guideTabs['downloadMoblie'] = '移动端下载';

module/block/view/guide.html.php

@@ -0,0 +1,47 @@
+<style>
+.block-guide .col-nav {border-right: 1px solid #EBF2FB; width: 170px; padding: 0;}
+.block-guide .nav-secondary > li {position: relative;}
+.block-guide .nav-secondary > li > a {font-size: 14px; color: #838A9D; position: relative; box-shadow: none; padding-left: 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: all .2s;}
+.block-guide .nav-secondary > li > a:first-child {padding-right: 36px;}
+.block-guide .nav-secondary > li.active > a:first-child {color: #3C4353; background: transparent; box-shadow: none;}
+.block-guide .nav-secondary > li.active > a:first-child:hover,
+.block-guide .nav-secondary > li.active > a:first-child:focus,
+.block-guide .nav-secondary > li > a:first-child:hover {box-shadow: none; border-radius: 4px 0 0 4px;}
+.block-guide .nav-secondary > li.active > a:first-child:before {content: ' '; display: block; left: -1px; top: 10px; bottom: 10px; width: 4px; background: #006af1; position: absolute;}
+.block-guide .nav-secondary > li > a.btn-view {position: absolute; top: 0; right: 0; bottom: 0; padding: 8px; width: 36px; text-align: center; opacity: 0;}
+.block-guide .nav-secondary > li:hover > a.btn-view {opacity: 1;}
+.block-guide .nav-secondary > li.active > a.btn-view {box-shadow: none;}
+.block-guide .nav-secondary > li.switch-icon {display: none;}
+</style>
+<script>
+<?php $blockNavId = 'nav-' . uniqid(); ?>
+$(function()
+{
+    var $nav = $('#<?php echo $blockNavId;?>');
+    $nav.on('click', '.switch-icon', function(e)
+    {
+        var isPrev = $(this).is('.prev');
+        var $activeItem = $nav.children('.active');
+        var $next = $activeItem[isPrev ? 'prev' : 'next']('li:not(.switch-icon)');
+        if ($next.length) $next.find('a[data-toggle="tab"]').trigger('click');
+        else $nav.children('li:not(.switch-icon)')[isPrev ? 'last' : 'first']().find('a[data-toggle="tab"]').trigger('click');
+        e.preventDefault();
+    });
+});
+</script>
+<div class="panel-body">
+  <div class="table-row">
+    <div class="col col-nav">
+      <ul class="nav nav-stacked nav-secondary scrollbar-hover" id='<?php echo $blockNavId;?>'>
+        <?php foreach($lang->block->guideTabs as $tab => $tabName):?>
+        <li <?php if($tab == 'flowchart') echo "class='active' id='activeGuide'";?>>
+          <a href="###" title="<?php echo $tabName?>" data-target='<?php echo "#tab3{$blockNavId}Content{$tab}";?>' data-toggle="tab"><?php echo $tabName;?></a>
+          <?php echo html::a('###', "<i class='icon-arrow-right text-primary'></i>", '', "class='btn-view'");?>
+        </li>
+        <?php endforeach;?>
+      </ul>
+    </div>
+    <div class="col tab-content">
+    </div>
+  </div>
+</div>