Skip to content

Commit

Permalink
#229 Update the case > links page to display more details about the r…
Browse files Browse the repository at this point in the history
…elated cases
  • Loading branch information
nadouani committed Jun 1, 2017
1 parent 867b2b9 commit 33b598c
Show file tree
Hide file tree
Showing 4 changed files with 107 additions and 41 deletions.
3 changes: 2 additions & 1 deletion ui/app/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,9 @@
<link rel="stylesheet" href="styles/flow.css"/>
<link rel="stylesheet" href="styles/search.css"/>
<link rel="stylesheet" href="styles/filters.css"/>
<link rel="stylesheet" href="styles/case-item.css"/>
<link rel="stylesheet" href="styles/directives/page-sizer.css"/>
<link rel="stylesheet" href="styles/directives/user.css"/>
<link rel="stylesheet" href="styles/directives/user.css"/>
<!-- endbuild -->

<style>
Expand Down
42 changes: 42 additions & 0 deletions ui/app/styles/case-item.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
div.case-collection:nth-of-type(odd) {
background-color: #f9f9f9;
}

div.case-item {
margin-bottom: 1px;
display: flex;
justify-content: space-around;
align-items: stretch;
}

div.case-item>div {
padding: 5px;
}

div.case-item>div.case-tlp {
width: 8px;
}

div.case-item>div.case-details {
flex: 1;
}

div.case-item>div.case-owner {
width: 50px;
}

div.case-item>div.case-severity {
width: 40px;
}

div.case-item>div.case-date {
width: 120px;
}

div.case-item>div.case-observables-count {
width: 30px;
}

div.case-item>div.case-observables-list {
width: 400px;
}
101 changes: 62 additions & 39 deletions ui/app/views/partials/case/case.links.html
Original file line number Diff line number Diff line change
@@ -1,42 +1,65 @@
<div class="case-links" ng-show="links.length > 0">
<h4 class="vpad10 text-primary">Related cases ({{links.length}})</h4>
<table class="table table-striped">
<thead>
<tr>
<th>Case</th>
<th>Tags</th>
<th colspan="2">Linked observables</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="link in links">
<td class="wrap">
<div>
{{link.startDate | showDate:'YYYY-MM-DD HH:mm'}}
<tlp value="link.tlp"></tlp>
</div>
<div class="small">
<i class="glyphicon glyphicon-folder-open text-muted mr-xxxs"></i>
<a href ui-sref="app.case.details({caseId: link.id})"># {{link.caseId}} - {{link.title | limitTo: 100}}</a>
</div>
</td>
<td>
<tag-list data="link.tags"></tag-list>
</td>
<td><span class="badge">{{link.linkedWith.length}}</span></td>
<td>
<div ng-repeat="observable in link.linkedWith | limitTo:5" class="wrap">
<a href ui-sref="app.case.observables-item({caseId: link.id, itemId: observable.id})">
<strong>[{{observable.dataType}}]</strong>:
<span ng-if="observable.attachment"></span>{{observable.attachment.name}}
<span ng-if="!observable.attachment"></span>{{observable.data | fang}}
</a>
</div>
<div class="mt-xs" ng-if="link.linkedWith.length > 5">
<a href ui-sref="app.case.observables({caseId: caseId})"><strong>See ({{link.linkedWith.length - 5}}) more links</strong></a>
</div>
</td>
</tr>
</tbody>
</table>
<div class="case-item">
<div class="case-details text-bold">Title</div>
<div class="case-date text-bold">Date</div>
<div class="case-observables-list text-bold">Linked observables</div>
</div>
<div class="case-collection" ng-repeat="item in links">
<div class="case-item" >
<!-- case severity -->
<div class="case-tlp bg-tlp-{{item.tlp}}"></div>

<!-- case title and main details -->
<div class="case-details">
<div class="case-title">
<a ui-sref="app.case.details({caseId: item.id})">#{{item.caseId}} - {{item.title}}</a>
</div>
<div class="case-tags flexwrap mt-xxs">
<span class="mr-xxxs text-muted"><i class="fa fa-tags"></i></span>
<strong class="text-muted mr-xxxs" ng-if="!item.tags || item.tags.length === 0">None</strong>
<span ng-repeat="tag in item.tags track by $index" class="label label-primary mb-xxxs mr-xxxs pointer">{{tag}}</span>
</div>
<div class="text-success" ng-show="item.status !== 'Open'">
<small>
(Closed at {{item.endDate | showDate}} as <strong>{{CaseResolutionStatus[item.resolutionStatus]}}</strong>)
</small>
</div>
<div class="text-danger" ng-if="item.mergeFrom">
<small>
Merged from <a href ui-sref="app.case.details({caseId: item.mergeFrom[0]})"> Case #{{item.stats.mergeFrom[0].caseId}}</a> and
<a href ui-sref="app.case.details({caseId: item.mergeFrom[1]})"> Case #{{utem.stats.mergeFrom[1].caseId}}</a>
</small>
</div>
</div>

<div class="case-severity">
<div class="clickable">
<severity active="false" value="item.severity"></severity>
</div>
</div>

<div class="case-date">
<span uib-tooltip="{{item.startDate | showDate}}" tooltip-popup-delay="500" tooltip-placement="bottom">{{item.startDate | shortDate}}</span>
</div>

<div class="case-observables-count">
<span class="badge">{{item.linkedWith.length}}</span>
</div>

<div class="case-observables-list">
<div ng-repeat="observable in item.linkedWith | limitTo:5" class="wrap">
<a href ui-sref="app.case.observables-item({caseId: item.id, itemId: observable.id})">
<strong>[{{observable.dataType}}]</strong>:
<span ng-if="observable.attachment"></span>{{observable.attachment.name}}
<span ng-if="!observable.attachment"></span>{{observable.data | fang}}
</a>
</div>
<div class="mt-xs" ng-if="item.linkedWith.length > 5">
<a href ui-sref="app.case.observables({caseId: caseId})"><strong>See ({{item.linkedWith.length - 5}}) more links</strong></a>
</div>
</div>
</div>
</div>

</div>
2 changes: 1 addition & 1 deletion ui/app/views/partials/case/case.panelinfo.html
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ <h3 class="box-title">
<span class="ml-xxs text-danger" ng-show="links.length > 0">
<i class="glyphicon glyphicon-link"></i>
<strong>
<ng-pluralize count="links.length" when="{'one': '1 Related case', 'other': '{} Related cases'}"></ng-pluralize>
<a class="text-danger" href ui-sref="app.case.links({caseId:caze.id})"><ng-pluralize count="links.length" when="{'one': '1 Related case', 'other': '{} Related cases'}"></ng-pluralize></a>
</strong>
</span>

Expand Down

0 comments on commit 33b598c

Please sign in to comment.