Job detail page

Added ellipsis to plays and tasks table columns.
This commit is contained in:
Chris Houseknecht
2014-07-22 14:06:16 -04:00
parent 8be350b791
commit 7206c1ede1
2 changed files with 23 additions and 6 deletions

View File

@@ -306,6 +306,23 @@
font-size: 12px;
}
#plays-table-header table,
#plays-table-detail table,
#tasks-table-detail table,
#tasks-table-header table,
#tasks-table-detail table {
table-layout:fixed;
}
#plays-table-detail td,
#plays-table-header td,
#tasks-table-detail td,
#tasks-table-header td {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#tasks-table-detail {
height: 150px;
}

View File

@@ -152,8 +152,8 @@
</div>
</div>
<div class="table-header">
<table class="table table-condensed" style="table-layout:fixed;">
<div id="plays-table-header" class="table-header">
<table class="table table-condensed">
<thead>
<tr>
<th class="col-lg-2 col-md-2 col-sm-2 col-xs-3">Started</th>
@@ -166,7 +166,7 @@
</div>
<div id="plays-table-detail" class="table-detail" lr-infinite-scroll="playsScrollDown"
scroll-threshold="10" time-threshold="500">
<table class="table table-condensed" style="table-layout:fixed;">
<table class="table table-condensed">
<tbody>
<tr class="cursor-pointer" ng-repeat="play in plays" ng-class="play.playActiveClass" ng-click="selectPlay(play.id, $event)">
<td class="col-lg-2 col-md-2 col-sm-2 col-xs-3">{{ play.created | date: 'HH:mm:ss' }}</td>
@@ -211,7 +211,7 @@
</div>
<div class="table-header">
<table class="table table-condensed" style="table-layout:fixed;">
<table id="tasks-table-header" class="table table-condensed">
<thead>
<tr>
<th class="col-lg-2 col-md-2 col-sm-2 col-xs-3">Started</th>
@@ -225,7 +225,7 @@
</div>
<div id="tasks-table-detail" class="table-detail" lr-infinite-scroll="tasksScrollDown"
scroll-threshold="10" time-threshold="500">
<table class="table table-condensed" style="table-layout:fixed;">
<table class="table table-condensed">
<tbody>
<tr class="cursor-pointer" ng-repeat="task in taskList = (tasks) track by $index" ng-class="task.taskActiveClass" ng-click="selectTask(task.id)">
<td class="col-lg-2 col-md-2 col-sm-2 col-xs-3">{{ task.created | date: 'HH:mm:ss' }}</td>
@@ -233,7 +233,7 @@
data-placement="top">{{ task.elapsed }}</td>
<td class="col-lg-1 col-md-2 col-sm-2 col-xs-2 status-column" aw-tool-tip="{{ task.status_tip }}"
data-tip-watch="task.status_tip" data-placement="top"><i class="fa icon-job-{{ task.status }}"></i></td>
<td class="col-lg-3 col-md-3 col-sm-6 col-xs-4"><span ng-show="hasRoles">{{ task.role }}</span> {{ task.name }}</td>
<td class="col-lg-3 col-md-3 col-sm-6 col-xs-4" id="">{{ task.name }}</td>
<td class="col-lg-4 col-md-3 hidden-sm hidden-xs"><div class="status-bar"><div class="successful-hosts inner-bar" id="{{ task.id }}-successful-bar" aw-tool-tip="Hosts OK" data-placement="top" ng-style="task.successfulStyle">{{ task.successfulCount }}</div><div class="changed-hosts inner-bar" id="{{ task.id }}-changed-bar" aw-tool-tip="Hosts Changed" data-placement="top" ng-style="task.changedStyle">{{ task.changedCount }}</div><div class="skipped-hosts inner-bar" id="{{ task.id }}-skipped-bar" aw-tool-tip="Hosts Skipped" data-placement="top" ng-style="task.skippedStyle">{{ task.skippedCount }}</div><div class="failed-hosts inner-bar" id="{{ task.id }}-failed-bar" aw-tool-tip="Hosts Failed" data-placement="top" ng-style="task.failedStyle">{{ task.failedCount }}</div><div class="unreachable-hosts inner-bar" id="{{ task.id }}-unreachable-hosts-bar" aw-tool-tip="Hosts Unreachable" data-placement="top" ng-style="task.unreachableStyle">{{ task.unreachableCount }}</div><div class="missing-hosts inner-bar" id="{{ task.id }}-misssing-hosts-bar" ng-style="task.missingStyle">{{ task.missingCount }}</div><div class="no-matching-hosts inner-bar" id="{{ task.id }}-{{ task.play_id }}-no-matching-hosts-bar" aw-tool-tip="No matching hosts were found" data-placement="top" style="width: 100%;" ng-show="task.status === 'no-matching-hosts'">No matching hosts</div></div></td>
</tr>
<tr ng-show="taskList.length === 0">