mirror of
https://github.com/ansible/awx.git
synced 2026-02-25 06:56:00 -03:30
296 lines
22 KiB
HTML
296 lines
22 KiB
HTML
<div class="tab-pane" id="jobs-detail">
|
|
<div ng-cloak id="htmlTemplate">
|
|
|
|
<div class="row">
|
|
<div id="breadcrumb-container" class="col-md-12" style="position: relative;">
|
|
<ul class="ansible-breadcrumb" id="breadcrumb-list">
|
|
<li><a href="/#/jobs">Jobs</a></li>
|
|
<li class="active"><a href="">{{ job_id }} - {{ job.name }}</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row" style="position: relative;">
|
|
<div id="job-detail-container">
|
|
<div class="job_well">
|
|
<div class="row">
|
|
<div class="col-md-12 text-right">
|
|
<a href="/#/jobs/{{ job_id }}/stdout" id="view-stdout-button" target="_blank" type="button" class="btn btn-primary btn-xs" aw-tool-tip="View standard out. Opens in new tab or window." data-placement="top"><i class="fa fa-lg fa-external-link"></i></a>
|
|
<a href="" ng-click="deleteJob()" id="cancel-job-button" ng-show="job_status.status == 'running'" type="button" class="btn btn-primary btn-xs" aw-tool-tip="Cancel" data-placement="top"><i class="fa fa-lg fa-minus-circle"></i></a>
|
|
<a href="" ng-click="deleteJob()" id="delete-job-button" ng-show="job_status.status != 'running'" type="button" class="btn btn-primary btn-xs" aw-tool-tip="Delete" data-placement="top"><i class="fa fa-lg fa-trash-o"></i></a>
|
|
<a href="" ng-click="relaunchJob()" id="relaunch-job-button" type="button" class="btn btn-primary btn-xs" aw-tool-tip="Relaunch using the same parameters" data-placement="top"><i class="fa fa-lg fa-rocket"></i></a>
|
|
<button type="button" id="summary-button" class="btn btn-primary btn-xs" ng-click="toggleSummary()" aw-tool-tip="View summary" data-placement="top"><i class="fa fa-lg fa-arrow-circle-left fa-lg"></i></button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-horizontal" role="form" id="job-status-form">
|
|
|
|
<div class="form-group">
|
|
<label class="col-lg-1 col-md-2 col-sm-2 col-xs-3 control-label">Status</label>
|
|
<div class="col-lg-11 col-md-10 col-sm-10 col-xs-9">
|
|
<i class="fa icon-job-{{ job_status.status }}"></i> {{ job_status.status }} {{ job_status.explanation }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-lg-1 col-md-2 col-sm-2 col-xs-3 control-label">Started</label>
|
|
<div class="col-lg-11 col-md-10 col-sm-10 col-xs-9">
|
|
<div ng-show="job_status.started" id="started-time">{{ job_status.started | date:'MM/dd/yy HH:mm:ss' }}</div>
|
|
<div ng-show="job_status.finished" id="finished-time">Finished {{ job_status.finished | date:'MM/dd/yy HH:mm:ss' }}</div>
|
|
<div ng-show="job_status.finished" id="elapsed-time">Elapsed {{ job_status.elapsed }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group" ng-show="!lessStatus">
|
|
<label class="col-lg-1 col-md-2 col-sm-2 col-xs-3 control-label">Template</label>
|
|
<div class="col-lg-11 col-md-10 col-sm-10 col-xs-9">
|
|
<a href="{{ job_template_url }}" aw-tool-tip="Edit the job template" data-placement="top">{{ job_template_name }}</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group" ng-show="!lessStatus">
|
|
<label class="col-lg-1 col-md-2 col-sm-2 col-xs-3 control-label">Project</label>
|
|
<div class="col-lg-11 col-md-10 col-sm-10 col-xs-9">
|
|
<a href="{{ project_url }}" aw-tool-tip="Edit the project" data-placement="top">{{ project_name }}</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group" ng-show="!lessStatus">
|
|
<label class="col-lg-1 col-md-2 col-sm-2 col-xs-3 control-label">Inventory</label>
|
|
<div class="col-lg-11 col-md-10 col-sm-10 col-xs-9">
|
|
<a href="{{ inventory_url }}" aw-tool-tip="Edit the inventory" data-placement="top">{{ inventory_name }}</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-12 more-or-less">
|
|
<a ng-show="lessStatus" href="" ng-click="toggleLessStatus()">more...</a>
|
|
<a ng-show="!lessStatus" href="" ng-click="toggleLessStatus()">less <i class="fa fa-angle-up"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
</div>
|
|
|
|
<div id="job-detail-tables">
|
|
<div id="play-section" class="section">
|
|
<h5>Plays</h5>
|
|
<div class="table-header">
|
|
<div class="row">
|
|
<div class="col-lg-1 col-md-1 col-sm-2 hidden-xs">Started</div>
|
|
<div class="col-lg-1 col-md-1 hidden-sm hidden-xs">Elapsed</div>
|
|
<div class="col-lg-10 col-md-10 col-sm-10 col-xs-12">Name</div>
|
|
</div>
|
|
</div>
|
|
<div id="plays-table-detail" class="table-detail" lr-infinite-scroll="playsScrollDown"
|
|
scroll-threshold="10" time-threshold="500">
|
|
<div class="row cursor-pointer" ng-repeat="play in playList = (plays | FilterById : search_all_plays | FilterFailedEvents : liveEventProcessing : searchAllStatus) track by $index"
|
|
ng-class="play.playActiveClass" ng-click="selectPlay(play.id)">
|
|
<div class="col-lg-1 col-md-1 col-sm-2 hidden-xs">{{ play.created | date: 'HH:mm:ss' }}</div>
|
|
<div class="col-lg-1 col-md-1 hidden-sm hidden-xs" aw-tool-tip="Completed at {{ play.finished | date:'HH:mm:ss' }}"
|
|
data-placement="top">{{ play.elapsed }}
|
|
</div>
|
|
<div class="col-lg-10 col-md-10 col-sm-10 col-xs-12 status-column"
|
|
aw-tool-tip="{{ play.status_tip }}" data-tip-watch="play.status_tip" data-placement="top">
|
|
<i class="fa icon-job-{{ play.status }}"></i> {{ play.name }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="row" ng-show="playList.length == 0">
|
|
<div class="col-lg-12">
|
|
<div class="loading-info">No matching plays</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="scroll-spinner" id="playsMoreRows"><i class="fa fa-cog fa-spin"></i></div>
|
|
</div><!-- section -->
|
|
|
|
<div id="task-section" class="section" tasks=>
|
|
<h5>Tasks</h5>
|
|
<div class="table-header">
|
|
<div class="row">
|
|
<div class="col-lg-1 col-md-1 col-sm-2 hidden-xs">Started</div>
|
|
<div class="col-lg-1 col-md-1 hidden-sm hidden-xs">Elapsed</div>
|
|
<div class="col-lg-5 col-md-5 col-sm-10 col-xs-12">Name</div>
|
|
<div class="col-lg-5 col-md-5 hidden-xs hidden-sm">Host Status</div>
|
|
</div>
|
|
</div>
|
|
<div id="tasks-table-detail" class="table-detail" lr-infinite-scroll="tasksScrollDown"
|
|
scroll-threshold="10" time-threshold="500">
|
|
<div class="row cursor-pointer"
|
|
ng-repeat="task in taskList = (tasks | FilterById : search_all_tasks | FilterFailedEvents : liveEventProcessing : searchAllStatus) track by $index"
|
|
ng-class="task.taskActiveClass" ng-click="selectTask(task.id)">
|
|
<div class="col-lg-1 col-md-1 col-sm-2 hidden-xs">{{ task.created | date: 'HH:mm:ss' }}</div>
|
|
<div class="col-lg-1 col-md-1 hidden-sm hidden-xs" aw-tool-tip="Completed at {{ task.finished | date:'HH:mm:ss' }}"
|
|
data-placement="top">{{ task.elapsed }}
|
|
</div>
|
|
<div class="col-lg-5 col-md-5 col-sm-10 col-xs-12 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><span ng-show="hasRoles"> {{ task.role }} </span> {{ task.name }}
|
|
</div>
|
|
<div class="col-lg-5 col-md-5 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>
|
|
</div>
|
|
</div>
|
|
<div class="row" ng-show="taskList.length == 0">
|
|
<div class="col-lg-12">
|
|
<div class="loading-info">No matching tasks</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="scroll-spinner" id="tasksMoreRows"><i class="fa fa-cog fa-spin"></i></div>
|
|
</div><!-- section -->
|
|
|
|
<div id="task-hosts-section" class="section">
|
|
<div class="header">
|
|
<div class="title">Hosts</div>
|
|
<!-- <div class="search-field">
|
|
<input type="text" ng-model="task_host_name" placeholder="Host Name" ng-keypress="taskHostNameKeyPress($event)" />
|
|
<a class="search-icon" ng-show="searchTaskHostsEnabled" ng-click="searchTaskHosts()"><i class="fa fa-search"></i></a>
|
|
<a class="search-icon" ng-show="!searchTaskHostsEnabled" ng-click="task_host_name=''; searchTaskHosts()"><i class="fa fa-times"></i></a>
|
|
</div>!-->
|
|
</div>
|
|
<div id="hosts-table-detail" class="table-detail" lr-infinite-scroll="hostResultsScrollDown" scroll-threshold="10" time-threshold="500">
|
|
<div id="hosts-table-detail-inner">
|
|
<div class="row cursor-pointer" ng-repeat="result in results = (hostResults | filter:{ status : searchAllStatus}) track by $index" ng-click="viewHostResults(result.id)">
|
|
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-7 status-column">
|
|
<a href="" aw-tool-tip="Event ID: {{ result.id }}<br \>Status: {{ result.status_text }}. Click for details" data-placement="top"><i ng-show="result.status_text != 'Unreachable'" class="fa icon-job-{{ result.status }}"></i><i ng-show="result.status_text == 'Unreachable'" class="fa icon-job-unreachable"></i> {{ result.name }}</a>
|
|
</div>
|
|
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
|
|
{{ result.msg }}
|
|
</div>
|
|
</div>
|
|
<div class="row" ng-show="results.length == 0">
|
|
<div class="col-lg-12">
|
|
<div class="loading-info">No matching hosts</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="scroll-spinner" id="hostResultsMoreRows"><i class="fa fa-cog fa-spin"></i></div>
|
|
</div><!-- section -->
|
|
</div><!-- job-detail-tables -->
|
|
|
|
</div><!-- well -->
|
|
|
|
</div><!-- job-detail-container -->
|
|
|
|
<div id="job-summary-container">
|
|
<div class="job_well">
|
|
<div id="summary-well-top-section">
|
|
<div id="hide-summary-button" style="display: hidden;">
|
|
<a href="" class="btn btn-xs btn-primary" ng-click="toggleSummary('hide')" aw-tool-tip="Hide summary" data-placement="top"><i class="fa fa-arrow-circle-right fa-lg"></i></a>
|
|
</div>
|
|
|
|
<div id="summary-search-section" class="section">
|
|
<div class="header">
|
|
<div class="title">Filter</div>
|
|
</div>
|
|
<form class="form-inline" id="job-filter-form">
|
|
<div class="col-sm-7 col-xs-7 remove-left-padding">
|
|
<div style="position:relative;">
|
|
<input type="text" class="input-sm form-control" id="search_all_hosts_name" ng-model="search_all_hosts_name"
|
|
placeholder="Host Name" ng-disabled="liveEventProcessing " ng-keypress="allHostNameKeyPress($event)" >
|
|
<div id="search-all-input-icons">
|
|
<a class="search-icon" ng-show="searchAllHostsEnabled" ng-click="searchAllByHost()"><i class="fa fa-search"></i></a>
|
|
<a class="search-icon" ng-show="!searchAllHostsEnabled" ng-click="search_all_hosts_name=''; searchAllByHost()"><i class="fa fa-times"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-5 col-xs-5 remove-left-padding">
|
|
<label>Status</label>
|
|
<div class="btn-group" aw-toggle-button data-after-toggle="filterByStatus">
|
|
<button class="btn btn-xs btn-primary active">All</button>
|
|
<button class="btn btn-xs btn-default">Failed</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div style="display:block; clear:both; width:100%; height:1px; margin-top:55px; margin-bottom:20px;">
|
|
<hr>
|
|
</div>
|
|
|
|
<div id="hosts-summary-section" class="section job_summary">
|
|
<div class="header">
|
|
<div class="title">Host Summary</div>
|
|
<div class="legend pull-right"><i class="fa fa-circle successful-hosts-color"></i> OK <i class="fa fa-circle changed-hosts-color"></i> Changed
|
|
<i class="fa fa-circle unreachable-hosts-color"></i> Unreachable <i class="fa fa-circle failed-hosts-color"></i> Failed</div>
|
|
</div>
|
|
<div class="table-header">
|
|
<div class="row">
|
|
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">Host</div>
|
|
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">Completed Tasks</div>
|
|
</div>
|
|
</div>
|
|
<div id="hosts-summary-table" class="table-detail" lr-infinite-scroll="hostSummariesScrollDown" scroll-threshold="10" time-threshold="500">
|
|
<div class="row" ng-repeat="host in summaryList = (hosts | filter:{ status : searchAllStatus}) track by $index" id="{{ host.id }}">
|
|
<div class="name col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
|
<a href="" ng-click="hostEventsViewer(host.id, host.name)" aw-tool-tip="View all events for this host"
|
|
data-placement="top">{{ host.name }}</a>
|
|
</div>
|
|
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6 badge-column">
|
|
<a href="" aw-tool-tip="OK" data-placement="top" ng-hide="host.ok == 0"><span class="badge successful-hosts">{{ host.ok }}</span></a>
|
|
<a href="" aw-tool-tip="Changed" data-placement="top" ng-hide="host.changed == 0"><span class="badge changed-hosts">{{ host.changed }}</span></a>
|
|
<a href="" aw-tool-tip="Unreachable" data-placement="top" ng-hide="host.unreachable == 0"><span class="badge unreachable-hosts">{{ host.unreachable }}</span></a>
|
|
<a href="" aw-tool-tip="Failed" data-placement="top" ng-hide="host.failed == 0"><span class="badge failed-hosts">{{ host.failed }}</span></a>
|
|
</div>
|
|
</div>
|
|
<div class="row" ng-show="summaryList.length === 0">
|
|
<div class="col-lg-12">
|
|
<div class="loading-info">No matching hosts</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="scroll-spinner" id="hostSummariesMoreRows"><i class="fa fa-cog fa-spin"></i></div>
|
|
</div><!-- section -->
|
|
</div><!-- summary-well-top-section -->
|
|
|
|
<div id="graph-section" class="section">
|
|
<div class="header">
|
|
<div class="title">Host Status Summary</div>
|
|
<div class="legend pull-right" style="display: none;"><i class="fa fa-circle successful-hosts-color"></i> OK <i class="fa fa-circle changed-hosts-color"></i> Changed
|
|
<i class="fa fa-circle unreachable-hosts-color"></i> Unreachable <i class="fa fa-circle failed-hosts-color"></i> Failed</div>
|
|
</div>
|
|
</div><!-- graph section -->
|
|
</div>
|
|
</div><!-- col-md-5 -->
|
|
|
|
</div>
|
|
|
|
<div id="host-events-modal-dialog" style="display:none;">
|
|
<form class="form-inline">
|
|
<div class="form-group">
|
|
<label>Search</label>
|
|
<input type="text" class="form-control" id="host-events-search-name" ng-model="host_events_search_name" placeholder="Host name" >
|
|
</div>
|
|
<div class="form-group">
|
|
<label>Status</label>
|
|
<select id="host-events-search-status" ng-model="host_events_search_status" name="host-events-search-name">
|
|
<option value="all">All</option>
|
|
<option value="failed">Failed</option>
|
|
<option value="changed">Changed</option>
|
|
<option value="ok">OK</option>
|
|
<option value="unreachable">Unreachable</option>
|
|
</select>
|
|
</div>
|
|
</form>
|
|
<div id="host-events-table" lr-infinite-scroll="hostEventsTable" scroll-threshold="10" time-threshold="500">
|
|
<div class="row" ng-repeat="event in host_events">
|
|
<div class="col-md-2"><i class="fa icon-job{{ event.status }}"></i></div>
|
|
<div class="col-md-2">{{ event.play }}</div>
|
|
<div class="col-md-2">{{ event.role }}</div>
|
|
<div class="col-md-2">{{ event.task }}</div>
|
|
<div class="col-md-2">{{ event.msg }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="job-detail-footer" class="footer-row"></div>
|
|
</div>
|
|
|
|
<div ng-include="'/static/partials/eventviewer.html'"></div>
|
|
|
|
</div>
|
|
|
|
</div>
|