opendev/storyboard-webclient
Code Issues Proposed changes

Merge "Allowing the user to choose what Columns are seen"

Browse Source
This commit is contained in:
Zuul 2020-09-24 18:52:28 +00:00 committed by Gerrit Code Review
commit 6f9f826d25
4 changed files with 90 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/app/search/directive/search_results.js
View File

@ -20,7 +20,7 @@
* @see ProjectListController
*/
angular.module('sb.search').directive('searchResults',
function ($log, $parse, Criteria, $injector, Preference) {
function ($log, $parse, Criteria, $injector, Preference, User) {
'use strict';
return {
@ -36,6 +36,41 @@ angular.module('sb.search').directive('searchResults',
args.searchWithoutCriteria === 'true';
var criteria = [];
//Controls dropdown events
$scope.dropdownControl = function(choice){
if (choice === 'open'){
angular.element(document.querySelector('#query'))
.addClass('open');
return;
}
angular.element(document.querySelector('#query'))
.removeClass('open');
};
//Controls which columns are chosen
$scope.columnControl = function(filter){
if ($scope.chosenCriteria.includes(filter)){
$scope.chosenCriteria.splice($scope.chosenCriteria
.indexOf(filter), 1);
return;
}
$scope.chosenCriteria.push(filter);
};
//Dropdown Options
$scope.queryFilters = {
'created_at': 'Created At',
'updated_at': 'Updated At',
'status': 'Status',
'private': 'Private',
'creator_id': 'Creator'
};
$scope.chosenCriteria = ['created_at', 'updated_at', 'status'];
$scope.timeCriteria = ['created_at', 'updated_at'];
$scope.isSearching = false;
$scope.searchResults = [];
@ -53,6 +88,16 @@ angular.module('sb.search').directive('searchResults',
*/
$scope.sortDirection = 'desc';
function showFullName(story_object){
var full_name;
story_object.forEach(function(story){
full_name = User.get({'id': story.creator_id});
full_name.$promise.then(function(data){
story.creator_id = data.full_name;
});
});
}
/**
* Handle error result.
*/
@ -71,6 +116,7 @@ angular.module('sb.search').directive('searchResults',
$scope.searchOffset = parseInt(headers('X-Offset')) || 0;
$scope.searchLimit = parseInt(headers('X-Limit')) || 0;
$scope.searchResults = results;
showFullName($scope.searchResults);
$scope.isSearching = false;
}

21
src/app/search/template/story_search_item.html
View File

@ -1,9 +1,9 @@
<td class="col-xs-7" style="word-break: break-word">
<td style="word-break: break-word">
<a href="#!/story/{{story.id}}">
{{story.id}}: {{story.title | truncate: 97}}
</a>
<small ng-show="isLoggedIn">
<subscribe
<subscribe class="pull-right"
resource="story"
resource-id="story.id"
subscriptions="storySubscriptions">
@ -22,14 +22,13 @@
</li>
</ul>
</td>
<td class="col-sm-2 hidden-xs">
<span time-moment eventdate="story.created_at" short-date="true">
<td ng-repeat="criteria in chosenCriteria">
<span ng-if="timeCriteria.includes(criteria)" time-moment eventdate="story[criteria]" short-date="true">
</span>
<span ng-if="!timeCriteria.includes(criteria) && criteria != 'status'">
{{story[criteria]}}
</span>
<span ng-if="criteria == 'status'">
<story-status-label story="story"/>
</span>
</td>
<td class="col-sm-2 hidden-xs">
<span time-moment eventdate="story.updated_at" short-date="true">
</span>
</td>
<td class="text-right col-xs-1">
<story-status-label story="story"/>
</td>

57
src/app/stories/template/list.html
View File

@ -65,6 +65,30 @@
on-page-size="updatePageSize(pageSize)"
></result-set-pager>
</div>
<div class="align-bottom">
Columns:
<span class="form-control-static" id="query">
<button class="btn btn-xs btn-default" ng-click="dropdownControl('open')" dropdown-toggle>
<i class="fas fa-sort-alpha-down"></i>
</button>
<div class = "dropdown-menu dropdown-menu-left" role="menu">
<li ng-repeat="(type, value) in queryFilters">
<input ng-click="columnControl(type)" type="checkbox"
ng-checked=chosenCriteria.includes(type)
class="form-check-input"
id="{{ type }}"/>
<label class="form-check-label" for="{{ type }}">{{ value }}</label>
</li>
<div class="row text-center">
<div class="col-xs-8">
<button class="btn btn-sm btn-primary" ng-click="dropdownControl('close')">
Close
</button>
</div>
</div>
</div>
</span>
</div>
</div>
</div>
@ -92,40 +116,17 @@
</i>
</a>
</th>
<th class="hidden-xs">
<a href="" ng-click="toggleFilter('created_at')">
Created
<th ng-repeat="column in chosenCriteria">
<a href="" ng-click="toggleFilter(column)">
{{queryFilters[column]}}
<i class="fa fa-caret-down"
ng-if="sortField == 'created_at' && sortDirection == 'desc'">
ng-if="sortField == column && sortDirection == 'desc'">
</i>
<i class="fa fa-caret-up"
ng-if="sortField == 'created_at' && sortDirection == 'asc'">
ng-if="sortField == column && sortDirection == 'asc'">
</i>
</a>
</th>
<th class="hidden-xs">
<a href="" ng-click="toggleFilter('updated_at')">
Updated
<i class="fa fa-caret-down"
ng-if="sortField == 'updated_at' && sortDirection == 'desc'">
</i>
<i class="fa fa-caret-up"
ng-if="sortField == 'updated_at' && sortDirection == 'asc'">
</i>
</a>
</th>
<th class="text-right">
<a href="" ng-click="toggleFilter('status')">
Status
<i class="fa fa-caret-down"
ng-if="sortField == 'status' && sortDirection == 'desc'">
</i>
<i class="fa fa-caret-up"
ng-if="sortField == 'status' && sortDirection == 'asc'">
</i>
</a>
</th>
<th></th>
</tr>
</thead>
<tbody ng-if="searchResults.length != 0 && !isSearching">

4
src/theme/base/_stories.scss
View File

@ -39,4 +39,8 @@
.label .fa-times:hover{
cursor:pointer;
opacity:1;
}
#query .dropdown-menu > li{
padding-left:1rem;
}