support search task

This commit is contained in:
MaysWind 2016-05-28 22:20:42 +08:00
parent 2c50e31fbe
commit 8173e5ec27
7 changed files with 107 additions and 67 deletions

View file

@ -34,72 +34,84 @@
</a> </a>
<nav class="navbar navbar-static-top" role="navigation"> <nav class="navbar navbar-static-top" role="navigation">
<ul class="nav navbar-nav"> <div class="navbar-toolbar">
<li> <ul class="nav navbar-nav">
<a class="toolbar" title="{{'New' | translate}}"> <li>
<i class="fa fa-plus"></i> <a class="toolbar" title="{{'New' | translate}}">
<span translate>New</span> <i class="fa fa-plus"></i>
</a> <span translate>New</span>
</li> </a>
<li> </li>
<a class="toolbar" title="{{'Start' | translate}}"> <li>
<i class="fa fa-play"></i> <a class="toolbar" title="{{'Start' | translate}}">
</a> <i class="fa fa-play"></i>
</li> </a>
<li> </li>
<a class="toolbar" title="{{'Pause' | translate}}"> <li>
<i class="fa fa-pause"></i> <a class="toolbar" title="{{'Pause' | translate}}">
</a> <i class="fa fa-pause"></i>
</li> </a>
<li> </li>
<a class="toolbar" title="{{'Delete' | translate}}"> <li>
<i class="fa fa-trash-o"></i> <a class="toolbar" title="{{'Delete' | translate}}">
</a> <i class="fa fa-trash-o"></i>
</li> </a>
<li> </li>
<a class="toolbar dropdown-toggle" data-toggle="dropdown" title="{{'Display Order' | translate}}"> <li>
<i class="fa fa-sort-alpha-asc"></i> <a class="toolbar dropdown-toggle" data-toggle="dropdown" title="{{'Display Order' | translate}}">
</a> <i class="fa fa-sort-alpha-asc"></i>
<ul class="dropdown-menu" role="menu"> </a>
<li> <ul class="dropdown-menu" role="menu">
<a class="pointer-cursor" ng-click="changeDisplayOrder('default:asc')"> <li>
<span translate>Default</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('default:asc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('default')}"></i> <span translate>Default</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('default')}"></i>
</li> </a>
<li> </li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('name:asc')"> <li>
<span translate>By File Name</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('name:asc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('name')}"></i> <span translate>By File Name</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('name')}"></i>
</li> </a>
<li> </li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('size:asc')"> <li>
<span translate>By File Size</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('size:asc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('size')}"></i> <span translate>By File Size</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('size')}"></i>
</li> </a>
<li> </li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('percent:desc')"> <li>
<span translate>By Completed Percent</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('percent:desc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('percent')}"></i> <span translate>By Completed Percent</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('percent')}"></i>
</li> </a>
<li> </li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('remain:asc')"> <li>
<span translate>By Remain Time</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('remain:asc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('remain')}"></i> <span translate>By Remain Time</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('remain')}"></i>
</li> </a>
<li> </li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('dspeed:desc')"> <li>
<span translate>By Download Speed</span> <a class="pointer-cursor" ng-click="changeDisplayOrder('dspeed:desc')">
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('dspeed')}"></i> <span translate>By Download Speed</span>
</a> <i class="fa" ng-class="{'fa-check': isSetDisplayOrder('dspeed')}"></i>
</li> </a>
</ul> </li>
</li> </ul>
</ul> </li>
</ul>
</div>
<div class="navbar-searchbar hidden-xs">
<ul class="nav navbar-nav">
<li>
<input class="form-control" placeholder="{{('Search' | translate)}}" ng-model="searchContext.text" />
<div class="form-control-icon">
<span class="fa fa-search form-control-feedback"></span>
</div>
</li>
</ul>
</div>
</nav> </nav>
</header> </header>

View file

@ -12,6 +12,7 @@
"Pause": "暂停下载任务", "Pause": "暂停下载任务",
"Delete": "删除下载任务", "Delete": "删除下载任务",
"Display Order": "显示顺序", "Display Order": "显示顺序",
"Search": "搜索",
"Default": "默认", "Default": "默认",
"By File Name": "按文件名", "By File Name": "按文件名",
"By File Size": "按文件大小", "By File Size": "按文件大小",

View file

@ -85,6 +85,18 @@
$scope.titleWidth = getTitleWidth(); $scope.titleWidth = getTitleWidth();
$scope.filterByTaskName = function (task) {
if (!task || !angular.isString(task.taskName)) {
return false;
}
if (!$scope.searchContext || !$scope.searchContext.text) {
return true;
}
return (task.taskName.toLowerCase().indexOf($scope.searchContext.text.toLowerCase()) >= 0);
};
$scope.getOrderType = function () { $scope.getOrderType = function () {
return ariaNgSettingService.getDisplayOrder(); return ariaNgSettingService.getDisplayOrder();
}; };

View file

@ -26,6 +26,10 @@
refreshGlobalStat(); refreshGlobalStat();
$scope.searchContext = {
text: ''
};
$scope.changeDisplayOrder = function (type, autoSetReverse) { $scope.changeDisplayOrder = function (type, autoSetReverse) {
var oldType = utils.parseOrderType(ariaNgSettingService.getDisplayOrder()); var oldType = utils.parseOrderType(ariaNgSettingService.getDisplayOrder());
var newType = utils.parseOrderType(type); var newType = utils.parseOrderType(type);

View file

@ -16,6 +16,7 @@
'Pause': 'Pause', 'Pause': 'Pause',
'Delete': 'Delete', 'Delete': 'Delete',
'Display Order': 'Display Order', 'Display Order': 'Display Order',
'Search': 'Search',
'Default': 'Default', 'Default': 'Default',
'By File Name': 'By File Name', 'By File Name': 'By File Name',
'By File Size': 'By File Size', 'By File Size': 'By File Size',

View file

@ -43,6 +43,16 @@
color: #0080ff; color: #0080ff;
} }
.skin-aria-ng .main-header .navbar .navbar-searchbar {
padding-top: 8px;
padding-right: 20px;
float: right;
}
.skin-aria-ng .main-header .navbar .navbar-searchbar .form-control-icon {
color: #999999;
}
@media (max-width: 767px) { @media (max-width: 767px) {
.skin-aria-ng .main-header .navbar { .skin-aria-ng .main-header .navbar {
padding-left: 20px; padding-left: 20px;

View file

@ -35,7 +35,7 @@
</div> </div>
</div> </div>
<div class="task-table-body"> <div class="task-table-body">
<div class="row" ng-repeat="task in downloadTasks | taskOrderBy: getOrderType()" data-gid="{{task.gid}}"> <div class="row" ng-repeat="task in downloadTasks | filter: filterByTaskName | taskOrderBy: getOrderType()" data-gid="{{task.gid}}">
<div class="col-sm-8"> <div class="col-sm-8">
<span class="task-name" ng-bind="task.taskName | substring: (titleWidth / 20)" title="{{task.taskName}}"></span> <span class="task-name" ng-bind="task.taskName | substring: (titleWidth / 20)" title="{{task.taskName}}"></span>
<div class="task-files"> <div class="task-files">