diff options
Diffstat (limited to 'catalog-ui/app/scripts/view-models/component-viewer/properties')
4 files changed, 540 insertions, 0 deletions
diff --git a/catalog-ui/app/scripts/view-models/component-viewer/properties/product-properties-view.html b/catalog-ui/app/scripts/view-models/component-viewer/properties/product-properties-view.html new file mode 100644 index 0000000000..8aeda603f8 --- /dev/null +++ b/catalog-ui/app/scripts/view-models/component-viewer/properties/product-properties-view.html @@ -0,0 +1,76 @@ +<div class="w-sdc-component-viewer-right-properties"> + + <h4 class="w-sdc-resource-viewer-right-title">General Information</h4> + <div class="w-sdc-resource-viewer-right-content-section"> + <div class='sdc-resource-viewer-sidebar-section-content-column-1'> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TYPE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" translate="GENERAL_LABEL_PRODUCT"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_VERSION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.version"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CATEGORY"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.category}}" data-ng-bind="component.category"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CREATION_DATE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creationDate | date: 'MM/dd/yyyy'"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_AUTHOR"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creatorFullName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CONTACT_ID"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.contacts[0]"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_PROJECT_CODE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.projectCode"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">Life Cycle Status:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value"> + {{sdcMenu.LifeCycleStatuses[component.lifecycleState].text}} + </span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">Distribution Status:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value"> + {{sdcMenu.DistributionStatuses[component.distributionStatus].text}} + </span> + </div> + </div> + <div class='sdc-resource-viewer-sidebar-section-content-column-2'> + <div class="sdc-resource-viewer-sidebar-section-content-item description"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_DESCRIPTION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.description"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item" > + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TAGS"></span> + <span tooltips tooltip-content="{{component.tags.join(', ')}}" class="sdc-resource-viewer-sidebar-section-content-tags" data-ng-repeat="(tag, tagName) in component.tags"> + {{tagName}}{{$last ? '' : ','}} + </span> + </div> + </div> + </div> + <h4 class="w-sdc-resource-viewer-right-title">Additional Information</h4> + + <div class="sdc-properties-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="additionalInformations.length"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Key</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Value</th> + </thead> + <tbody> + <tr data-ng-repeat="additionalInformation in additionalInformations"> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.key}}">{{additionalInformation.key}}</span></td> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.value}}">{{additionalInformation.value}}</span></td> + </tr> + </tbody> + </table> + </div> +</div> diff --git a/catalog-ui/app/scripts/view-models/component-viewer/properties/properties-view.less b/catalog-ui/app/scripts/view-models/component-viewer/properties/properties-view.less new file mode 100644 index 0000000000..c0beed338f --- /dev/null +++ b/catalog-ui/app/scripts/view-models/component-viewer/properties/properties-view.less @@ -0,0 +1,128 @@ +.w-sdc-component-viewer-right-properties { + .w-sdc-resource-viewer-tabs { + height: 42px; + } + + .w-sdc-resource-viewer-right-content-section { + margin: 0 0 20px 16px; + } + + .sdc-resource-viewer-sidebar-section-content-column-1, + .sdc-resource-viewer-sidebar-section-content-column-2 { + display: table-cell; + width: 50%; + } + .sdc-resource-viewer-sidebar-section-content-item { + .b_7; + margin-bottom: 5px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + width: 305px; + } + .sdc-resource-viewer-sidebar-section-content-item-label { + .bold; + .g_9; + } + .w-sdc-resource-viewer-right .sdc-resource-viewer-sidebar-section-content-column-1 { + .sdc-resource-viewer-sidebar-section-content-item { + width: 390px; + } + } + .sdc-resource-viewer-sidebar-section-content-item.description { + margin: 0; + + .sdc-resource-viewer-sidebar-section-content-item-value { + word-wrap: break-word; + white-space: normal; + display: block; + + } + .sdc-resource-viewer-sidebar-section-content-tags { + word-wrap: break-word; + white-space: pre-wrap; + display: inline-block; + max-width: 167px; + + } + } + + .w-sdc-resource-viewer-right-title { + .g_1; + .bg_n; + padding: 7px 15px; + margin: 0px 0 25px; + font-weight: bold; + } + + .w-sdc-resource-viewer-right-table-head-cell { + .g_9; + text-align: left; + } + + .cols-1 { + width: 100%; + } + .cols-2 { + width: 50%; + } + .cols-3 { + width: 33%; + } + + .sdc-properties-container table tbody td.label { + .bold; + } + + .w-sdc-designer-sidebar-section-content, + .w-sdc-resource-viewer-right-table { + display: table; + width: 100%; + .b_9; + word-break: break-all; + + tbody td { + padding: 4px 20px 0 0; + + .ellipsis-directive-more-less { + display: none; + } + + .ellipsis-cols2 { + .sdc-ellipsis; + max-width: 340px; + } + .ellipsis-cols3 { + .sdc-ellipsis; + max-width: 200px; + } + } + + } + + .i-sdc-designer-sidebar-section-content-column-1 { + display: table-cell; + width: 50%; + } + + .i-sdc-designer-sidebar-section-content-column-2 { + display: table-cell; + width: 50%; + } + + .i-sdc-resource-viewer-artifacts-item-action, + .sdc-information-artifacts-icon { + .sprite; + display: inline-block; + width: 20px; + height: 20px; + cursor: pointer; + vertical-align: middle; + &.download { + .sprite.e-sdc-small-download; + } + &.preview { + .e-sdc-small-icon-eye; + } + } +} diff --git a/catalog-ui/app/scripts/view-models/component-viewer/properties/resource-properties-view.html b/catalog-ui/app/scripts/view-models/component-viewer/properties/resource-properties-view.html new file mode 100644 index 0000000000..c02e7aba7e --- /dev/null +++ b/catalog-ui/app/scripts/view-models/component-viewer/properties/resource-properties-view.html @@ -0,0 +1,169 @@ +<div class="w-sdc-component-viewer-right-properties"> + + <h4 class="w-sdc-resource-viewer-right-title">General Information</h4> + <div class="w-sdc-resource-viewer-right-content-section"> + <div class='sdc-resource-viewer-sidebar-section-content-column-1'> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TYPE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" >Resource</span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_RESOURCE_TYPE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.resourceType | resourceTypeName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_VERSION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.version"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CATEGORY"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.categories[0].name}}" data-ng-bind="component.categories[0].name"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_SUB_CATEGORY"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.categories[0].subcategories[0].name}}" data-ng-bind="component.categories[0].subcategories[0].name"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CREATION_DATE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creationDate | date: 'MM/dd/yyyy'"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_AUTHOR"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creatorFullName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_VENDOR_NAME"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.vendorName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_VENDOR_RELEASE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.vendorRelease"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CONTACT_ID"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.contactId"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">Life Cycle Status:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value"> + {{sdcMenu.LifeCycleStatuses[component.lifecycleState].text}} + </span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">System Name:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.systemName}}" data-ng-bind="component.systemName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_LICENSE_TYPE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.licenseType"></span> + </div> + </div> + <div class='sdc-resource-viewer-sidebar-section-content-column-2'> + <div class="sdc-resource-viewer-sidebar-section-content-item description"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_DESCRIPTION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.description"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TAGS"></span> + <span class="sdc-resource-viewer-sidebar-section-content-tags" data-ng-repeat="(tag, tagName) in component.tags" tooltips tooltip-content="{{component.tags.join(', ')}}">{{tagName}}{{$last ? '' : ','}}</span> + </div> + </div> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Additional Information</h4> + + <div class="sdc-properties-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="additionalInformations.length"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Key</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Value</th> + </thead> + <tbody> + <tr data-ng-repeat="additionalInformation in additionalInformations"> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.key}}">{{additionalInformation.key}}</span></td> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.value}}">{{additionalInformation.value}}</span></td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Properties</h4> + <div class="sdc-properties-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="component.properties.length"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Type (Constraints)</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Default Value</th> + </thead> + <tbody> + <tr data-ng-repeat="property in component.properties"> + <td><span class="ellipsis-cols2" data-tests-id="{{property.name}}" tooltips tooltip-content="{{property.name}}">{{property.name}}</span></td> + <td><span data-tests-id="{{property.type}}">{{property.type}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{property.defaultValue}}" tooltips tooltip-content="{{property.defaultValue}}">{{property.defaultValue}}</span></td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Requirements</h4> + <div class="sdc-requirements-container w-sdc-resource-viewer-right-content-section" > + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.requirements)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-1">Type</th> + </thead> + <tbody> + <tr data-ng-repeat="(key, value) in component.requirements"> + <td>{{value[0].name}}</td> + </tr> + </tbody> + </table> + </div> + + + <h4 class="w-sdc-resource-viewer-right-title">Deployment Artifacts</h4> + + <div class="sdc-information-container w-sdc-resource-viewer-right-content-section" > + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.deploymentArtifacts)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">File</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Version</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3"></th> + </thead> + <tbody> + <tr data-ng-repeat="(artifactLogicName, artifact) in component.deploymentArtifacts"> + <td><span class="ellipsis-cols2" data-tests-id="{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactName}}" tooltips tooltip-content="{{artifact.artifactName}}">{{artifact.artifactName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactVersion}}" tooltips tooltip-content="{{artifact.artifactVersion}}" data-ng-if="artifact.esId">{{artifact.artifactVersion}}</span></td> + <td class="cols-3"> + <download-artifact class="sdc-information-artifacts-icon download" data-ng-if="artifact.artifactName" component="component" artifact="artifact"></download-artifact> + <!--span class="sdc-information-artifacts-icon preview"></span--> + </td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Information Artifacts</h4> + <div class="sdc-information-container w-sdc-resource-viewer-right-content-section" > + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.artifacts)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">File</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Version</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3"></th> + </thead> + <tbody> + <tr data-ng-repeat="(artifactLogicName, artifact) in component.artifacts"> + <td><span class="ellipsis-cols2" data-tests-id="{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactName}}" tooltips tooltip-content="{{artifact.artifactName}}">{{artifact.artifactName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactVersion}}" tooltips tooltip-content="{{artifact.artifactVersion}}" data-ng-if="artifact.esId">{{artifact.artifactVersion}}</span></td> + <td class="cols-3"> + <download-artifact class="sdc-information-artifacts-icon download" data-ng-if="artifact.artifactName" component="component" artifact="artifact"></download-artifact> + <!--span class="sdc-information-artifacts-icon preview"></span--> + </td> + </tr> + </tbody> + </table> + </div> +</div> diff --git a/catalog-ui/app/scripts/view-models/component-viewer/properties/service-properties-view.html b/catalog-ui/app/scripts/view-models/component-viewer/properties/service-properties-view.html new file mode 100644 index 0000000000..01f872c13c --- /dev/null +++ b/catalog-ui/app/scripts/view-models/component-viewer/properties/service-properties-view.html @@ -0,0 +1,167 @@ +<div class="w-sdc-component-viewer-right-properties"> + + <h4 class="w-sdc-resource-viewer-right-title">General Information</h4> + <div class="w-sdc-resource-viewer-right-content-section"> + <div class='sdc-resource-viewer-sidebar-section-content-column-1'> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TYPE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" translate="GENERAL_LABEL_SERVICE"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_VERSION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.version"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CATEGORY"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.categories[0].name}}" data-ng-bind="component.categories[0].name"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CREATION_DATE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creationDate | date: 'MM/dd/yyyy'"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_AUTHOR"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.creatorFullName"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_CONTACT_ID"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.contactId"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_PROJECT_CODE"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.projectCode"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">Life Cycle Status:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value"> {{sdcMenu.LifeCycleStatuses[component.lifecycleState].text}}</span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">Distribution Status:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value">{{sdcMenu.DistributionStatuses[component.distributionStatus].text}}</span> + </div> + + <div class="sdc-resource-viewer-sidebar-section-content-item"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label">System Name:</span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" tooltips tooltip-content="{{component.systemName}}" data-ng-bind="component.systemName"></span> + </div> + </div> + <div class='sdc-resource-viewer-sidebar-section-content-column-2'> + <div class="sdc-resource-viewer-sidebar-section-content-item description"> + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_DESCRIPTION"></span> + <span class="sdc-resource-viewer-sidebar-section-content-item-value" data-ng-bind="component.description"></span> + </div> + <div class="sdc-resource-viewer-sidebar-section-content-item" > + <span class="sdc-resource-viewer-sidebar-section-content-item-label" translate="GENERAL_LABEL_TAGS"></span> + <span tooltips tooltip-content="{{component.tags.join(', ')}}" class="sdc-resource-viewer-sidebar-section-content-tags" data-ng-repeat="(tag, tagName) in component.tags">{{tagName}}{{$last ? '' : ','}}</span> + </div> + </div> + </div> + <h4 class="w-sdc-resource-viewer-right-title">Additional Information</h4> + + <div class="sdc-properties-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="additionalInformations.length"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Key</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Value</th> + </thead> + <tbody> + <tr data-ng-repeat="additionalInformation in additionalInformations"> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.key}}">{{additionalInformation.key}}</span></td> + <td><span class="ellipsis-cols2" tooltips tooltip-content="{{additionalInformation.value}}">{{additionalInformation.value}}</span></td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Inputs</h4> + + <div class="sdc-properties-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="inputs.length"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Type (Constraints)</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Default Value</th> + </thead> + <tbody> + <tr data-ng-repeat="input in inputs"> + <td><span class="ellipsis-cols2" data-tests-id="{{input.name}}" tooltips tooltip-content="{{input.name}}">{{input.name}}</span></td> + <td>{{input.type}}</td> + <td><span class="ellipsis-cols3" data-tests-id="{{input.value}}" tooltips tooltip-content="{{input.value}}">{{input.value}}</span></td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">API Artifacts</h4> + + <div class="sdc-requirements-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.serviceApiArtifacts)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">File</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Version</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3"></th> + </thead> + <tbody> + <tr data-ng-repeat="(artifactLogicName, artifact) in component.serviceApiArtifacts"> + <td><span class="ellipsis-cols2" data-tests-id="{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactName}}" tooltips tooltip-content="{{artifact.artifactName}}">{{artifact.artifactName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactVersion}}" tooltips tooltip-content="{{artifact.artifactVersion}}" data-ng-if="artifact.esId">{{artifact.artifactVersion}}</span></td> + <td class="cols-3"> + <download-artifact class="sdc-information-artifacts-icon download" data-ng-if="artifact.artifactName" component="component" artifact="artifact"></download-artifact> + <!--span class="sdc-information-artifacts-icon preview"></span--> + </td> + </tr> + </tbody> + </table> + </div> + + <h4 class="w-sdc-resource-viewer-right-title">Deployment Artifacts</h4> + + <div class="sdc-information-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.deploymentArtifacts)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">File</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Version</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3"></th> + </thead> + <tbody> + <tr data-ng-repeat="(artifactLogicName, artifact) in component.deploymentArtifacts"> + <td><span class="ellipsis-cols2" data-tests-id="{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactName}}" tooltips tooltip-content="{{artifact.artifactName}}">{{artifact.artifactName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactVersion}}" tooltips tooltip-content="{{artifact.artifactVersion}}" data-ng-if="artifact.esId">{{artifact.artifactVersion}}</span></td> + <td class="cols-3"> + <download-artifact class="sdc-information-artifacts-icon download" data-ng-if="artifact.artifactName" component="component" artifact="artifact"></download-artifact> + <!--span class="sdc-information-artifacts-icon preview"></span--> + </td> + </tr> + </tbody> + </table> + </div> + + + <h4 class="w-sdc-resource-viewer-right-title">Information Artifacts</h4> + + <div class="sdc-information-container w-sdc-resource-viewer-right-content-section"> + <table class="w-sdc-resource-viewer-right-table" data-ng-show="hasItems(component.artifacts)"> + <thead class="w-sdc-resource-viewer-right-table-head"> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-2">Name</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">File</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3">Version</th> + <th class="w-sdc-resource-viewer-right-table-head-cell cols-3"></th> + </thead> + <tbody> + <tr data-ng-repeat="(artifactLogicName, artifact) in component.artifacts"> + <td><span class="ellipsis-cols2" data-tests-id="{{artifact.artifactDisplayName}}" tooltips tooltip-content="{{artifact.artifactDisplayName}}">{{artifact.artifactDisplayName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactName}}" tooltips tooltip-content="{{artifact.artifactName}}">{{artifact.artifactName}}</span></td> + <td><span class="ellipsis-cols3" data-tests-id="{{artifact.artifactVersion}}" tooltips tooltip-content="{{artifact.artifactVersion}}" data-ng-if="artifact.esId">{{artifact.artifactVersion}}</span></td> + <td class="cols-3"> + <download-artifact class="sdc-information-artifacts-icon download" data-ng-if="artifact.artifactName" component="component" artifact="artifact"></download-artifact> + <!--span class="sdc-information-artifacts-icon preview"></span--> + </td> + </tr> + </tbody> + </table> + </div> +</div> |