External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-24 07:51:23 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2983 from mabashian/upgrade-jquery-mabashian

Browse Source 
Upgrades jQuery and Bootstrap

Reviewed-by: https://github.com/softwarefactory-project-zuul[bot]
This commit is contained in:
softwarefactory-project-zuul[bot] 2019-01-15 14:06:33 +00:00 committed by GitHub
commit b9607dd415
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
155 changed files with 1533 additions and 1527 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
awx/ui/client/assets/ansible-bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
awx/ui/client/features/credentials/index.view.html
View File

@ -1,6 +1,6 @@
<div ui-view="edit"></div>
<div ui-view="add"></div>
<div class="panel at-Panel">
<div class="card at-Panel">
<div ui-view="list"></div>
</div>

6
awx/ui/client/features/credentials/legacy.credentials.js
View File

@ -79,19 +79,19 @@ function LegacyCredentialsService () {
key: true,
label: N_('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
},
role: {
label: N_('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4'
columnClass: 'col-lg-4 col-md-4 col-sm-4 col-xs-4'
},
team_roles: {
label: N_('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4'
columnClass: 'col-lg-5 col-md-5 col-sm-5 col-xs-4'
}
}
}),

8
awx/ui/client/features/output/_index.less
View File

@ -174,6 +174,14 @@
grid-column-start: 1;
grid-column-end: 3;
}
/* The ng-transclude tag that gets injected as a part of at-Panel was throwing off the height
of the panel after Bootstrap's move to display: flex. This seemed like the most concise fix*/
ng-transclude {
display: flex;
flex-flow: column nowrap;
height: 100%;
}
}
.at-mixin-event() {

2
awx/ui/client/features/output/search.partial.html
View File

@ -10,7 +10,7 @@
ng-attr-placeholder="{{ vm.running ?
vm.strings.get('search.PLACEHOLDER_RUNNING') :
vm.strings.get('search.PLACEHOLDER_DEFAULT') }}">
<span class="input-group-btn">
<span class="input-group-btn input-group-append">
<button class="btn at-ButtonHollow--default at-Input-button"
ng-click="vm.submitSearch()"
ng-disabled="vm.disabled || !vm.value || vm.value === ''"

2
awx/ui/client/features/portalMode/_index.less
View File

@ -45,7 +45,7 @@
.PortalMode-filterHolder {
position: absolute;
right: 1px;
margin-right: 25px;
margin-right: 10px;
display: flex;
align-items: center;
justify-content: center;

20
awx/ui/client/features/templates/templatesList.view.html
View File

@ -21,18 +21,14 @@
aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu at-List-toolbarActionDropdownMenu">
<li>
<a ui-sref="templates.addJobTemplate">
{{:: vm.strings.get('list.ADD_DD_JT_LABEL') }}
</a>
</li>
<li>
<a ui-sref="templates.addWorkflowJobTemplate">
{{:: vm.strings.get('list.ADD_DD_WF_LABEL') }}
</a>
</li>
</ul>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="button-add">
<a class="dropdown-item" ui-sref="templates.addJobTemplate">
{{:: vm.strings.get('list.ADD_DD_JT_LABEL') }}
</a>
<a class="dropdown-item" ui-sref="templates.addWorkflowJobTemplate">
{{:: vm.strings.get('list.ADD_DD_WF_LABEL') }}
</a>
</div>
</div>
</div>
<at-list results="vm.templates" id="templates_list">

2
awx/ui/client/index.template.ejs
View File

@ -60,8 +60,8 @@
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" ng-hide="disableButtons" data-target="#alert-modal" data-dismiss="modal" class="modal" aria-hidden="true"><i class="fa fa-times-circle"></i></button>
<h3 id="alertHeader" ng-bind="alertHeader"></h3>
<button type="button" class="close" ng-hide="disableButtons" data-target="#alert-modal" data-dismiss="modal" class="modal" aria-hidden="true"><i class="fa fa-times-circle"></i></button>
</div>
<div class="modal-body">
<div id="alert-modal-msg" class="alert" ng-bind-html="alertBody"></div>

4
awx/ui/client/legacy/styles/angular-scheduler.less
View File

@ -174,10 +174,6 @@
.inline-label {
margin-left: 10px;
}
.radio-inline input[type="radio"]{
margin-top: 2px;
margin-left: -15px;
}
#scheduler-buttons {
margin-top: 20px;
}

113
awx/ui/client/legacy/styles/ansible-ui.less
View File

