mirror of
https://github.com/ansible/awx.git
synced 2024-11-01 08:21:15 +03:00
show credential kind icon on credential tags
This commit is contained in:
parent
c50c63a9ff
commit
e33604de71
@ -21,25 +21,37 @@
|
||||
<div class="MultiCredential-tags">
|
||||
<div class="MultiCredential-tagSection">
|
||||
<div class="MultiCredential-flexContainer">
|
||||
<div
|
||||
class="MultiCredential-tagContainer ng-scope"
|
||||
ng-repeat="tag in tags track by $index">
|
||||
<div class="MultiCredential-deleteContainer"
|
||||
ng-click="vm.removeCredential(tag.id)"
|
||||
ng-if="!tag.readOnly">
|
||||
<i class="fa fa-times MultiCredential-tagDelete"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-tag" ng-class="tag.readOnly ? 'MultiCredential-tag--disabled' : 'MultiCredential-tag--deletable'">
|
||||
<span ng-if="tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.typeName }} {{ tag.info }}:
|
||||
</span>
|
||||
<span ng-if="!tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.typeName }}:
|
||||
</span>
|
||||
<span class="MultiCredential-name u-wordwrap ng-binding">
|
||||
{{ tag.name }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="MultiCredential-tagContainer ng-scope" ng-repeat="tag in tags track by $index">
|
||||
<div class="MultiCredential-deleteContainer"
|
||||
ng-click="vm.deselectCredential(tag)"
|
||||
ng-hide="fieldIsDisabled || tag.readOnly">
|
||||
<i class="fa fa-times MultiCredential-tagDelete"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-iconContainer--disabled" ng-switch="tag.kind" ng-if="fieldIsDisabled || tag.readOnly">
|
||||
<i class="fa fa-cloud MultiCredential-tagIcon" ng-switch-when="cloud"></i>
|
||||
<i class="fa fa-info MultiCredential-tagIcon" ng-switch-when="insights"></i>
|
||||
<i class="fa fa-sitemap MultiCredential-tagIcon" ng-switch-when="net"></i>
|
||||
<i class="fa fa-code-fork MultiCredential-tagIcon" ng-switch-when="scm"></i>
|
||||
<i class="fa fa-key MultiCredential-tagIcon" ng-switch-when="ssh"></i>
|
||||
<i class="fa fa-archive MultiCredential-tagIcon" ng-switch-when="vault"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-iconContainer" ng-switch="tag.kind" ng-if="!(fieldIsDisabled || tag.readOnly)">
|
||||
<i class="fa fa-cloud MultiCredential-tagIcon" ng-switch-when="cloud"></i>
|
||||
<i class="fa fa-info MultiCredential-tagIcon" ng-switch-when="insights"></i>
|
||||
<i class="fa fa-sitemap MultiCredential-tagIcon" ng-switch-when="net"></i>
|
||||
<i class="fa fa-code-fork MultiCredential-tagIcon" ng-switch-when="scm"></i>
|
||||
<i class="fa fa-key MultiCredential-tagIcon" ng-switch-when="ssh"></i>
|
||||
<i class="fa fa-archive MultiCredential-tagIcon" ng-switch-when="vault"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-tag"
|
||||
ng-class="{'MultiCredential-tag--deletable': !fieldIsDisabled && !tag.readOnly, 'MultiCredential-tag--disabled': tag.readOnly}">
|
||||
<span ng-if="!tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.name }}
|
||||
</span>
|
||||
<span ng-if="tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.name }} | {{ tag.info }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -53,6 +53,9 @@
|
||||
|
||||
.MultiCredential-tag--disabled {
|
||||
background-color: @default-icon;
|
||||
border-top-left-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.MultiCredential-tag--deletable {
|
||||
@ -79,7 +82,37 @@
|
||||
}
|
||||
|
||||
.MultiCredential-tagDelete {
|
||||
font-size: 13px;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.MultiCredential-iconContainer {
|
||||
background-color: @default-link!important;
|
||||
color: @default-bg;
|
||||
border-top-left-radius: 0px;
|
||||
border-bottom-left-radius: 0px;
|
||||
padding: 0px 5px;
|
||||
margin: 3px 0px;
|
||||
margin-left: -3px;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.MultiCredential-iconContainer--disabled {
|
||||
background-color: @default-icon;
|
||||
color: @default-bg;
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
padding: 0 5px;
|
||||
padding-left: 10px;
|
||||
margin: 3px 0px;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
.MultiCredential-tagIcon {
|
||||
margin: 0px 0px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.MultiCredential-name {
|
||||
@ -91,7 +124,7 @@
|
||||
.MultiCredential-name--label {
|
||||
color: @default-list-header-bg;
|
||||
font-size: 10px;
|
||||
margin-left: -7px;
|
||||
margin-left: -8px;
|
||||
margin-right: 5px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
@ -22,17 +22,30 @@
|
||||
ng-hide="fieldIsDisabled || tag.readOnly">
|
||||
<i class="fa fa-times MultiCredential-tagDelete"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-iconContainer--disabled" ng-switch="tag.kind" ng-if="fieldIsDisabled || tag.readOnly">
|
||||
<i class="fa fa-cloud MultiCredential-tagIcon" ng-switch-when="cloud"></i>
|
||||
<i class="fa fa-info MultiCredential-tagIcon" ng-switch-when="insights"></i>
|
||||
<i class="fa fa-sitemap MultiCredential-tagIcon" ng-switch-when="net"></i>
|
||||
<i class="fa fa-code-fork MultiCredential-tagIcon" ng-switch-when="scm"></i>
|
||||
<i class="fa fa-key MultiCredential-tagIcon" ng-switch-when="ssh"></i>
|
||||
<i class="fa fa-archive MultiCredential-tagIcon" ng-switch-when="vault"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-iconContainer" ng-switch="tag.kind" ng-if="!(fieldIsDisabled || tag.readOnly)">
|
||||
<i class="fa fa-cloud MultiCredential-tagIcon" ng-switch-when="cloud"></i>
|
||||
<i class="fa fa-info MultiCredential-tagIcon" ng-switch-when="insights"></i>
|
||||
<i class="fa fa-sitemap MultiCredential-tagIcon" ng-switch-when="net"></i>
|
||||
<i class="fa fa-code-fork MultiCredential-tagIcon" ng-switch-when="scm"></i>
|
||||
<i class="fa fa-key MultiCredential-tagIcon" ng-switch-when="ssh"></i>
|
||||
<i class="fa fa-archive MultiCredential-tagIcon" ng-switch-when="vault"></i>
|
||||
</div>
|
||||
<div class="MultiCredential-tag"
|
||||
ng-class="{'MultiCredential-tag--deletable': !fieldIsDisabled && !tag.readOnly, 'MultiCredential-tag--disabled': tag.readOnly}">
|
||||
<span ng-if="tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.typeName }} {{ tag.info }}:
|
||||
</span>
|
||||
<span ng-if="!tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.typeName }}:
|
||||
</span>
|
||||
<span class="MultiCredential-name u-wordwrap ng-binding">
|
||||
{{ tag.name }}
|
||||
</span>
|
||||
<span ng-if="tag.info" class="MultiCredential-name--label ng-binding">
|
||||
{{ tag.name }} | {{ tag.info }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -84,6 +84,7 @@ function MultiCredentialService (Rest, ProcessErrors, $q, GetBasePath) {
|
||||
return {
|
||||
id: credential.id,
|
||||
name: credential.name,
|
||||
kind: _.get(credentialType, 'kind'),
|
||||
typeName: _.get(credentialType, 'name'),
|
||||
info: _.get(credential, 'inputs.vault_id'),
|
||||
readOnly: this.isReadOnly(credential),
|
||||
|
Loading…
Reference in New Issue
Block a user