* code for task #3810.

2018-04-11 10:09:33 +08:00
parent abff565609
commit c60070b991
19 changed files with 739 additions and 838 deletions
@@ -776,11 +776,11 @@ EOD;
            {
                if($method != 'edit' and $method != 'copy' and $method != 'delete')
                {
-                    return html::a($link, "<i class='$class'></i> " . $title, $target, "class='btn $extraClass' $misc", true);
+                    return html::a($link, "<i class='$class muted'></i> " . "<span class='text'>{$title}</span>", $target, "class='btn btn-link $extraClass' $misc", true);
                }
                else
                {
-                    return html::a($link, "<i class='$class'></i>", $target, "class='btn $extraClass' title='$title' $misc", false);
+                    return html::a($link, "<i class='$class muted'></i>", $target, "class='btn btn-link $extraClass' title='$title' $misc", false);
                }
            }
            else
@@ -1,35 +1,21 @@
-<style>
-.datatable-menu-wrapper {position: relative;}
-.datatable-menu {position: absolute; right: 0; top: 0; border: 1px solid #ddd; background: #fff; z-index: 999;}
-.datatable-menu > .btn {padding: 5px 6px; outline: none; color: #4d90fe!important}
-.datatable-menu > .btn:hover {color: #002563!important}
-.datatable + .datatable-menu-wrapper .datatable-menu > .btn {padding: 5px 6px 6px;}
-</style>
 <?php $datatableId = $this->moduleName . ucfirst($this->methodName);?>
 <script>
 $(function()
 {
-    var $table = $('#wrap > .outer > .main > form > table').first();
-    if($table.length > 0)
+    var $btnToolbar = $('#main #mainContent form.main-table .table-header .btn-toolbar:first');
+    if($btnToolbar.length > 0)
    {
-        var $dropdown = $("<div class='datatable-menu-wrapper'><div class='dropdown datatable-menu'><button type='button' class='btn btn-link' data-toggle='dropdown'><i class='icon-cogs'></i> <span class='caret'></span></button></div></div>");
-        var $dropmenu = $("<ul class='dropdown-menu pull-right'></ul>");
-        $dropmenu.append("<li><a id='tableCustomBtn' href='<?php echo $this->createLink('datatable', 'ajaxCustom', 'id=' . $this->moduleName . '&method=' . $this->methodName)?>' data-toggle='modal' data-type='ajax'><?php echo $lang->datatable->custom?></a></li>");
-        $dropmenu.append("<li><a href='javascript:;' id='switchToDatatable'><?php echo $lang->datatable->switchToDatatable?></a></li>");
-        $dropdown.children('.dropdown').append($dropmenu);
-        $table.before($dropdown);
+        <?php $mode = isset($this->config->datatable->$datatableId->mode) ? $this->config->datatable->$datatableId->mode : 'table';?>
+        $btnToolbar.append("<a href=\"javascript:saveDatatableConfig('mode', 'table', true);\" class='btn btn-link <?php echo $mode == 'table' ? 'btn-active-line' : '';?>'><?php echo $lang->datatable->table?></a>");
+        $btnToolbar.append("<a href=\"javascript:saveDatatableConfig('mode', 'datatable', true);\" class='btn btn-link <?php echo $mode == 'datatable' ? 'btn-active-line' : '';?>'><?php echo $lang->datatable->datatable?></a>");
+        $btnToolbar.append("<a id='tableCustomBtn' class='btn btn-link' href='<?php echo $this->createLink('datatable', 'ajaxCustom', 'id=' . $this->moduleName . '&method=' . $this->methodName)?>' data-toggle='modal' data-type='ajax'><i class='icon icon-cog'></i></a>");
        <?php if(!empty($setShowModule)):?>
-        $('.side .side-body .panel-body .tree').parent().append("<div class='text-right'><a href='javascript:;' data-toggle='showModuleModal'><?php echo $lang->datatable->showModule?></a></div>");
+        $('#sidebar .cell .text-center').append("<a href='javascript:;' data-toggle='showModuleModal' class='text-secondary small'><?php echo $lang->datatable->showModule?></a><hr class='space-sm' />");
        <?php endif;?>
        $('#tableCustomBtn').modalTrigger();
        $("a[data-toggle='showModuleModal']").click(function(){$('#showModuleModal').modal('show')});
    }

-    $('#switchToDatatable').click(function()
-    {
-        saveDatatableConfig('mode', 'datatable', true)
-    });
-
    $('#setShowModule').click(function()
    {
        saveDatatableConfig('showModule', $('#showModuleModal input[name="showModule"]:checked').val(), true)
@@ -54,6 +40,7 @@ $(function()
    window.saveDatatableConfig = saveDatatableConfig;
 });
 </script>
+
 <div class="modal fade" id="showModuleModal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog w-600px">
    <div class="modal-content">
@@ -6,14 +6,14 @@ $lang->datatable->show   = '显示';
 $lang->datatable->hide   = '隐藏';
 $lang->datatable->reset  = '恢复默认';

-$lang->datatable->custom            = '自定义列';
-$lang->datatable->customTip         = '勾选需要显示的列';
-$lang->datatable->switchToTable     = '切换到简单表格';
-$lang->datatable->switchToDatatable = '切换到高级表格';
-$lang->datatable->required          = '必选';
-$lang->datatable->confirmReset      = '是否恢复默认设置？';
-$lang->datatable->setGlobal         = '全局';
-$lang->datatable->resetGlobal       = '全局恢复默认';
+$lang->datatable->custom       = '自定义列';
+$lang->datatable->customTip    = '勾选需要显示的列';
+$lang->datatable->table        = '简单表格';
+$lang->datatable->datatable    = '高级表格';
+$lang->datatable->required     = '必选';
+$lang->datatable->confirmReset = '是否恢复默认设置？';
+$lang->datatable->setGlobal    = '全局';
+$lang->datatable->resetGlobal  = '全局恢复默认';

 $lang->datatable->branch   = '分支';
 $lang->datatable->platform = '平台';
@@ -204,6 +204,7 @@ class product extends control
        $this->view->storyCases    = $storyCases;
        $this->view->param         = $param;
        $this->view->products      = $this->products;
+        $this->view->allCount      = $this->story->getCount($productID);
        $this->display();
    }

@@ -464,7 +465,7 @@ class product extends control
     * @access public
     * @return void
     */
-    public function dynamic($productID = 0, $type = 'today', $param = '', $orderBy = 'date_desc', $recTotal = 0, $recPerPage = 50, $pageID = 1)
+    public function dynamic($productID = 0, $type = 'today', $param = '', $orderBy = 'date_desc', $lastDate = '')
    {
        /* Save session. */
        $uri   = $this->app->getURI(true);
@@ -484,14 +485,10 @@ class product extends control
        /* Append id for secend sort. */
        $sort = $this->loadModel('common')->appendOrder($orderBy);

-        /* Set the pager. */
-        $this->app->loadClass('pager', $static = true);
-        $pager = pager::init($recTotal, $recPerPage, $pageID);
-
        /* Set the user and type. */
        $account = $type == 'account' ? $param : 'all';
        $period  = $type == 'account' ? 'all'  : $type;
-        $actions = $this->loadModel('action')->getDynamic($account, $period, $sort, $pager, $productID);
+        $actions = $this->loadModel('action')->getDynamic($account, $period, $sort, $lastDate, $productID);

        /* The header and position. */
        $this->view->title      = $this->products[$productID] . $this->lang->colon . $this->lang->product->dynamic;
@@ -504,7 +501,6 @@ class product extends control
        $this->view->users      = $this->loadModel('user')->getPairs('noletter|nodeleted');
        $this->view->account    = $account;
        $this->view->orderBy    = $orderBy;
-        $this->view->pager      = $pager;
        $this->view->param      = $param;
        $this->view->dateGroups = $this->action->buildDateGroup($actions);
        $this->view->allCount   = $this->action->getCount('product', $productID);
@@ -33,7 +33,7 @@ $(function()

 function showCheckedSummary()
 {
-    var $summary = $('tfoot .table-actions .text:last');
+    var $summary = $('#main #mainContent form.main-table .table-header .table-statistic');
    if(!$summary.hasClass('readed'))
    {
        taskSummary = $summary.html();
@@ -60,15 +60,15 @@ function showCheckedSummary()
        summary = checkedSummary.replace('%total%', checkedTotal)
          .replace('%estimate%', checkedEstimate)
          .replace('%rate%', rate)
-        $('tfoot .table-actions .text:last').html(summary);
+        $summary.html(summary);
    }
    else
    {
-        $('tfoot .table-actions .text:last').html(taskSummary);
+        $summary.html(taskSummary);
    }
 }

 function setQueryBar(queryID, title)
 {
-    $('#bysearchTab').before("<li id='QUERY" + queryID + "Tab' class='active'><a href='" + createLink('product', 'browse', "productID=" + productID + "&branch=" + branch + "&browseType=bysearch&param=" + queryID) + "'>" + title + "</a></li>");
+    $('#bysearchTab').before("<a id='QUERY" + queryID + "Tab' class='btn btn-link btn-active-text' href='" + createLink('product', 'browse', "productID=" + productID + "&branch=" + branch + "&browseType=bysearch&param=" + queryID) + "'><span class='text'>" + title + "</span></a>");
 }
@@ -114,20 +114,16 @@ $lang->product->storySummary   = " <strong>%s</strong> Story(ies), <strong>%s</s
 $lang->product->checkedSummary = " <strong>%total%</strong> Checked, <strong>%estimate%</strong> hour(s) estimated, case coverage is <strong>%rate%</strong>.";
 $lang->product->noMatched      = '"%s" cannot be found.' . $lang->productCommon;

-$lang->product->mySelects['assignedtome'] = $lang->product->assignedToMe;
-$lang->product->mySelects['openedbyme']   = $lang->product->openedByMe;
-$lang->product->mySelects['resolvedbyme'] = $lang->product->reviewedByMe;
-
-$lang->product->featureBar['browse']['unclosed']     = $lang->product->unclosed;
-$lang->product->featureBar['browse']['unplan']       = $lang->product->unplan;
 $lang->product->featureBar['browse']['allstory']     = $lang->product->allStory;
-
-
-
-$lang->product->featureBar['browse']['my']           = $lang->product->my;
-$lang->product->featureBar['browse']['closedbyme']   = $lang->product->closedByMe;
+$lang->product->featureBar['browse']['unclosed']     = $lang->product->unclosed;
+$lang->product->featureBar['browse']['assignedtome'] = $lang->product->assignedToMe;
+$lang->product->featureBar['browse']['openedbyme']   = $lang->product->openedByMe;
+$lang->product->featureBar['browse']['reviewedbyme'] = $lang->product->reviewedByMe;
 $lang->product->featureBar['browse']['draftstory']   = $lang->product->draftStory;
-$lang->product->featureBar['browse']['activestory']  = $lang->product->activeStory;
-$lang->product->featureBar['browse']['changedstory'] = $lang->product->changedStory;
-$lang->product->featureBar['browse']['willclose']    = $lang->product->willClose;
-$lang->product->featureBar['browse']['closedstory']  = $lang->product->closedStory;
+$lang->product->featureBar['browse']['more']         = $lang->more;
+
+$lang->product->moreSelects['closedbyme']   = $lang->product->closedByMe;
+$lang->product->moreSelects['activestory']  = $lang->product->activeStory;
+$lang->product->moreSelects['changedstory'] = $lang->product->changedStory;
+$lang->product->moreSelects['willclose']    = $lang->product->willClose;
+$lang->product->moreSelects['closedstory']  = $lang->product->closedStory;
@@ -114,20 +114,16 @@ $lang->product->storySummary   = "本页共 <strong>%s</strong> 个需求，预
 $lang->product->checkedSummary = "选中 <strong>%total%</strong> 个需求，预计 <strong>%estimate%</strong> 个工时，用例覆盖率<strong>%rate%</strong>。";
 $lang->product->noMatched      = '找不到包含"%s"的' . $lang->productCommon;

-
-
-
-
-$lang->product->featureBar['browse']['unclosed']     = $lang->product->unclosed;
-$lang->product->featureBar['browse']['unplan']       = $lang->product->unplan;
 $lang->product->featureBar['browse']['allstory']     = $lang->product->allStory;
+$lang->product->featureBar['browse']['unclosed']     = $lang->product->unclosed;
 $lang->product->featureBar['browse']['assignedtome'] = $lang->product->assignedToMe;
 $lang->product->featureBar['browse']['openedbyme']   = $lang->product->openedByMe;
 $lang->product->featureBar['browse']['reviewedbyme'] = $lang->product->reviewedByMe;
-
-$lang->product->featureBar['browse']['closedbyme']   = $lang->product->closedByMe;
 $lang->product->featureBar['browse']['draftstory']   = $lang->product->draftStory;
-$lang->product->featureBar['browse']['activestory']  = $lang->product->activeStory;
-$lang->product->featureBar['browse']['changedstory'] = $lang->product->changedStory;
-$lang->product->featureBar['browse']['willclose']    = $lang->product->willClose;
-$lang->product->featureBar['browse']['closedstory']  = $lang->product->closedStory;
+$lang->product->featureBar['browse']['more']         = $lang->more;
+
+$lang->product->moreSelects['closedbyme']   = $lang->product->closedByMe;
+$lang->product->moreSelects['activestory']  = $lang->product->activeStory;
+$lang->product->moreSelects['changedstory'] = $lang->product->changedStory;
+$lang->product->moreSelects['willclose']    = $lang->product->willClose;
+$lang->product->moreSelects['closedstory']  = $lang->product->closedStory;
@@ -53,7 +53,8 @@ class productModel extends model

        $productIndex  = '<div class="btn-group angle-btn"><div class="btn-group"><button data-toggle="dropdown" type="button" class="btn">' . $this->lang->product->index . ' <span class="caret"></span></button>';
        $productIndex .= '<ul class="dropdown-menu">';
-        if(common::hasPriv('product', 'all')) $productIndex .= '<li>' . html::a(helper::createLink('product', 'all'), '<i class="icon icon-cards-view"></i> ' . $this->lang->product->all) . '</li>';
+        if(common::hasPriv('product', 'index'))  $productIndex .= '<li class="active">' . html::a(helper::createLink('product', 'index'), '<i class="icon icon-home"></i> ' . $this->lang->product->index) . '</li>';
+        if(common::hasPriv('product', 'all'))    $productIndex .= '<li>' . html::a(helper::createLink('product', 'all'), '<i class="icon icon-cards-view"></i> ' . $this->lang->product->all) . '</li>';
        if(common::hasPriv('product', 'create')) $productIndex .= '<li>' . html::a(helper::createLink('product', 'create'), '<i class="icon icon-plus"></i> ' . $this->lang->product->create) . '</li>';
        $productIndex .= '</ul></div></div>';
        $productIndex .= $selectHtml;
@@ -15,330 +15,310 @@
 <?php js::set('browseType', $browseType);?>
 <?php js::set('productID', $productID);?>
 <?php js::set('branch', $branch);?>
-<?php $currentBrowseType = isset($lang->product->mySelects[$browseType]) && in_array($browseType, array_keys($lang->product->mySelects)) ? $browseType : '';?>
-<div id='featurebar'>
-  <ul class='nav'>
-    <li>
-      <div class='label-angle<?php if($moduleID) echo ' with-close';?>'>
-        <?php
-        echo $moduleName;
-        if($moduleID)
-        {
-            $removeLink = $browseType == 'bymodule' ? inlink('browse', "productID=$productID&branch=$branch&browseType=$browseType&param=0&orderBy=$orderBy&recTotal=0&recPerPage={$pager->recPerPage}") : 'javascript:removeCookieByKey("storyModule")';
-            echo html::a($removeLink, "<i class='icon icon-remove'></i>", '', "class='text-muted'");
-        }
-        ?>
-      </div>
-    </li>
+<div id="mainMenu" class="clearfix">
+  <div id="sidebarHeader">
+    <?php echo html::commonButton('<i class="icon icon-caret-left"></i>', '', 'btn btn-icon btn-sm btn-info sidebar-toggle');?>
+    <div class="title">
+      <?php
+      echo $moduleName;
+      if($moduleID)
+      {
+          $removeLink = $browseType == 'bymodule' ? inlink('browse', "productID=$productID&branch=$branch&browseType=$browseType&param=0&orderBy=$orderBy&recTotal=0&recPerPage={$pager->recPerPage}") : 'javascript:removeCookieByKey("storyModule")';
+          echo html::a($removeLink, "<i class='icon icon-remove'></i>", '', "class='text-muted'");
+      }
+      ?>
+    </div>
+  </div>
+  <div class="btn-toolbar pull-left">
    <?php foreach(customModel::getFeatureMenu($this->moduleName, $this->methodName) as $menuItem):?>
    <?php if(isset($menuItem->hidden)) continue;?>
    <?php $menuBrowseType = strpos($menuItem->name, 'QUERY') === 0 ? 'bySearch' : $menuItem->name;?>
    <?php $param = strpos($menuItem->name, 'QUERY') === 0 ? '&param=' . (int)substr($menuItem->name, 5) : '';?>
-    <?php if($menuItem->name == 'my'):?>
+    <?php if($menuItem->name == 'more'):?>
    <?php
-        echo "<li id='statusTab' class='dropdown " . (!empty($currentBrowseType) ? 'active' : '') . "'>";
-        echo html::a('javascript:;', $menuItem->text . " <span class='caret'></span>", '', "data-toggle='dropdown'");
+        echo '<div class="btn-group">';
+        echo html::a('javascript:;', $menuItem->text . " <span class='caret'></span>", '', "data-toggle='dropdown' class='btn btn-link'");
        echo "<ul class='dropdown-menu'>";
-        foreach ($lang->product->mySelects as $key => $value)
+        foreach ($lang->product->moreSelects as $key => $value)
        {
-            echo '<li' . ($key == $currentBrowseType ? " class='active'" : '') . '>';
+            echo '<li' . ($key == $this->session->storyBrowseType ? " class='active'" : '') . '>';
            echo html::a($this->inlink('browse', "productID=$productID&branch=$branch&browseType=$key" . $param), $value);
        }
-        echo '</ul></li>';
+        echo '</ul></div>';
    ?>
    <?php else:?>
-    <li id='<?php echo $menuItem->name?>Tab'><?php echo html::a($this->inlink('browse', "productID=$productID&branch=$branch&browseType=$menuBrowseType" . $param), $menuItem->text);?></li>
+    <?php echo html::a($this->inlink('browse', "productID=$productID&branch=$branch&browseType=$menuBrowseType" . $param), "<span class='text'>$menuItem->text</span>" . ($menuItem->name == 'allstory' ? ' <span class="label label-light label-badge">' . $allCount . '</span>' : ''), '', "id='{$menuItem->name}Tab' class='btn btn-link" . ($this->session->storyBrowseType == $menuItem->name ? ' btn-active-text' : '') . "'");?>
    <?php endif;?>
    <?php endforeach;?>
-    <li id='bysearchTab'><a href='javascript:;'><i class='icon-search icon'></i> <?php echo $lang->product->searchStory;?></a></li>
-  </ul>
-  <div class='actions'>
-    <div class='btn-group'>
-      <div class='btn-group'>
-        <button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown'>
-          <i class='icon-download-alt'></i> <?php echo $lang->export ?>
-          <span class='caret'></span>
-        </button>
-        <ul class='dropdown-menu' id='exportActionMenu'>
+    <a class="btn btn-link querybox-toggle" id='bysearchTab'><i class="icon icon-search muted"></i> <?php echo $lang->product->searchStory;?></a>
+  </div>
+  <div class="btn-toolbar pull-right">
+    <?php common::printIcon('story', 'report', "productID=$productID&browseType=$browseType&branchID=$branch&moduleID=$moduleID", '', 'button', 'bar-chart'); ?>
+    <div class="btn-group">
+      <button class="btn btn-link" data-toggle="dropdown"><i class="icon icon-export muted"></i> <span class="text"><?php echo $lang->export ?></span> <span class="caret"></span></button>
+      <ul class="dropdown-menu">
        <?php 
        $misc = common::hasPriv('story', 'export') ? "class='export'" : "class=disabled";
        $link = common::hasPriv('story', 'export') ?  $this->createLink('story', 'export', "productID=$productID&orderBy=$orderBy") : '#';
        echo "<li>" . html::a($link, $lang->story->export, '', $misc) . "</li>";
        ?>
-        </ul>
-      </div>
-        <?php common::printIcon('story', 'report', "productID=$productID&browseType=$browseType&branchID=$branch&moduleID=$moduleID", '', 'button', 'bar-chart'); ?>
-    </div>
-    <div class="btn-group" id='createActionMenu'>
-      <?php
-      if(commonModel::isTutorialMode())
-      {
-          $wizardParams = helper::safe64Encode("productID=$productID&branch=$branch&moduleID=$moduleID");
-          echo html::a($this->createLink('tutorial', 'wizard', "module=story&method=create&params=$wizardParams"), "<i class='con-plus'></i>" . $lang->story->create, '', "class='create-story-btn btn btn-primary'");
-      }
-      else
-      {
-          $misc = common::hasPriv('story', 'create') ? "class='btn btn-primary'" : "class='btn btn-primary disabled'";
-          $link = common::hasPriv('story', 'create') ?  $this->createLink('story', 'create', "productID=$productID&branch=$branch&moduleID=$moduleID") : '#';
-          echo html::a($link, "<i class='icon icon-plus'></i>" . $lang->story->create, '', $misc);
-      }
-
-      $misc = common::hasPriv('story', 'batchCreate') ? '' : "disabled";
-      $link = common::hasPriv('story', 'batchCreate') ?  $this->createLink('story', 'batchCreate', "productID=$productID&branch=$branch&moduleID=$moduleID") : '#';
-      ?>
-      <button type="button" class="btn btn-primary dropdown-toggle <?php echo $misc?>" data-toggle="dropdown">
-        <span class="caret"></span>
-      </button>
-      <ul class='dropdown-menu pull-right'>
-      <?php echo "<li>" . html::a($link, $lang->story->batchCreate, '', "class='$misc'") . "</li>";?>
      </ul>
    </div>
+    <?php if(common::hasPriv('story', 'batchCreate')) echo html::a($this->createLink('story', 'batchCreate', "productID=$productID&branch=$branch&moduleID=$moduleID"), "<i class='icon icon-plus'></i> {$lang->story->batchCreate}", '', "class='btn btn btn-secondary'");?>
+    <?php
+    if(commonModel::isTutorialMode())
+    {
+        $wizardParams = helper::safe64Encode("productID=$productID&branch=$branch&moduleID=$moduleID");
+        $link = $this->createLink('tutorial', 'wizard', "module=story&method=create&params=$wizardParams");
+        echo html::a($link, "<i class='icon icon-plus'></i> {$lang->story->create}", '', "class='btn btn-primary'");
+    }
+    else
+    {
+        $link = $this->createLink('story', 'create', "productID=$productID&branch=$branch&moduleID=$moduleID");
+        if(common::hasPriv('story', 'create')) echo html::a($link, "<i class='icon icon-plus'></i> {$lang->story->create}", '', "class='btn btn-primary'");
+    }
+    ?>
  </div>
-  <div id='querybox' class='<?php if($browseType =='bysearch') echo 'show';?>'></div>
 </div>
-<div class='side' id='treebox'>
-  <a class='side-handle' data-id='productTree'><i class='icon-caret-left'></i></a>
-  <div class='side-body'>
-    <div class='panel panel-sm'>
-      <div class='panel-heading nobr'><?php echo html::icon($lang->icons['product']);?> <strong><?php echo $branch ? $branches[$branch] : $productName;?></strong></div>
-      <div class='panel-body'>
-        <?php echo $moduleTree;?>
-        <div class='text-right'>
-          <?php common::printLink('tree', 'browse', "rootID=$productID&view=story", $lang->tree->manage);?>
-        </div>
+<div id="mainContent" class="main-row">
+  <div class="side-col" id="sidebar">
+    <div class="cell">
+      <?php echo $moduleTree;?>
+      <div class="text-center">
+        <?php common::printLink('tree', 'browse', "rootID=$productID&view=story", $lang->tree->manage, '', "class='btn btn-info btn-wide'");?>
+        <hr class="space-sm" />
      </div>
    </div>
  </div>
-</div>
-<div class='main'>
-  <script>setTreeBox();</script>
-  <form method='post' id='productStoryForm'>
-    <?php
-    $datatableId  = $this->moduleName . ucfirst($this->methodName);
-    $useDatatable = (isset($this->config->datatable->$datatableId->mode) and $this->config->datatable->$datatableId->mode == 'datatable');
-    $vars         = "productID=$productID&branch=$branch&browseType=$browseType&param=$param&orderBy=%s&recTotal={$pager->recTotal}&recPerPage={$pager->recPerPage}";
+  <div class="main-col">
+    <div class="cell" id="queryBox"></div>
+    <form class="main-table table-story" data-ride="table" method="post" id='productStoryForm'>
+      <div class="table-header">
+        <div class="table-statistic"><?php echo $summary;?></div>
+        <nav class="btn-toolbar pull-right"></nav>
+      </div>
+      <?php
+      $datatableId  = $this->moduleName . ucfirst($this->methodName);
+      $useDatatable = (isset($this->config->datatable->$datatableId->mode) and $this->config->datatable->$datatableId->mode == 'datatable');
+      $vars         = "productID=$productID&branch=$branch&browseType=$browseType&param=$param&orderBy=%s&recTotal={$pager->recTotal}&recPerPage={$pager->recPerPage}";

-    if($useDatatable) include '../../common/view/datatable.html.php';
-    if(!$useDatatable) include '../../common/view/tablesorter.html.php';
-    $setting = $this->datatable->getSetting('product');
-    $widths  = $this->datatable->setFixedFieldWidth($setting);
-    $columns = 0;
-    ?>
-    <table class='table table-condensed table-hover table-striped tablesorter table-fixed <?php echo ($useDatatable ? 'datatable' : 'table-selectable');?>' id='storyList' data-checkable='true' data-fixed-left-width='<?php echo $widths['leftWidth']?>' data-fixed-right-width='<?php echo $widths['rightWidth']?>' data-custom-menu='true' data-checkbox-name='storyIDList[]'>
-      <thead>
-        <tr>
-        <?php
-        foreach($setting as $key => $value)
-        {
-            if($value->show)
-            {
-                $this->datatable->printHead($value, $orderBy, $vars);
-                $columns ++;
-            }
-        }
-        ?>
-        </tr>
-      </thead>
-      <tbody>
-        <?php foreach($stories as $story):?>
-        <tr class='text-center' data-id='<?php echo $story->id?>' data-estimate='<?php echo $story->estimate?>' data-cases='<?php echo zget($storyCases, $story->id, 0);?>'>
-          <?php foreach($setting as $key => $value) $this->story->printCell($value, $story, $users, $branches, $storyStages, $modulePairs, $storyTasks, $storyBugs, $storyCases, $useDatatable ? 'datatable' : 'table');?>
-        </tr>
-        <?php endforeach;?>
-      </tbody>
-      <tfoot>
-      <tr>
-        <td colspan='<?php echo $columns?>'>
-          <div class='table-actions clearfix'>
-            <?php if(count($stories)):?>
-            <?php echo html::selectButton();?>
+      if($useDatatable) include '../../common/view/datatable.html.php';
+      if(!$useDatatable) include '../../common/view/tablesorter.html.php';
+      $setting = $this->datatable->getSetting('product');
+      $widths  = $this->datatable->setFixedFieldWidth($setting);
+      $columns = 0;
+      ?>
+      <table class="table has-sort-head" id='storyList'>
+        <thead>
+          <tr>
+          <?php
+          foreach($setting as $key => $value)
+          {
+              if($value->show)
+              {
+                  $this->datatable->printHead($value, $orderBy, $vars);
+                  $columns ++;
+              }
+          }
+          ?>
+          </tr>
+        </thead>
+        <tbody>
+          <?php foreach($stories as $story):?>
+          <tr data-id='<?php echo $story->id?>' data-estimate='<?php echo $story->estimate?>' data-cases='<?php echo zget($storyCases, $story->id, 0);?>'>
+            <?php foreach($setting as $key => $value) $this->story->printCell($value, $story, $users, $branches, $storyStages, $modulePairs, $storyTasks, $storyBugs, $storyCases, $useDatatable ? 'datatable' : 'table');?>
+          </tr>
+          <?php endforeach;?>
+        </tbody>
+      </table>
+      <?php if($stories):?>
+      <div class="table-footer">
+        <div class="checkbox-primary check-all"><label><?php echo $lang->selectAll?></label></div>
+        <div class="table-actions btn-toolbar">
+          <div class='btn-group dropup'>
            <?php
            $canBatchEdit  = common::hasPriv('story', 'batchEdit');
            $disabled   = $canBatchEdit ? '' : "disabled='disabled'";
            $actionLink = $this->createLink('story', 'batchEdit', "productID=$productID&projectID=0&branch=$branch");
            ?>
-            <div class='btn-group dropup'>
-              <?php echo html::commonButton($lang->edit, "onclick=\"setFormAction('$actionLink')\" $disabled");?>
-              <button type='button' class='btn dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></button>
-              <ul class='dropdown-menu'>
-                <?php 
-                $class = "class='disabled'";
+            <?php echo html::commonButton($lang->edit, "data-form-action='$actionLink' $disabled");?>
+            <button type='button' class='btn dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></button>
+            <ul class='dropdown-menu'>
+              <?php 
+              $class = "class='disabled'";
+              $canBatchClose = common::hasPriv('story', 'batchClose') && strtolower($browseType) != 'closedbyme' && strtolower($browseType) != 'closedstory';
+              $actionLink    = $this->createLink('story', 'batchClose', "productID=$productID&projectID=0");
+              $misc = $canBatchClose ? "onclick=\"setFormAction('$actionLink')\"" : $class;
+              echo "<li>" . html::a('#', $lang->close, '', $misc) . "</li>";

-                $canBatchClose = common::hasPriv('story', 'batchClose') && strtolower($browseType) != 'closedbyme' && strtolower($browseType) != 'closedstory';
-                $actionLink    = $this->createLink('story', 'batchClose', "productID=$productID&projectID=0");
-                $misc = $canBatchClose ? "onclick=\"setFormAction('$actionLink')\"" : $class;
-                echo "<li>" . html::a('#', $lang->close, '', $misc) . "</li>";
-
-                if(common::hasPriv('story', 'batchReview'))
-                {
-                    echo "<li class='dropdown-submenu'>";
-                    echo html::a('javascript:;', $lang->story->review, '', "id='reviewItem'");
-                    echo "<ul class='dropdown-menu'>";
-                    unset($lang->story->reviewResultList['']);
-                    unset($lang->story->reviewResultList['revert']);
-                    foreach($lang->story->reviewResultList as $key => $result)
-                    {
-                        $actionLink = $this->createLink('story', 'batchReview', "result=$key");
-                        if($key == 'reject')
-                        {
-                            echo "<li class='dropdown-submenu'>";
-                            echo html::a('#', $result, '', "id='rejectItem'");
-                            echo "<ul class='dropdown-menu'>";
-                            unset($lang->story->reasonList['']);
-                            unset($lang->story->reasonList['subdivided']);
-                            unset($lang->story->reasonList['duplicate']);
-
-                            foreach($lang->story->reasonList as $key => $reason)
-                            {
-                                $actionLink = $this->createLink('story', 'batchReview', "result=reject&reason=$key");
-                                echo "<li>";
-                                echo html::a('#', $reason, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"");
-                                echo "</li>";
-                            }
-                            echo '</ul></li>';
-                        }
-                        else
-                        {
-                          echo '<li>' . html::a('#', $result, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . '</li>';
-                        }
-                    }
-                    echo '</ul></li>';
-                }
-                else
-                {
-                    echo '<li>' . html::a('javascript:;', $lang->story->review,  '', $class) . '</li>';
-                }
-
-                if(common::hasPriv('story', 'batchChangeBranch') and $this->session->currentProductType != 'normal')
-                {
-                    $withSearch = count($branches) > 8;
-                    echo "<li class='dropdown-submenu'>";
-                    echo html::a('javascript:;', $lang->product->branchName[$this->session->currentProductType], '', "id='branchItem'");
-                    echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
-                    echo "<ul class='dropdown-list'>";
-                    foreach($branches as $branchID => $branchName)
-                    {
-                        $actionLink = $this->createLink('story', 'batchChangeBranch', "branchID=$branchID");
-                        echo "<li class='option' data-key='$branchID'>" . html::a('#', $branchName, '', "onclick=\"setFormAction('$actionLink', 'hiddenwin')\"") . "</li>";
-                    }
-                    echo '</ul>';
-                    if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
-                    echo '</div></li>';
-                }
-
-                if(common::hasPriv('story', 'batchChangeModule'))
-                {
-                    $withSearch = count($modules) > 8;
-                    echo "<li class='dropdown-submenu'>";
-                    echo html::a('javascript:;', $lang->story->moduleAB, '', "id='moduleItem'");
-                    echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
-                    echo "<ul class='dropdown-list'>";
-                    foreach($modules as $moduleId => $module)
-                    {
-                        $actionLink = $this->createLink('story', 'batchChangeModule', "moduleID=$moduleId");
-                        echo "<li class='option' data-key='$moduleID'>" . html::a('#', $module, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . "</li>";
-                    }
-                    echo '</ul>';
-                    if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
-                    echo '</div></li>';
-                }
-                else
-                {
-                    echo '<li>' . html::a('javascript:;', $lang->story->moduleAB, '', $class) . '</li>';
-                }
-
-                if(common::hasPriv('story', 'batchChangePlan'))
-                {
-                    unset($plans['']);
-                    $plans      = array(0 => $lang->null) + $plans;
-                    $withSearch = count($plans) > 8;
-                    echo "<li class='dropdown-submenu'>";
-                    echo html::a('javascript:;', $lang->story->planAB, '', "id='planItem'");
-                    echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
-                    echo "<ul class='dropdown-list'>";
-                    foreach($plans as $planID => $plan)
-                    {
-                        $actionLink = $this->createLink('story', 'batchChangePlan', "planID=$planID");
-                        echo "<li class='option' data-key='$planID'>" . html::a('#', $plan, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . "</li>";
-                    }
-                    echo '</ul>';
-                    if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
-                    echo '</div></li>';
-                }
-                else
-                {
-                    echo '<li>' . html::a('javascript:;', $lang->story->planAB, '', $class) . '</li>';
-                }
-
-                if(common::hasPriv('story', 'batchChangeStage'))
-                {
-                    echo "<li class='dropdown-submenu'>";
-                    echo html::a('javascript:;', $lang->story->stageAB, '', "id='stageItem'");
-                    echo "<ul class='dropdown-menu'>";
-                    $lang->story->stageList[''] = $lang->null;
-                    foreach($lang->story->stageList as $key => $stage)
-                    {
-                        $actionLink = $this->createLink('story', 'batchChangeStage', "stage=$key");
-                        echo "<li>" . html::a('#', $stage, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . "</li>";
-                    }
-                    echo '</ul></li>';
-                }
-                else
-                {
-                    echo '<li>' . html::a('javascript:;', $lang->story->stageAB, '', $class) . '</li>';
-                }
-
-                if(common::hasPriv('story', 'batchAssignTo'))
-                {
-                      $withSearch = count($users) > 10;
-                      $actionLink = $this->createLink('story', 'batchAssignTo', "productID=$productID");
-                      echo "<li class='dropdown-submenu'>";
-                      echo html::select('assignedTo', $users, 'admin', 'class="hidden"');
-                      echo html::a('javascript::', $lang->story->assignedTo, '', 'id="assignItem"');
-                      echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
-                      echo '<ul class="dropdown-list">';
-                      foreach ($users as $key => $value)
+              if(common::hasPriv('story', 'batchReview'))
+              {
+                  echo "<li class='dropdown-submenu'>";
+                  echo html::a('javascript:;', $lang->story->review, '', "id='reviewItem'");
+                  echo "<ul class='dropdown-menu'>";
+                  unset($lang->story->reviewResultList['']);
+                  unset($lang->story->reviewResultList['revert']);
+                  foreach($lang->story->reviewResultList as $key => $result)
+                  {
+                      $actionLink = $this->createLink('story', 'batchReview', "result=$key");
+                      if($key == 'reject')
                      {
-                          if(empty($key) or $key == 'closed') continue;
-                          echo "<li class='option' data-key='$key'>" . html::a("javascript:$(\"#assignedTo\").val(\"$key\");setFormAction(\"$actionLink\",\"hiddenwin\")", $value, '', '') . '</li>';
+                          echo "<li class='dropdown-submenu'>";
+                          echo html::a('#', $result, '', "id='rejectItem'");
+                          echo "<ul class='dropdown-menu'>";
+                          unset($lang->story->reasonList['']);
+                          unset($lang->story->reasonList['subdivided']);
+                          unset($lang->story->reasonList['duplicate']);
+
+                          foreach($lang->story->reasonList as $key => $reason)
+                          {
+                              $actionLink = $this->createLink('story', 'batchReview', "result=reject&reason=$key");
+                              echo "<li>";
+                              echo html::a('#', $reason, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"");
+                              echo "</li>";
+                          }
+                          echo '</ul></li>';
                      }
-                      echo "</ul>";
-                      if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control'><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
-                      echo "</div></li>";
-                }
-                else
-                {
-                    echo '<li>' . html::a('javascript:;', $lang->story->assignedTo, '', $class) . '</li>';
-                }
-                ?>
-              </ul>
-            </div>
-            <?php endif; ?>
-            <div class='text'><?php echo $summary;?></div>
+                      else
+                      {
+                        echo '<li>' . html::a('#', $result, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . '</li>';
+                      }
+                  }
+                  echo '</ul></li>';
+              }
+              else
+              {
+                  echo '<li>' . html::a('javascript:;', $lang->story->review,  '', $class) . '</li>';
+              }
+
+              if(common::hasPriv('story', 'batchChangeBranch') and $this->session->currentProductType != 'normal')
+              {
+                  $withSearch = count($branches) > 8;
+                  echo "<li class='dropdown-submenu'>";
+                  echo html::a('javascript:;', $lang->product->branchName[$this->session->currentProductType], '', "id='branchItem'");
+                  echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
+                  echo "<ul class='dropdown-list'>";
+                  foreach($branches as $branchID => $branchName)
+                  {
+                      $actionLink = $this->createLink('story', 'batchChangeBranch', "branchID=$branchID");
+                      echo "<li class='option' data-key='$branchID'>" . html::a('#', $branchName, '', "onclick=\"setFormAction('$actionLink', 'hiddenwin')\"") . "</li>";
+                  }
+                  echo '</ul>';
+                  if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
+                  echo '</div></li>';
+              }
+
+              if(common::hasPriv('story', 'batchChangeModule'))
+              {
+                  $withSearch = count($modules) > 8;
+                  echo "<li class='dropdown-submenu'>";
+                  echo html::a('javascript:;', $lang->story->moduleAB, '', "id='moduleItem'");
+                  echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
+                  echo "<ul class='dropdown-list'>";
+                  foreach($modules as $moduleId => $module)
+                  {
+                      $actionLink = $this->createLink('story', 'batchChangeModule', "moduleID=$moduleId");
+                      echo "<li class='option' data-key='$moduleID'>" . html::a('#', empty($module) ? '/' : $module, '', "onclick=\"setFormAction('$actionLink', 'hiddenwin')\"") . "</li>";
+                  }
+                  echo '</ul>';
+                  if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
+                  echo '</div></li>';
+              }
+              else
+              {
+                  echo '<li>' . html::a('javascript:;', $lang->story->moduleAB, '', $class) . '</li>';
+              }
+
+              if(common::hasPriv('story', 'batchChangePlan'))
+              {
+                  unset($plans['']);
+                  $plans      = array(0 => $lang->null) + $plans;
+                  $withSearch = count($plans) > 8;
+                  echo "<li class='dropdown-submenu'>";
+                  echo html::a('javascript:;', $lang->story->planAB, '', "id='planItem'");
+                  echo "<div class='dropdown-menu" . ($withSearch ? ' with-search':'') . "'>";
+                  echo "<ul class='dropdown-list'>";
+                  foreach($plans as $planID => $plan)
+                  {
+                      $actionLink = $this->createLink('story', 'batchChangePlan', "planID=$planID");
+                      echo "<li class='option' data-key='$planID'>" . html::a('#', $plan, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . "</li>";
+                  }
+                  echo '</ul>';
+                  if($withSearch) echo "<div class='menu-search'><div class='input-group input-group-sm'><input type='text' class='form-control' placeholder=''><span class='input-group-addon'><i class='icon-search'></i></span></div></div>";
+                  echo '</div></li>';
+              }
+              else
+              {
+                  echo '<li>' . html::a('javascript:;', $lang->story->planAB, '', $class) . '</li>';
+              }
+
+              if(common::hasPriv('story', 'batchChangeStage'))
+              {
+                  echo "<li class='dropdown-submenu'>";
+                  echo html::a('javascript:;', $lang->story->stageAB, '', "id='stageItem'");
+                  echo "<ul class='dropdown-menu'>";
+                  $lang->story->stageList[''] = $lang->null;
+                  foreach($lang->story->stageList as $key => $stage)
+                  {
+                      $actionLink = $this->createLink('story', 'batchChangeStage', "stage=$key");
+                      echo "<li>" . html::a('#', $stage, '', "onclick=\"setFormAction('$actionLink','hiddenwin')\"") . "</li>";
+                  }
+                  echo '</ul></li>';
+              }
+              else
+              {
+                  echo '<li>' . html::a('javascript:;', $lang->story->stageAB, '', $class) . '</li>';
+              }
+              ?>
+            </ul>
          </div>
-          <?php $pager->show();?>
-        </td>
-      </tr>
-      </tfoot>
-    </table>
-  </form>
+
+          <?php if(common::hasPriv('story', 'batchAssignTo')):?>
+          <div class="btn-group dropup">
+            <button data-toggle="dropdown" type="button" class="btn"><?php echo $lang->story->assignedTo;?> <span class="caret"></span></button>
+            <div class="dropdown-menu search-list" data-ride="searchList">
+              <?php
+              $withSearch = count($users) > 10;
+              $actionLink = $this->createLink('story', 'batchAssignTo', "productID=$productID");
+              echo html::select('assignedTo', $users, '', 'class="hidden"');
+              if(!$withSearch):
+              ?>
+              <div class="input-control search-box search-box-circle has-icon-left has-icon-right search-example">
+                <input id="userSearchBox" type="search" autocomplete="off" class="form-control search-input">
+                <label for="userSearchBox" class="input-control-icon-left search-icon"><i class="icon icon-search"></i></label>
+                <a class="input-control-icon-right search-clear-btn"><i class="icon icon-close icon-sm"></i></a>
+              </div>
+              <?php endif;?>
+              <div class="list-group">
+              <?php foreach ($users as $key => $value):?>
+              <?php
+              if(empty($key) or $key == 'closed') continue;
+              echo html::a("javascript:$(\"#assignedTo\").val(\"$key\");setFormAction(\"$actionLink\", \"hiddenwin\")", $value, '', '');
+              ?>
+              <?php endforeach;?>
+              </div>
+            </div>
+          </div>
+          <?php endif;?>
+        </div>
+        <?php $pager->show('right', 'pagerjs');?>
+      </div>
+      <?php endif;?>
+    </form>
+  </div>
 </div>
 <?php js::set('checkedSummary', $lang->product->checkedSummary);?>
 <script language='javascript'>
 var moduleID = <?php echo $moduleID?>;
 $('#module<?php echo $moduleID;?>').addClass('active');
-$('#<?php echo ($browseType == 'bymodule' and $this->session->storyBrowseType == 'bysearch') ? 'all' : $this->session->storyBrowseType;?>Tab').addClass('active');
 <?php if($browseType == 'bysearch'):?>
 $shortcut = $('#QUERY<?php echo (int)$param;?>Tab');
 if($shortcut.size() > 0)
 {
-    $shortcut.addClass('active');
-    $('#bysearchTab').removeClass('active');
+    $shortcut.addClass('btn-active-text');
+    $('#bysearchTab').removeClass('btn-active-text');
    $('#querybox').removeClass('show');
 }
 <?php endif;?>
-<?php if(isset($this->config->product->homepage) and $this->config->product->homepage != 'browse'):?>
-$('#modulemenu .nav li.right:last').after("<li class='right'><a style='font-size:12px' href='javascript:setHomepage(\"product\", \"browse\")'><i class='icon icon-cog'></i> <?php echo $lang->homepage?></a></li>")
-<?php endif;?>
 </script>
 <?php include '../../common/view/footer.html.php';?>
@@ -17,7 +17,7 @@ $lang->search->group1        = '第一组';
 $lang->search->group2        = '第二组';
 $lang->search->buildForm     = '搜索表单';
 $lang->search->buildQuery    = '执行搜索';
-$lang->search->saveQuery     = '保存查询';
+$lang->search->savedQuery    = '已保存的检索历史';
 $lang->search->deleteQuery   = '删除查询';
 $lang->search->setQueryTitle = '请输入查询标题（保存之前请先查询）：';
 $lang->search->select        = '需求/任务筛选';
@@ -16,51 +16,209 @@ include '../../common/view/datepicker.html.php';
 include '../../common/view/chosen.html.php';
 ?>
 <style>
-#bysearchTab {transition: all .3s cubic-bezier(.175, .885, .32, 1);}
-#bysearchTab.active {background: #fff; padding: 2px 10px 3px; padding-bottom: 2px\0; border: 1px solid #ddd; border-bottom: none}
-#bysearchTab.active:hover {background: #ddd}
-#bysearchTab.active > a:after {font-size: 14px; font-family: NewZenIcon; content: ' \e6e2'; color: #808080}
-#featurebar .nav {position: relative;}
-#featurebar .nav .dropdown .dropdown-menu{z-index:1010;}
-#querybox form{padding-right: 40px;}
-#querybox .form-control {padding: 2px}
-@-moz-document url-prefix() {#querybox .form-control {padding: 6px 2px;}}
-#querybox .table {border: none}
-#querybox .table-form td {border: none}
-#querybox .btn {padding: 5px 8px;}
-#querybox .table-form td td {padding: 2px;}
-#querybox .table .table {margin: 0;}
-.outer #querybox .table tr > th:first-child, .outer #querybox .table tr > td:first-child,
-.outer #querybox .table tr > th:last-child, .outer #querybox .table tr > td:last-child,
-.outer #querybox .table tbody > tr:last-child td {padding: 2px}
-#querybox a:hover {text-decoration: none;}
-
-#selectPeriod {padding: 4px; height: 197px; min-width: 120px}
-#selectPeriod > .dropdown-header {background: #f1f1f1; display: block; text-align: center; padding: 4px 0; line-height: 20px; margin-bottom: 5px; font-size: 14px; border-radius: 2px; color: #333; font-size: 12px}
-#selectPeriod li > a {padding: 4px 15px; border-radius: 2px}
-
-#moreOrLite {position: absolute; right: -10px; top: 0; bottom: 0}
-#searchlite, #searchmore {color: #4d90fe; width: 50px; padding: 0 5px; line-height: 60px; text-align: center;}
-#searchlite {line-height: 127px}
-#searchform.showmore #searchmore, #searchform #searchlite {display: none;}
-#searchform.showmore #searchlite, #searchform #searchmore {display: inline-block;}
-#searchform .chosen-container[id^="field"] .chosen-drop{min-width: 120px;}
-#searchform [id^="valueBox"] .chosen-container .chosen-single{max-width: 170px;}
-#searchform [id^="valueBox"] .chosen-container .chosen-drop{min-width: 400px;}
-#searchform .chosen-container .chosen-drop ul.chosen-results li{white-space:normal}
-#searchmore > i, #searchlite > i {font-size: 28px;}
-#searchmore > i {position: relative; top: 4px;}
-#searchmore:hover, #searchlite:hover {color: #145CCD; background: #e5e5e5}
-
+.w-400px {width: 400px;}
+.w-60px {width: 60px;}
+.w-160px {width: 160px;}
+.w-120px {width: 120px;}
+.w-70px {width: 70px;}
+.w-110px {width: 110px;}
+#selectPeriod {padding: 4px 0; height: 197px; min-width: 120px}
+#selectPeriod > .dropdown-header {background: #f1f1f1; display: block; text-align: center; padding: 4px 0; line-height: 20px; margin: 5px 10px; font-size: 14px; border-radius: 2px; color: #333; font-size: 12px}
 #groupAndOr {display: inline-block;}
+#searchForm > table {max-width: 1160px; margin: 0 auto;}
+#searchForm > table > tbody > tr > td {padding: 10px 15px; color: #838A9D;}
+#searchForm .form-actions {padding-bottom: 20px; padding-top: 0;}
+#searchForm .chosen-container[id^="field"] .chosen-drop {min-width: 140px;}
+#searchForm [id^="valueBox"] .chosen-container .chosen-single {max-width: 170px;}
+#searchForm [id^="valueBox"] .chosen-container .chosen-drop {min-width: 400px;}
+#searchForm .chosen-container .chosen-drop ul.chosen-results li {white-space:normal}
+#searchForm input.date::-webkit-input-placeholder {color: #000000; opacity: 1;}
+#searchForm input.date::-moz-placeholder {color: #000000; opacity: 1;}
+#searchForm input.date:-ms-input-placeholder {color: #000000; opacity: 1;}
+#searchForm .btn-expand-form {background: transparent;}
+#searchForm .btn-expand-form:hover {background: #e9f2fb;}
+.showmore .btn-expand-form .icon-chevron-double-down:before {content: '\e959';}

-.outer > #querybox {margin: -20px -20px 20px; border-top: none; border-bottom: 1px solid #ddd}
-
-#searchform input.date::-webkit-input-placeholder{color: #000000; opacity: 1;}
-#searchform input.date::-moz-placeholder{color: #000000; opacity: 1;}
-#searchform input.date:-ms-input-placeholder{color: #000000; opacity: 1;}
+#userQueries {border-left: 1px solid #eee; vertical-align: top;}
+#userQueries > h4 {margin: 0 0 6px;}
+#userQueries .label {line-height: 24px; padding: 0 4px 0 8px; display: inline-block; background-color: #EEEEEE; color: #A6AAB8; border-radius: 12px; margin-bottom: 5px;}
+#userQueries .label:hover {background-color: #aaa; color: #fff;}
+#userQueries .label > .icon-close {position: relative; top: 0; border-radius: 9px; font-size: 12px; line-height: 18px; width: 18px; display: inline-block;}
+#userQueries .label > .icon-close:hover {background-color: #ff5d5d; color: #fff;}
 </style>
-<script language='Javascript'>
+<form method='post' action='<?php echo $this->createLink('search', 'buildQuery');?>' target='hiddenwin' id='searchForm'>
+<div class='hidden'>
+<?php
+/* Print every field as an html object, select or input. Thus when setFiled is called, copy it's html to build the search form. */
+foreach($fieldParams as $fieldName => $param)
+{
+    echo "<div id='box$fieldName'>";
+    if($param['control'] == 'select') echo html::select('field' . $fieldName, $param['values'], '', "class='form-control searchSelect'");
+    if($param['control'] == 'input')  echo html::input('field' . $fieldName, '', "class='form-control searchInput' autocomplete='off'");
+    echo '</div>';
+}
+?>
+</div>
+<table class='table table-condensed table-form' id='<?php echo "{$module}-search";?>'>
+  <tbody>
+    <tr>
+      <td class='w-400px'>
+        <table class='table table-form table-fixed'>
+          <tbody>
+            <?php
+            $formSessionName = $module . 'Form';
+            $formSession     = $this->session->$formSessionName;
+
+            $fieldNO = 1;
+            for($i = 1; $i <= $groupItems; $i ++)
+            {
+                $spanClass = $i == 1 ? '' : 'hidden';
+                echo "<tr id='searchbox$fieldNO' class='$spanClass'>";
+
+                /* Get params of current field. */
+                $currentField = $formSession["field$fieldNO"];
+                if(!isset($fieldParams[$currentField]))
+                {
+                    $currentField = key($searchFields);
+                    $formSession["field$fieldNO"]    = $currentField;
+                    $formSession["operator$fieldNO"] = isset($fieldParams[$currentField]['operator']) ? $fieldParams[$currentField]['operator'] : '=';
+                    $formSession["value$fieldNO"]    =  '';
+                }
+
+                $param = $fieldParams[$currentField];
+
+                /* Print and or. */
+                echo "<td class='text-right w-60px'>";
+                if($i == 1) echo "<span id='searchgroup1'><strong>{$lang->search->group1}</strong></span>" . html::hidden("andOr$fieldNO", 'AND');
+                if($i > 1)  echo html::select("andOr$fieldNO", $lang->search->andor, $formSession["andOr$fieldNO"], "class='form-control'");
+                echo '</td>';
+
+                /* Print field. */
+                echo "<td class='w-110px' style='overflow: visible'>" . html::select("field$fieldNO", $searchFields, $formSession["field$fieldNO"], "onchange='setField(this, $fieldNO, {$module}params)' class='form-control chosen'") . '</td>';
+
+                /* Print operator. */
+                echo "<td class='w-70px'>" . html::select("operator$fieldNO", $lang->search->operators, $formSession["operator$fieldNO"], "class='form-control'") . '</td>';
+
+                /* Print value. */
+                echo "<td id='valueBox$fieldNO' style='overflow:visible'>";
+                if($param['control'] == 'select') echo html::select("value$fieldNO", $param['values'], $formSession["value$fieldNO"], "class='form-control searchSelect chosen'");
+                if($param['control'] == 'input')
+                {
+                    $fieldName  = $formSession["field$fieldNO"];
+                    $fieldValue = $formSession["value$fieldNO"];
+                    $extraClass = isset($param['class']) ? $param['class'] : '';
+
+                    if($fieldValue && strpos('$lastWeek,$thisWeek,$today,$yesterday,$thisMonth,$lastMonth',$fieldValue) !== false)
+                    {
+                        echo html::input("dateValue$fieldNO", '', "class='form-control $extraClass searchInput' placeholder='{$fieldValue}'");
+                        echo html::hidden("value$fieldNO", $fieldValue);
+                    }
+                    else
+                    {
+                        echo html::input("value$fieldNO", $fieldValue, "class='form-control $extraClass searchInput' autocomplete='off'");
+                    }
+                }
+                echo '</td>';
+
+                $fieldNO ++;
+                echo '</tr>';
+            }
+            ?>
+          </tbody>
+        </table>
+      </td>
+      <td class='text-center nobr'><?php echo html::select('groupAndOr', $lang->search->andor, $formSession['groupAndOr'], "class='form-control w-60px'")?></td>
+      <td class='w-400px'>
+        <table class='table table-form'>
+          <tbody>
+            <?php
+            for($i = 1; $i <= $groupItems; $i ++)
+            {
+                $spanClass = $i == 1 ? '' : 'hidden';
+                echo "<tr id='searchbox$fieldNO' class='$spanClass'>";
+
+                /* Get params of current field. */
+                $currentField = $formSession["field$fieldNO"];
+                if(!isset($fieldParams[$currentField]))
+                {
+                    $currentField = key($searchFields);
+                    $formSession["field$fieldNO"]    = $currentField;
+                    $formSession["operator$fieldNO"] = isset($fieldParams[$currentField]['operator']) ? $fieldParams[$currentField]['operator'] : '=';
+                    $formSession["value$fieldNO"]    =  '';
+                }
+                $param = $fieldParams[$currentField];
+
+                /* Print and or. */
+                echo "<td class='text-right w-60px'>";
+                if($i == 1) echo "<span id='searchgroup2'><strong>{$lang->search->group2}</strong></span>" . html::hidden("andOr$fieldNO", 'AND');
+                if($i > 1)  echo html::select("andOr$fieldNO", $lang->search->andor, $formSession["andOr$fieldNO"], "class='form-control'");
+                echo '</td>';
+
+                /* Print field. */
+                echo "<td class='w-90px' style='overflow: visible'>" . html::select("field$fieldNO", $searchFields, $formSession["field$fieldNO"], "onchange='setField(this, $fieldNO, {$module}params)' class='form-control chosen'") . '</td>';
+
+                /* Print operator. */
+                echo "<td class='w-70px'>" .  html::select("operator$fieldNO", $lang->search->operators, $formSession["operator$fieldNO"], "class='form-control'") . '</td>';
+
+                /* Print value. */
+                echo "<td id='valueBox$fieldNO'>";
+                if($param['control'] == 'select') echo html::select("value$fieldNO", $param['values'], $formSession["value$fieldNO"], "class='form-control searchSelect chosen'");
+
+                if($param['control'] == 'input')
+                {
+                    $fieldName  = $formSession["field$fieldNO"];
+                    $fieldValue = $formSession["value$fieldNO"];
+                    $extraClass = isset($param['class']) ? $param['class'] : '';
+
+                    if($fieldValue && strpos('$lastWeek,$thisWeek,$today,$yesterday,$thisMonth,$lastMonth',$fieldValue) !== false)
+                    {
+                        echo html::input("dateValue$fieldNO", '', "class='form-control $extraClass searchInput' placeholder='{$fieldValue}'");
+                        echo html::hidden("value$fieldNO", $fieldValue);
+                    }
+                    else
+                    {
+                        echo html::input("value$fieldNO", $fieldValue, "class='form-control $extraClass searchInput' autocomplete='off'");
+                    }
+                }
+                echo '</td>';
+
+                $fieldNO ++;
+                echo '</tr>';
+            }
+            ?>
+          </tbody>
+        </table>
+      </td>
+      <td class='w-160px' rowspan='2' id='userQueries'>
+        <h4><?php echo $lang->search->savedQuery;?></h4>
+        <div>
+          <?php foreach($queries as $queryID => $queryName):?>
+          <?php echo html::a("javascript:executeQuery($queryID)", $queryName . (common::hasPriv('search', 'deleteQuery') ? '<i class="icon icon-close"></i>' : ''), '', "class='label user-query' data-query-id='$queryID'");?>
+          <?php endforeach;?>
+        </div>
+      </td>
+    </tr>
+    <tr>
+      <td colspan='3' class='text-center form-actions'>
+        <?php
+        echo html::hidden('module',     $module);
+        echo html::hidden('actionURL',  $actionURL);
+        echo html::hidden('groupItems', $groupItems);
+        echo html::submitButton($lang->search->common);
+        if($style != 'simple')
+        {
+            if(common::hasPriv('search', 'saveQuery')) echo html::a($this->createLink('search', 'saveQuery', "module=$module&onMenuBar=$onMenuBar"), $lang->save, '', "class='btn-save-form btn btn-secondary btn-wide'");
+            echo html::commonButton($lang->search->reset, 'onclick=resetForm(this)');
+        }
+        echo html::commonButton('<i class="icon icon-chevron-double-down"></i>', '', '"btn-expand-form btn btn-info pull-right"');
+        echo html::hidden('formType', 'lite');
+        ?>
+      </td>
+    </tr>
+  </tbody>
+</table>
+</form>
+<script>
 var dtOptions =
 {
    language: '<?php echo $this->app->getClientLang();?>',
@@ -73,437 +231,207 @@ var dtOptions =
    forceParse: 0,
    format: 'yyyy-mm-dd'
 };
-
-$(function()
-{
-    $('.date').each(function()
-    {
-        time = $(this).val();
-        if(!isNaN(time) && time != ''){
-            var Y = time.substring(0, 4);
-            var m = time.substring(4, 6);
-            var d = time.substring(6, 8);
-            time = Y + '-' + m + '-' + d;
-            $('.date').val(time);
-        }
-    });
-    setDateField('.date');
-});
-
 var <?php echo $module . 'params'?> = <?php echo empty($fieldParams) ? '{}' : json_encode($fieldParams);?>;
 var groupItems    = <?php echo $config->search->groupItems;?>;
 var setQueryTitle = '<?php echo $lang->search->setQueryTitle;?>';
 var module        = '<?php echo $module;?>';
 var actionURL     = '<?php echo $actionURL;?>';

-/**
- * Set date field
- *
- * @param  string $query
- * @return void
- */
-function setDateField(query, fieldNO)
+$(function()
 {
-    var $period = $('#selectPeriod');
-    if(!$period.length)
+
+    var $searchForm = $('#searchForm');
+    $searchForm.find('select.chosen').chosen();
+
+    /*
+     * Load queries form
+     */
+    var loadQueries = window.loadQueries = function(queryID)
    {
-        $period = $("<ul id='selectPeriod' class='dropdown-menu'><li class='dropdown-header'><?php echo $lang->datepicker->dpText->TEXT_OR . ' ' . $lang->datepicker->dpText->TEXT_DATE;?></li><li><a href='#lastWeek'><?php echo $lang->datepicker->dpText->TEXT_PREV_WEEK;?></a></li><li><a href='#thisWeek'><?php echo $lang->datepicker->dpText->TEXT_THIS_WEEK;?></a></li><li><a href='#yesterday'><?php echo $lang->datepicker->dpText->TEXT_YESTERDAY;?></a></li><li><a href='#today'><?php echo $lang->datepicker->dpText->TEXT_TODAY;?></a></li><li><a href='#lastMonth'><?php echo $lang->datepicker->dpText->TEXT_PREV_MONTH;?></a></li><li><a href='#thisMonth'><?php echo $lang->datepicker->dpText->TEXT_THIS_MONTH;?></a></li></ul>").appendTo('body');
-        $period.find('li > a').click(function(event)
+        $('#queryBox').load($.createLink('search', 'ajaxGetQuery', 'module=' + module + '&queryID=' + queryID));
+    };
+
+    /*
+     * Expand or collapse form
+     *
+     * @param expand    true for expand form, false for collapse form
+     */
+    var expandForm = function(expand)
+    {
+        if (expand === undefined) expand = !$searchForm.hasClass('showmore');
+        $searchForm.toggleClass('showmore', expand);
+        for(i = 1; i <= groupItems * 2; i ++)
        {
-            var target = $(query).closest('form').find('#' + $period.data('target'));
+            if(i != 1 && i != groupItems + 1 )
+            {
+                $searchForm.find('#searchbox' + i).toggleClass('hidden', !expand);
+            }
+        }
+
+        $searchForm.find('#formType').val(expand ? 'more' : '');
+        $searchForm.toggleClass('showmore', expand);
+    };
+
+    /**
+     * Set date field
+     *
+     * @param  string $query
+     * @return void
+     */
+    var setDateField = function(query, fieldNO)
+    {
+        var $period = $('#selectPeriod');
+        if(!$period.length)
+        {
+            $period = $("<ul id='selectPeriod' class='dropdown-menu'><li class='dropdown-header'><?php echo $lang->datepicker->dpText->TEXT_OR . ' ' . $lang->datepicker->dpText->TEXT_DATE;?></li><li><a href='#lastWeek'><?php echo $lang->datepicker->dpText->TEXT_PREV_WEEK;?></a></li><li><a href='#thisWeek'><?php echo $lang->datepicker->dpText->TEXT_THIS_WEEK;?></a></li><li><a href='#yesterday'><?php echo $lang->datepicker->dpText->TEXT_YESTERDAY;?></a></li><li><a href='#today'><?php echo $lang->datepicker->dpText->TEXT_TODAY;?></a></li><li><a href='#lastMonth'><?php echo $lang->datepicker->dpText->TEXT_PREV_MONTH;?></a></li><li><a href='#thisMonth'><?php echo $lang->datepicker->dpText->TEXT_THIS_MONTH;?></a></li></ul>").appendTo('body');
+            $period.find('li > a').click(function(event)
+            {
+                var target = $(query).closest('form').find('#' + $period.data('target'));
+                if(target.length)
+                {
+                    if(target.next('input[type=hidden]').length)
+                    {
+                        target.next('input[type=hidden]').val($(this).attr('href').replace('#', '$'));
+                        target.attr('placeholder', $(this).attr('href').replace('#', '$'));
+                    }
+                    else
+                    {
+                        target.val($(this).attr('href').replace('#', '$'));
+                    }
+
+                    $(query).closest('form').find('#operator' + $period.data('fieldNO')).val('between');
+                    $period.hide();
+                }
+                event.stopPropagation();
+                return false;
+            });
+        }
+        $(query).datetimepicker('remove').datepicker(dtOptions).on('show', function(e)
+        {
+            var $e = $(e.target);
+            var ePos = $e.offset();
+            $period.css({'left': ePos.left + 211, 'top': ePos.top + 29, 'min-height': $('.datetimepicker').outerHeight()}).show().data('target', $e.attr('id')).data('fieldNO', fieldNO).find('li.active').removeClass('active');
+            if($e.attr('placeholder'))
+            {
+                $period.find("li > a[href='" + $e.attr('placeholder').replace('$', '#') + "']").closest('li').addClass('active');
+            }
+            else
+            {
+                $period.find("li > a[href='" + $e.val().replace('$', '#') + "']").closest('li').addClass('active');
+            }
+        }).on('changeDate', function()
+        {
+            var opt = $(query).closest('form').find('#operator' + $period.data('fieldNO'));
+            var target = $('#' + $period.data('target'));
            if(target.length)
            {
                if(target.next('input[type=hidden]').length)
                {
-                    target.next('input[type=hidden]').val($(this).attr('href').replace('#', '$'));
-                    target.attr('placeholder', $(this).attr('href').replace('#', '$'));
+                    target.next('input[type=hidden]').val(target.val());
                }
-                else
-                {
-                    target.val($(this).attr('href').replace('#', '$'));
-                }
-
-                $(query).closest('form').find('#operator' + $period.data('fieldNO')).val('between');
-                $period.hide();
            }
-            event.stopPropagation();
-            return false;
-        });
-    }
-    $(query).datetimepicker('remove').datetimepicker(dtOptions).on('show', function(e)
-    {
-        var $e = $(e.target);
-        var ePos = $e.offset();
-        $period.css({'left': ePos.left + 175, 'top': ePos.top + 29, 'min-height': $('.datetimepicker').outerHeight()}).show().data('target', $e.attr('id')).data('fieldNO', fieldNO).find('li.active').removeClass('active');
-        if($e.attr('placeholder'))
-        {
-            $period.find("li > a[href='" + $e.attr('placeholder').replace('$', '#') + "']").closest('li').addClass('active');
-        }
-        else
-        {
-            $period.find("li > a[href='" + $e.val().replace('$', '#') + "']").closest('li').addClass('active');
-        }
-    }).on('changeDate', function()
-    {
-        var opt = $(query).closest('form').find('#operator' + $period.data('fieldNO'));
-        var target = $('#' + $period.data('target'));
-        if(target.length)
-        {
-            if(target.next('input[type=hidden]').length)
-            {
-                target.next('input[type=hidden]').val(target.val());
-            }
-        }
-        if(opt.val() == 'between') opt.val('<=');
-        $period.hide();
-    }).on('hide', function(){setTimeout(function(){$period.hide();}, 200);});
-}
-
-/**
- * When the value of the fields select changed, set the operator and value of the new field.
- *
- * @param  string $obj
- * @param  int    $fieldNO
- * @access public
- * @return void
- */
-function setField(obj, fieldNO, moduleparams)
-{
-    var params    = moduleparams;
-    var fieldName = $(obj).val();
-    $(obj).closest('form').find('#operator' + fieldNO).val(params[fieldName]['operator']);   // Set the operator according the param setting.
-    $(obj).closest('form').find('#valueBox' + fieldNO).html($(obj).closest('form').find('#box' + fieldName).children().clone());
-    $(obj).closest('form').find('#valueBox' + fieldNO).children().attr({name : 'value' + fieldNO, id : 'value' + fieldNO});
-
-    if(typeof(params[fieldName]['class']) != undefined && params[fieldName]['class'] == 'date')
-    {
-        setDateField($(obj).closest('form').find("#value" + fieldNO), fieldNO);
-        $(obj).closest('form').find("#value" + fieldNO).addClass('date');   // Shortcut the width of the datepicker to make sure align with others.
-        var groupItems = <?php echo $config->search->groupItems?>;
-        var maxNO      = 2 * groupItems;
-        var nextNO     = fieldNO > groupItems ? fieldNO - groupItems + 1 : fieldNO + groupItems;
-        var nextValue  = $(obj).closest('form').find('#value' + nextNO).val();
-        var operator   = $(obj).closest('form').find("#operator" + fieldNO).val();
-        if(nextNO <= maxNO && fieldNO < maxNO && (nextValue == '' || nextValue == 0) && operator == ">=")
-        {
-            $(obj).closest('form').find('#field' + nextNO).val($(obj).closest('form').find('#field' + fieldNO).val());
-            $(obj).closest('form').find('#operator' + nextNO).val('<=');
-            $(obj).closest('form').find('#valueBox' + nextNO).html($(obj).closest('form').find('#box' + fieldName).children().clone());
-            $(obj).closest('form').find('#valueBox' + nextNO).children().attr({name : 'value' + nextNO, id : 'value' + nextNO});
-            setDateField($(obj).closest('form').find("#value" + nextNO), nextNO);
-            $(obj).closest('form').find("#value" + nextNO).addClass('date');
-        }
-    }
-    else if(params[fieldName]['control'] == 'select')
-    {
-        $(obj).closest('form').find("#value" + fieldNO).chosen(defaultChosenOptions).on('chosen:showing_dropdown', function()
-        {
-            var $this = $(this);
-            var $chosen = $this.next('.chosen-container').removeClass('chosen-up');
-            var $drop = $chosen.find('.chosen-drop');
-            $chosen.toggleClass('chosen-up', $drop.height() + $drop.offset().top - $(document).scrollTop() > $(window).height());
-        });
-    }
-}
-
-/**
- * Reset forms.
- *
- * @access public
- * @return void
- */
-function resetForm(obj)
-{
-    for(i = 1; i <= groupItems * 2; i ++)
-    {
-        $(obj).closest('form').find('#value' + i).val('').trigger('chosen:updated');
-        $(obj).closest('form').find('#dateValue' + i).val('').attr('placeholder','');
-    }
-}
-
-/**
- * Show more fields.
- *
- * @access public
- * @return void
- */
-function showmore(obj)
-{
-    for(i = 1; i <= groupItems * 2; i ++)
-    {
-        if(i != 1 && i != groupItems + 1 )
-        {
-            $(obj).closest('form').find('#searchbox' + i).removeClass('hidden');
-        }
+            if(opt.val() == 'between') opt.val('<=');
+            $period.hide();
+        }).on('hide', function(){setTimeout(function(){$period.hide();}, 200);});
    }

-    $(obj).closest('form').find('#formType').val('more');
-    $(obj).closest('form').addClass('showmore');
-}
-
-/**
- * Show lite search form.
- *
- * @access public
- * @return void
- */
-function showlite(obj)
-{
-    for(i = 1; i <= groupItems * 2; i ++)
+    /**
+     * When the value of the fields select changed, set the operator and value of the new field.
+     *
+     * @param  string $obj
+     * @param  int    $fieldNO
+     * @access public
+     * @return void
+     */
+    var setField = window.setField = function(obj, fieldNO, moduleparams)
    {
-        if(i != 1 && i != groupItems + 1)
+        var params    = moduleparams;
+        var $obj      = $(obj);
+        var fieldName = $obj.val();
+        $searchForm.find('#operator' + fieldNO).val(params[fieldName]['operator']);   // Set the operator according the param setting.
+        $searchForm.find('#valueBox' + fieldNO).html($searchForm.find('#box' + fieldName).children().clone());
+        $searchForm.find('#valueBox' + fieldNO).children().attr({name : 'value' + fieldNO, id : 'value' + fieldNO});
+
+        if(typeof(params[fieldName]['class']) != undefined && params[fieldName]['class'] == 'date')
        {
-            $(obj).closest('form').find('#value' + i).val('');
-            $(obj).closest('form').find('#searchbox' + i).addClass('hidden');
-        }
-    }
-    $(obj).closest('form').removeClass('showmore');
-    $(obj).closest('form').find('#formType').val('lite');
-}
-
-/**
- * loadQueries.
- *
- * @param  queryID $queryID
- * @access public
- * @return void
- */
-function loadQueries(queryID)
-{
-    $('#queryBox').load(createLink('search', 'ajaxGetQuery', 'module=' + module + '&queryID=' + queryID));
-}
-
-/**
- * Execute a query.
- *
- * @param  int    $queryID
- * @access public
- * @return void
- */
-function executeQuery(queryID)
-{
-    if(!queryID) return;
-    location.href = actionURL.replace('myQueryID', queryID);
-}
-
-/**
- * Delete a query.
- *
- * @access public
- * @return void
- */
-function deleteQuery()
-{
-    queryID = $('#queryID').val();
-    if(!queryID) return;
-    deleteQueryLink = createLink('search', 'deleteQuery', 'queryID=' + queryID);
-    $.get(deleteQueryLink, function(data)
-    {
-        if(data == 'success') $('#queryBox').load(createLink('search', 'ajaxGetQuery', 'module=' + module));
-    });
-}
-
-$(function()
-{
-    $('#searchform select[id^="operator"]').change(function()
-    {
-        var value = $(this).val();
-        if(value == '>=' && $(this).closest('tr').find('input[id^="value"]').hasClass('date'))
-        {
-            fieldNO   = parseInt($(this).attr('id').replace('operator', ''));
-            fieldName = $(this).closest('tr').find("select[id^='field']").val();
-            var $form      = $(this).closest('form');
-            var groupItems = <?php echo $config->search->groupItems?>;
+            setDateField($searchForm.find("#value" + fieldNO), fieldNO);
+            $searchForm.find("#value" + fieldNO).addClass('date');   // Shortcut the width of the datepicker to make sure align with others.
            var maxNO      = 2 * groupItems;
            var nextNO     = fieldNO > groupItems ? fieldNO - groupItems + 1 : fieldNO + groupItems;
-            var nextValue  = $form.find('#value' + nextNO).val();
-            if(nextNO <= maxNO && fieldNO < maxNO && (nextValue == '' || nextValue == 0))
+            var nextValue  = $searchForm.find('#value' + nextNO).val();
+            var operator   = $searchForm.find("#operator" + fieldNO).val();
+            if(nextNO <= maxNO && fieldNO < maxNO && (nextValue == '' || nextValue == 0) && operator == ">=")
            {
-                $form.find('#field' + nextNO).val($form.find('#field' + fieldNO).val());
-                $form.find('#operator' + nextNO).val('<=');
-                $form.find('#valueBox' + nextNO).html($form.find('#box' + fieldName).children().clone());
-                $form.find('#valueBox' + nextNO).children().attr({name : 'value' + nextNO, id : 'value' + nextNO});
-                setDateField($form.find("#value" + nextNO), nextNO);
-                $form.find("#value" + nextNO).addClass('date');
+                $searchForm.find('#field' + nextNO).val($searchForm.find('#field' + fieldNO).val());
+                $searchForm.find('#operator' + nextNO).val('<=');
+                $searchForm.find('#valueBox' + nextNO).html($searchForm.find('#box' + fieldName).children().clone());
+                $searchForm.find('#valueBox' + nextNO).children().attr({name : 'value' + nextNO, id : 'value' + nextNO});
+                setDateField($searchForm.find("#value" + nextNO), nextNO);
+                $searchForm.find("#value" + nextNO).addClass('date');
            }
        }
-    })
-})
-</script>
+        else if(params[fieldName]['control'] == 'select')
+        {
+            $searchForm.find("#value" + fieldNO).chosen().on('chosen:showing_dropdown', function()
+            {
+                var $this = $(this);
+                var $chosen = $this.next('.chosen-container').removeClass('chosen-up');
+                var $drop = $chosen.find('.chosen-drop');
+                $chosen.toggleClass('chosen-up', $drop.height() + $drop.offset().top - $(document).scrollTop() > $(window).height());
+            });
+        }
+    };

-<form method='post' action='<?php echo $this->createLink('search', 'buildQuery');?>' target='hiddenwin' id='searchform' class='form-condensed'>
-<div class='hidden'>
-<?php
-/* Print every field as an html object, select or input. Thus when setFiled is called, copy it's html to build the search form. */
-foreach($fieldParams as $fieldName => $param)
-{
-    echo "<span id='box$fieldName'>";
-    if($param['control'] == 'select') echo html::select('field' . $fieldName, $param['values'], '', "class='form-control searchSelect'");
-    if($param['control'] == 'input')  echo html::input('field' . $fieldName, '', "class='form-control searchInput' autocomplete='off'");
-    echo '</span>';
-}
-?>
-</div>
-<table class='table table-condensed table-form' id='<?php echo "{$module}-search";?>' style='max-width: 1200px; margin: 0 auto'>
-  <tr>
-    <td class='w-400px'>
-      <table class='table active-disabled table-fixed'>
-      <?php
-      $formSessionName = $module . 'Form';
-      $formSession     = $this->session->$formSessionName;
+    /*
+     * Reset form
+     */
+    var resetForm = function()
+    {
+        for(i = 1; i <= groupItems * 2; i ++)
+        {
+            $searchForm.find('#value' + i).val('').trigger('chosen:updated');
+            $searchForm.find('#dateValue' + i).val('').attr('placeholder','');
+        }
+    };

-      $fieldNO = 1;
-      for($i = 1; $i <= $groupItems; $i ++)
-      {
-          $spanClass = $i == 1 ? '' : 'hidden';
-          echo "<tr id='searchbox$fieldNO' class='$spanClass'>";
+    $searchForm.on('click', '.btn-expand-form', function() {expandForm();});
+    $searchForm.on('click', '.btn-reset-form', function() {resetForm();});
+    $searchForm.on('change', 'select[id^="operator"]', function()
+    {
+        var $select = $(this);
+        var value = $select.val();
+        var $tr = $select.closest('tr');
+        if(value == '>=' && $tr.find('input[id^="value"].date').length)
+        {
+            var fieldNO   = parseInt($(this).attr('id').replace('operator', ''));
+            var fieldName = $tr.find("select[id^='field']").val();
+            var maxNO      = 2 * groupItems;
+            var nextNO     = fieldNO > groupItems ? fieldNO - groupItems + 1 : fieldNO + groupItems;
+            var nextValue  = searchForm.find('#value' + nextNO).val();
+            if(nextNO <= maxNO && fieldNO < maxNO && (nextValue == '' || nextValue == 0))
+            {
+                searchForm.find('#field' + nextNO).val(searchForm.find('#field' + fieldNO).val());
+                searchForm.find('#operator' + nextNO).val('<=');
+                searchForm.find('#valueBox' + nextNO).html(searchForm.find('#box' + fieldName).children().clone());
+                searchForm.find('#valueBox' + nextNO).children().attr({name : 'value' + nextNO, id : 'value' + nextNO});
+                setDateField(searchForm.find("#value" + nextNO), nextNO);
+                searchForm.find("#value" + nextNO).addClass('date');
+            }
+        }
+    });

-          /* Get params of current field. */
-          $currentField = $formSession["field$fieldNO"];
-          if(!isset($fieldParams[$currentField]))
-          {
-              $currentField = key($searchFields);
-              $formSession["field$fieldNO"]    = $currentField;
-              $formSession["operator$fieldNO"] = isset($fieldParams[$currentField]['operator']) ? $fieldParams[$currentField]['operator'] : '=';
-              $formSession["value$fieldNO"]    =  '';
-          }
+    $searchForm.find('.btn-save-form').modalTrigger({width:650, type:'iframe', title: setQueryTitle});

-          $param = $fieldParams[$currentField];
-
-          /* Print and or. */
-          echo "<td class='text-right w-60px'>";
-          if($i == 1) echo "<span id='searchgroup1'><strong>{$lang->search->group1}</strong></span>" . html::hidden("andOr$fieldNO", 'AND');
-          if($i > 1)  echo html::select("andOr$fieldNO", $lang->search->andor, $formSession["andOr$fieldNO"], "class='form-control'");
-          echo '</td>';
-
-          /* Print field. */
-          echo "<td class='w-110px' style='overflow: visible'>" . html::select("field$fieldNO", $searchFields, $formSession["field$fieldNO"], "onchange='setField(this, $fieldNO, {$module}params)' class='form-control chosen'") . '</td>';
-
-          /* Print operator. */
-          echo "<td class='w-70px'>" . html::select("operator$fieldNO", $lang->search->operators, $formSession["operator$fieldNO"], "class='form-control'") . '</td>';
-
-          /* Print value. */
-          echo "<td id='valueBox$fieldNO' style='overflow:visible'>";
-          if($param['control'] == 'select') echo html::select("value$fieldNO", $param['values'], $formSession["value$fieldNO"], "class='form-control searchSelect chosen'");
-          if($param['control'] == 'input')
-          {
-              $fieldName  = $formSession["field$fieldNO"];
-              $fieldValue = $formSession["value$fieldNO"];
-              $extraClass = isset($param['class']) ? $param['class'] : '';
-
-              if($fieldValue && strpos('$lastWeek,$thisWeek,$today,$yesterday,$thisMonth,$lastMonth',$fieldValue) !== false)
-              {
-                  echo html::input("dateValue$fieldNO", '', "class='form-control $extraClass searchInput' placeholder='{$fieldValue}'");
-                  echo html::hidden("value$fieldNO", $fieldValue);
-              }
-              else
-              {
-                  echo html::input("value$fieldNO", $fieldValue, "class='form-control $extraClass searchInput' autocomplete='off'");
-              }
-          }
-          echo '</td>';
-
-          $fieldNO ++;
-          echo '</tr>';
-      }
-      ?>
-      </table>
-    </td>
-    <td class='text-center nobr'><?php echo html::select('groupAndOr', $lang->search->andor, $formSession['groupAndOr'], "class='form-control w-60px'")?></td>
-    <td class='w-400px'>
-      <table class='table active-disabled'>
-      <?php
-      for($i = 1; $i <= $groupItems; $i ++)
-      {
-          $spanClass = $i == 1 ? '' : 'hidden';
-          echo "<tr id='searchbox$fieldNO' class='$spanClass'>";
-
-          /* Get params of current field. */
-          $currentField = $formSession["field$fieldNO"];
-          if(!isset($fieldParams[$currentField]))
-          {
-              $currentField = key($searchFields);
-              $formSession["field$fieldNO"]    = $currentField;
-              $formSession["operator$fieldNO"] = isset($fieldParams[$currentField]['operator']) ? $fieldParams[$currentField]['operator'] : '=';
-              $formSession["value$fieldNO"]    =  '';
-          }
-          $param = $fieldParams[$currentField];
-
-          /* Print and or. */
-          echo "<td class='text-right w-60px'>";
-          if($i == 1) echo "<span id='searchgroup2'><strong>{$lang->search->group2}</strong></span>" . html::hidden("andOr$fieldNO", 'AND');
-          if($i > 1)  echo html::select("andOr$fieldNO", $lang->search->andor, $formSession["andOr$fieldNO"], "class='form-control'");
-          echo '</td>';
-
-          /* Print field. */
-          echo "<td class='w-90px' style='overflow: visible'>" . html::select("field$fieldNO", $searchFields, $formSession["field$fieldNO"], "onchange='setField(this, $fieldNO, {$module}params)' class='form-control chosen'") . '</td>';
-
-          /* Print operator. */
-          echo "<td class='w-70px'>" .  html::select("operator$fieldNO", $lang->search->operators, $formSession["operator$fieldNO"], "class='form-control'") . '</td>';
-
-          /* Print value. */
-          echo "<td id='valueBox$fieldNO'>";
-          if($param['control'] == 'select') echo html::select("value$fieldNO", $param['values'], $formSession["value$fieldNO"], "class='form-control searchSelect chosen'");
-
-          if($param['control'] == 'input')
-          {
-              $fieldName  = $formSession["field$fieldNO"];
-              $fieldValue = $formSession["value$fieldNO"];
-              $extraClass = isset($param['class']) ? $param['class'] : '';
-
-              if($fieldValue && strpos('$lastWeek,$thisWeek,$today,$yesterday,$thisMonth,$lastMonth',$fieldValue) !== false)
-              {
-                  echo html::input("dateValue$fieldNO", '', "class='form-control $extraClass searchInput' placeholder='{$fieldValue}'");
-                  echo html::hidden("value$fieldNO", $fieldValue);
-              }
-              else
-              {
-                  echo html::input("value$fieldNO", $fieldValue, "class='form-control $extraClass searchInput' autocomplete='off'");
-              }
-          }
-          echo '</td>';
-
-          $fieldNO ++;
-          echo '</tr>';
-      }
-      ?>
-      </table>
-    </td>
-    <td class='<?php echo $style == 'simple' ? 'w-80px' : 'w-160px';?>'>
-      <?php
-      echo html::hidden('module',     $module);
-      echo html::hidden('actionURL',  $actionURL);
-      echo html::hidden('groupItems', $groupItems);
-      echo "<div class='btn-group'>";
-      echo html::submitButton($lang->search->common);
-      if($style != 'simple')
-      {
-          echo html::commonButton($lang->search->reset, 'onclick=resetForm(this)');
-          if(common::hasPriv('search', 'saveQuery')) echo html::a($this->createLink('search', 'saveQuery', "module=$module&onMenuBar=$onMenuBar"), $lang->save, '', "class='saveQuery btn'");
-      }
-      echo '</div>';
-      ?>
-    </td>
-    <?php if($style != 'simple'):?>
-    <td class='w-120px'>
-      <div class='input-group'>
-      <span id='queryBox'><?php echo html::select('queryID', $queries, $queryID, 'onchange=executeQuery(this.value) class=form-control');?></span>
-      <?php if(common::hasPriv('search', 'deleteQuery')) echo "<span class='input-group-btn'>" . html::a('javascript:deleteQuery()', '<i class="icon-remove"></i>', '', 'class=btn') . '</span>';?>
-      </div>
-    </td>
-    <?php endif;?>
-  </tr>
-</table>
-<div id='moreOrLite'>
-  <a id="searchmore" href="javascript:;" onclick="showmore(this)"><i class="icon-double-angle-down icon-2x"></i></a>
-  <a id="searchlite" href="javascript:;" onclick="showlite(this)"><i class="icon-double-angle-up icon-2x"></i></a>
-  <?php echo html::hidden('formType', 'lite');?>
-</div>
-</form>
-<script>
-$(function()
-{
-   $(".saveQuery").modalTrigger({width:650, type:'iframe', title:'<?php echo $lang->search->setQueryTitle?>'});
-   <?php if(isset($formSession['formType'])) echo "show{$formSession['formType']}('#{$module}-search')";?>
+    $searchForm.on('click', '.user-query .icon-close', function(e)
+    {
+        var $query = $(this).closest('.user-query');
+        var queryId = $query.data('queryId');
+        var deleteQueryLink = $.createLink('search', 'deleteQuery', 'queryID=' + queryId);
+        $.getJSON(deleteQueryLink, function(data)
+        {
+            if(data == 'success') $query.remove();
+        });
+        e.stopPropagation();
+    });
 });
 </script>
@@ -2332,10 +2332,7 @@ class storyModel extends model
        $id        = $col->id;
        if($col->show)
        {
-            $class = '';
-            if($id == 'status') $class .= ' story-' . $story->status;
-            if($id == 'title')  $class .= ' text-left';
-            if($id == 'id')     $class .= ' cell-id';
+            $class = "c-{$id}";
            if($id == 'assignedTo' && $story->assignedTo == $account) $class .= ' red';

            $title = '';
@@ -2346,11 +2343,10 @@ class storyModel extends model
            switch($id)
            {
            case 'id':
-                if($mode == 'table') echo "<input type='checkbox' name='storyIDList[{$story->id}]' value='{$story->id}' /> ";
-                echo $canView ? html::a($storyLink, sprintf('%03d', $story->id)) : sprintf('%03d', $story->id);
+                echo '<div class="checkbox-primary"><input type="checkbox" name="storyIDList[' . $story->id . ']" value="' . $story->id . '"><label></label>' . sprintf('%03d', $story->id) . '</div>';
                break;
            case 'pri':
-                echo "<span class='pri" . zget($this->lang->story->priList, $story->pri, $story->pri) . "'>";
+                echo "<span class='label-pri label-pri-" . $story->pri . "'>";
                echo zget($this->lang->story->priList, $story->pri, $story->pri);
                echo "</span>";
                break;
@@ -2375,7 +2371,9 @@ class storyModel extends model
                echo $story->sourceNote;
                break;
            case 'status':
-                echo $this->lang->story->statusList[$story->status];
+                echo "<span class='status-{$story->status}'>";
+                echo "<span class='label label-dot'></span> " . $this->lang->story->statusList[$story->status];
+                echo '</span>';
                break;
            case 'estimate':
                echo $story->estimate;
@@ -2451,10 +2449,13 @@ class storyModel extends model
                break;
            case 'actions':
                $vars = "story={$story->id}";
-                common::printIcon('story', 'change',     $vars, $story, 'list', 'random');
-                common::printIcon('story', 'review',     $vars, $story, 'list', 'review');
+                echo "<div class='more'>";
+                common::printIcon('story', 'change',     $vars, $story, 'list', 'fork');
+                common::printIcon('story', 'delete',     $vars, $story, 'list', 'trash', 'hiddenwin');
+                echo "</div>";
+                common::printIcon('story', 'review',     $vars, $story, 'list', 'glasses');
                common::printIcon('story', 'close',      $vars, $story, 'list', 'off', '', 'iframe', true);
-                common::printIcon('story', 'edit',       $vars, $story, 'list', 'pencil');
+                common::printIcon('story', 'edit',       $vars, $story, 'list');
                if($this->config->global->flow != 'onlyStory') common::printIcon('story', 'createCase', "productID=$story->product&branch=$story->branch&module=0&from=&param=0&$vars", $story, 'list', 'sitemap');
                break;
            }
@@ -2613,4 +2614,16 @@ class storyModel extends model

        return array($toList, $ccList);
    }
+
+    /**
+     * Get story count.
+     * 
+     * @param  int    $productID 
+     * @access public
+     * @return int
+     */
+    public function getCount($productID)
+    {
+        return $this->dao->select('count(*) as count')->from(TABLE_STORY)->where('deleted')->eq(0)->andWhere('product')->eq($productID)->fetch('count');
+    }
 }
@@ -686,28 +686,28 @@ function toggleSearch()
        {
            if(browseType == 'bymodule')
            {
-                $('#bymoduleTab').removeClass('active');
+                $('#bymoduleTab').removeClass('btn-active-text');
            }
            else
            {
-                $('#' + browseType + 'Tab').removeClass('active');
+                $('#' + browseType + 'Tab').removeClass('btn-active-text');
            }
-            $('#bysearchTab').addClass('active');
+            $('#bysearchTab').addClass('btn-active-text');
            ajaxGetSearchForm();
-            $('#querybox').addClass('show');
+            $('#queryBox').addClass('show');
        },
        function()
        {
            if(browseType == 'bymodule')
            {
-                $('#bymoduleTab').addClass('active');
+                $('#bymoduleTab').addClass('btn-active-text');
            }
            else
            {
-                $('#' + browseType +'Tab').addClass('active');
+                $('#' + browseType +'Tab').addClass('btn-active-text');
            }
-            $('#bysearchTab').removeClass('active');
-            $('#querybox').removeClass('show');
+            $('#bysearchTab').removeClass('btn-active-text');
+            $('#queryBox').removeClass('show');
        } 
    );
 }
@@ -720,7 +720,7 @@ function toggleSearch()
 */
 function ajaxGetSearchForm(querybox)
 {
-    var $querybox = $(querybox || '#querybox');
+    var $querybox = $(querybox || '#queryBox');
    if($querybox.html() == '')
    {
        $.get(createLink('search', 'buildForm'), function(data)
@@ -103,13 +103,16 @@
 <glyph unicode="&#xe955;" glyph-name="file-word" d="M625.58 316.538h39.298l-45.346-201.048-58.956 282.674h-94.712l-68.544-282.674-51.392 282.674h-99.016l100.528-455.004h96.746l67.818 269.076 60.672-269.076h89.188l115.224 455.004h-151.508v-81.628zM872.716 535.93c-19.742 26.928-47.268 58.402-77.49 88.626s-61.702 57.748-88.626 77.49c-45.846 33.616-68.082 37.506-80.82 37.506h-440.888c-39.21 0-71.112-31.9-71.112-71.112v-768c0-39.21 31.898-71.112 71.112-71.112h654.222c39.21 0 71.112 31.9 71.112 71.112v554.666c0 12.738-3.888 34.98-37.506 80.82v0zM755 584.332c27.288-27.288 48.712-51.91 64.518-72.332h-136.848v136.84c20.43-15.806 45.048-37.226 72.332-64.506v0zM853.334-99.556c0-7.708-6.514-14.222-14.222-14.222h-654.222c-7.708 0-14.222 6.514-14.222 14.222v768c0 7.708 6.514 14.222 14.222 14.222 0 0 440.852 0.002 440.888 0v-199.112c0-15.708 12.734-28.444 28.444-28.444h199.112v-554.666z" />
 <glyph unicode="&#xe956;" glyph-name="file-excel" d="M717.358 398.222h-120.26l-85.096-125.362-85.104 125.362h-120.258l144.144-215.524-162.642-239.588h223.856v81.4h-44.584l44.584 66.662 99.018-148.062h124.84l-162.646 239.588 144.146 215.524zM872.716 535.932c-19.742 26.926-47.266 58.4-77.492 88.626s-61.7 57.746-88.626 77.492c-45.844 33.618-68.082 37.506-80.822 37.506h-440.888c-39.21 0-71.112-31.9-71.112-71.112v-768c0-39.21 31.898-71.112 71.112-71.112h654.222c39.21 0 71.112 31.9 71.112 71.112v554.666c0 12.74-3.886 34.978-37.506 80.822v0zM755 584.332c27.288-27.288 48.712-51.91 64.516-72.332h-136.848v136.84c20.428-15.804 45.048-37.224 72.332-64.508v0zM853.334-99.556c0-7.708-6.514-14.222-14.222-14.222h-654.222c-7.708 0-14.222 6.514-14.222 14.222v768c0 7.708 6.514 14.222 14.222 14.222 0 0 440.85 0.002 440.888 0v-199.112c0-15.708 12.732-28.444 28.444-28.444h199.112v-554.666z" />
 <glyph unicode="&#xe957;" glyph-name="code" d="M632.794 70.731l213.713 213.713-213.713 213.713 65.043 65.043 278.756-278.756-278.756-278.756-65.043 65.043zM391.206 70.731l-213.713 213.713 213.713 213.713-65.043 65.043-278.756-278.756 278.756-278.756 65.043 65.043z" />
+<glyph unicode="&#xe958;" glyph-name="home" d="M426.667-56.889v256h170.667v-256h213.333v341.333h128l-426.667 384-426.667-384h128v-341.333h213.333z" />
+<glyph unicode="&#xe959;" glyph-name="chevron-double-up" d="M200.448-170.668l-95.705 95.705 407.257 407.257 407.257-407.257-95.705-95.705-311.553 310.873-311.553-310.873zM200.448 236.592l-95.705 95.705 407.257 407.257 407.257-407.257-95.705-95.705-311.553 310.873-311.553-310.873z" />
+<glyph unicode="&#xe95a;" glyph-name="chevron-double-down" d="M823.553 739.555l95.705-95.705-407.258-407.258-407.258 407.258 95.705 95.705 311.553-310.872 311.553 310.872zM823.553 332.296l95.705-95.705-407.258-407.258-407.258 407.258 95.705 95.705 311.553-310.872 311.553 310.872z" />
 <glyph unicode="&#xe982;" glyph-name="spinner-indicator" d="M416-131.556c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM0 284.444c0 53.020 42.982 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM832 284.444c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM121.844 578.6c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM710.156-9.712c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM121.844-9.712c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96zM710.156 578.6c0 53.020 42.98 96 96 96s96-42.98 96-96c0-53.020-42.98-96-96-96s-96 42.98-96 96z" />
-<glyph unicode="&#xf0d7;" glyph-name="caret-down2" d="M821.728 419.95c0-10.284-4.235-19.964-11.494-27.223l-271.013-271.013c-7.26-7.26-16.939-11.494-27.223-11.494s-19.964 4.235-27.223 11.494l-271.013 271.013c-7.26 7.26-11.494 16.939-11.494 27.223 0 21.172 17.543 38.715 38.715 38.715h542.025c21.172 0 38.715-17.543 38.715-38.715z" />
-<glyph unicode="&#xf0d8;" glyph-name="caret-up2" d="M821.728 148.938c0-21.172-17.543-38.715-38.715-38.715h-542.026c-21.172 0-38.715 17.543-38.715 38.715 0 10.283 4.235 19.964 11.494 27.223l271.013 271.013c7.26 7.26 16.939 11.494 27.223 11.494s19.964-4.235 27.223-11.494l271.013-271.013c7.26-7.26 11.494-16.939 11.494-27.223z" />
-<glyph unicode="&#xf0d9;" glyph-name="caret-left2" d="M704 583.111v-597.333c0-23.334-19.333-42.666-42.666-42.666-11.334 0-22.002 4.666-30 12.666l-298.667 298.667c-7.998 7.998-12.666 18.666-12.666 30s4.666 22.002 12.666 30l298.667 298.667c7.998 7.998 18.666 12.666 30 12.666 23.334 0 42.666-19.333 42.666-42.666z" />
-<glyph unicode="&#xf0da;" glyph-name="caret-right2" d="M704 284.444c0-11.334-4.666-22.002-12.666-30l-298.667-298.667c-7.998-7.998-18.666-12.666-30-12.666-23.334 0-42.666 19.333-42.666 42.666v597.333c0 23.334 19.333 42.666 42.666 42.666 11.334 0 22.002-4.666 30-12.666l298.667-298.667c7.998-7.998 12.666-18.666 12.666-30z" />
-<glyph unicode="&#xf0dc;" glyph-name="sort2" d="M822.304 168.081c0-10.301-4.24-20.003-11.513-27.275l-271.519-271.519c-7.27-7.27-16.973-11.513-27.275-11.513s-20.003 4.24-27.275 11.513l-271.519 271.519c-7.27 7.27-11.513 16.973-11.513 27.275 0 21.214 17.573 38.785 38.785 38.785h543.036c21.214 0 38.785-17.573 38.785-38.785zM822.304 400.807c0-21.214-17.573-38.785-38.785-38.785h-543.036c-21.214 0-38.785 17.573-38.785 38.785 0 10.301 4.24 20.003 11.513 27.275l271.519 271.519c7.27 7.27 16.973 11.513 27.275 11.513s20.003-4.24 27.275-11.513l271.519-271.519c7.27-7.27 11.513-16.973 11.513-27.275z" />
-<glyph unicode="&#xf0dd;" glyph-name="sort-down2" d="M821.724 167.504c0-10.281-4.235-19.964-11.493-27.222l-271.013-271.013c-7.258-7.258-16.939-11.493-27.222-11.493s-19.964 4.235-27.222 11.493l-271.013 271.013c-7.258 7.258-11.493 16.939-11.493 27.222 0 21.171 17.545 38.713 38.713 38.713h542.021c21.171 0 38.713-17.545 38.713-38.713z" />
-<glyph unicode="&#xf0de;" glyph-name="sort-up2" d="M821.728 404.932c0-21.173-17.543-38.715-38.715-38.715h-542.026c-21.173 0-38.715 17.543-38.715 38.715 0 10.284 4.237 19.966 11.492 27.221l271.013 271.013c7.263 7.263 16.937 11.492 27.221 11.492s19.966-4.237 27.221-11.492l271.013-271.013c7.263-7.263 11.492-16.937 11.492-27.221z" />
+<glyph unicode="&#xf0d7;" glyph-name="caret-down" d="M821.728 419.95c0-10.284-4.235-19.964-11.494-27.223l-271.013-271.013c-7.26-7.26-16.939-11.494-27.223-11.494s-19.964 4.235-27.223 11.494l-271.013 271.013c-7.26 7.26-11.494 16.939-11.494 27.223 0 21.172 17.543 38.715 38.715 38.715h542.025c21.172 0 38.715-17.543 38.715-38.715z" />
+<glyph unicode="&#xf0d8;" glyph-name="caret-up" d="M821.728 148.938c0-21.172-17.543-38.715-38.715-38.715h-542.026c-21.172 0-38.715 17.543-38.715 38.715 0 10.283 4.235 19.964 11.494 27.223l271.013 271.013c7.26 7.26 16.939 11.494 27.223 11.494s19.964-4.235 27.223-11.494l271.013-271.013c7.26-7.26 11.494-16.939 11.494-27.223z" />
+<glyph unicode="&#xf0d9;" glyph-name="caret-left" d="M704 583.111v-597.333c0-23.334-19.333-42.666-42.666-42.666-11.334 0-22.002 4.666-30 12.666l-298.667 298.667c-7.998 7.998-12.666 18.666-12.666 30s4.666 22.002 12.666 30l298.667 298.667c7.998 7.998 18.666 12.666 30 12.666 23.334 0 42.666-19.333 42.666-42.666z" />
+<glyph unicode="&#xf0da;" glyph-name="caret-right" d="M704 284.444c0-11.334-4.666-22.002-12.666-30l-298.667-298.667c-7.998-7.998-18.666-12.666-30-12.666-23.334 0-42.666 19.333-42.666 42.666v597.333c0 23.334 19.333 42.666 42.666 42.666 11.334 0 22.002-4.666 30-12.666l298.667-298.667c7.998-7.998 12.666-18.666 12.666-30z" />
+<glyph unicode="&#xf0dc;" glyph-name="sort" d="M822.304 168.081c0-10.301-4.24-20.003-11.513-27.275l-271.519-271.519c-7.27-7.27-16.973-11.513-27.275-11.513s-20.003 4.24-27.275 11.513l-271.519 271.519c-7.27 7.27-11.513 16.973-11.513 27.275 0 21.214 17.573 38.785 38.785 38.785h543.036c21.214 0 38.785-17.573 38.785-38.785zM822.304 400.807c0-21.214-17.573-38.785-38.785-38.785h-543.036c-21.214 0-38.785 17.573-38.785 38.785 0 10.301 4.24 20.003 11.513 27.275l271.519 271.519c7.27 7.27 16.973 11.513 27.275 11.513s20.003-4.24 27.275-11.513l271.519-271.519c7.27-7.27 11.513-16.973 11.513-27.275z" />
+<glyph unicode="&#xf0dd;" glyph-name="sort-down" d="M821.724 167.504c0-10.281-4.235-19.964-11.493-27.222l-271.013-271.013c-7.258-7.258-16.939-11.493-27.222-11.493s-19.964 4.235-27.222 11.493l-271.013 271.013c-7.258 7.258-11.493 16.939-11.493 27.222 0 21.171 17.545 38.713 38.713 38.713h542.021c21.171 0 38.713-17.545 38.713-38.713z" />
+<glyph unicode="&#xf0de;" glyph-name="sort-up" d="M821.728 404.932c0-21.173-17.543-38.715-38.715-38.715h-542.026c-21.173 0-38.715 17.543-38.715 38.715 0 10.284 4.237 19.966 11.492 27.221l271.013 271.013c7.263 7.263 16.937 11.492 27.221 11.492s19.966-4.237 27.221-11.492l271.013-271.013c7.263-7.263 11.492-16.937 11.492-27.221z" />
 <glyph unicode="&#xf1c9;" glyph-name="file-code" d="M867.555 546.541c18.792-18.792 34.538-56.381 34.538-83.303v-585.144c0-26.92-21.841-48.76-48.76-48.76h-682.667c-26.92 0-48.76 21.841-48.76 48.76v812.7c0 26.92 21.841 48.76 48.76 48.76h455.111c26.92 0 64.507-15.746 83.303-34.538zM642.030 670.478v-190.983h190.983c-3.048 8.633-7.619 17.272-11.176 20.824l-158.983 158.983c-3.557 3.557-12.19 8.127-20.824 11.176zM837.077-105.651v520.128h-211.303c-26.92 0-48.76 21.841-48.76 48.76v211.303h-390.096v-780.192h650.161zM365.713 349.461c5.589 7.112 15.746 8.633 22.856 3.048l25.905-19.303c7.112-5.589 8.633-15.746 3.048-22.856l-92.444-123.43 92.444-123.43c5.589-7.112 4.063-17.272-3.048-22.856l-25.905-19.303c-7.112-5.589-17.272-4.063-22.856 3.048l-114.792 152.887c-4.063 5.589-4.063 13.715 0 19.303zM773.077 196.572c4.063-5.589 4.063-13.715 0-19.303l-114.792-152.887c-5.589-7.112-15.746-8.633-22.856-3.048l-25.905 19.303c-7.112 5.589-8.633 15.746-3.048 22.856l92.444 123.43-92.444 123.43c-5.589 7.112-4.063 17.272 3.048 22.856l25.905 19.303c7.112 5.589 17.272 4.063 22.856-3.048zM458.156-37.588c-9.144 1.525-14.728 10.159-13.208 18.792l70.095 422.096c1.525 9.144 10.159 14.728 18.792 13.208l32-5.080c9.144-1.525 14.728-10.159 13.208-18.792l-70.095-422.096c-1.525-9.144-10.159-14.728-18.792-13.208z" />
 </font></defs></svg>