@ -302,10 +302,6 @@ i:active,
background-color: @default-succ;
}
.bold-text .checkbox-inline {
font-weight: bold;
}
/* Disable textarea re-sizing as a general rule */
textarea {
resize: none;
@ -370,16 +366,18 @@ textarea.allowresize {
}
/* TB tooltip overrides */
.popover-content {
.popover-body {
width: 100%;
padding: 0;
color: @default-bg;
.table>tbody>tr>td {
padding-left: 0;
border-top: 1px solid @b7grey;
}
}
h3.popover-title, .popover-content, .popover-content blockquote, .popover-content a {
h3.popover-header, .popover-body, .popover-body blockquote, .popover-body a {
font-family: 'Open Sans', sans-serif;
font-size: 12px;
}
.flyout {
@ -391,7 +389,7 @@ textarea.allowresize {
.flyout tbody > tr:last-child > td {
padding-bottom: 0;
}
.popover-title {
.popover-header {
padding: 0 0 5px 0;
background-color: @default-interface-txt;
color: @default-bg;
@ -480,37 +478,6 @@ hr {
}
}
/* help collapse */
h4.panel-title {
font-size: 14px;
}
.panel-heading:hover {
cursor: pointer;
}
.panel-default>.panel-heading .collapse-help-icon {
color: @grey;
}
.collapsible-help {
margin-top: 20px;
margin-bottom: 20px;
dl {
margin-left: 15px;
}
dt {
margin-top: 15px;
}
}
/*
th.actions-column,
td.actions {
white-space: nowrap;
}
*/
.tab-content {
padding-top: 15px;
}
@ -586,6 +553,7 @@ dd {
.ui-widget-content a.help-link:visited {
color: @default-icon;
text-decoration: none;
padding-left: 5px;
}
.help-link:hover,
@ -805,27 +773,6 @@ select.page-size {
display: inline-block;
}
/* Display drop-down menus on hover. Remove margin between toggle link
and menu, allowing smooth mouse movement between toggle and menu
http://stackoverflow.com/questions/8878033/how-to-make-twitter-bootstrap-menu-dropdown-on-hover-rather-than-click
*/
/* .dropdown-toggle:hover .dropdown-menu, .dropdown:hover .dropdown-menu {
display: block;
}
.dropdown-menu li:hover {
visibility: visible;
}
.dropdown-menu {
margin-top: 0;
z-index: 200;
}
*/
/* end */
.greeting {
padding-right: 22px;
}
@ -857,26 +804,6 @@ input[type="checkbox"].checkbox-no-label {
margin-top: 10px;
}
.radio-group {
.radio-inline + .radio-inline {
margin-left: 0;
}
}
.checkbox-group {
.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
margin-left: 0;
}
.checkbox-inline, .radio-inline {
margin-right: 10px;
}
.checkbox-inline.stack-inline {
display: block;
}
}
.checkbox-options {
font-weight: normal;
}
@ -1612,6 +1539,7 @@ tr td button i {
/* overrides to TB modal */
.modal-content {
padding: 20px;
box-shadow: 0 5px 15px rgba(0,0,0,.5);
}
.modal-header {
@ -1627,6 +1555,7 @@ tr td button i {
.modal {
border: 1px solid @black;
overflow-y: auto;
}
.modal .SmartSearch-bar {
@ -1976,10 +1905,6 @@ tr td button i {
margin: 0 15px;
}
.panel-title {
font-weight: bold;
}
.show_input_button {
width: 73px;
}
@ -2027,7 +1952,7 @@ tr td button i {
margin: 100px auto;
}
.modal-backdrop, .modal-backdrop.fade.in {
.modal-backdrop, .modal-backdrop.fade.show {
opacity: .25;
}
@ -2197,10 +2122,6 @@ a:hover {
background-color: @default-err;
}
.dropdown-menu>li>a {
padding: 3px 10px;
}
#scheduled-jobs-tab .List-header {
display: none;
}
@ -2329,22 +2250,6 @@ body {
padding-bottom: 0px;
}
.Panel {
background-color: @panel-bg;
border-radius: 5px;
padding: 20px;
border: 1px solid @panel-border;
margin-top: 20px;
}
.Panel--noBottomPadding {
padding-bottom: 0px;
}
.Panel-hidden {
display: none;
}
.btn {
text-transform: uppercase;
}

188
awx/ui/client/legacy/styles/bootstrap-custom-overrides.less vendored Normal file
View File

@ -0,0 +1,188 @@
body {
font-family: 'Open Sans', sans-serif;
font-weight: 400;
color: @default-data-txt;
background-color: @default-secondary-bg;
font-size: 0.88rem;
}
.dropdown-toggle::after {
display:none;
}
.tooltip.show {
opacity: 1;
}
.tooltip {
font-family: 'Open Sans', sans-serif;
font-size: 0.75rem;
line-height: 1.4;
}
.bs-tooltip-top .arrow::before,
.bs-tooltip-auto[x-placement^="top"] .arrow::before {
border-top-color: @default-stdout-txt;
}
.bs-tooltip-bottom .arrow::before,
.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
border-bottom-color: @default-stdout-txt;
}
.bs-tooltip-left .arrow::before,
.bs-tooltip-auto[x-placement^="left"] .arrow::before {
border-left-color: @default-stdout-txt;
}
.bs-tooltip-right .arrow::before,
.bs-tooltip-auto[x-placement^="right"] .arrow::before {
border-right-color: @default-stdout-txt;
}
/* this used to exist but was removed */
.form-horizontal .form-group {
margin-left: -15px;
margin-right: -15px;
}
label {
margin-bottom: 0.3125rem;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
line-height: 1.1;
}
p {
margin-bottom: 0.625rem;
}
.dropdown-menu, .btn {
font-size: 0.88rem;
}
.btn-xs, .btn-group-xs>.btn {
padding: 1px 5px;
font-size: 0.75rem;
line-height: 1.5;
border-radius: 3px;
}
.btn-sm, .btn-group-sm>.btn {
padding: 5px 10px;
font-size: 0.75rem;
line-height: 1.5;
border-radius: 3px;
}
button, html input[type=button], input[type=reset], input[type=submit] {
cursor: pointer;
}
.dropdown-menu {
padding: .2rem 0;
}
.dropdown-item {
padding: 0.19rem 0.625rem;
}
@media (min-width: 768px) {
.modal-dialog {
width: 600px;
}
}
.modal-dialog {
max-width: none;
}
.modal-footer>:not(:last-child) {
margin-right: 1.25rem;
}
.btn-group-vertical>.btn, .btn-group>.btn {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.bs-popover-auto[x-placement^=right] .arrow::after, .bs-popover-right .arrow::after {
border-right-color: @default-stdout-txt;
}
.bs-popover-auto[x-placement^=left] .arrow::after, .bs-popover-left .arrow::after {
border-left-color: @default-stdout-txt;
}
.bs-popover-auto[x-placement^=top] .arrow::after, .bs-popover-top .arrow::after {
border-top-color: @default-stdout-txt;
}
.bs-popover-auto[x-placement^=bottom] .arrow::after, .bs-popover-bottom .arrow::after {
border-bottom-color: @default-stdout-txt;
}
a:not([href]):not([tabindex]) {
color: @default-link;
}
a:not([href]):not([tabindex]):hover {
color: @default-link-hov;
}
.dropdown-menu>li>a {
padding: 3px 10px;
display: block;
clear: both;
font-weight: 400;
line-height: 1.42857143;
white-space: nowrap;
}
.dropdown-item.active,
.dropdown-item:active,
.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
text-decoration: none;
color: @default-data-txt;
background-color: @f6grey;
}
.radio-inline+.radio-inline, .checkbox-inline+.checkbox-inline {
margin-left: 10px;
}
label {
font-weight: 700;
}
.radio-inline, .checkbox-inline {
font-weight: 400;
}
.form-control {
height: 30px;
}
.btn-success{
background: @default-succ;
border-color: transparent;
:hover{
background: @default-succ-hov;
}
:disabled{
background: @default-succ-disabled;
}
}
.btn-default{
background: @btn-bg;
border-color: @btn-bord;
color: @btn-txt;
:hover{
background: @btn-bg-hov;
}
:focus{
background: @btn-bg-sel;
}
}

3
awx/ui/client/legacy/styles/bootstrap-datepicker.less vendored
View File

@ -70,9 +70,6 @@
border-bottom: 0;
border-top: 6px solid #fff;
}
.datepicker > div {
display: none;
}
.datepicker.days .datepicker-days,
.datepicker.months .datepicker-months,
.datepicker.years .datepicker-years {

21
awx/ui/client/legacy/styles/forms.less
View File

@ -216,12 +216,6 @@
}
}
.Form-checkbox--stacked {
label {
display: block;
}
}
.Form-checkbox--subCheckbox {
font-size: 10px;
color: @default-stdout-txt;
@ -424,13 +418,12 @@
width: 100%;
}
.Form-passwordButton {
.Form-browseButton, .Form-passwordButton {
height: 30px;
color: @default-interface-txt;
text-transform: uppercase;
line-height: 1;
padding-left: 7px;
padding-right: 7px;
line-height: 1.2;
padding: 6px 12px;
background-color: @default-bg;
border:1px solid @b7grey;
}
@ -582,7 +575,6 @@ input[type='radio']:checked:before {
color: @default-interface-txt;
font-weight: normal;
font-size: small;
padding-right:5px;
width: 100%;
.noselect;
}
@ -789,7 +781,8 @@ input[type='radio']:checked:before {
background-color: @ebgrey;
}
.Form-checkboxRow {
display: flex;
clear: left;
.Form-checkbox {
label {
font-weight: 400;
}
}

87
awx/ui/client/legacy/styles/lists.less
View File

@ -22,27 +22,20 @@ table, tbody {
}
.List-tableHeader{
height: 30px;
height: 34px;
font-size: 14px;
font-weight: normal;
text-transform: uppercase;
color: @list-header-txt;
background-color: @list-header-bg;
padding-left: 15px;
padding-right: 15px;
border-bottom-width:0px!important;
}
.List-tableHeader:first-of-type {
border-top-left-radius: 5px;
}
.List-tableHeader:last-of-type {
border-top-right-radius: 5px;
align-items: center;
display: flex;
}
.List-tableHeader--info, .List-tableHeader--actions {
text-align: right;
justify-content: flex-end;
}
.List-tableHeader:not([ng-click]) {
@ -54,7 +47,7 @@ table, tbody {
}
.List-tableRow {
height: 40px;
min-height: 44px;
font-size: 14px;
color: @list-item;
border-bottom: 1px solid @default-border;
@ -69,7 +62,7 @@ table, tbody {
}
.List-tableRow--selected {
border-left: 5px solid @list-row-select-bord;
background-color: @list-row-select-bord;
}
.List-tableRow--disabled {
@ -117,6 +110,9 @@ table, tbody {
padding: 7px 15px;
border-top:0px!important;
word-wrap: break-word;
display: flex;
align-items: center;
height: 100%;
}
.List-tableCell.description-column {
@ -126,7 +122,7 @@ table, tbody {
.List-actionButtonCell {
padding-top:5px;
padding-right: 15px;
padding-right: 0px;
display:flex;
justify-content: flex-end;
}
@ -178,6 +174,7 @@ table, tbody {
margin: 0;
background-color: @list-title-badge;
border-radius: 5px;
color: @at-white;
}
.List-titleBadge--selected {
@ -398,7 +395,7 @@ table, tbody {
}
.List-staticColumn--mediumStatus {
width: 52px;
width: 53px;
padding-right: 0px!important;
}
@ -458,10 +455,6 @@ table, tbody {
font-size: 11px;
}
.List-dropdownButton {
border: none;
}
.List-dropdownSuccess {
background-color: @submit-button-bg;
color: @submit-button-text;
@ -564,3 +557,59 @@ table, tbody {
width: 100%;
}
}
.List-defaultLayout {
display: grid;
grid-template-columns: 5px auto;
}
.List-lookupLayout {
display: grid;
grid-template-columns: 26px auto;
}
.List-staticColumnLayout--statusOrCheckbox {
display: grid;
grid-template-columns: 5px 25px auto;
}
.List-staticColumnLayout--groups {
display: grid;
grid-template-columns: 5px 25px 25px auto;
}
.List-staticColumnLayout--hosts {
display: grid;
grid-template-columns: 5px 55px 25px auto;
}
.List-staticColumnLayout--hostsWithCheckbox {
display: grid;
grid-template-columns: 5px 25px 55px 25px auto;
}
.List-staticColumnLayout--schedules {
display: grid;
grid-template-columns: 5px 15px 55px auto;
}
.List-staticColumnLayout--toggleOnOff {
display: grid;
grid-template-columns: 5px 55px auto;
}
.List-table {
margin-top: 20px;
}
.List-tableHeaderRow {
background-color: @list-header-bg;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.List-centerEnd {
display: flex;
align-items: center;
justify-content: flex-end;
}

4
awx/ui/client/lib/components/form/form.partial.html
View File

@ -1,8 +1,6 @@
<div>
<form ng-attr-autocomplete="{{::autocomplete || undefined }}">
<div class="row">
<ng-transclude></ng-transclude>
</div>
<ng-transclude class="row"></ng-transclude>
</form>
<at-modal></at-modal>

6
awx/ui/client/lib/components/input/_index.less
View File

@ -317,3 +317,9 @@
}
}
}
.at-InputGroup-container {
.row {
margin: 0;
}
}

2
awx/ui/client/lib/components/input/file.partial.html
View File

@ -3,7 +3,7 @@
<at-input-label></at-input-label>
<input class="at-InputFile--hidden" type="file"/>
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button class="btn at-ButtonHollow--default at-Input-button"
ng-disabled="state._disabled || form.disabled"
ng-click="vm.onButtonClick()">

1
awx/ui/client/lib/components/input/group.directive.js
View File

@ -118,6 +118,7 @@ function AtInputGroupController ($scope, $compile) {
vm.insert = group => {
const container = document.createElement('div');
container.className = 'row';
let col = 1;
const colPerRow = 12 / scope.col;
let isDivided = true;

2
awx/ui/client/lib/components/input/secret.partial.html
View File

@ -3,7 +3,7 @@
<at-input-label></at-input-label>
<div class="input-group">
<span class="input-group-btn at-InputGroup-button">
<span class="input-group-btn at-InputGroup-button input-group-prepend">
<button class="btn at-ButtonHollow--white"
ng-class="{
'at-Input-button--fixed-xs': mode === 'input',

2
awx/ui/client/lib/components/input/textarea-secret.partial.html
View File

@ -3,7 +3,7 @@
<at-input-label></at-input-label>
<div ng-class="{ 'input-group': state._edit }">
<div ng-if="state._edit" class="input-group-btn at-InputGroup-button">
<div ng-if="state._edit" class="input-group-btn at-InputGroup-button input-group-prepend">
<button class="btn at-ButtonHollow--white at-Input-button--fixed-md"
ng-disabled="!state._enableToggle && (state._disabled || form.disabled)"
ng-click="state._isBeingReplaced = !state._isBeingReplaced">

1
awx/ui/client/lib/components/layout/_index.less
View File

@ -106,6 +106,7 @@
display: flex;
cursor: pointer;
font-size: 13px;
line-height: 1.42857143;
i {
cursor: pointer;
color: @at-color-side-nav-item-icon;

6
awx/ui/client/lib/components/modal/modal.partial.html
View File

@ -1,13 +1,13 @@
<div class="modal at-Modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content at-Modal-window">
<div class="row">
<div class="col-xs-10">
<div class="Modal-header">
<div class="Modal-title">
<div class="at-Modal-heading">
<h4 class="modal-title at-Modal-title">{{ vm.modal.title }}</h4>
</div>
</div>
<div class="col-xs-2">
<div class="Modal-exitHolder">
<div class="at-Modal-dismiss">
<i class="fa fa-lg fa-times-circle" ng-click="vm.hide()"></i>
</div>

2
awx/ui/client/lib/components/panel/body.partial.html
View File

@ -1,3 +1,3 @@
<div class="panel-body at-Panel-body">
<div class="card-body at-Panel-body">
<ng-transclude></ng-transclude>
</div>

2
awx/ui/client/lib/components/panel/panel.partial.html
View File

@ -1,3 +1,3 @@
<div class="panel panel-default at-Panel">
<div class="card at-Panel">
<ng-transclude></ng-transclude>
</div>

4
awx/ui/client/lib/components/tabs/_index.less
View File

@ -1,7 +1,3 @@
.at-TabGroup {
margin-top: @at-margin-panel;
}
.at-Tab {
margin: 0 @at-margin-item-column 0 0;
font-size: @at-font-size-body;

2
awx/ui/client/lib/components/tabs/group.partial.html
View File

@ -1,3 +1,3 @@
<div class="at-TabGroup">
<div>
<ng-transclude></ng-transclude>
</div>

3
awx/ui/client/lib/components/truncate/_index.less
View File

@ -1,6 +1,7 @@
.at-Truncate {
display: flex;
align-items: center;
height: 100%;
.at-Truncate-text {
font-family: monospace, Courier, "Courier New", "Open Sans", sans-serif;
@ -28,4 +29,4 @@
top: 0px;
width: 2em;
}
}
}

4
awx/ui/client/lib/theme/index.less
View File

@ -36,9 +36,7 @@
@import '../../legacy/styles/text-label';
@import '../../legacy/styles/bootstrap-datepicker';
@import '../../legacy/styles/ansible-ui';
// Dependency Style Overrides
@import '../../src/shared/bootstrap-settings';
@import '../../legacy/styles/bootstrap-custom-overrides';
// Legacy Utilities
@import '../../src/shared/utilities/alerts';

20
awx/ui/client/src/access/add-rbac-user-team/rbac-selected-list.directive.js
View File

@ -33,6 +33,7 @@ export default ['$compile', 'i18n', 'generateList',
list = _.cloneDeep(listMap[scope.resourceType]);
delete list.actions;
delete list.layoutClass;
list.listTitleBadge = false;
@ -42,20 +43,22 @@ export default ['$compile', 'i18n', 'generateList',
name: list.fields.name,
scm_type: list.fields.scm_type
};
delete list.staticColumns;
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/projects/{{project.id}}";
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.scm_type.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-5';
list.fields.scm_type.columnClass = 'col-sm-5';
break;
case 'inventories':
list.fields = {
name: list.fields.name,
organization: list.fields.organization
};
delete list.staticColumns;
delete list.fields.name.ngClick;
list.fields.name.ngHref = '{{inventory.linkToDetails}}';
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.organization.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-5';
list.fields.organization.columnClass = 'col-sm-5';
break;
case 'job_templates':
list.name = 'job_templates';
@ -63,7 +66,7 @@ export default ['$compile', 'i18n', 'generateList',
list.fields = {
name: list.fields.name
};
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.name.columnClass = 'col-sm-10';
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/templates/job_template/{{job_template.id}}";
break;
@ -73,7 +76,7 @@ export default ['$compile', 'i18n', 'generateList',
list.fields = {
name: list.fields.name
};
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.name.columnClass = 'col-sm-10';
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/templates/workflow_job_template/{{workflow_template.id}}";
break;
@ -83,7 +86,7 @@ export default ['$compile', 'i18n', 'generateList',
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/credentials/{{credential.id}}";
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.name.columnClass = 'col-sm-10';
break;
case 'organizations':
list.fields = {
@ -91,11 +94,12 @@ export default ['$compile', 'i18n', 'generateList',
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/organizations/{{organization.id}}";
list.fields.name.columnClass = 'col-md-5 col-sm-5 col-xs-10';
list.fields.name.columnClass = 'col-sm-10';
break;
}
list.fieldActions = {
columnClass: 'col-sm-2',
remove: {
ngClick: `removeSelection(${list.iterator}, resourceType)`,
iconClass: 'fa fa-times-circle',

4
awx/ui/client/src/access/rbac-multiselect/permissionsUsers.list.js
View File

@ -25,11 +25,11 @@
fields: {
first_name: {
label: i18n._('First Name'),
columnClass: 'col-md-3 col-sm-3 hidden-xs'
columnClass: 'd-none d-sm-flex col-md-3 col-sm-3'
},
last_name: {
label: i18n._('Last Name'),
columnClass: 'col-md-3 col-sm-3 hidden-xs'
columnClass: 'd-none d-sm-flex col-md-3 col-sm-3'
},
username: {
key: true,

33
awx/ui/client/src/access/rbac-multiselect/rbac-multiselect-list.directive.js
View File

@ -37,6 +37,7 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
list.multiSelect = true;
list.multiSelectExtended = true;
list.listTitleBadge = false;
list.layoutClass = 'List-staticColumnLayout--statusOrCheckbox';
delete list.actions;
delete list.fieldActions;
@ -47,10 +48,11 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
name: list.fields.name,
scm_type: list.fields.scm_type
};
delete list.staticColumns;
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/projects/{{project.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.scm_type.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-6';
list.fields.scm_type.columnClass = 'col-sm-6';
break;
case 'Inventories':
@ -58,10 +60,11 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
name: list.fields.name,
organization: list.fields.organization
};
delete list.staticColumns;
delete list.fields.name.ngClick;
list.fields.name.ngHref = '{{inventory.linkToDetails}}';
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.organization.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-6';
list.fields.organization.columnClass = 'col-sm-6';
delete list.disableRow;
break;
@ -74,7 +77,7 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/templates/job_template/{{job_template.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.name.columnClass = 'col-sm-12';
break;
case 'WorkflowTemplates':
@ -86,7 +89,7 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/templates/workflow_job_template/{{workflow_template.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.name.columnClass = 'col-sm-12';
break;
case 'Users':
list.querySet = { order_by: 'username', page_size: '5' };
@ -97,9 +100,9 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.username.ngClick;
list.fields.username.ngHref = "#/users/{{user.id}}";
list.fields.username.columnClass = 'col-md-5 col-sm-5 col-xs-11';
list.fields.first_name.columnClass = 'col-md-3 col-sm-3 hidden-xs';
list.fields.last_name.columnClass = 'col-md-3 col-sm-3 hidden-xs';
list.fields.username.columnClass = 'col-sm-4 col-xs-11';
list.fields.first_name.columnClass = 'd-none d-sm-flex col-sm-4';
list.fields.last_name.columnClass = 'd-none d-sm-flex col-sm-4';
break;
case 'Teams':
list.fields = {
@ -108,8 +111,8 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/teams/{{team.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.organization.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-6';
list.fields.organization.columnClass = 'col-sm-6';
break;
case 'Organizations':
list.fields = {
@ -117,7 +120,7 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/organizations/{{organization.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.name.columnClass = 'col-sm-12';
break;
case 'Credentials':
list.fields = {
@ -125,15 +128,15 @@ export default ['addPermissionsTeamsList', 'addPermissionsUsersList', 'TemplateL
};
delete list.fields.name.ngClick;
list.fields.name.ngHref = "#/credentials/{{credential.id}}";
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.name.columnClass = 'col-sm-12';
break;
default:
list.fields = {
name: list.fields.name,
description: list.fields.description
};
list.fields.name.columnClass = 'col-md-6 col-sm-6 col-xs-11';
list.fields.description.columnClass = 'col-md-5 col-sm-5 hidden-xs';
list.fields.name.columnClass = 'col-sm-6';
list.fields.description.columnClass = 'col-sm-6';
}
list_html = generateList.build({

1
awx/ui/client/src/access/rbac-role-column/roleList.block.less
View File

@ -4,7 +4,6 @@
display: flex;
flex-wrap: wrap;
align-items: flex-start;
padding-left: 15px;
}
.RoleList-tagContainer {

4
awx/ui/client/src/activity-stream/factories/build-anchor.factory.js
View File

@ -95,10 +95,10 @@ export default function BuildAnchor($log, $filter) {
const name = $filter('sanitize')(obj.name || obj.username);
if (url) {
return ` <a href=\"${url}\"> ${name} </a> `;
return ` <a href=\"${url}\">&nbsp;${name}&nbsp;</a> `;
}
return ` <span> ${name} </span> `;
return ` <span>&nbsp;${name}&nbsp;</span> `;
}
catch(err){
$log.debug(err);

2
awx/ui/client/src/configuration/forms/settings-form.partial.html
View File

@ -5,7 +5,7 @@
</div>
<div class="tab-pane" id="configuration-panel">
<div ng-cloak id="htmlTemplate" class="Panel">
<div ng-cloak id="htmlTemplate" class="card at-Panel">
<div class="Form-header">
<div class="Form-title Form-title--uppercase" translate>{{ vm.getCurrentFormTitle() }}</div>
</div>

3
awx/ui/client/src/configuration/settings.block.less
View File

@ -79,6 +79,7 @@ label#filePickerButton {
cursor: pointer;
background-color: #fff;
color: @default-interface-txt;
margin-bottom: 0;
}
input#filePickerText {
cursor: default;
@ -131,7 +132,7 @@ input#filePickerText {
display: inline-block;
// Filepicker and toggle disabling
.Form-filePicker--pickerButton, .Form-filePicker--textBox,
.Form-browseButton, .Form-filePicker--textBox,
.ScheduleToggle {
pointer-events: none;
cursor: not-allowed;

8
awx/ui/client/src/credential-types/credential-types.list.js
View File

@ -22,8 +22,8 @@ export default ['i18n', function(i18n){
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-3 col-sm-9 col-xs-9',
modalColumnClass: 'col-md-11',
columnClass: 'col-md-4 col-sm-9 col-xs-9',
modalColumnClass: 'col-sm-12',
awToolTip: '{{credential_type.description | sanitize}}',
dataPlacement: 'top'
},
@ -31,7 +31,7 @@ export default ['i18n', function(i18n){
label: i18n._('Kind'),
ngBind: 'credential_type.kind_label',
excludeModal: true,
columnClass: 'col-md-2 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex col-md-4'
},
},
@ -48,7 +48,7 @@ export default ['i18n', function(i18n){
fieldActions: {
columnClass: 'col-md-2 col-sm-3 col-xs-3',
columnClass: 'col-md-4 col-sm-3 col-xs-3',
edit: {
ngClick: "editCredentialType(credential_type.id)",

6
awx/ui/client/src/credentials/credentials.form.js
View File

@ -456,19 +456,19 @@ export default ['i18n', function(i18n) {
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-sm-3 col-xs-4'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4'
columnClass: 'col-sm-4 col-xs-4'
},
team_roles: {
label: i18n._('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4'
columnClass: 'col-sm-5 col-xs-4'
}
}
}

8
awx/ui/client/src/credentials/credentials.list.js
View File

@ -24,7 +24,7 @@ export default ['i18n', function(i18n) {
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-3 col-sm-9 col-xs-9',
columnClass: 'col-md-4 col-sm-9 col-xs-9',
modalColumnClass: 'col-md-12',
awToolTip: '{{credential.description | sanitize}}',
dataPlacement: 'top'
@ -34,14 +34,14 @@ export default ['i18n', function(i18n) {
ngBind: 'credential.kind',
excludeModal: true,
nosort: true,
columnClass: 'col-md-2 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex col-md-2'
},
owners: {
label: i18n._('Owners'),
type: 'owners',
nosort: true,
excludeModal: true,
columnClass: 'col-md-2 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex col-md-2 List-tableCell'
}
},
@ -58,7 +58,7 @@ export default ['i18n', function(i18n) {
fieldActions: {
columnClass: 'col-md-2 col-sm-3 col-xs-3',
columnClass: 'col-md-4 col-sm-3 col-xs-3',
edit: {
ngClick: "editCredential(credential.id)",

16
awx/ui/client/src/credentials/factories/kind-change.factory.js
View File

@ -2,8 +2,7 @@ export default
function KindChange(Empty, i18n) {
return function(params) {
var scope = params.scope,
reset = params.reset,
collapse, id;
reset = params.reset;
$('.popover').each(function() {
// remove lingering popover <div>. Seems to be a bug in TB3 RC1
@ -164,19 +163,6 @@ export default
scope.authorize = false;
scope.authorize_password = null;
}
// Collapse or open help widget based on whether scm value is selected
collapse = $('#credential_kind').parent().find('.panel-collapse').first();
id = collapse.attr('id');
if (!Empty(scope.kind) && scope.kind.value !== '') {
if ($('#' + id + '-icon').hasClass('icon-minus')) {
scope.accordionToggle('#' + id);
}
} else {
if ($('#' + id + '-icon').hasClass('icon-plus')) {
scope.accordionToggle('#' + id);
}
}
};
}

2
awx/ui/client/src/home/dashboard/counts/dashboard-counts.block.less
View File

@ -60,9 +60,11 @@
.DashboardCounts-label {
flex: 1;
margin-bottom: 0px;
margin-top: 0.625rem;
color: @db-count-label;
text-transform: uppercase;
transition: color 0.2s;
font-size: 0.75rem;
}
@media only screen and (max-width: 710px) {

5
awx/ui/client/src/home/dashboard/graphs/dashboard-graphs.block.less
View File

@ -122,6 +122,10 @@
border-color: @d7grey;
min-width: 115px;
a:not([href]):not([tabindex]) {
color: @default-interface-txt;
}
a > span {
float: none;
}
@ -145,7 +149,6 @@
.DashboardGraphs-statusFilters{
padding-top: 5px;
}
.DashboardGraphs-statusFilter{

50
awx/ui/client/src/home/dashboard/lists/dashboard-list.block.less
View File

@ -52,11 +52,7 @@
}
.DashboardList-tableHeader--time {
width: 190px;
padding-left:20px;
padding-right: 15px;
border-top-right-radius: 5px;
text-align: right;
justify-content: flex-end;
}
.DashboardList-tableHeader--actions {
@ -67,7 +63,7 @@
}
.DashboardList-status{
padding-right: 5px;
padding-right: 9px;
}
.DashboardList-status--success{
@ -90,26 +86,10 @@
content: "\f06a";
}
.DashboardList-nameCell {
padding-left: 15px;
width: 100%;
word-wrap: break-word;
}
.DashboardList-nameContainer {
color: @default-link;
}
.DashboardList-activityCell {
padding-right: 20px;
padding-left: 20px;
}
.DashboardList-timeCell {
white-space: nowrap;
padding-right: 15px;
padding-left: 20px;
text-align: right;
display: flex;
justify-content: flex-end;
}
.DashboardList-nameContainer:hover {
@ -117,28 +97,6 @@
cursor: pointer;
}
.DashboardList-actionButtonCell {
padding-top:10px;
padding-right: 15px;
display:flex;
justify-content: flex-end;
}
.DashboardList-tableRow--evenRow > .DashboardList-actionButtonCell > .DashboardList-actionButton {
background-color: @list-actn-alt-bg;
border: 1px solid @list-actn-alt-bord;
}
.DashboardList-actionButton--launch {
margin-right: 10px;
}
.DashboardList-actionButton--edit:hover {
background-color: @default-link;
color: @default-bg;
border: 1px solid @default-link;
}
.DashboardList-noJobs {
color: @list-empty-txt;
margin-top: 20px;

63
awx/ui/client/src/home/dashboard/lists/job-templates/job-templates-list.partial.html
View File

@ -8,37 +8,40 @@
</a>
</div>
<div class="DashboardList-container">
<table class="List-table">
<tr class="List-tableHeaderRow">
<th class="List-tableHeader DashboardList-tableHeader--name">
<translate>Name</translate>
</th>
<th class="List-tableHeader DashboardList-tableHeader--activity">
<translate>Activity</translate>
</th>
<th class="List-tableHeader DashboardList-tableHeader--actions">
<translate>Actions</translate>
</th>
</tr>
<tr class="List-tableRow"
ng-repeat = "template in templates">
<td class="DashboardList-nameCell">
<a ng-href="#/templates/{{template.type}}/{{template.id}}" class="DashboardList-nameContainer">
{{ template.name }}
</a>
</td>
<td class="DashboardList-activityCell">
<aw-smart-status jobs="template.recent_jobs" template-type="template.type"></aw-smart-status>
</td>
<td class="List-actionsContainer">
<div class="List-actionButtonCell">
<at-launch-template template="template"
ng-show="template.can_start">
</at-launch-template>
<div class="List-table">
<div class="List-tableHeaderRow">
<div class="d-flex">
<div class="List-tableHeader col-sm-4">
<translate>Name</translate>
</div>
<div class="List-tableHeader col-sm-5">
<translate>Activity</translate>
</div>
<div class="List-tableHeader List-tableHeader--actions col-sm-3">
<translate>Actions</translate>
</div>
</div>
</div>
<div class="List-tableRow" ng-repeat="template in templates">
<div class="d-flex">
<div class="List-tableCell col-sm-4">
<a ng-href="#/templates/{{template.type}}/{{template.id}}" class="DashboardList-nameContainer">
{{ template.name }}
</a>
</div>
</td>
</tr>
</table>
<div class="List-tableCell col-sm-5">
<aw-smart-status jobs="template.recent_jobs" template-type="template.type"></aw-smart-status>
</div>
<div class="col-sm-3 List-actionsContainer">
<div class="List-actionButtonCell List-tableCell">
<at-launch-template template="template"
ng-show="template.can_start">
</at-launch-template>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="DashboardList" ng-show="noJobTemplates">

53
awx/ui/client/src/home/dashboard/lists/jobs/jobs-list.partial.html
View File

@ -8,29 +8,36 @@
</a>
</div>
<div class="DashboardList-container">
<table class="List-table">
<tr>
<th class="List-tableHeader DashboardList-tableHeader--name" translate>Name</th>
<th class="List-tableHeader DashboardList-tableHeader--time" translate>Time</th>
</tr>
<tr class="List-tableRow"
ng-repeat = "job in jobs">
<td class="DashboardList-nameCell">
<a href="{{ job.detailsUrl }}" ng-if="isSuccessful(job.status)" aw-tool-tip="{{strings.get('list.STATUS_TOOLTIP', job.status)}}" aw-tip-placement="right" data-tip-watch="strings.get('list.STATUS_TOOLTIP', job.status)">
<i class="fa DashboardList-status DashboardList-status--success icon-job-successful"></i>
</a>
<a href="{{ job.detailsUrl }}" ng-if="!isSuccessful(job.status)" aw-tool-tip="{{strings.get('list.STATUS_TOOLTIP', job.status)}}" aw-tip-placement="right" data-tip-watch="strings.get('list.STATUS_TOOLTIP', job.status)">
<i class="fa DashboardList-status DashboardList-status--failed icon-job-failed"></i>
</a>
<a href="{{ job.detailsUrl }}" class="DashboardList-nameContainer">
{{ job.name }}
</a>
</td>
<td class="DashboardList-timeCell">
{{job.time}}
</td>
</tr>
</table>
<div class="List-table">
<div class="List-tableHeaderRow">
<div class="d-flex">
<div class="List-tableHeader col-6">
<translate>Name</translate>
</div>
<div class="List-tableHeader col-6 DashboardList-tableHeader--time">
<translate>Time</translate>
</div>
</div>
</div>
<div class="List-tableRow" ng-repeat="job in jobs">
<div class="d-flex">
<div class="List-tableCell col-6">
<a href="{{ job.detailsUrl }}" ng-if="isSuccessful(job.status)" aw-tool-tip="{{strings.get('list.STATUS_TOOLTIP', job.status)}}" aw-tip-placement="right" data-tip-watch="strings.get('list.STATUS_TOOLTIP', job.status)">
<i class="fa DashboardList-status DashboardList-status--success icon-job-successful"></i>
</a>
<a href="{{ job.detailsUrl }}" ng-if="!isSuccessful(job.status)" aw-tool-tip="{{strings.get('list.STATUS_TOOLTIP', job.status)}}" aw-tip-placement="right" data-tip-watch="strings.get('list.STATUS_TOOLTIP', job.status)">
<i class="fa DashboardList-status DashboardList-status--failed icon-job-failed"></i>
</a>
<a href="{{ job.detailsUrl }}" class="DashboardList-nameContainer">
{{ job.name }}
</a>
</div>
<div class="List-tableCell col-6 DashboardList-timeCell">
{{job.time}}
</div>
</div>
</div>
</div>
</div>
</div>

2
awx/ui/client/src/instance-groups/instances/instance-modal.partial.html
View File

@ -1,6 +1,6 @@
<div id="instance-modal" class="modal-dialog">
<div class="modal-content">
<div class="row at-Panel-headingRow">
<div class="at-Panel-headingRow">
<div class="col-xs-10">
<h3 class="at-Panel-headingTitle">{{ vm.panelTitle }} | {{ vm.instanceGroupName}}</h3>
</div>

78
awx/ui/client/src/inventories-hosts/hosts/host.list.js
View File

@ -22,45 +22,53 @@ export default ['i18n', function(i18n) {
basePath: 'hosts',
title: false,
actionHolderClass: 'List-actionHolder',
layoutClass: 'List-staticColumnLayout--hostsWithCheckbox',
staticColumns: [
{
field: 'toggleHost',
content: {
ngDisabled: 'host.has_inventory_sources',
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleHost($event, host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
}
}, {
field: 'active_failures',
content: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ host.job_status_html }}",
dataTitle: "{{ host.job_status_title }}",
awToolTip: "{{ host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column List-staticColumn--smallStatus'
}
}
],
fields: {
toggleHost: {
ngDisabled: 'host.has_inventory_sources',
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleHost($event, host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
},
active_failures: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ host.job_status_html }}",
dataTitle: "{{ host.job_status_title }}",
awToolTip: "{{ host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
key: true,
label: i18n._('Name'),
ngClick: "editHost(host.id)",
columnClass: 'col-lg-6 col-md-8 col-sm-8 col-xs-7',
columnClass: 'col-sm-4',
dataHostId: "{{ host.id }}",
dataType: "host",
class: 'InventoryManage-breakWord'
@ -69,14 +77,14 @@ export default ['i18n', function(i18n) {
label: i18n._('Inventory'),
sourceModel: 'inventory',
sourceField: 'name',
columnClass: 'col-lg-5 col-md-4 col-sm-4 hidden-xs elllipsis',
columnClass: 'd-none d-sm-flex col-sm-4 elllipsis',
ngClick: "editInventory(host)"
}
},
fieldActions: {
columnClass: 'col-lg-6 col-md-4 col-sm-4 col-xs-5 text-right',
columnClass: 'col-sm-4 col-xs-5 text-right',
edit: {
ngClick: "editHost(host.id)",
icon: 'icon-edit',

83
awx/ui/client/src/inventories-hosts/hosts/hosts.partial.html
View File

@ -1,7 +1,7 @@
<div class="tab-pane" id="hosts-panel">
<aw-limit-panels max-panels="2" panel-container="hosts-panel"></aw-limit-panels>
<div ui-view="form"></div>
<div class="Panel">
<div class="card at-Panel">
<div class="row Form-tabRow">
<div class="col-lg-12">
<div class="Form-tabHolder">
@ -29,7 +29,7 @@
default-params="host_default_params"
query-set="host_queryset"
search-tags="searchTags">
</smart-search>
</smart-search>
</div>
<div class="row" ng-show="hosts.length === 0 && !(searchTags | isEmpty)">
@ -37,56 +37,59 @@
</div>
<div class="List-noItems" ng-show="hosts.length === 0 && (searchTags | isEmpty)" translate>NO HOSTS HAVE BEEN CREATED</div>
<div class="list-table-container" ng-show="hosts.length > 0">
<table id="hosts_table" class="List-table table-no-border" is-extended="false">
<thead>
<tr class="List-tableHeaderRow">
<th base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="toggleHost" column-iterator="host" column-no-sort="true" column-label="" column-custom-class="List-staticColumn--toggle" query-set="host_queryset"></th>
<th base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="active_failures" column-iterator="host" column-no-sort="true" column-label="" column-custom-class="status-column List-staticColumn--smallStatus" query-set="host_queryset"></th>
<th base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="name" column-iterator="host" column-no-sort="undefined" column-label="Name" column-custom-class="col-lg-6 col-md-8 col-sm-8 col-xs-7" query-set="host_queryset"></th>
<th base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="inventory" column-iterator="host" column-no-sort="undefined" column-label="Inventory" column-custom-class="col-lg-5 col-md-4 col-sm-4 hidden-xs elllipsis" query-set="host_queryset"></th>
<th class="List-tableHeader List-tableHeader--actions actions-column col-lg-6 col-md-4 col-sm-4 col-xs-5 text-right" translate>Actions</th>
</tr>
</thead>
<tbody>
<tr ng-class="{'List-tableRow--selected': $stateParams['host_id'] == host.id}" id="{{ host.id }}" class="List-tableRow host_class" ng-repeat="host in hosts track by host.id">
<td class="List-tableCell toggleHost-column List-staticColumn--toggle">
<div id="hosts_table" class="List-table table-no-border">
<div class="List-staticColumnLayout--hosts List-tableHeaderRow">
<div></div>
<div></div>
<div></div>
<div class="d-flex h-100">
<div class="List-tableHeader" base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="name" column-iterator="host" column-no-sort="undefined" column-label="Name" column-custom-class="col-lg-4" query-set="host_queryset"></div>
<div class="List-tableHeader" base-path="hosts" collection="hosts" dataset="host_dataset" column-sort="" column-field="inventory" column-iterator="host" column-no-sort="undefined" column-label="Inventory" column-custom-class="d-none d-sm-flex col-sm-4 ellipsis" query-set="host_queryset"></div>
<div class="List-tableHeader List-tableHeader--actions actions-column col-lg-4 text-right" translate>Actions</div>
</div>
</div>
<div class="List-staticColumnLayout--hosts List-tableRow" ng-repeat="host in hosts track by host.id">
<div></div>
<div class="List-tableCell toggleHost-column List-staticColumn--toggle">
<div class="ScheduleToggle" ng-class="{'is-on': host.enabled, 'ScheduleToggle--disabled': host.has_inventory_sources}" aw-tool-tip="{{strings.get('hostList.DISABLED_TOGGLE_TOOLTIP')}}" data-placement="right" data-tip-watch="undefined">
<button ng-disabled="host.has_inventory_sources" ng-show="host.enabled" class="ScheduleToggle-switch is-on" ng-click="toggleHost($event, host)" translate>ON</button>
<button ng-disabled="host.has_inventory_sources" ng-show="!host.enabled" class="ScheduleToggle-switch" ng-click="toggleHost($event, host)" translate>OFF</button>
</div>
</td>
<td class="List-tableCell active_failures-column status-column List-staticColumn--smallStatus">
</div>
<div class="List-tableCell active_failures-column status-column List-staticColumn--smallStatus">
<div class="host-name">
<a href="" ng-click="noop()" aw-tool-tip="{{ host.badgeToolTip }}" aw-pop-over="{{ host.job_status_html }}" data-placement="top" over-title="{{ host.job_status_title }}">
<i class="fa {{ 'fa icon-job-' + host.active_failures }}"></i>
</a>
</div>
</td>
<td class="List-tableCell name-column InventoryManage-breakWord col-lg-6 col-md-8 col-sm-8 col-xs-7">
<div class="host-name">
<a ui-sref="hosts.edit({host_id:host.id})">{{host.name }}</a>
</div>
<div class="d-flex h-100">
<div class="List-tableCell name-column InventoryManage-breakWord col-lg-4">
<div class="host-name">
<a ui-sref="hosts.edit({host_id:host.id})">{{host.name }}</a>
</div>
</div>
</td>
<td class="List-tableCell inventory_name-column col-lg-5 col-md-4 col-sm-4 hidden-xs elllipsis">
<div class="host-name">
<a href="#/inventories/inventory/{{host.inventory}}">{{host.inventory_name}}</a>
<div class="List-tableCell inventory_name-column col-lg-4 elllipsis">
<div class="host-name">
<a href="#/inventories/inventory/{{host.inventory}}">{{host.inventory_name}}</a>
</div>
</div>
</td>
<td class="List-actionsContainer">
<div class="List-actionButtonCell List-tableCell">
<button id="insights-action" class="List-actionButton " ng-class="{'List-actionButton--selected' : $stateParams['host_id'] == host.id && $state.is('hosts.edit.insights')}" data-placement="top" ng-click="goToInsights(host.id)" aw-tool-tip="{{strings.get('inventory.VIEW_INSIGHTS')}}" data-tip-watch="strings.get('inventory.VIEW_INSIGHTS')" ng-show="host.insights_system_id && host.summary_fields.inventory.hasOwnProperty('insights_credential_id')">
<i class="fa fa-info"></i>
</button>
<button id="edit-action" class="List-actionButton " ng-class="{'List-editButton--selected' : $stateParams['host_id'] == host.id && $state.is('hosts.edit') }" data-placement="top" ng-click="editHost(host.id)" aw-tool-tip="{{strings.get('inventory.EDIT_HOST')}}" data-tip-watch="strings.get('inventory.VIEW_HOST')" ng-show="host.summary_fields.user_capabilities.edit">
<i class="fa fa-pencil"></i>
</button>
<button id="view-action" class="List-actionButton " data-placement="top" ng-click="editHost(host.id)" aw-tool-tip="{{strings.get('inventory.VIEW_HOST')}}" data-tip-watch="strings.get('inventory.VIEW_HOST')" ng-show="!host.summary_fields.user_capabilities.edit"><i class="fa fa-search-plus"></i>
</button>
<div class="List-actionsContainer col-lg-4">
<div class="List-actionButtonCell List-tableCell">
<button id="insights-action" class="List-actionButton " ng-class="{'List-actionButton--selected' : $stateParams['host_id'] == host.id && $state.is('hosts.edit.insights')}" data-placement="top" ng-click="goToInsights(host.id)" aw-tool-tip="{{strings.get('inventory.VIEW_INSIGHTS')}}" data-tip-watch="strings.get('inventory.VIEW_INSIGHTS')" ng-show="host.insights_system_id && host.summary_fields.inventory.hasOwnProperty('insights_credential_id')">
<i class="fa fa-info"></i>
</button>
<button id="edit-action" class="List-actionButton " ng-class="{'List-editButton--selected' : $stateParams['host_id'] == host.id && $state.is('hosts.edit') }" data-placement="top" ng-click="editHost(host.id)" aw-tool-tip="{{strings.get('inventory.EDIT_HOST')}}" data-tip-watch="strings.get('inventory.VIEW_HOST')" ng-show="host.summary_fields.user_capabilities.edit">
<i class="fa fa-pencil"></i>
</button>
<button id="view-action" class="List-actionButton " data-placement="top" ng-click="editHost(host.id)" aw-tool-tip="{{strings.get('inventory.VIEW_HOST')}}" data-tip-watch="strings.get('inventory.VIEW_HOST')" ng-show="!host.summary_fields.user_capabilities.edit"><i class="fa fa-search-plus"></i>
</button>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div><!-- table container -->
<paginate
base-path="hosts"

26
awx/ui/client/src/inventories-hosts/hosts/related/groups/hosts-related-groups.list.js
View File

@ -15,18 +15,24 @@ export default ['i18n', function(i18n) {
hover: true,
trackBy: 'group.id',
basePath: 'api/v2/hosts/{{$stateParams.host_id}}/groups/',
layoutClass: 'List-staticColumnLayout--groups',
staticColumns: [
{
field: 'failed_hosts',
content: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + group.hosts_status_class }}",
columnClass: 'status-column'
}
}
],
fields: {
failed_hosts: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + group.hosts_status_class }}",
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
label: i18n._('Groups'),
key: true,

4
awx/ui/client/src/inventories-hosts/inventories/inventories.block.less
View File

@ -1,5 +1,5 @@
.Inventories-hostStatus {
margin-left: 5px;
margin-left: 10px;
}
#inventories-panel {
.completed_jobsList.List-well {
@ -9,4 +9,4 @@
margin: 0;
}
}
}
}

2
awx/ui/client/src/inventories-hosts/inventories/inventories.partial.html
View File

@ -7,7 +7,7 @@
<div ui-view="groupForm"></div>
<div ui-view="sourcesForm"></div>
<div ui-view="form"></div>
<div ng-cloak id="htmlTemplate" class="Panel">
<div ng-cloak id="htmlTemplate" class="card at-Panel">
<div class="row Form-tabRow">
<div class="col-lg-12">
<div class="Form-tabHolder">

54
awx/ui/client/src/inventories-hosts/inventories/inventory.list.js
View File

@ -20,33 +20,37 @@ export default ['i18n', function(i18n) {
title: false,
disableRow: "{{ inventory.pending_deletion }}",
disableRowValue: 'inventory.pending_deletion',
layoutClass: 'List-staticColumnLayout--toggleOnOff',
staticColumns: [
{
field: 'status',
content: {
label: '',
nosort: true,
ngClick: "null",
iconOnly: true,
excludeModal: true,
template: `<source-summary-popover inventory="inventory" ng-hide="inventory.pending_deletion" ng-if="inventory.kind === ''"></source-summary-popover><host-summary-popover inventory="inventory" ng-hide="inventory.pending_deletion" ng-class="{'HostSummaryPopover-noSourceSummary': inventory.kind !== ''}"></host-summary-popover>`,
icons: [{
icon: "{{ 'icon-cloud-' + inventory.syncStatus }}",
awToolTip: "{{ inventory.syncTip }}",
awTipPlacement: "right",
ngClick: "showSourceSummary($event, inventory.id)",
ngClass: "inventory.launch_class"
},{
icon: "{{ 'icon-job-' + inventory.hostsStatus }}",
awToolTip: false,
ngClick: "showHostSummary($event, inventory.id)"
}]
}
}
],
fields: {
status: {
label: '',
columnClass: 'List-staticColumn--mediumStatus',
nosort: true,
ngClick: "null",
iconOnly: true,
excludeModal: true,
template: `<source-summary-popover inventory="inventory" ng-hide="inventory.pending_deletion" ng-if="inventory.kind === ''"></source-summary-popover><host-summary-popover inventory="inventory" ng-hide="inventory.pending_deletion" ng-class="{'HostSummaryPopover-noSourceSummary': inventory.kind !== ''}"></host-summary-popover>`,
icons: [{
icon: "{{ 'icon-cloud-' + inventory.syncStatus }}",
awToolTip: "{{ inventory.syncTip }}",
awTipPlacement: "right",
ngClick: "showSourceSummary($event, inventory.id)",
ngClass: "inventory.launch_class"
},{
icon: "{{ 'icon-job-' + inventory.hostsStatus }}",
awToolTip: false,
ngClick: "showHostSummary($event, inventory.id)",
ngClass: "inventory.host_status_class"
}]
},
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-4 col-sm-3 col-xs-6 List-staticColumnAdjacent',
columnClass: 'col-md-4 col-sm-4 col-xs-8',
modalColumnClass: 'col-md-12',
awToolTip: "{{ inventory.description | sanitize }}",
awTipPlacement: "top",
@ -55,7 +59,7 @@ export default ['i18n', function(i18n) {
kind: {
label: i18n._('Type'),
ngBind: 'inventory.kind_label',
columnClass: 'col-md-2 col-sm-2 hidden-xs'
columnClass: 'd-none d-sm-flex col-sm-2'
},
organization: {
label: i18n._('Organization'),
@ -64,7 +68,7 @@ export default ['i18n', function(i18n) {
sourceModel: 'organization',
sourceField: 'name',
excludeModal: true,
columnClass: 'col-md-3 col-sm-2 hidden-xs'
columnClass: 'd-none d-sm-flex col-md-3 col-sm-2'
}
},
@ -93,7 +97,7 @@ export default ['i18n', function(i18n) {
},
fieldActions: {
columnClass: 'col-md-2 col-sm-3 col-xs-4',
columnClass: 'col-md-3 col-sm-4 col-xs-4',
edit: {
label: i18n._('Edit'),
ngClick: 'editInventory(inventory)',

2
awx/ui/client/src/inventories-hosts/inventories/list/host-summary-popover/host-summary-popover.block.less
View File

@ -1,3 +1,3 @@
.HostSummaryPopover-noSourceSummary {
margin-left: 19px;
margin-left: 15px;
}

4
awx/ui/client/src/inventories-hosts/inventories/list/host-summary-popover/host-summary-popover.partial.html
View File

@ -1,3 +1,3 @@
<a href="" ng-click="showHostSummary($event, inventory.id)" ng-class="inventory.host_status_class" >
<a href="" ng-click="showHostSummary($event, inventory.id)" class="Inventories-hostStatus">
<i class="fa {{ 'icon-job-' + inventory.hostsStatus }}"></i>
</a>
</a>

1
awx/ui/client/src/inventories-hosts/inventories/list/inventory-list.controller.js
View File

@ -38,7 +38,6 @@ function InventoriesList($scope,
function processInventoryRow(inventory) {
inventory.launch_class = "";
inventory.host_status_class = "Inventories-hostStatus";
if (inventory.has_inventory_sources) {
inventory.copyTip = i18n._('Inventories with sources cannot be copied');

26
awx/ui/client/src/inventories-hosts/inventories/related/groups/groups.list.js
View File

@ -16,18 +16,24 @@
multiSelect: true,
trackBy: 'group.id',
basePath: 'api/v2/inventories/{{$stateParams.inventory_id}}/groups/',
layoutClass: 'List-staticColumnLayout--groups',
staticColumns: [
{
field: 'failed_hosts',
content: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + group.hosts_status_class }}",
columnClass: 'status-column'
}
}
],
fields: {
failed_hosts: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + group.hosts_status_class }}",
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
label: i18n._('Groups'),
key: true,

26
awx/ui/client/src/inventories-hosts/inventories/related/groups/related/nested-groups/group-nested-groups.list.js
View File

@ -16,18 +16,24 @@
multiSelect: true,
trackBy: 'nested_group.id',
basePath: 'api/v2/groups/{{$stateParams.group_id}}/children/',
layoutClass: 'List-staticColumnLayout--groups',
staticColumns: [
{
field: 'failed_hosts',
content: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ nested_group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + nested_group.hosts_status_class }}",
columnClass: 'status-column'
}
}
],
fields: {
failed_hosts: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ nested_group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + nested_group.hosts_status_class }}",
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
label: i18n._('Groups'),
key: true,

73
awx/ui/client/src/inventories-hosts/inventories/related/groups/related/nested-hosts/group-nested-hosts.list.js
View File

@ -18,40 +18,49 @@ export default ['i18n', function(i18n) {
multiSelect: true,
trackBy: 'nested_host.id',
basePath: 'api/v2/groups/{{$stateParams.group_id}}/all_hosts/',
layoutClass: 'List-staticColumnLayout--hostsWithCheckbox',
staticColumns: [
{
field: 'toggleHost',
content: {
ngDisabled: '!nested_host.summary_fields.user_capabilities.edit || nested_host.has_inventory_sources',
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleHost($event, nested_host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
}
},
{
field: 'active_failures',
content: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ nested_host.job_status_html }}",
dataTitle: "{{ nested_host.job_status_title }}",
awToolTip: "{{ nested_host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + nested_host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column List-staticColumn--smallStatus'
}
}
],
fields: {
toggleHost: {
ngDisabled: '!nested_host.summary_fields.user_capabilities.edit || nested_host.has_inventory_sources',
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleHost($event, nested_host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
},
active_failures: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ nested_host.job_status_html }}",
dataTitle: "{{ nested_host.job_status_title }}",
awToolTip: "{{ nested_host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + nested_host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
key: true,
label: i18n._('Hosts'),

2
awx/ui/client/src/inventories-hosts/inventories/related/hosts/related-groups-labels/relatedGroupsLabelsList.block.less
View File

@ -1,3 +1,5 @@
.RelatedGroupsLabelsCell{
width:100%;
display: flex;
align-items: center;
}

1
awx/ui/client/src/inventories-hosts/inventories/related/hosts/related-host.form.js
View File

@ -37,6 +37,7 @@ function(i18n) {
" set by the inventory sync process.") +
"</p>",
dataTitle: i18n._('Host Enabled'),
dataPlacement: "right",
ngDisabled: '!host.summary_fields.user_capabilities.edit || host.has_inventory_sources || isSmartInvHost'
}
},

78
awx/ui/client/src/inventories-hosts/inventories/related/hosts/related-host.list.js
View File

@ -17,46 +17,54 @@ export default ['i18n', function(i18n) {
multiSelect: true,
trackBy: 'host.id',
basePath: 'api/v2/inventories/{{$stateParams.inventory_id}}/hosts/',
layoutClass: 'List-staticColumnLayout--hostsWithCheckbox',
staticColumns: [
{
field: 'toggleHost',
content: {
ngDisabled: '!host.summary_fields.user_capabilities.edit || host.has_inventory_sources',
label: '',
type: "toggle",
ngClick: "toggleHost($event, host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
}
},
{
field: 'active_failures',
content: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ host.job_status_html }}",
dataTitle: "{{ host.job_status_title }}",
awToolTip: "{{ host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column'
}
}
],
fields: {
toggleHost: {
ngDisabled: '!host.summary_fields.user_capabilities.edit || host.has_inventory_sources',
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleHost($event, host)",
awToolTip: "<p>" +
i18n._("Indicates if a host is available and should be included in running jobs.") +
"</p><p>" +
i18n._("For hosts that are part of an external" +
" inventory, this flag cannot be changed. It will be" +
" set by the inventory sync process.") +
"</p>",
dataPlacement: "right",
nosort: true,
},
active_failures: {
label: '',
iconOnly: true,
nosort: true,
// do not remove this ng-click directive
// the list generator case to handle fields without ng-click
// cannot handle the aw-* directives
ngClick: 'noop()',
awPopOver: "{{ host.job_status_html }}",
dataTitle: "{{ host.job_status_title }}",
awToolTip: "{{ host.badgeToolTip }}",
dataPlacement: 'top',
icon: "{{ 'fa icon-job-' + host.active_failures }}",
id: 'active-failures-action',
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
key: true,
label: i18n._('Hosts'),
uiSref: ".edit({inventory_id: host.inventory_id,host_id: host.id})",
ngClass: "{ 'host-disabled-label': !host.enabled }",
columnClass: 'col-lg-6 col-md-8 col-sm-8 col-xs-7',
columnClass: 'col-lg-3 col-md-4 col-sm-8 col-xs-7',
dataHostId: "{{ host.id }}",
dataType: "host",
class: 'InventoryManage-breakWord'
@ -66,13 +74,13 @@ export default ['i18n', function(i18n) {
type: 'related_groups',
nosort: true,
showDelete: true,
columnClass: 'RelatedGroupsLabelsCell List-tableCell col-lg-2 col-md-3 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex List-tableCell col-lg-5 col-md-4'
}
},
fieldActions: {
columnClass: 'col-lg-6 col-md-4 col-sm-4 col-xs-5 text-right',
columnClass: 'col-sm-4 col-xs-5 text-right',
edit: {
ngClick: "editHost(host)",
icon: 'icon-edit',

26
awx/ui/client/src/inventories-hosts/inventories/related/hosts/related/nested-groups/host-nested-groups.list.js
View File

@ -16,18 +16,24 @@
multiSelect: true,
trackBy: 'nested_group.id',
basePath: 'api/v2/hosts/{{$stateParams.host_id}}/all_groups/',
layoutClass: 'List-staticColumnLayout--groups',
staticColumns: [
{
field: 'failed_hosts',
content: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ nested_group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + nested_group.hosts_status_class }}",
columnClass: 'status-column'
}
}
],
fields: {
failed_hosts: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
awToolTip: "{{ nested_group.hosts_status_tip }}",
dataPlacement: "top",
icon: "{{ 'fa icon-job-' + nested_group.hosts_status_class }}",
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
label: i18n._('Groups'),
key: true,

5
awx/ui/client/src/inventories-hosts/inventories/related/sources/sources.form.js
View File

@ -345,7 +345,6 @@ return {
label: i18n._('Update Options'),
type: 'checkbox_group',
ngShow: "source && (source.value !== '' && source.value !== null)",
class: 'Form-checkbox--stacked',
subForm: 'sourceSubForm',
fields: [{
name: 'overwrite',
@ -357,7 +356,6 @@ return {
dataTitle: i18n._('Overwrite'),
dataContainer: 'body',
dataPlacement: 'right',
labelClass: 'checkbox-options',
ngDisabled: "(!(inventory_source_obj.summary_fields.user_capabilities.edit || canAdd))"
}, {
name: 'overwrite_vars',
@ -369,7 +367,6 @@ return {
dataTitle: i18n._('Overwrite Variables'),
dataContainer: 'body',
dataPlacement: 'right',
labelClass: 'checkbox-options',
ngDisabled: "(!(inventory_source_obj.summary_fields.user_capabilities.edit || canAdd) || source.value === 'scm')"
}, {
name: 'update_on_launch',
@ -381,7 +378,6 @@ return {
dataTitle: i18n._('Update on Launch'),
dataContainer: 'body',
dataPlacement: 'right',
labelClass: 'checkbox-options',
ngDisabled: '!(inventory_source_obj.summary_fields.user_capabilities.edit || canAdd)'
}, {
name: 'update_on_project_update',
@ -394,7 +390,6 @@ return {
dataTitle: i18n._('Update on Project Update'),
dataContainer: 'body',
dataPlacement: 'right',
labelClass: 'checkbox-options',
ngDisabled: '!(inventory_source_obj.summary_fields.user_capabilities.edit || canAdd)'
}]
},

31
awx/ui/client/src/inventories-hosts/inventories/related/sources/sources.list.js
View File

@ -15,21 +15,26 @@
hover: true,
trackBy: 'inventory_source.id',
basePath: 'api/v2/inventories/{{$stateParams.inventory_id}}/inventory_sources/',
layoutClass: 'List-staticColumnLayout--statusOrCheckbox',
staticColumns: [
{
field: 'sync_status',
content: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
ngClick: 'viewUpdateStatus(inventory_source.id)',
awToolTip: "{{ inventory_source.status_tooltip }}",
dataTipWatch: "inventory_source.status_tooltip",
icon: "{{ 'fa icon-cloud-' + inventory_source.status_class }}",
ngClass: "inventory_source.status_class",
dataPlacement: "top",
}
}
],
fields: {
sync_status: {
label: '',
nosort: true,
mode: 'all',
iconOnly: true,
ngClick: 'viewUpdateStatus(inventory_source.id)',
awToolTip: "{{ inventory_source.status_tooltip }}",
dataTipWatch: "inventory_source.status_tooltip",
icon: "{{ 'fa icon-cloud-' + inventory_source.status_class }}",
ngClass: "inventory_source.status_class",
dataPlacement: "top",
columnClass: 'status-column List-staticColumn--smallStatus'
},
name: {
label: i18n._('Sources'),
key: true,

5
awx/ui/client/src/inventories-hosts/inventories/smart-inventory/smart-inventory-host-filter/host-filter-modal/host-filter-modal.directive.js
View File

@ -45,15 +45,18 @@ export default ['templateUrl', function(templateUrl) {
$scope.hosts = $scope.host_dataset.results;
let hostList = _.cloneDeep(HostsList);
delete hostList.staticColumns;
delete hostList.fields.toggleHost;
delete hostList.fields.active_failures;
delete hostList.fields.name.ngClick;
hostList.fields.name.class += " HostFilterModal-tableRow";
hostList.fields.name.columnClass = 'col-sm-6';
hostList.fields.name.noLink = true;
hostList.well = false;
delete hostList.fields.inventory.ngClick;
hostList.fields.inventory.columnClass = 'col-sm-6';
hostList.fields.inventory.ngBind = 'host.summary_fields.inventory.name';
hostList.emptyListText = 'You must have access to at least one host in order to create a smart inventory host filter';
hostList.layoutClass = 'List-defaultLayout';
let html = GenerateList.build({
list: hostList,
input_type: 'host-filter-modal-body',

2
awx/ui/client/src/inventories-hosts/inventories/smart-inventory/smart-inventory-host-filter/host-filter-modal/host-filter-modal.partial.html
View File

@ -13,7 +13,7 @@
</div>
<div class="modal-body" id="host-filter-modal-body"></div>
<div class="modal-footer">
<button type="button" ng-click="cancelForm()" class="Lookup-cancel btn btn-default" translate>CANCEL</button>
<button type="button" ng-click="cancelForm()" class="btn btn-default" translate>CANCEL</button>
<button type="button" ng-click="saveForm()" ng-disabled="!searchTags || searchTags.length === 0" class="Lookup-save btn btn-primary" translate>SAVE</button>
</div>
</div>

2
awx/ui/client/src/inventories-hosts/inventories/smart-inventory/smart-inventory-host-filter/smart-inventory-host-filter.partial.html
View File

@ -1,5 +1,5 @@
<div class="input-group Form-mixedInputGroup">
<span class="input-group-btn Form-variableHeightButtonGroup">
<span class="input-group-btn Form-variableHeightButtonGroup input-group-prepend">
<button type="button" class="Form-lookupButton Form-lookupButton--variableHeight btn btn-default" ng-click="openHostFilterModal()" ng-disabled="!hasEditPermissions || !organization">
<i class="fa fa-search"></i>
</button>

6
awx/ui/client/src/inventories-hosts/inventories/smart-inventory/smart-inventory.form.js
View File

@ -124,19 +124,19 @@ export default ['i18n', function(i18n) {
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-sm-3 col-xs-4'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4',
columnClass: 'col-sm-4 col-xs-4'
},
team_roles: {
label: i18n._('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4',
columnClass: 'col-sm-5 col-xs-4'
}
},
ngClick: "$state.go('inventories.editSmartInventory.permissions');"

6
awx/ui/client/src/inventories-hosts/inventories/standard-inventory/inventory.form.js
View File

@ -126,19 +126,19 @@ function(i18n) {
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-sm-3 col-xs-4'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4',
columnClass: 'col-sm-4 col-xs-4'
},
team_roles: {
label: i18n._('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4',
columnClass: 'col-sm-5 col-xs-4'
}
}
},

2
awx/ui/client/src/inventories-hosts/shared/associate-groups/associate-groups.partial.html
View File

@ -13,7 +13,7 @@
</div>
<div class="modal-body AssociateGroups-modalBody" id="associate-groups-list"></div>
<div class="modal-footer">
<button ng-click="closeModal()" class="Lookup-cancel btn btn-default" translate>CANCEL</button>
<button ng-click="closeModal()" class="btn btn-default" translate>CANCEL</button>
<button ng-click="linkGroups()" class="Lookup-save btn btn-primary" ng-disabled="!selectedItems || selectedItems.length === 0" translate>SAVE</button>
</div>
</div>

2
awx/ui/client/src/inventories-hosts/shared/associate-hosts/associate-hosts.partial.html
View File

@ -13,7 +13,7 @@
</div>
<div class="modal-body AssociateHosts-modalBody" id="associate-hosts-list"></div>
<div class="modal-footer">
<button ng-click="closeModal()" class="Lookup-cancel btn btn-default" translate>CANCEL</button>
<button ng-click="closeModal()" class="btn btn-default" translate>CANCEL</button>
<button ng-click="linkhosts()" class="Lookup-save btn btn-primary" ng-disabled="!selectedItems || selectedItems.length === 0" translate>SAVE</button>
</div>
</div>

6
awx/ui/client/src/inventory-scripts/inventory-scripts.list.js
View File

@ -18,7 +18,7 @@ export default ['i18n', function(i18n){
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-3 col-sm-9 col-xs-9',
columnClass: 'col-md-4 col-sm-9 col-xs-9',
modalColumnClass: 'col-md-8',
awToolTip: '{{inventory_script.description | sanitize}}',
dataPlacement: 'top'
@ -29,7 +29,7 @@ export default ['i18n', function(i18n){
sourceModel: 'organization',
sourceField: 'name',
excludeModal: true,
columnClass: 'col-md-3 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex col-md-4'
}
},
@ -46,7 +46,7 @@ export default ['i18n', function(i18n){
fieldActions: {
columnClass: 'col-md-2 col-sm-3 col-xs-3',
columnClass: 'col-md-4 col-sm-3 col-xs-3',
edit: {
ngClick: "editCustomInv(inventory_script.id)",

10
awx/ui/client/src/job-submission/job-submission.partial.html
View File

@ -104,7 +104,7 @@
<span class="Form-inputLabel" translate> Password</span>
</label>
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button type="button" class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-ssh-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-ssh-password')" data-container="job-launch-modal" data-original-title="" title="" translate>Show</button>
</span>
<input id="job-submission-ssh-password" type="password" ng-model="passwords.ssh_password" name="ssh_password" class="password-field form-control input-sm Form-textInput" required>
@ -118,7 +118,7 @@
<span class="Form-inputLabel" translate> Private Key Passphrase</span>
</label>
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button type="button" class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-ssh-key-unlock_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-ssh-key-unlock')" data-container="job-launch-modal" data-original-title="" title="" translate>Show</button>
</span>
<input id="job-submission-ssh-key-unlock" type="password" ng-model="passwords.ssh_key_unlock" name="ssh_key_unlock" class="password-field form-control input-sm Form-textInput" required>
@ -132,7 +132,7 @@
<span class="Form-inputLabel" translate> Privilege Escalation Password</span>
</label>
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button type="button" class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-become-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-become-password')" data-container="job-launch-modal" data-original-title="" title="" translate>Show</button>
</span>
<input id="job-submission-become-password" type="password" ng-model="passwords.become_password" name="become_password" class="password-field form-control input-sm Form-textInput" required>
@ -146,7 +146,7 @@
<span class="Form-inputLabel" translate> Vault Password</span>
</label>
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button type="button" class="btn btn-default show_input_button JobSubmission-passwordButton" id="job-submission-vault-password_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#job-submission-vault-password')" data-container="job-launch-modal" data-original-title="" title="" translate>Show</button>
</span>
<input id="job-submission-vault-password" type="password" ng-model="passwords.vault_password" name="vault_password" class="password-field form-control input-sm Form-textInput" required>
@ -295,7 +295,7 @@
</div>
<div ng-if="question.type === 'password'">
<div class="input-group">
<span class="input-group-btn">
<span class="input-group-btn input-group-prepend">
<button type="button" class="btn btn-default show_input_button JobSubmission-passwordButton" id="survey_question_{{$index}}_show_input_button" aw-tool-tip="Toggle the display of plaintext." aw-tip-placement="top" ng-click="togglePassword('#survey_question_' + $index)" data-original-title="" data-container="job-launch-modal" title="" translate>Show</button>
</span>
<input id="survey_question_{{$index}}" ng-if="!question.default" type="password" ng-model="question.model" name="survey_question_{{$index}}" ng-required="question.required" ng-minlength="question.minlength" ng-maxlength="question.maxlength" class="form-control Form-textInput" autocomplete="false">

4
awx/ui/client/src/license/license.partial.html
View File

@ -1,7 +1,7 @@
<div class="License-container"
ng-class="{'License-container--missing': licenseMissing}">
<div class="License-details" ng-hide="licenseMissing">
<div class="Panel">
<div class="card at-Panel">
<div class="List-titleText" translate>Details</div>
<div class="License-fields">
<div class="License-field">
@ -72,7 +72,7 @@
</div>
</div>
<div class="License-management" ng-class="{'License-management--missingLicense' : licenseMissing}">
<div class="Panel">
<div class="card at-Panel">
<div class="List-titleText">{{title}}</div>
<div class="License-body">
<div class="License-helperText" ng-if="licenseMissing" translate>Welcome to Ansible Tower! Please complete the steps below to acquire a license.</div>

1
awx/ui/client/src/login/loginModal/loginModal.block.less
View File

@ -148,6 +148,7 @@
transition: background-color 0.2s;
background-color: @submit-button-bg;
color: @submit-button-text;
font-size: 0.875rem;
}
.LoginModal-signInButton:hover,

4
awx/ui/client/src/management-jobs/card/card.partial.html
View File

@ -1,7 +1,7 @@
<div class="tab-pane" id="management-jobs-panel">
<div id="management-jobs-panel">
<aw-limit-panels max-panels="2" panel-container="management-jobs-panel"></aw-limit-panels>
<div ui-view></div>
<div class="tab-pane Panel" id="management_jobs">
<div class="card at-Panel" id="management_jobs">
<div class="List-title">
<div class="List-titleText" translate>
MANAGEMENT JOBS

2
awx/ui/client/src/management-jobs/notifications/notifications.partial.html
View File

@ -1,4 +1,4 @@
<div class="tab-pane" id="notifications">
<div ui-view></div>
<div ng-cloak id="htmlTemplate" class="Panel"></div>
<div ng-cloak id="htmlTemplate" class="card at-Panel"></div>
</div>

26
awx/ui/client/src/management-jobs/scheduler/schedulerForm.partial.html
View File

@ -1,4 +1,4 @@
<div id="htmlTemplate" class=" SchedulerFormPanel Panel" ng-hide="hideForm">
<div id="htmlTemplate" class="card at-Panel" ng-hide="hideForm">
<div class="Form-header">
<div class="Form-title" ng-show="!isEdit">{{ schedulerName || "ADD SCHEDULE"}}</div>
<div class="Form-title" ng-show="isEdit">{{ schedulerName || "EDIT SCHEDULE"}}</div>
@ -40,11 +40,10 @@
<span class="red-text">*</span>
<span translate>Start Date</span>
</label>
<div class="input-group Form-inputGroup SchedulerForm-inputGroup--date">
<scheduler-date-picker date="schedulerStartDt"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd)">
</scheduler-date-picker>
</div>
<scheduler-date-picker date="schedulerStartDt"
class="input-group Form-inputGroup SchedulerForm-inputGroup--date"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd)">
</scheduler-date-picker>
<div class="error"
ng-show="scheduler_form_schedulerStartDt_error"
ng-bind="scheduler_form_schedulerStartDt_error">
@ -508,11 +507,10 @@
<span class="red-text">*</span>
End Date
</label>
<div class="input-group Form-inputGroup SchedulerForm-inputGroup--date">
<scheduler-date-picker date="$parent.schedulerEndDt"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd)">
</scheduler-date-picker>
</div>
<scheduler-date-picker date="$parent.schedulerEndDt"
class="input-group Form-inputGroup SchedulerForm-inputGroup--date"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd)">
</scheduler-date-picker>
<div class="error"
ng-show="$parent.scheduler_endDt_error">
Please provide a valid date.
@ -553,8 +551,7 @@
class="SchedulerFormDetail-dateFormatsLabel">
Date format
</label>
<label class="radio-inline
SchedulerFormDetail-radioLabel">
<label class="radio-inline SchedulerFormDetail-radioLabel">
<input type="radio"
class="SchedulerFormDetail-radioButton"
ng-model="dateChoice"
@ -562,8 +559,7 @@
value="local" >
Local time
</label>
<label class="radio-inline
SchedulerFormDetail-radioLabel">
<label class="radio-inline SchedulerFormDetail-radioLabel">
<input type="radio"
class="SchedulerFormDetail-radioButton"
ng-model="dateChoice"

31
awx/ui/client/src/notifications/notificationTemplates.list.js
View File

@ -15,22 +15,27 @@ export default ['i18n', function(i18n){
iterator: 'notification_template',
index: false,
hover: false,
layoutClass: 'List-staticColumnLayout--statusOrCheckbox',
staticColumns: [
{
field: 'status',
content: {
label: '',
iconOnly: true,
nosort: true,
icon: 'icon-job-{{ notification_template.status }}',
awPopOver: '{{ notification_template.template_status_html }}',
dataTitle: i18n._("Recent Notifications"),
dataPlacement: 'right'
}
}
],
fields: {
status: {
label: '',
iconOnly: true,
nosort: true,
icon: 'icon-job-{{ notification_template.status }}',
awPopOver: '{{ notification_template.template_status_html }}',
dataTitle: i18n._("Recent Notifications"),
dataPlacement: 'right',
columnClass: 'col-lg-1 col-md-1 col-sm-2 col-xs-2 List-staticColumn--smallStatus'
},
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-3 col-sm-9 col-xs-9',
columnClass: 'col-md-4 col-sm-9 col-xs-9',
linkTo: '/#/notification_templates/{{notification_template.id}}',
awToolTip: '{{notification_template.description | sanitize}}',
dataPlacement: 'top'
@ -41,7 +46,7 @@ export default ['i18n', function(i18n){
searchType: 'select',
searchOptions: [],
excludeModal: true,
columnClass: 'col-md-4 hidden-sm hidden-xs'
columnClass: 'd-none d-md-flex col-md-4'
}
},
@ -58,7 +63,7 @@ export default ['i18n', function(i18n){
fieldActions: {
columnClass: 'col-md-2 col-sm-3 col-xs-3',
columnClass: 'col-md-4 col-sm-3 col-xs-3',
edit: {
ngClick: "editNotification(notification_template.id)",

9
awx/ui/client/src/notifications/notifications.block.less
View File

@ -26,10 +26,6 @@
display:block!important;
}
#notification_templates_table .name-column {
padding-left: 10px;
}
.notificationsList {
margin-top: 0;
}
@ -46,11 +42,8 @@
}
.close {
position: absolute;
right: 10px;
top: 5px;
color: white;
opacity: 1;
text-shadow: none;
}
}
}

9
awx/ui/client/src/notifications/notifications.list.js
View File

@ -25,7 +25,7 @@ export default ['i18n', 'templateUrl', function(i18n, templateUrl){
name: {
key: true,
label: i18n._('Name'),
columnClass: 'col-md-3 col-sm-9 col-xs-9',
columnClass: 'col-md-4 col-sm-9 col-xs-9',
linkTo: '/#/notification_templates/{{notification.id}}'
},
notification_type: {
@ -33,7 +33,7 @@ export default ['i18n', 'templateUrl', function(i18n, templateUrl){
searchType: 'select',
searchOptions: [],
excludeModal: true,
columnClass: 'col-md-4 hidden-sm hidden-xs'
columnClass: 'd-none d-sm-flex col-md-4 col-sm-3'
},
notification_templates_success: {
label: i18n._('Success'),
@ -44,11 +44,12 @@ export default ['i18n', 'templateUrl', function(i18n, templateUrl){
awToolTip: "{{ schedule.play_tip }}",
dataTipWatch: "schedule.play_tip",
dataPlacement: "right",
nosort: true
nosort: true,
columnClass: 'd-none d-md-flex justify-content-start col-md-2'
},
notification_templates_error: {
label: i18n._('Failure'),
columnClass: 'NotifierList-lastColumn',
columnClass: 'd-none d-md-flex justify-content-start col-md-2 NotifierList-lastColumn',
flag: 'notification_templates_error',
type: "toggle",
ngClick: "toggleNotification($event, notification.id, \"notification_templates_error\")",

4
awx/ui/client/src/organizations/linkout/addUsers/addUsers.controller.js
View File

@ -42,6 +42,10 @@ function($scope, $rootScope, ProcessErrors, GetBasePath, generateList,
list.name = 'add_users';
list.multiSelect = true;
list.fields.username.ngClick = 'linkoutUser(add_user.id)';
list.fields.username.columnClass = 'col-sm-4';
list.fields.first_name.columnClass = 'col-sm-4';
list.fields.last_name.columnClass = 'col-sm-4';
list.layoutClass = 'List-staticColumnLayout--statusOrCheckbox';
delete list.actions;
delete list.fieldActions;

3
awx/ui/client/src/organizations/linkout/addUsers/addUsers.partial.html
View File

@ -1,5 +1,4 @@
<div id="add-users-modal" class="AddUsers modal fade">
<div class="AddUsers-backDrop is-loggedOut"></div>
<div id="add-users-modal" class="AddUsers modal">
<div class="AddUsers-dialog">
<div class="AddUsers-content is-loggedOut">
<div class="AddUsers-header">

2
awx/ui/client/src/organizations/list/organizations-list.partial.html
View File

@ -1,6 +1,6 @@
<div ui-view="form"></div>
<div class="tab-pane" id="organizations">
<div ng-cloak id="htmlTemplate" class="Panel">
<div ng-cloak id="htmlTemplate" class="card at-Panel">
<div class="List-header">
<div class="List-title">
<div class="List-titleText" translate>

10
awx/ui/client/src/organizations/organizations.form.js
View File

@ -103,13 +103,13 @@ export default ['NotificationsList', 'i18n',
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-sm-6'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4'
columnClass: 'col-sm-6'
}
}
},
@ -142,19 +142,19 @@ export default ['NotificationsList', 'i18n',
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4',
columnClass: 'col-lg-4 col-md-4 col-sm-4 col-xs-4',
},
team_roles: {
label: i18n._('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4',
columnClass: 'col-lg-5 col-md-5 col-sm-5 col-xs-4',
}
}
},

2
awx/ui/client/src/organizations/organizations.list.js
View File

@ -21,7 +21,7 @@ export default [function() {
name: {
key: true,
label: 'Name',
columnClass: 'col-lg-4 col-md-6 col-sm-8 col-xs-8',
columnClass: 'col-sm-12',
awToolTip: '{{organization.description | sanitize}}',
dataPlacement: 'top'
},

6
awx/ui/client/src/projects/projects.form.js
View File

@ -264,19 +264,19 @@ export default ['i18n', 'NotificationsList', 'TemplateList',
key: true,
label: i18n._('User'),
linkBase: 'users',
class: 'col-lg-3 col-md-3 col-sm-3 col-xs-4'
columnClass: 'col-sm-3 col-xs-4'
},
role: {
label: i18n._('Role'),
type: 'role',
nosort: true,
class: 'col-lg-4 col-md-4 col-sm-4 col-xs-4',
columnClass: 'col-sm-4 col-xs-4',
},
team_roles: {
label: i18n._('Team Roles'),
type: 'team_roles',
nosort: true,
class: 'col-lg-5 col-md-5 col-sm-5 col-xs-4',
columnClass: 'col-sm-5 col-xs-4',
}
}
},

238
awx/ui/client/src/projects/projects.list.js
View File

@ -5,124 +5,130 @@
*************************************************/
export default ['i18n', function(i18n) {
return {
return {
name: 'projects',
iterator: 'project',
basePath: 'projects',
selectTitle: i18n._('Add Project'),
editTitle: i18n._('PROJECTS'),
listTitle: i18n._('PROJECTS'),
selectInstructions: '<p>Select existing projects by clicking each project or checking the related checkbox. When finished, click the blue ' +
'<em>Select</em> button, located bottom right.</p><p>Create a new project by clicking the <i class=\"fa fa-plus\"></i> button.</p>',
index: false,
hover: true,
emptyListText: i18n._('No Projects Have Been Created'),
name: 'projects',
iterator: 'project',
basePath: 'projects',
selectTitle: i18n._('Add Project'),
editTitle: i18n._('PROJECTS'),
listTitle: i18n._('PROJECTS'),
selectInstructions: '<p>Select existing projects by clicking each project or checking the related checkbox. When finished, click the blue ' +
'<em>Select</em> button, located bottom right.</p><p>Create a new project by clicking the <i class=\"fa fa-plus\"></i> button.</p>',
index: false,
hover: true,
emptyListText: i18n._('No Projects Have Been Created'),
layoutClass: 'List-staticColumnLayout--statusOrCheckbox',
staticColumns: [
{
field: 'status',
content: {
label: '',
iconOnly: true,
ngClick: 'showSCMStatus(project.id)',
awToolTip: '{{ project.statusTip }}',
dataTipWatch: 'project.statusTip',
dataPlacement: 'right',
icon: "icon-job-{{ project.statusIcon }}",
columnClass: "List-staticColumn--smallStatus",
nosort: true,
excludeModal: true
}
}
],
fields: {
status: {
label: '',
iconOnly: true,
ngClick: 'showSCMStatus(project.id)',
awToolTip: '{{ project.statusTip }}',
dataTipWatch: 'project.statusTip',
dataPlacement: 'right',
icon: "icon-job-{{ project.statusIcon }}",
columnClass: "List-staticColumn--smallStatus",
nosort: true,
excludeModal: true
},
name: {
key: true,
label: i18n._('Name'),
columnClass: "col-lg-4 col-md-4 col-sm-4 col-xs-7 List-staticColumnAdjacent",
modalColumnClass: 'col-md-8',
awToolTip: '{{project.description | sanitize}}',
dataPlacement: 'top'
},
scm_type: {
label: i18n._('Type'),
ngBind: 'project.type_label',
excludeModal: true,
columnClass: 'col-lg-2 col-md-2 col-sm-2 hidden-xs'
},
scm_revision: {
label: i18n._('Revision'),
excludeModal: true,
columnClass: 'List-tableCell col-lg-2 col-md-2 hidden-sm hidden-xs',
type: 'revision'
},
last_updated: {
label: i18n._('Last Updated'),
filter: "longDate",
columnClass: "col-lg-3 hidden-md hidden-sm hidden-xs",
excludeModal: true
}
},
fields: {
name: {
key: true,
label: i18n._('Name'),
columnClass: "col-md-3 col-sm-6 List-staticColumnAdjacent",
modalColumnClass: 'col-md-8',
awToolTip: '{{project.description | sanitize}}',
dataPlacement: 'top'
},
scm_type: {
label: i18n._('Type'),
ngBind: 'project.type_label',
excludeModal: true,
columnClass: 'col-md-2 col-sm-2'
},
scm_revision: {
label: i18n._('Revision'),
excludeModal: true,
columnClass: 'd-none d-md-flex col-md-2',
type: 'revision'
},
last_updated: {
label: i18n._('Last Updated'),
filter: "longDate",
columnClass: "d-none d-md-flex col-md-2",
excludeModal: true
}
},
actions: {
refresh: {
mode: 'all',
awToolTip: i18n._("Refresh the page"),
ngClick: "refresh()",
ngShow: "socketStatus === 'error'",
actionClass: 'btn List-buttonDefault',
buttonContent: i18n._('REFRESH')
},
add: {
mode: 'all', // One of: edit, select, all
ngClick: 'addProject()',
awToolTip: i18n._('Create a new project'),
actionClass: 'at-Button--add',
actionId: 'button-add',
ngShow: "canAdd"
}
},
actions: {
refresh: {
mode: 'all',
awToolTip: i18n._("Refresh the page"),
ngClick: "refresh()",
ngShow: "socketStatus === 'error'",
actionClass: 'btn List-buttonDefault',
buttonContent: i18n._('REFRESH')
},
add: {
mode: 'all', // One of: edit, select, all
ngClick: 'addProject()',
awToolTip: i18n._('Create a new project'),
actionClass: 'at-Button--add',
actionId: 'button-add',
ngShow: "canAdd"
}
},
fieldActions: {
fieldActions: {
columnClass: 'col-lg-4 col-md-3 col-sm-4 col-xs-5',
edit: {
ngClick: "editProject(project.id)",
awToolTip: i18n._('Edit the project'),
dataPlacement: 'top',
ngShow: "project.summary_fields.user_capabilities.edit"
},
scm_update: {
ngClick: 'SCMUpdate(project.id, $event)',
awToolTip: "{{ project.scm_update_tooltip }}",
dataTipWatch: "project.scm_update_tooltip",
ngClass: "project.scm_type_class",
dataPlacement: 'top',
ngShow: "project.summary_fields.user_capabilities.start"
},
copy: {
label: i18n._('Copy'),
ngClick: 'copyProject(project)',
"class": 'btn-danger btn-xs',
awToolTip: i18n._('Copy project'),
dataPlacement: 'top',
ngShow: 'project.summary_fields.user_capabilities.copy'
},
view: {
ngClick: "editProject(project.id)",
awToolTip: i18n._('View the project'),
dataPlacement: 'top',
ngShow: "!project.summary_fields.user_capabilities.edit",
icon: 'fa-eye',
},
"delete": {
ngClick: "deleteProject(project.id, project.name)",
awToolTip: i18n._('Delete the project'),
ngShow: "(project.status !== 'updating' && project.status !== 'running' && project.status !== 'pending' && project.status !== 'waiting') && project.summary_fields.user_capabilities.delete",
dataPlacement: 'top'
},
cancel: {
ngClick: "cancelUpdate(project)",
awToolTip: i18n._('Cancel the SCM update'),
ngShow: "(project.status == 'updating' || project.status == 'running' || project.status == 'pending' || project.status == 'waiting') && project.summary_fields.user_capabilities.start",
dataPlacement: 'top',
ngDisabled: "project.pending_cancellation || project.status == 'canceled'"
}
}
};}];
columnClass: 'col-md-3 col-sm-4',
edit: {
ngClick: "editProject(project.id)",
awToolTip: i18n._('Edit the project'),
dataPlacement: 'top',
ngShow: "project.summary_fields.user_capabilities.edit"
},
scm_update: {
ngClick: 'SCMUpdate(project.id, $event)',
awToolTip: "{{ project.scm_update_tooltip }}",
dataTipWatch: "project.scm_update_tooltip",
ngClass: "project.scm_type_class",
dataPlacement: 'top',
ngShow: "project.summary_fields.user_capabilities.start"
},
copy: {
label: i18n._('Copy'),
ngClick: 'copyProject(project)',
"class": 'btn-danger btn-xs',
awToolTip: i18n._('Copy project'),
dataPlacement: 'top',
ngShow: 'project.summary_fields.user_capabilities.copy'
},
view: {
ngClick: "editProject(project.id)",
awToolTip: i18n._('View the project'),
dataPlacement: 'top',
ngShow: "!project.summary_fields.user_capabilities.edit",
icon: 'fa-eye',
},
"delete": {
ngClick: "deleteProject(project.id, project.name)",
awToolTip: i18n._('Delete the project'),
ngShow: "(project.status !== 'updating' && project.status !== 'running' && project.status !== 'pending' && project.status !== 'waiting') && project.summary_fields.user_capabilities.delete",
dataPlacement: 'top'
},
cancel: {
ngClick: "cancelUpdate(project)",
awToolTip: i18n._('Cancel the SCM update'),
ngShow: "(project.status == 'updating' || project.status == 'running' || project.status == 'pending' || project.status == 'waiting') && project.summary_fields.user_capabilities.start",
dataPlacement: 'top',
ngDisabled: "project.pending_cancellation || project.status == 'canceled'"
}
}
};}];

9
awx/ui/client/src/scheduler/scheduleToggle.block.less
View File

@ -13,7 +13,6 @@
border-radius: 5px;
border: 1px solid @default-link;
background-color: @default-link;
margin-top: 2px;
cursor: pointer;
display: flex;
justify-content: flex-end;
@ -75,3 +74,11 @@
.ScheduleToggle-switch.is-on:hover {
background-color: @default-link-hov;
}
.ScheduleToggle-listTableCell {
display: flex;
align-items: center;
height: 100%;
justify-content: flex-end;
padding-right: 0px;
}

35
awx/ui/client/src/scheduler/scheduled-jobs.list.js
View File

@ -14,22 +14,27 @@ export default ['i18n', function(i18n) {
listTitle: i18n._('SCHEDULED JOBS'),
hover: true,
emptyListText: i18n._('No schedules exist'),
layoutClass: 'List-staticColumnLayout--toggleOnOff',
staticColumns: [
{
field: 'enabled',
content: {
label: '',
type: 'toggle',
ngClick: "toggleSchedule($event, schedule.id)",
nosort: true,
awToolTip: "{{ schedule.play_tip }}",
ngDisabled: "!schedule.summary_fields.user_capabilities.edit",
dataTipWatch: "schedule.play_tip",
dataPlacement: 'top'
}
}
],
fields: {
enabled: {
label: '',
columnClass: 'List-staticColumn--toggle',
type: 'toggle',
ngClick: "toggleSchedule($event, schedule.id)",
nosort: true,
awToolTip: "{{ schedule.play_tip }}",
ngDisabled: "!schedule.summary_fields.user_capabilities.edit",
dataTipWatch: "schedule.play_tip",
dataPlacement: 'top'
},
name: {
label: i18n._('Name'),
columnClass: 'col-lg-4 col-md-5 col-sm-5 col-xs-7 List-staticColumnAdjacent',
columnClass: 'col-xl-4 col-lg-5 col-md-5 col-sm-7 List-staticColumnAdjacent',
sourceModel: 'unified_job_template',
sourceField: 'name',
// ngBind: 'schedule.summary_fields.unified_job_template.name',
@ -41,7 +46,7 @@ export default ['i18n', function(i18n) {
type: {
label: i18n._('Type'),
noLink: true,
columnClass: "col-lg-2 col-md-2 hidden-sm hidden-xs",
columnClass: "d-none d-md-flex col-md-2",
sourceModel: 'unified_job_template',
sourceField: 'unified_job_type',
ngBind: 'schedule.type_label',
@ -50,7 +55,7 @@ export default ['i18n', function(i18n) {
next_run: {
label: i18n._('Next Run'),
noLink: true,
columnClass: "col-lg-3 col-md-2 col-sm-3 hidden-xs",
columnClass: "d-none d-md-flex col-xl-3 col-lg-2 col-md-3",
filter: "longDate",
key: true
}
@ -60,7 +65,7 @@ export default ['i18n', function(i18n) {
fieldActions: {
columnClass: 'col-lg-3 col-md-3 col-sm-3 col-xs-5',
columnClass: 'col-xl-3 col-lg-3 col-md-4 col-sm-5',
"edit": {
mode: "all",
ngClick: "editSchedule(schedule)",

2
awx/ui/client/src/scheduler/scheduler.partial.html
View File

@ -1,4 +1,4 @@
<div ui-view></div>
<div class="Panel">
<div class="card at-Panel">
<div id="schedule-list-target"></div>
</div>

26
awx/ui/client/src/scheduler/schedulerForm.partial.html
View File

@ -1,4 +1,4 @@
<div id="htmlTemplate" class=" SchedulerFormPanel Panel" ng-hide="hideForm">
<div id="htmlTemplate" class="card at-Panel" ng-hide="hideForm">
<div class="Form-header">
<div class="Form-title" ng-show="!isEdit">{{ schedulerName || strings.get('state.CREATE_SCHEDULE') }}</div>
<div class="Form-title" ng-show="isEdit">{{ schedulerName || strings.get('state.EDIT_SCHEDULE') }}</div>
@ -40,11 +40,10 @@
<span class="red-text">*</span>
{{ strings.get('form.START_DATE') }}
</label>
<div class="input-group Form-inputGroup SchedulerForm-inputGroup--date">
<scheduler-date-picker date="schedulerStartDt"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd) || credentialRequiresPassword">
</scheduler-date-picker>
</div>
<scheduler-date-picker date="schedulerStartDt"
class="input-group Form-inputGroup SchedulerForm-inputGroup--date"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd) || credentialRequiresPassword">
</scheduler-date-picker>
<div class="error"
ng-show="scheduler_form_schedulerStartDt_error"
ng-bind="scheduler_form_schedulerStartDt_error">
@ -490,11 +489,10 @@
<span class="red-text">*</span>
{{ strings.get('form.END_DATE') }}
</label>
<div class="input-group Form-inputGroup SchedulerForm-inputGroup--date">
<scheduler-date-picker date="$parent.schedulerEndDt"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd) || credentialRequiresPassword">
</scheduler-date-picker>
</div>
<scheduler-date-picker date="$parent.schedulerEndDt"
class="input-group Form-inputGroup SchedulerForm-inputGroup--date"
disabled="!(schedule_obj.summary_fields.user_capabilities.edit || canAdd) || credentialRequiresPassword">
</scheduler-date-picker>
<div class="error"
ng-show="$parent.scheduler_endDt_error">
{{ strings.get('form.PROVIDE_VALID_DATE') }}
@ -600,8 +598,7 @@
class="SchedulerFormDetail-dateFormatsLabel">
{{ strings.get('form.DATE_FORMAT') }}
</label>
<label class="radio-inline
SchedulerFormDetail-radioLabel">
<label class="SchedulerFormDetail-radioLabel">
<input type="radio"
class="SchedulerFormDetail-radioButton"
ng-model="dateChoice"
@ -609,8 +606,7 @@
value="local" >
{{ strings.get('form.LOCAL_TIME_ZONE') }}
</label>
<label class="radio-inline
SchedulerFormDetail-radioLabel">
<label class="SchedulerFormDetail-radioLabel">
<input type="radio"
class="SchedulerFormDetail-radioButton"
ng-model="dateChoice"

7
awx/ui/client/src/scheduler/schedulerFormDetail.block.less
View File

@ -52,12 +52,17 @@
.SchedulerFormDetail-dateFormatsLabel {
font-weight: normal;
margin-right: 5px;
}
.SchedulerFormDetail-radioLabel {
margin-top: -3px !important;
color: @default-data-txt !important;
font-weight: normal;
margin-left: 5px;
}
.SchedulerFormDetail-dateFormats label:last-of-type {
margin-left: 10px;
}
.SchedulerFormDetail-radioButton {

56
awx/ui/client/src/scheduler/schedules.list.js
View File

@ -14,48 +14,55 @@ export default ['i18n', function(i18n) {
listTitle: '{{parentObject | sanitize}} || SCHEDULES',
index: false,
hover: true,
layoutClass: 'List-staticColumnLayout--schedules',
staticColumns: [
{
field: 'invalid',
content: {
label: '',
type: 'invalid',
nosort: true,
awToolTip: i18n._("Resources are missing from this template."),
dataPlacement: 'right',
ngShow: '!isValid(schedule)'
}
},
{
field: 'toggleSchedule',
content: {
ngDisabled: "!schedule.summary_fields.user_capabilities.edit || credentialRequiresPassword",
label: '',
type: "toggle",
ngClick: "toggleSchedule($event, schedule.id)",
awToolTip: "{{ schedule.play_tip }}",
dataTipWatch: "schedule.play_tip",
dataPlacement: "right",
nosort: true,
}
}
],
fields: {
invalid: {
columnClass: "List-staticColumn--invalidBar",
label: '',
type: 'invalid',
nosort: true,
awToolTip: i18n._("Resources are missing from this template."),
dataPlacement: 'right',
ngShow: '!isValid(schedule)'
},
toggleSchedule: {
ngDisabled: "!schedule.summary_fields.user_capabilities.edit || credentialRequiresPassword",
label: '',
columnClass: 'List-staticColumn--toggle',
type: "toggle",
ngClick: "toggleSchedule($event, schedule.id)",
awToolTip: "{{ schedule.play_tip }}",
dataTipWatch: "schedule.play_tip",
dataPlacement: "right",
nosort: true,
},
name: {
key: true,
label: i18n._('Name'),
uiSref: "{{schedule.linkToDetails}}",
columnClass: "col-md-3 col-sm-3 col-xs-6"
columnClass: "col-sm-3 col-xs-6"
},
dtstart: {
label: i18n._('First Run'),
filter: "longDate",
columnClass: "List-staticColumn--schedulerTime hidden-sm hidden-xs"
columnClass: "d-none d-sm-flex col-sm-2"
},
next_run: {
label: i18n._('Next Run'),
filter: "longDate",
columnClass: "List-staticColumn--schedulerTime hidden-xs"
columnClass: "d-none d-sm-flex col-sm-2"
},
dtend: {
label: i18n._('Final Run'),
filter: "longDate",
columnClass: "List-staticColumn--schedulerTime hidden-xs"
columnClass: "d-none d-sm-flex col-sm-2"
},
},
@ -81,6 +88,7 @@ export default ['i18n', function(i18n) {
},
fieldActions: {
columnClass: 'col-sm-3 col-xs-6',
edit: {
label: i18n._('Edit'),
ngClick: "editSchedule(schedule)",

21
awx/ui/client/src/shared/bootstrap-settings.less vendored
View File

@ -1,21 +0,0 @@
.btn-success{
background: @default-succ;
border-color: transparent;
:hover{
background: @default-succ-hov;
}
:disabled{
background: @default-succ-disabled;
}
}
.btn-default{
background: @btn-bg;
border-color: @btn-bord;
color: @btn-txt;
:hover{
background: @btn-bg-hov;
}
:focus{
background: @btn-bg-sel;
}
}

4
awx/ui/client/src/shared/column-sort/column-sort.partial.html
View File

@ -1,4 +1,4 @@
<th id="{{columnIterator}}-{{columnField}}-header" class="List-tableHeader list-header {{columnCustomClass}}" ng-click="columnNoSort !== 'true' && toggleColumnOrderBy()" ng-class="{'list-header-noSort' : columnNoSort === 'true'}" >
<div id="{{columnIterator}}-{{columnField}}-header" class="List-tableHeader list-header {{columnCustomClass}}" ng-click="columnNoSort !== 'true' && toggleColumnOrderBy()" ng-class="{'list-header-noSort' : columnNoSort === 'true'}" >
{{columnLabel | translate}}
<i ng-if="columnNoSort !== 'true'" class="fa columnSortIcon" ng-class="orderByIcon()">
</th>
</div>

21
awx/ui/client/src/shared/directives.js
View File

@ -100,10 +100,12 @@ function(SettingsUtils, i18n, $rootScope) {
},
template: `
<div class="input-group">
<label class="input-group-addon Form-filePicker--pickerButton" id="filePickerButton" for="filePicker" ng-click="update($event)">${browseText}</label>
<input type="text" class="form-control Form-filePicker--textBox" id="filePickerText" placeholder="${placeholderText}" readonly>
<input type="file" name="file" class="Form-filePicker" id="filePicker" onchange="angular.element(this).scope().fileChange(this.files)"/>
</div>
<span class="input-group-btn input-group-prepend">
<label class="btn Form-browseButton" id="filePickerButton" for="filePicker" ng-click="update($event)">${browseText}</label>
</span>
<input type="text" class="form-control Form-filePicker--textBox" id="filePickerText" placeholder="${placeholderText}" readonly>
<input type="file" name="file" class="Form-filePicker" id="filePicker" onchange="angular.element(this).scope().fileChange(this.files)"/>
</div>
<div ng-if="imagePresent" class="Form-filePicker--selectedFile">
${uploadedText}
@ -795,7 +797,7 @@ function(SettingsUtils, i18n, $rootScope) {
let tooltipInnerClass = (attrs.tooltipInnerClass || attrs.tooltipinnerclass) ? (attrs.tooltipInnerClass || attrs.tooltipinnerclass) : '';
let tooltipOuterClass = attrs.tooltipOuterClass ? attrs.tooltipOuterClass : '';
template = '<div class="tooltip Tooltip ' + tooltipOuterClass + '" role="tooltip"><div class="tooltip-arrow Tooltip-arrow"></div><div class="tooltip-inner Tooltip-inner ' + tooltipInnerClass + '"></div></div>';
template = '<div class="tooltip Tooltip ' + tooltipOuterClass + '" role="tooltip"><div class="tooltip-arrow Tooltip-arrow arrow"></div><div class="tooltip-inner Tooltip-inner ' + tooltipInnerClass + '"></div></div>';
// This block helps clean up tooltips that may get orphaned by a click event
$(element).on('mouseenter', function(event) {
@ -836,7 +838,8 @@ function(SettingsUtils, i18n, $rootScope) {
title: attrs.awToolTip,
container: container,
trigger: 'hover',
template: template
template: template,
boundary: 'window'
});
if (attrs.tipWatch) {
@ -844,7 +847,7 @@ function(SettingsUtils, i18n, $rootScope) {
scope.$watch(attrs.tipWatch, function(newVal) {
// Where did fixTitle come from?:
// http://stackoverflow.com/questions/9501921/change-twitter-bootstrap-tooltip-content-on-click
$(element).tooltip('hide').attr('data-original-title', newVal).tooltip('fixTitle');
$(element).tooltip('hide').attr('data-original-title', newVal).tooltip('_fixTitle');
});
}
}
@ -866,11 +869,11 @@ function(SettingsUtils, i18n, $rootScope) {
title = (attrs.overTitle) ? attrs.overTitle : (attrs.popoverTitle) ? attrs.popoverTitle : 'Help',
container = (attrs.container !== undefined) ? attrs.container : false,
trigger = (attrs.trigger !== undefined) ? attrs.trigger : 'manual',
template = '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
template = '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-header"></h3><div class="popover-body"></div></div>',
id_to_close = "";
if (element[0].id) {
template = '<div id="' + element[0].id + '_popover_container" class="popover" role="tooltip"><div class="arrow"></div><h3 id="' + element[0].id + '_popover_title" class="popover-title" translate></h3><div id="' + element[0].id + '_popover_content" class="popover-content" translate></div></div>';
template = '<div id="' + element[0].id + '_popover_container" class="popover" role="tooltip"><div class="arrow"></div><h3 id="' + element[0].id + '_popover_title" class="popover-header" translate></h3><div id="' + element[0].id + '_popover_content" class="popover-body" translate></div></div>';
}
scope.triggerPopover = function(e) {

137
awx/ui/client/src/shared/form-generator.js
View File

@ -141,10 +141,10 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
.factory('GenerateForm', ['$rootScope', '$compile', 'generateList',
'Attr', 'Icon', 'Column',
'NavigationLink', 'HelpCollapse', 'Empty', 'SelectIcon',
'NavigationLink', 'Empty', 'SelectIcon',
'ActionButton', 'MessageBar', '$log', 'i18n',
function ($rootScope, $compile, GenerateList,
Attr, Icon, Column, NavigationLink, HelpCollapse,
Attr, Icon, Column, NavigationLink,
Empty, SelectIcon, ActionButton, MessageBar, $log, i18n) {
return {
@ -163,7 +163,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
},
// Not a very good way to do this
// Form sub-states expect to target ui-views related@stateName & modal@stateName
// Also wraps mess of generated HTML in a .Panel
// Also wraps mess of generated HTML in a .card and at-Panel
wrapPanel(html, ignorePanel){
if(ignorePanel) {
return `
@ -176,7 +176,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
else {
return `
${MessageBar(this.form)}
<div class="Panel">
<div class="card at-Panel">
${html}
<div ui-view="related"></div>
<div ui-view="modal"></div>
@ -508,22 +508,6 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
navigationLink: NavigationLink,
buildHelpCollapse: function (collapse_array) {
var html = '',
params = {}, i;
for (i = 0; i < collapse_array.length; i++) {
params.hdr = collapse_array[i].hdr;
params.content = collapse_array[i].content;
params.idx = this.accordion_count++;
params.show = (collapse_array[i].show) ? collapse_array[i].show : null;
params.ngHide = (collapse_array[i].ngHide) ? collapse_array[i].ngHide : null;
params.bind = (collapse_array[i].ngBind) ? collapse_array[i].ngBind : null;
html += HelpCollapse(params);
}
return html;
},
buildHeaderField: function(key, field, options, form){
var html = '';
// extend these blocks to include elements similarly buildField()
@ -594,43 +578,30 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
return html;
}
function buildCheckbox(form, field, fld, idx, includeLabel) {
var html = '',
label = (includeLabel !== undefined && includeLabel === false) ? false : true;
if (label) {
html += "<span class=\"Form-checkboxRow\">";
html += "<label class=\"";
html += (field.inline === undefined || field.inline === true) ? "checkbox-inline" : "";
html += (field.labelClass) ? " " + field.labelClass : "";
html += "\"";
html += (field.ngShow) ? " ng-show=\"" +field.ngShow + "\" " : "";
html += ">";
}
function buildCheckbox(form, field, fld, idx) {
var html = '';
html += "<div class=\"form-check\" ";
html += (field.ngShow) ? " ng-show=\"" +field.ngShow + "\" " : "";
html += ">";
html += "<label class=\"form-check-label\">";
html += "<input type=\"checkbox\" ";
html += Attr(field, 'type');
html += "ng-model=\"" + fld + '" ';
html += "name=\"" + fld + '" ';
html += (field.ngChange) ? Attr(field, 'ngChange') : "";
html += "id=\"" + form.name + "_" + fld + "_chbox\" ";
html += "id=\"" + form.name + "_" + fld + "_chbox";
html += (idx !== undefined) ? "_" + idx : "";
html += "class=\"";
html += "\"";
html += "\" class=\"form-check-input\"";
html += (field.trueValue !== undefined) ? Attr(field, 'trueValue') : "";
html += (field.falseValue !== undefined) ? Attr(field, 'falseValue') : "";
html += (field.checked) ? "checked " : "";
html += (field.readonly) ? "disabled " : "";
html += (field.ngChange) ? "ng-change=\"" +field.ngChange + "\" " : "";
html += (field.ngDisabled) ? "ng-disabled=\"" + field.ngDisabled + "\" " : "";
html += " > ";
if (label) {
html += field.label + " ";
html += (field.awPopOver) ? Attr(field, 'awPopOver', fld) : "";
html += "</label>\n";
html += "</span>";
}
html += `><span class="Form-inputLabel">${field.label}</span></label>`;
html += (field.awPopOver) ? Attr(field, 'awPopOver', fld) : "";
html += `</div>`;
return html;
}
@ -843,7 +814,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
}
if (field.genHash) {
html += "<span class=\"input-group-btn\"><button type=\"button\" class=\"btn Form-lookupButton\" ng-click=\"genHash('" + fld + "')\" " +
html += "<span class=\"input-group-btn input-group-prepend\"><button type=\"button\" class=\"btn Form-lookupButton\" ng-click=\"genHash('" + fld + "')\" " +
"aw-tool-tip=\"Generate " + field.label + "\" data-placement=\"top\" id=\"" + this.form.name + "_" + fld + "_gen_btn\">" +
"<i class=\"fa fa-magic\"></i></button></span>\n</div>\n";
}
@ -872,9 +843,6 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += "<div class=\"error api-error\" id=\"" + this.form.name + "-" + fld + "-api-error\" ng-bind=\"" + fld + "_api_error\"></div>\n";
// Add help panel(s)
html += (field.helpCollapse) ? this.buildHelpCollapse(field.helpCollapse) : '';
html += "</div>\n";
}
@ -890,7 +858,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += (horizontal) ? " " + getFieldWidth() : "";
html += "'>\n";
// TODO: make it so that the button won't show up if the mode is edit, hasShowInputButton !== true, and there are no contents in the field.
html += "<span class='input-group-btn'>\n";
html += "<span class='input-group-btn input-group-prepend'>\n";
html += "<button aw-password-toggle type='button' class='btn btn-default show_input_button Form-passwordButton' ";
html += buildId(field, fld + "_show_input_button", this.form);
html += `aw-tool-tip='${tooltip}'} aw-tip-placement='top'`;
@ -966,9 +934,6 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
}
html += "<div class='error api-error' id='" + this.form.name + "-" + fld + "-api-error' ng-bind='" + fld + "_api_error'>\n</div>\n";
// Add help panel(s)
html += (field.helpCollapse) ? this.buildHelpCollapse(field.helpCollapse) : '';
}
//textarea fields
@ -1104,10 +1069,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += `<div class="error" id="${field.onError.id}" ng-show="${field.onError.ngShow}">${field.onError.text}</div>`;
}
html += "<div class=\"error api-error\" id=\"" + this.form.name + "-" + fld + "-api-error\" ng-bind=\"" + fld + "_api_error\"></div>\n";
// Add help panel(s)
html += (field.helpCollapse) ? this.buildHelpCollapse(field.helpCollapse) : '';
html += "</div>\n";
}
@ -1228,17 +1190,8 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
}
html += "<div class=\"checkbox\">\n";
html += "<label>";
html += buildCheckbox(this.form, field, fld, undefined, false);
html += (field.icon) ? Icon(field.icon) : "";
if (field.labelBind) {
html += "\t\t<span class=\"Form-inputLabel\" ng-bind=\"" + field.labelBind + "\" translate>\n\t\t</span>";
} else {
html += "<span class=\"Form-inputLabel\" translate>" + field.label + "</span>";
}
html += (field.awPopOver) ? this.attr(field, 'awPopOver', fld) : "";
html += "</label>\n";
html += "<div class=\"error api-error\" id=\"" + this.form.name + "-" + fld + "-api-error\" ng-bind=\"" +
fld + "_api_error\"></div>\n";
html += "</div><!-- checkbox -->\n";
@ -1246,8 +1199,6 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
if (horizontal) {
html += "</div>\n";
}
html += (field.helpCollapse) ? this.buildHelpCollapse(field.helpCollapse) : '';
}
//radio group
@ -1261,7 +1212,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += ">\n";
for (i = 0; i < field.options.length; i++) {
html += "<label class=\"radio-inline ";
html += "<label class=\"";
html += (field.options[i].labelClass) ? ` ${field.options[i].labelClass} "` : "\"";
html += (field.options[i].ngShow) ? this.attr(field.options[i], 'ngShow') : "";
html += ">";
@ -1292,9 +1243,6 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += "<div class=\"error api-error\" id=\"" + this.form.name + "-" + fld + "-api-error\" ng-bind=\"" +
fld + "_api_error\"></div>\n";
// Add help panel(s)
html += (field.helpCollapse) ? this.buildHelpCollapse(field.helpCollapse) : '';
html += "</div>\n";
}
@ -1354,7 +1302,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += ">\n";
html += `<div class="input-group Form-mixedInputGroup">`;
html += "<span class=\"input-group-btn\">\n";
html += "<span class=\"input-group-btn input-group-prepend\">\n";
html += `<button type="button" class="Form-lookupButton btn" ng-click="${field.ngClick || defaultLookupNgClick}"
${field.readonly || field.showonly}
${this.attr(field, "ngDisabled")}
@ -1917,13 +1865,11 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += `
<div class="list-wrapper"
ng-show="${collection.iterator}s.length > 0 && !is_superuser">
<table id="${itm}_table" class="${collection.iterator} List-table">
<thead>
<tr class="List-tableHeaderRow">
<div id="${itm}_table" class="${collection.iterator} List-table">
<div class="d-flex List-tableHeaderRow">
`;
html += (collection.index === undefined || collection.index !== false) ? "<th class=\"col-xs-1\">#</th>\n" : "";
for (fld in collection.fields) {
html += `<th class="List-tableHeader list-header ${collection.fields[fld].columnClass}"
html += `<div class="List-tableHeader list-header ${collection.fields[fld].columnClass}"
id="${collection.iterator}-${fld}-header"
base-path="${collection.basePath}"
collection="${collection.name}"
@ -1934,22 +1880,20 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
column-no-sort="${collection.fields[fld].nosort}"
column-label="${collection.fields[fld].label}">
${collection.fields[fld].label}
</th>`;
</div>`;
}
if (collection.fieldActions) {
html += "<th class=\"List-tableHeader List-tableHeader--actions\">Actions</th>\n";
html += `<div class="List-tableHeader List-tableHeader--actions ${collection.fieldActions.columnClass}">Actions</div>`;
}
html += "</tr>\n";
html += "</thead>";
html += "<tbody>\n";
html += "</div>";
html += "<tr class=\"List-tableRow\" ng-repeat=\"" + collection.iterator + " in " + itm + "\" ";
html += "<div class=\"d-flex List-tableRow\" ng-repeat=\"" + collection.iterator + " in " + itm + "\" ";
html += "id=\"{{ " + collection.iterator + ".id }}\">\n";
if (collection.index === undefined || collection.index !== false) {
html += "<td class=\"List-tableCell";
html += "<div class=\"List-tableCell";
html += (collection.fields[fld].class) ? collection.fields[fld].class : "";
html += "\">{{ $index + ((" + collection.iterator + "_page - 1) * " +
collection.iterator + "_page_size) + 1 }}.</td>\n";
collection.iterator + "_page_size) + 1 }}.</div>\n";
}
cnt = 1;
base = (collection.base) ? collection.base : itm;
@ -1968,7 +1912,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
// Row level actions
if (collection.fieldActions) {
html += "<td class=\"List-actionsContainer\"><div class=\"List-tableCell List-actionButtonCell actions\">";
html += `<div class="List-actionsContainer ${collection.fieldActions.columnClass}"><div class="List-tableCell List-actionButtonCell actions">`;
for (act in collection.fieldActions) {
if (act !== 'columnClass') {
fAction = collection.fieldActions[act];
@ -1996,18 +1940,17 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
html += "</button>";
}
}
html += "</div></td>";
html += "</tr>\n";
html += "</div></div>";
html += "</div>\n";
}
// Message for loading
html += "<tr ng-show=\"" + collection.iterator + "Loading == true\">\n";
html += "<td colspan=\"" + cnt + "\"><div class=\"loading-info\">" + i18n._("Loading...") + "</div></td>\n";
html += "</tr>\n";
html += "<div ng-show=\"" + collection.iterator + "Loading == true\">\n";
html += "<div colspan=\"" + cnt + "\"><div class=\"loading-info\">" + i18n._("Loading...") + "</div></div>\n";
html += "</div>\n";
// End List
html += "</tbody>\n";
html += "</table>\n";
html += "</div>\n";
//html += "</div>\n"; // close well
html += "</div>\n"; // close list-wrapper div
@ -2029,10 +1972,12 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
let ngShow = options.ngShow ? `ng-show="${options.ngShow}"` : '';
return `
<label class="checkbox-inline Form-checkbox Form-checkbox--subCheckbox" ${ngShow}>
<input type="checkbox" id="${options.id}" ${ngModel} ${ngChange} ${ngDisabled} />
${options.text}
</label> `;
<div class="form-check Form-checkbox Form-checkbox--subCheckbox">
<label class="form-check-label" ${ngShow}>
<input class="form-check-input" type="checkbox" id="${options.id}" ${ngModel} ${ngChange} ${ngDisabled} />
${options.text}
</label>
</div>`;
}
}

94
awx/ui/client/src/shared/generator-helpers.js
View File

@ -471,65 +471,55 @@ angular.module('GeneratorHelpers', [systemStatus.name])
fld = params.fld,
options = params.options,
base = params.base,
field = list.fields[fld],
html = '',
classList;
field = params.field ? params.field : list.fields[fld],
html = '';
field.columnClass = field.columnClass ? "List-tableCell " + field.columnClass : "List-tableCell";
const classList = Attr(field, 'columnClass');
if (field.type !== undefined && field.type === 'DropDown') {
html = DropDown(params);
} else if (field.type === 'role') {
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<role-list delete-target=\"${list.iterator}\" class=\"RoleList\">
</role-list>
</td>
</div>
`;
} else if (field.type === 'team_roles') {
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<role-list delete-target=\"${list.iterator}\" class=\"RoleList\" team-role-list="true">
</role-list>
</td>
</div>
`;
} else if (field.type === 'labels') {
let showDelete = field.showDelete === undefined ? true : field.showDelete;
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<labels-list class=\"LabelList\" show-delete="${showDelete}">
</labels-list>
</td>
</div>
`;
} else if (field.type === 'related_groups') {
let showDelete = field.showDelete === undefined ? true : field.showDelete;
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<related-groups-labels-list class=\"LabelList\" show-delete="${showDelete}">
</related-groups-labels-list>
</td>
</div>
`;
} else if (field.type === 'owners') {
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<owner-list></owner-list>
</td>
</div>
`;
} else if (field.type === 'revision') {
classList = (field.columnClass) ?
Attr(field, 'columnClass') : "";
html += `
<td ${classList}>
<div ${classList}>
<at-truncate ng-if="project.scm_revision" string="{{project.scm_revision}}" maxLength="7"></at-truncate>
</td>`;
</div>`;
} else if (field.type === 'badgeCount') {
html = BadgeCount(params);
} else if (field.type === 'badgeOnly') {
@ -537,7 +527,7 @@ angular.module('GeneratorHelpers', [systemStatus.name])
} else if (field.type === 'template') {
html = Template(field);
} else if (field.type === 'toggle') {
html += "<td class=\"List-tableCell " + fld + "-column";
html += "<div class=\"ScheduleToggle-listTableCell " + fld + "-column";
html += (field['class']) ? " " + field['class'] : "";
html += field.columnClass ? " " + field.columnClass : "";
html += "\"><div class='ScheduleToggle' ng-class='{\"is-on\": " + list.iterator + ".";
@ -551,14 +541,14 @@ angular.module('GeneratorHelpers', [systemStatus.name])
html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}" ` : "";
html += "ng-show='!" + list.iterator + "." ;
html += (field.flag) ? field.flag : "enabled";
html += "' class='ScheduleToggle-switch' ng-click='" + field.ngClick + "'>" + i18n._("OFF") + "</button></div></td>";
html += "' class='ScheduleToggle-switch' ng-click='" + field.ngClick + "'>" + i18n._("OFF") + "</button></div></div>";
} else if (field.type === 'invalid') {
html += `<td class='List-tableRow--invalid'><div class='List-tableRow--invalidBar' ng-show="${field.ngShow}"`;
html += `<div class='List-tableRow--invalid'><div class='List-tableRow--invalidBar' ng-show="${field.ngShow}"`;
html += `aw-tool-tip="${field.awToolTip}" data-placement=${field.dataPlacement}>`;
html += "<i class='fa fa-exclamation'></i>";
html += "</div></td>";
html += "</div></div>";
} else {
html += "<td class=\"List-tableCell " + fld + "-column";
html += "<div class=\"List-tableCell " + fld + "-column";
html += (field['class']) ? " " + field['class'] : "";
if (options.mode === 'lookup' && field.modalColumnClass) {
html += " " + field.modalColumnClass;
@ -704,49 +694,13 @@ angular.module('GeneratorHelpers', [systemStatus.name])
</span>`;
}
}
html += "</div>";
}
return html += "</td>\n";
return html;
};
}
])
.factory('HelpCollapse', function () {
return function (params) {
var hdr = params.hdr,
content = params.content,
show = params.show,
ngHide = params.ngHide,
idx = params.idx,
bind = params.bind,
html = '';
html += "<div class=\"panel-group collapsible-help\" ";
html += (show) ? "ng-show=\"" + show + "\" " : "";
html += (ngHide) ? "ng-hide=\"" + ngHide + "\" " : "";
html += ">\n";
html += "<div class=\"panel panel-default\">\n";
html += "<div class=\"panel-heading\" ng-click=\"accordionToggle('#accordion" + idx + "')\">\n";
html += "<h4 class=\"panel-title\">\n";
//html += "<i class=\"fa fa-question-circle help-collapse\"></i> " + hdr;
html += hdr;
html += "<i class=\"fa fa-minus pull-right collapse-help-icon\" id=\"accordion" + idx + "-icon\"></i>";
html += "</h4>\n";
html += "</div>\n";
html += "<div id=\"accordion" + idx + "\" class=\"panel-collapse collapse in\">\n";
html += "<div class=\"panel-body\" ";
html += (bind) ? "ng-bind-html=\"" + bind + "\" " : "";
html += ">\n";
html += (!bind) ? content : "";
html += "</div>\n";
html += "</div>\n";
html += "</div>\n";
html += "</div>\n";
return html;
};
})
.factory('ActionButton', function () {
return function (options) {

3
awx/ui/client/src/shared/instance-groups-multiselect/instance-groups-modal/instance-groups-modal.directive.js
View File

@ -58,7 +58,8 @@ export default ['templateUrl', '$window', function(templateUrl, $window) {
let html = `${GenerateList.build({
list: instanceGroupList,
input_type: 'instance-groups-modal-body',
hideViewPerPage: true
hideViewPerPage: true,
mode: 'lookup'
})}`;
$scope.list = instanceGroupList;

2
awx/ui/client/src/shared/instance-groups-multiselect/instance-groups-modal/instance-groups-modal.partial.html
View File

@ -14,7 +14,7 @@
<div id="instance-groups-modal-body"> {{ instance_group }} </div>
</div>
<div class="modal-footer">
<button type="button" ng-click="cancelForm()" class="Lookup-cancel btn btn-default" translate>CANCEL</button>
<button type="button" ng-click="cancelForm()" class="btn btn-default" translate>CANCEL</button>
<button type="button" ng-click="saveForm()" ng-disabled="!instance_groups || instance_groups.length === 0" class="Lookup-save btn btn-primary" translate>SAVE</button>
</div>
</div>

Some files were not shown because too many files have changed in this diff Show More