diff options
Diffstat (limited to 'app/main')
25 files changed, 3529 insertions, 0 deletions
diff --git a/app/main/dashboard/about/about.controller.js b/app/main/dashboard/about/about.controller.js new file mode 100644 index 0000000..32d903d --- /dev/null +++ b/app/main/dashboard/about/about.controller.js @@ -0,0 +1,16 @@ +(function () { + + 'use strict'; + + angular + .module('dcaeApp.dashboard.about') + .controller('DashboardAboutController', dashboardAboutController); + + function dashboardAboutController($state) { + + var vm = this; + vm.test = "lllllllllllllllll"; + + } + +})(); diff --git a/app/main/dashboard/about/about.html b/app/main/dashboard/about/about.html new file mode 100644 index 0000000..52b5326 --- /dev/null +++ b/app/main/dashboard/about/about.html @@ -0,0 +1,2 @@ +<h1>This is about</h1> +{{vm.test}} diff --git a/app/main/dashboard/about/about.less b/app/main/dashboard/about/about.less new file mode 100644 index 0000000..0232877 --- /dev/null +++ b/app/main/dashboard/about/about.less @@ -0,0 +1,5 @@ +.about { + h1 { + font-size: 160px; + } +} diff --git a/app/main/dashboard/about/about.module.js b/app/main/dashboard/about/about.module.js new file mode 100644 index 0000000..c447f6a --- /dev/null +++ b/app/main/dashboard/about/about.module.js @@ -0,0 +1,24 @@ +(function () { + + 'use strict'; + + angular + .module('dcaeApp.dashboard.about', []) + .config(config); + + function config($stateProvider) { + + $stateProvider.state('dcae.app.about', { + url: '/about', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/about/about.html', + controller: 'DashboardAboutController as vm' + } + }, + bodyClass: 'about' + }); + + } + +})(); diff --git a/app/main/dashboard/dcaedt/dcae.less b/app/main/dashboard/dcaedt/dcae.less new file mode 100644 index 0000000..6d93f7e --- /dev/null +++ b/app/main/dashboard/dcaedt/dcae.less @@ -0,0 +1,1376 @@ +.about { + h1 { + font-size: 40px; + } +} + +.home { + ul.users { + li { + font-size: 20px; + } + } +} +.sdc-dashboard-container { + .tlv-loader { + top: -110px; + left: 80px; + } + .sdc-hide-popover { + .popover { + display: none !important; + } + } +} + +/* dashboard card main icons */ +.dcae-s-sdc-service { background-position: -60px -2654px; width: 14px; height: 17px;} +.dcae-s-sdc-resource { background-position: -54px -2585px; width: 16px; height: 16px;} + +.dcae-sprite { + background-image: url('images/sprites/sprite-global-old.png'); + display: inline-block; +} +.dcae-sprite-new { + background-image: url('images/sprites/sprite-global.png'); + display: inline-block; +} +.dcae-sprite.logo { background-position: -50px -100px; width: 39px; height: 32px;} +.dcae-sprite.white-arrow-down { background-position: -50px -200px; width: 15px; height: 9px;} +.dcae-sprite.white-arrow-up { background-position: -100px -200px; width: 15px; height: 9px;} +.arrow-left { background-position: -262px -4041px; width: 11px; height: 10px;} +.dcae-sprite.tab-info { background-position: -50px -300px; width: 18px; height: 20px;} +.dcae-sprite.edit { background-position: -51px -689px; width: 31px; height: 30px;} +.dcae-sprite.details { background-position: -50px -900px; width: 19px; height: 19px;} +.dcae-sprite.structure { background-position: -212px -3880px; width: 23px; height: 21px;} +.dcae-sprite.artifacts { background-position: -50px -1098px; width: 20px; height: 20px;} +.dcae-sprite.menu { background-position: -50px -1200px; width: 17px; height: 14px;} +.dcae-sprite.catalog { background-position: -53px -1303px; width: 20px; height: 20px;} +.dcae-sprite.distribution { background-position: -50px -1400px; width: 24px; height: 14px;} +.dcae-sprite.support { background-position: -50px -1500px; width: 22px; height: 22px;} +.dcae-sprite.filter { background-position: -50px -1600px; width: 15px; height: 16px;} +.dcae-sprite.card-menu { background-position: -50px -2000px; width: 4px; height: 16px;} +.dcae-sprite.relationships { background-position: -50px -2097px; width: 26px; height: 19px;} +.dcae-sprite.lifecycle { background-position: -50px -2200px; width: 20px; height: 20px;} +.dcae-sprite.properties { background-position: -50px -2300px; width: 19px; height: 19px;} +.dcae-sprite.e-sdc-small-icon-delete { background-position: -64px -2771px; width: 11px; height: 13px;} +.dcae-sprite.magnification-glass { background-position: -49px -3138px; width: 12px; height: 12px;} +.dcae-sprite.clear-text { background-position: -104px -4040px; width: 10px; height: 11px;} +/*new tabs icons*/ +.dcae-sprite.info { background-position: -105px -3583px; width: 18px; height: 18px;} +.dcae-sprite.information-artifacts { background-position: -105px -3632px; width: 20px; height: 21px;} +.dcae-sprite.deployment-artifacts { background-position: -105px -3682px; width: 19px; height: 19px;} +.dcae-sprite.properties { background-position: -105px -3733px; width: 18px; height: 18px;} +.dcae-sprite.relations { background-position: -105px -3781px; width: 20px; height: 20px;} +.dcae-sprite.inputs { background-position: -104px -3887px; width: 18px; height: 14px;} +.dcae-sprite.api { background-position: -104px -3930px; width: 25px; height: 21px;} + +.dcae-main-right-container { + background-color: #ffffff; + bottom: 0; + padding: 22px 12px; + position: absolute; + left: 240px; + right: 0; + top: 0px; + overflow: scroll; +} + +.dcae-left-sidebar { + width: 242px; + overflow: hidden; + background-color: #f8f8f8; + -webkit-box-shadow: 1px 0 4px 0 rgba(24,24,25,.17); + -moz-box-shadow: 1px 0 4px 0 rgba(24,24,25,.17); + box-shadow: 1px 0 4px 0 rgba(24,24,25,.17); + position: absolute; + left: 0; + top: 0; + bottom: 0; + padding: 12px 18px; + z-index: 1; +} + +.dcae-left-sidebar-nav { + margin-top: 46px; +} + +.dcae-menu-item.selected { + border-left: 4px solid #009fdb; + padding-left: 18px; + color: #009fdb; +} + +.dcae-menu-item { + overflow: hidden; + text-overflow: ellipsis; + width: 100%; + white-space: nowrap; + display: inline-block; + max-width: none; + white-space: normal; + cursor: pointer; +} +//////////////////////////////Cards//////////////////// +.dcae-dashboard-card-new { + border: 2px dashed #a8b3b9; + .border-radius(2px); + cursor: pointer; + display: inline-block; + margin: 9px; + position: relative; + vertical-align: middle; + height: 190px; + width: 190px; +} + +.dcae-dashboard-card-new-content { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + height: 100%; + cursor: pointer; +} + +.dcae-dashboard-card-new-content-plus { + .dcae-sprite-new; + .add-icon; + position: relative; + margin-bottom: 20px; + + &:after { + .n_14_m; + content: 'ADD'; + position: absolute; + top: 25px; + left: -3px; + vertical-align: -50%; + } +} + +.dcae-dashboard-card-import-content-plus { + .dcae-sprite-new; + .import-icon; + position: relative; + margin-bottom: 20px; + + &:after { + .n_14_m; + content: 'IMPORT'; + position: absolute; + top: 25px; + left: -16px; + vertical-align: -50%; + } +} + +.sdc-dashboard-create-element-container, +.sdc-dashboard-import-element-container { + + width: 140px; + + .tlv-btn.import-dcae { + padding: 0; + } + + .tlv-btn { + position: relative; + width: 100%; + margin-bottom: 10px; + + &:last-child { + margin-bottom: 0; + } + } + + input[type="file"] { + cursor: inherit; + filter: alpha(opacity=0); + opacity: 0; + position: absolute; + top: 0; + left: 0; + width: 138px; + height: 30px; + } +} + +.dcae-dashboard-card { + width: 190px; + height: 190px; + background-color: #fff; + .border-radius(2px); + .box-shadow(0px 2px 2px 0px rgba(24, 24, 25, 0.05)); + display: inline-block; + margin: 10px; + position: relative; + vertical-align: middle; + border: solid 1px #e4e1e1; + + &:hover { + border: solid 1px @main_color_o; + .box-shadow(3px 3px 2px 0px rgba(24, 24, 25, 0.05)); + } + + &:active { + border: solid 1px @main_color_c; + .box-shadow(3px 3px 2px 0px rgba(24, 24, 25, 0.05)); + } +} + +.dcae-dashboard-card-body { + .hand; + border-bottom: 1px solid #ffffff; + height: 155px; + position: relative; + text-align: center; +} + +.dcae-dashboard-card-description { + .c_3; + .hand; + background-color: rgba(57, 73, 84, 0.9); + border-radius: 4px 4px 0 0; + bottom: 0; + left: 0; + opacity: 0; + padding: 10px; + position: absolute; + right: 0; + text-align: left; + top: 0; + word-wrap: break-word; + z-index: 4; + min-height: 100px; + overflow: hidden; +} + + .dcae-workspace-top-bar { + height: 26px; + padding: 12px 10px 0px 50px; + border-bottom: 1px solid #d2d2d2; + display: flex; + justify-content: space-between; + + .version-container{ + + } + + .progress-container{ + flex-grow:4; + z-index: 10000000; + + .general-view-top-progress{ + width:30%; + margin: 0 auto; + } + } + + .not-latest{ + position: absolute; + left: 24px; + top: 20px; + .dcae-sprite-new; + .asdc-warning; + } + + .sdc-workspace-top-bar-buttons { + + > button, > span:not(.delimiter){ + margin-right: 10px; + vertical-align: middle; + .hand; + + &.dcae-sprite-new { + text-indent: 100%; + } + &.disabled, &:hover.disabled { + pointer-events: none; + } + } + .delimiter { + height: 32px; + width: 1px; + background-color: #959595; + display: inline-block; + vertical-align: middle; + margin-right: 20px; + } + + } + + + .lifecycle-state { + padding: 7px 0 0 10px; + margin: 2px 0 7px 10px; + border-left: 1px solid #d2d2d2; + line-height: 15px; + font-family: @font-omnes-medium; + color: #d2d2d2; + + .lifecycle-state-icon { + .dcae-sprite-new; + } + .lifecycle-state-text { + + font-weight: bold; + text-transform: uppercase; + vertical-align: top; + padding: 3px; + } + } + + .version-selector { + // float:left; + background-color: transparent; + border: none; + margin-top: 6px; + } + } + + .dcae-asset-creation-info { + color: #959595; + font-family: omnes-regular,sans-serif; + font-size: 12px; + margin: 8px 20px 0 0; + } + + // Workspace bar // +.dcae-dashboard-card-schema { + margin-top: 30px; +} + +.dcae-dashboard-card-edit { + .hand; + position: absolute; + right: 13px; + top: 15px; + z-index: 2; +} + +.dcae-vfcmt-title{ + text-align: left; + margin: 7px; + color: #009fdb; +} + +.dcae-dashboard-card-footer { + border-top: 1px solid #eaeaea; + margin: 0px 5px; + position: relative; +} + +.dcae-dashboard-card-avatar { + .uppercase; + border-radius: 50%; + display: inline-block; + position: absolute; + left: -6px; + text-align: center; + top: -6px; + + span { + + background-color: @main_color_p; + .border-radius(15px); + color: @color_c; + content: ''; + height: 30px; + text-align: center; + display: block; + border: solid 2px #ECEFF3; + padding: 3px 10px 2px 10px; + + &.VF { + .j_14_m; + &::before { + content: 'VF'; + } + } + + &.VFC { + .j_14_m; + &::before { + content: 'VFC'; + } + } + + &.CP { + .j_14_m; + &::before { + content: 'CP'; + } + } + + &.VL { + .j_14_m; + &::before { + content: 'VL'; + } + } + + &.SERVICE { + .c_14_m; + &::before { + content: 'S'; + } + } + + &.PRODUCT { + .b_14_m; + &::before { + content: 'P'; + } + } + + &.green { + .d_12; + &::before { + content: 'R'; + } + } + &.red { + .r_12; + &::before { + content: 'S'; + } + } + &.dblack { + .s_12; + &::before { + content: 'P'; + } + } + } +} + +.dcae-dashboard-card-info { + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.dcae-dashboard-card-info-name-container{ + position: absolute; + bottom: 0; + left: 0; + margin: 0 0 2px 10px; +} +.dcae-dashboard-card-info-name { + .m_14_m; + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.dcae-dashboard-card-info-lifecycleState { + .m_13_m; + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.dcae-dashboard-card-info-user { + .n_13_r; + text-align: left; + line-height: 18px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + width: 100%; +} + +.dcae-dashboard-card-menu-button { + display: inline-block; + padding: 12px 0 0 10px; + position: absolute; + right: 12px; + top: 8px; + border-left: solid 1px @color_k; + height: 42px; + + &:hover { + .dcae-dashboard-card-menu { + display: block; + } + } +} + +.dcae-dashboard-card-menu { + .bg_c; + border-radius: 0 0 4px 4px; + border-top: 3px solid @color_a; + box-shadow: 0 2px 2px 0px rgba(0, 0, 0, 0.2); + color: @color_s; + display: none; + min-height: 30px; + padding: 9px 0; + position: absolute; + right: -27px; + width: 208px; + z-index: 9; + max-height: 164px; + + &::before { + //TODO: Missing image for small blue triangle. + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE1OTIzNDI1MENFQjExRTU4ODRERTI1MDM2REZCOUYzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE1OTIzNDI2MENFQjExRTU4ODRERTI1MDM2REZCOUYzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTU5MjM0MjMwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTU5MjM0MjQwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4gBXTlAAAAOElEQVR42mK0rp7NgASMgZgFiE/CBJjQJPcA8U4gNkdXAJMUAGJ+ZEVMaJIwAFfEhEUSRRFAgAEAVtgJyiLAPWAAAAAASUVORK5CYII='); + content: ''; + display: block; + height: 21px; + position: absolute; + right: 24px; + top: -24px; + width: 184px; + background-repeat: no-repeat; + background-position: 175px 16px; + } +} + +.i-sdc-dashboard-card-menu-item { + .hand; + line-height: 24px; + padding: 0 10px; + &:hover { .a_7; } +} + +.dcae-dashboard-card-info-lifecycleState-icon{ + position:absolute; + bottom:18px; + right:10px; +} + +// Same for dashboard and catalog view. +.dcae-dashboard-card-schema-image { + position: absolute; + top: 41%; + + //TODO: Israel - remove this after getting the services sprite. + height: 45px; + width: 53px; + background-repeat: no-repeat; + + // Center the icon vertical and horizontal. + margin: auto; + left: 0; + right: 0; + top: -10px; + bottom: 0; +} + +/* dashboard card main icons */ +.dcae-dashboard-card-schema-image.service { .dcae-s-sdc-service } +.dcae-dashboard-card-schema-image.resource { .dcae-s-sdc-resource } + +/* dashboard card statuses icons */ +.dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKIN { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN; } +.dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKOUT { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT; } +.dcae-dashboard-card-edit.CERTIFIED { .dcae-sprite; .dcae-s-sdc-state.CERTIFIED; } +.dcae-dashboard-card-edit.READY_FOR_CERTIFICATION { .dcae-sprite; .dcae-s-sdc-state.READY_FOR_CERTIFICATION; } +.dcae-dashboard-card-edit.CERTIFICATION_IN_PROGRESS { .dcae-sprite; .dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS; } +.dcae-dashboard-card-edit.DISTRIBUTED { .dcae-sprite; .dcae-s-sdc-state.DISTRIBUTED; } + +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKIN { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN.green; } +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKOUT { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT.green; } +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.CERTIFIED { .dcae-sprite; .dcae-s-sdc-state.CERTIFIED.green; } +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.READY_FOR_CERTIFICATION { .dcae-sprite; .dcae-s-sdc-state.READY_FOR_CERTIFICATION.green; } +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.CERTIFICATION_IN_PROGRESS { .dcae-sprite; .dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS.green; } +.dcae-dashboard-card-avatar.green + .dcae-dashboard-card-edit.DISTRIBUTED { .dcae-sprite; .dcae-s-sdc-state.DISTRIBUTED.green; } + +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKIN { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN.red; } +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.NOT_CERTIFIED_CHECKOUT { .dcae-sprite; .dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT.red; } +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.CERTIFIED { .dcae-sprite; .dcae-s-sdc-state.CERTIFIED.red; } +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.READY_FOR_CERTIFICATION { .dcae-sprite; .dcae-s-sdc-state.READY_FOR_CERTIFICATION.red; } +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.CERTIFICATION_IN_PROGRESS { .dcae-sprite; .dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS.red; } +.dcae-dashboard-card-avatar.red + .dcae-dashboard-card-edit.DISTRIBUTED { .dcae-sprite; .dcae-s-sdc-state.DISTRIBUTED.red; } + +.w-sdc-main-container{ + height: 100%; +} +.sdc-catalog-container { + + height: 100%; + .i-sdc-categories-list-item { + font-weight: normal; + } + + // Checkboxes + .i-sdc-designer-leftbar-section-content-ul { + padding: 0; + margin: 0; + + .i-sdc-catalog-subcategories-checkbox { + padding: 0 0 0 20px; + margin: 0; + + .i-sdc-catalog-grouping-checkbox { + padding: 0 0 0 20px; + margin: 0; + } + + } + + } + + .i-sdc-designer-leftbar-section-content-li { + &:last-child { + .i-sdc-categories-list-item { + margin: 0; + } + } + } + + .i-sdc-categories-list-item { + display: block; + //margin-bottom: 5px; + //padding-left: 15px; + //text-indent: -24px; + vertical-align: top; + font-weight: bold; + } + + .i-sdc-subcategories-list-item { + display: block; + //padding-left: 20px; + vertical-align: top; + font-weight: normal; + margin: 0; + //text-indent: -10px; + } + + /*Added by - Ikram */ + .i-sdc-product-input, + .i-sdc-product-select { + border: 1px solid @border_color_f; + min-height: 30px; + padding: 0; + width: 100%; + margin: 1px 0; + background-color: #F2F2F2; + outline: none; + + &:disabled { + .disabled; + } + optgroup{ + color: @color_u; + option{ + color: @color_b; + } + } + } + + .i-sdc-categories-list-item-icon { + display: inline-block; + float: right; + position: relative; + right: -8px; + top: 6px; + } + + .i-sdc-categories-list-item { + margin-top: 7px; + &.NOT_CERTIFIED_CHECKOUT, + &.NOT_CERTIFIED_CHECKIN { + .i-sdc-categories-list-item-icon { + background: url('images/sprites/sprite-global-old.png') no-repeat -53px -2889px; + width: 14px; + height: 14px; + + } + } + + &.CERTIFIED { + .i-sdc-categories-list-item-icon { + background: url('images/sprites/sprite-global-old.png') no-repeat -53px -3034px; + width: 14px; + height: 16px; + } + } + + &.READY_FOR_CERTIFICATION { + .i-sdc-categories-list-item-icon { + background: url('images/sprites/sprite-global-old.png') no-repeat -53px -2985px; + width: 14px; + height: 16px; + } + } + + &.CERTIFICATION_IN_PROGRESS { + .i-sdc-categories-list-item-icon { + background: url('images/sprites/sprite-global-old.png') no-repeat -53px -2934px; + width: 14px; + height: 16px; + } + } + + &.DISTRIBUTED, + &.TBD { + .i-sdc-categories-list-item-icon { + background: url('images/sprites/sprite-global-old.png') no-repeat -43px -3087px; + width: 24px; + height: 14px; + + } + } + } + + .i-sdc-categories-list-input { + margin: 8px; + + } + + .i-sdc-subcategories-list-input { + + margin: 8px; + } + .i-sdc-subcategories-list-input-container { + margin: 0px 0px 0px 20px; + padding: 2px; + } + + .dcae-header-catalog-search-container { + display: table; + padding: 21px 0; + position: relative; + + .dcae-designer-leftbar-search-input { + color: #000; + width: 300px; + } + + // .magnification { + // .dcae-sprite; + // .dcae-sprite.magnification-glass; + // .hand; + // position: absolute; + // top: 40px; + // right: 42px; + // } + } + + .dcae-catalog-main { + padding: 10px 12px; + } + .dcae-dashboard-catalog-header { + .b_9; + display: inline-block; + font-style: italic; + font-weight: bold; + padding-left: 10px; + } + + .dcae-dashboard-catalog-header-order { + .b_9; + font-weight: 800; + } + + .dcae-dashboard-catalog-sort { + .b_9; + font-weight: bold; + white-space:pre; + &:hover{ + .hand; + text-decoration: none; + .a_9; + } + &.blue { + .a_9; + } + } + + .dcae-catalog-sort-arrow{ + display: inline-block; + &.up{ + .b_9; + width: 0; + height: 0; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-bottom: 5px solid ; + } + &.down{ + .b_9; + width: 0; + height: 0; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-top: 5px solid; + } + } + + + + + .dcae-dashboard-catalog-header-right{ + float: right; + display: inline-block; + padding-right:34px; + } + + .dcae-dashboard-catalog-header-right-vf { + top:0px; + overflow:scroll; + } + + .dcae-header-catalog-search-input { + width: 420px; + display: table-cell; + padding: 0 25px 1px 10px; + border: 1px solid #bcbcbc; + .border-radius(10px); + height: 30px; + margin: 10px 30px; + outline: none; + } + + .sdc-catalog-type-filter-container { + margin-top: -1px; + } + + .i-sdc-designer-leftbar-section-title { + text-transform: uppercase; + .l_14_m; + line-height: 30px; + } + + .i-sdc-designer-leftbar-section-title-icon { + .hand; + .tlv-sprite; + .footer-close; + transition: .3s all; + margin-top: -4px; + } + + .i-sdc-designer-leftbar-section-title-text { + margin-left: 20px; + } + + .seperator-left, + .seperator-right { + border-right: solid 1px @color_m; + display: table-cell; + width: 2px; + } + + // Rotate catalog left side arrows + .i-sdc-designer-leftbar-section-title.expanded .i-sdc-designer-leftbar-section-title-icon { + transform: rotate(180deg); + } + + // Transform catalog left side sections + .i-sdc-designer-leftbar-section-title + .i-sdc-designer-leftbar-section-content { + max-height: 0px; + margin: 0 auto; + transition: all .3s; + overflow: hidden; + padding: 0 10px 0 18px; + } + + .i-sdc-designer-leftbar-section-title.expanded + .i-sdc-designer-leftbar-section-content { + max-height: 9999px; + margin: 0 auto 1px; + transition: all .3s; + padding: 10px 18px 10px 18px; + overflow: hidden; + } + +} + +.dcae-search-icon{ + position: absolute; + right: 40px; + top: 40px; + &.leftbar{ + top: 19px; + right: 18px; + } + &.magnification { + .dcae-sprite; + .dcae-sprite.magnification-glass; + .hand; + } + + &.cancel { + .dcae-sprite; + .dcae-sprite.clear-text; + .hand; + } +} + +.dcae-main-container { + background-color: #ECEFF3; + position: absolute; + /*top: 0px;*/ + left: 0; + right: 0; + /*bottom: 0px;*/ + height: 100%; + overflow: auto; +} +.dcae-input-text:read-only{ + background-color: #eaeaea; +} +.dcae-image-text-btn{ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} +.dcae-round-btn{ + border-radius: 50%; + position: relative; + z-index: 2; + padding: 0; + display: inline-block; + color: #fff; + overflow: hidden; + z-index: 1; + width: 75px; + height: 75px; + line-height: 40px; + padding: 0; + background-color: #009fdb; + border-radius: 50%; + transition: .3s; + cursor: pointer; + vertical-align: middle; + border:0; +} +.dcae-round-btn:disabled { + opacity: 0.5; + cursor: not-allowed !important; +} +.dcae-main-container .dcae-main-right-container { + background-color: #ffffff; + bottom: 0; + padding: 22px 12px; + position: absolute; + left: 240px; + right: 0; + top: 0px; + overflow: scroll; +} +.dcae-main-container .dcae-main-right-container > div:first-child { + /* scroll fix */ + padding-bottom: 53px; +} +.sdc-loading-page { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + position: absolute; + height: 100%; + width: 100%; +} +.sdc-loading-page .caption1 { + color: #ffffff; + font-family: omnes-light, sans-serif; + font-size: 24px; + text-align: center; +} +.sdc-loading-page .caption2 { + color: #ffffff; + font-family: omnes-medium, sans-serif; + font-size: 16px; + display: block; +} + +.dcae-dashboard-card-new { + border: 2px dashed #a8b3b9; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; + cursor: pointer; + display: inline-block; + margin: 9px; + position: relative; + vertical-align: middle; + height: 190px; + width: 190px; +} +.dcae-dashboard-card-new-content { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + height: 100%; +} +.dcae-import-icon{ + background: url('images/import.svg') no-repeat center; + display: inline-block; + width: 23px; + height: 23px; + position: relative; +} +.dcae-dashboard-card-new-content-plus { +// background-image: url('images/sprites/sprite-global.png'); + background: url('images/Add.png') no-repeat center; + display: inline-block; +// background-position: -50px -77px; + width: 45px; + height: 45px; + position: relative; +// margin-bottom: 20px; +} +.dcae-dashboard-card-new-content-plus:after { + color: #009fdb; + font-family: omnes-medium, sans-serif; + font-size: 14px; + content: 'Create New Asset'; + position: absolute; + top: 50px; + left: -36px; + vertical-align: -50%; + width:120px; +} +.dcae-dashboard-card-import-content-plus { + background-image: url('images/sprites/sprite-global.png'); + display: inline-block; + background-position: -100px -81px; + width: 23px; + height: 23px; + position: relative; + margin-bottom: 20px; +} +.dcae-dashboard-card-import-content-plus:after { + color: #959595; + font-family: omnes-medium, sans-serif; + font-size: 14px; + content: 'IMPORT'; + position: absolute; + top: 25px; + left: -16px; + vertical-align: -50%; +} +.sdc-dashboard-create-element-container, +.sdc-dashboard-import-element-container { + width: 140px; +} +.sdc-dashboard-create-element-container .tlv-btn.import-dcae, +.sdc-dashboard-import-element-container .tlv-btn.import-dcae { + padding: 0; +} +.sdc-dashboard-create-element-container .tlv-btn, +.sdc-dashboard-import-element-container .tlv-btn { + position: relative; + width: 100%; + margin-bottom: 10px; +} +.sdc-dashboard-create-element-container .tlv-btn:last-child, +.sdc-dashboard-import-element-container .tlv-btn:last-child { + margin-bottom: 0; +} +.sdc-dashboard-create-element-container input[type="file"], +.sdc-dashboard-import-element-container input[type="file"] { + cursor: inherit; + filter: alpha(opacity=0); + opacity: 0; + position: absolute; + top: 0; + left: 0; + width: 138px; + height: 30px; +} + +.dcae-dashboard-card:hover { + border: solid 1px #d2d2d2; + -webkit-box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); + -moz-box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); + box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); +} +.dcae-dashboard-card:active { + border: solid 1px #71c5eb; + -webkit-box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); + -moz-box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); + box-shadow: 3px 3px 2px 0px rgba(24, 24, 25, 0.05); +} + +.dcae-dashboard-card-description { + color: #ffffff; + font-family: omnes-regular, sans-serif; + font-size: 12px; + cursor: pointer; + background-color: rgba(57, 73, 84, 0.9); + border-radius: 4px 4px 0 0; + bottom: 0; + left: 0; + opacity: 0; + padding: 10px; + position: absolute; + right: 0; + text-align: left; + top: 0; + word-wrap: break-word; + z-index: 4; + min-height: 100px; + overflow: hidden; +} +.dcae-dashboard-card-schema { + margin-top: 30px; +} +.dcae-dashboard-card-edit { + cursor: pointer; + position: absolute; + right: 13px; + top: 15px; + z-index: 2; +} +.dcae-dashboard-card-footer { + padding: 0 5px; +// padding: 3px 12px 10px 12px; + position: relative; +} +.dcae-dashboard-card-avatar { + text-transform: uppercase; + border-radius: 50%; + display: inline-block; + position: absolute; + left: -6px; + text-align: center; + top: -6px; +} +.dcae-dashboard-card-avatar span { + background-color: #ffffff; + -webkit-border-radius: 15px; + -moz-border-radius: 15px; + border-radius: 15px; + color: #ffffff; + content: ''; + height: 30px; + text-align: center; + display: block; + border: solid 2px #ECEFF3; + padding: 3px 10px 2px 10px; +} +.dcae-dashboard-card-avatar span.VF { + color: #9063cd; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.VF::before { + content: 'VF'; +} +.dcae-dashboard-card-avatar span.VFC { + color: #9063cd; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.VFC::before { + content: 'VFC'; +} +.dcae-dashboard-card-avatar span.VFCMT { + color: #9063cd; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.VFCMT::before { + content: 'VFCMT'; +} +.dcae-dashboard-card-avatar span.CP { + color: #9063cd; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.CP::before { + content: 'CP'; +} +.dcae-dashboard-card-avatar span.VL { + color: #9063cd; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.VL::before { + content: 'VL'; +} +.dcae-dashboard-card-avatar span.SERVICE { + color: #71c5eb; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.SERVICE::before { + content: 'S'; +} +.dcae-dashboard-card-avatar span.PRODUCT { + color: #056bae; + font-family: omnes-medium, sans-serif; + font-size: 14px; +} +.dcae-dashboard-card-avatar span.PRODUCT::before { + content: 'P'; +} +.dcae-dashboard-card-avatar span.green { + color: #1d9a95; + font-family: omnes-medium, sans-serif; + font-size: 17px; +} +.dcae-dashboard-card-avatar span.green::before { + content: 'R'; +} +.dcae-dashboard-card-avatar span.red { + color: #e85858; + font-family: omnes-medium, sans-serif; + font-size: 17px; +} +.dcae-dashboard-card-avatar span.red::before { + content: 'S'; +} +.dcae-dashboard-card-avatar span.dblack { + color: #000000; + font-family: omnes-medium, sans-serif; + font-size: 17px; +} +.dcae-dashboard-card-avatar span.dblack::before { + content: 'P'; +} +.dcae-dashboard-card-info { + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.dcae-dashboard-card-info-name-container { + position: absolute; + bottom: 0; + left: 0; + margin: 0 0 2px 10px; +} +.dcae-dashboard-card-info-name { + color: #5a5a5a; + font-family: omnes-medium, sans-serif; + font-size: 14px; + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.dcae-dashboard-card-info-lifecycleState { + color: #5a5a5a; + font-family: omnes-medium, sans-serif; + font-size: 13px; + display: inline-block; + vertical-align: middle; + max-width: 165px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.dcae-dashboard-card-info-user { + color: #959595; + font-family: omnes-regular, sans-serif; + font-size: 13px; + line-height: 18px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + width: 100%; +} +.dcae-dashboard-card-menu-button { + display: inline-block; + padding: 12px 0 0 10px; + position: absolute; + right: 12px; + top: 8px; + border-left: solid 1px #e1e7ec; + height: 42px; +} +.dcae-dashboard-card-menu-button:hover .dcae-dashboard-card-menu { + display: block; +} +.dcae-dashboard-card-menu { + background-color: #ffffff; + border-radius: 0 0 4px 4px; + border-top: 3px solid #3b7b9b; + box-shadow: 0 2px 2px 0px rgba(0, 0, 0, 0.2); + color: #000000; + display: none; + min-height: 30px; + padding: 9px 0; + position: absolute; + right: -27px; + width: 208px; + z-index: 9; + max-height: 164px; +} +.dcae-dashboard-card-menu::before { + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE1OTIzNDI1MENFQjExRTU4ODRERTI1MDM2REZCOUYzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE1OTIzNDI2MENFQjExRTU4ODRERTI1MDM2REZCOUYzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTU5MjM0MjMwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTU5MjM0MjQwQ0VCMTFFNTg4NERFMjUwMzZERkI5RjMiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4gBXTlAAAAOElEQVR42mK0rp7NgASMgZgFiE/CBJjQJPcA8U4gNkdXAJMUAGJ+ZEVMaJIwAFfEhEUSRRFAgAEAVtgJyiLAPWAAAAAASUVORK5CYII='); + content: ''; + display: block; + height: 21px; + position: absolute; + right: 24px; + top: -24px; + width: 184px; + background-repeat: no-repeat; + background-position: 175px 16px; +} + +.perfect-scrollbar { + position: relative; + overflow: hidden; +} + +.scroller { + white-space: pre-line; + height: 500px; + overflow-y: hidden; + position: relative; +} + +.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y { + background-color: #666666; + -webkit-border-radius: 0px; + -moz-border-radius: 0px; + border-radius: 0px; + opacity: 1; + width: 6px; + margin: 0 2px; +} +.ps-container > .ps-scrollbar-y-rail { + -webkit-border-radius: 0px; + -moz-border-radius: 0px; + border-radius: 0px; + width: 10px ; + background-color: rgba(255, 255, 255, 0.5); + z-index: 1000; +} + +/* dashboard card statuses icons */ +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN { background-position: -47px -2839px; width: 20px; height: 19px;} +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN.green { background-position: -70px -2839px;} +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKIN.red { background-position: -93px -2839px;} + +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT { background-position: -53px -2889px; width: 14px; height: 14px;} +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT.green { background-position: -76px -2889px;} +.dcae-s-sdc-state.NOT_CERTIFIED_CHECKOUT.red { background-position: -99px -2889px;} + +.dcae-s-sdc-state.CERTIFIED { background-position: -53px -3034px; width: 14px; height: 16px;} +.dcae-s-sdc-state.CERTIFIED.green { background-position: -76px -3034px;} +.dcae-s-sdc-state.CERTIFIED.red { background-position: -99px -3034px;} + +.dcae-s-sdc-state.READY_FOR_CERTIFICATION { background-position: -53px -2985px; width: 14px; height: 16px;} +.dcae-s-sdc-state.READY_FOR_CERTIFICATION.green { background-position: -76px -2985px;} +.dcae-s-sdc-state.READY_FOR_CERTIFICATION.red { background-position: -99px -2985px;} + +.dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS { background-position: -53px -2934px; width: 14px; height: 16px;} +.dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS.green { background-position: -76px -2934px;} +.dcae-s-sdc-state.CERTIFICATION_IN_PROGRESS.red { background-position: -99px -2934px; } + +.dcae-s-sdc-state.DISTRIBUTED { background-position: -43px -3087px; width: 24px; height: 14px;} +.dcae-s-sdc-state.DISTRIBUTED.green { background-position: -76px -3087px;} +.dcae-s-sdc-state.DISTRIBUTED.red { background-position: -113px -3087px;} + diff --git a/app/main/dashboard/dcaedt/dcaedt.controller.js b/app/main/dashboard/dcaedt/dcaedt.controller.js new file mode 100644 index 0000000..499a523 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt.controller.js @@ -0,0 +1,519 @@ +(function () { + + 'use strict'; + + var CHECKOUT = 'NOT_CERTIFIED_CHECKOUT'; + + var DashboardDCAEController = function ($rootScope, $scope, $log, $location, dcaeFactory, $stateParams, $state, appSettings, $http, $templateCache) { + $scope.appSettings = appSettings; + + function init() { + if ($rootScope.VNFs === undefined) { + dcaeFactory + .getVNFList() + .then(function (response) { + $rootScope.VNFs = response.data; + $rootScope.VNFsRef = $rootScope.VNFs; + $scope.title = appSettings.title; + //var vm = this; vm.test = appSettings.title; + }, function (res, status, headers, config) { + errorHanlder(res); + $rootScope.VNFs = []; + }); + } + $rootScope.$state = $state; + $rootScope.$stateParams = $stateParams; + } + + init(); + + $scope.sortingVfcmts = function () { + $rootScope.VNFs = $rootScope.VNFsRef; + switch (value) { + case 'New': + return $rootScope + .VNFs + .reverse() + case 'Abc': + return $rootScope.VNFs = _.sortBy($rootScope.VNFs, function (s) { + return s + .name + .charCodeAt() * -1; + }).reverse(); + default: + return $rootScope.VNFs; + } + } + + $scope.goGeneral = function (component, createMode, typeFlag) { + // typeFlag: true when VNF, false when Service Assurance + $rootScope.component = component; + $rootScope.readOnlyComponent = false; + $rootScope.resultInformation = ""; + if (component != null) { + if (component.lastUpdaterUserId !== $rootScope.userId && component.lifecycleState === CHECKOUT) { + console.log('readOnlyComponent'); + $rootScope.readOnlyComponent = true; + } + $rootScope.componentUser = component.lastUpdaterUserId; + } + + $rootScope.createMode = createMode; + $rootScope.typeFlag = typeFlag; + $rootScope.s = ''; + + console.log(createMode); + console.log(component); + console.log(typeFlag); + + //description + if (component && component.uuid) { + $http({ + method: 'GET', + url: window.host + 'resource/' + component.uuid, + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + } // set the headers so angular passing info as form data (not request payload) + }) + .then(function (response) { + if (response && response.data && response.data.description) + $rootScope.component.description = response.data.description; + //console.log(response); + } + ); + } + + if (typeFlag == null) { + $scope.pullArtifacts(component); + } else { + if (!typeFlag) { + //$scope.Services(); + } + $scope.page = "general"; + $state.go('dcae.app.general'); + + } + } + + $scope.saveOnSdcExit = function (params) { + if (params === 'ok') { + document + .getElementById("savebtn") + .click(); + } else { + window + .sdc + .notify('ACTION_COMPLETED'); + } + } + + $scope.goSelfServe = function (component, createMode) { + //$location.url('/general'); if(component) { + $scope.page = "self_serve"; + $state.go('dcae.app.self_serve'); + $rootScope.component = component; + $rootScope.createMode = createMode; + console.log(component); + /*} else { + $scope.page="general"; + $state.go('dcae.app.general'); + $rootScope.createMode = true; + $rootScope.component={}; + }*/ + + } + + $scope.goImport = function (component, createMode) { + //$location.url('/general'); if(component) { + $scope.page = "import"; + $state.go('dcae.app.import'); + $rootScope.component = component; + $rootScope.createMode = createMode; + console.log(component); + /*} else { + $scope.page="general"; + $state.go('dcae.app.general'); + $rootScope.createMode = true; + $rootScope.component={}; + }*/ + } + + $scope.goToBreadcrumbHome = function () { + $scope.page = "home"; + $state.go('dcae.app.home'); + } + + $scope.goServices = function (component) { + $scope.Services(); + } + + $scope.goComposition = function (component, typeFlag) { + //$location.url('/general'); $scope.uuid = ""; + $scope.page = "composition"; + $rootScope.component = component; + $state.go('dcae.app.composition'); + $rootScope.componentUrl = 'comp-fe/icecat.html'; + $rootScope.typeFlag = typeFlag; + $rootScope.updateTime = Date.now(); + + $rootScope.importVNFs = $rootScope + .VNFs + .filter(function (item) { + return item.uuid !== $rootScope.component.uuid; + }); + + $http + .get(window.host + '/conf/composition') + .then(function (response) { + // success callback console.log(response); + window.flowTypes = response.data.flowTypes; + window.isRuleEditorActive = response.data.isRuleEditorActive; + }, function (response) { + // failure call back console.log(response); + $rootScope.dataTypes = "No Data Type"; + }); + console.log('userId: ', $rootScope.userId); + console.log('lastUpdaterUserId: ', $rootScope.component.lastUpdaterUserId); + $rootScope.disableImport = true; + document.addEventListener('noComposition', function () { + $rootScope + .$apply(function () { + $rootScope.disableImport = false; + }); + }, {once: true}); + // console.log($templateCache('comp-fe/icecat.html')); $rootScope.componentUrl = + // "comp-fe/icecat.html#"+component.uuid; + + } + + $scope.selectVfcmtRow = function (importComponent, currentComponent, row) { + $scope.importComponent = importComponent; + $scope.currentComponent = currentComponent; + $scope.selectedRow = row; + } + + $scope.importVfcmt = function () { + $scope.clone($scope.importComponent, $scope.currentComponent); + } + + $scope.clone = function (x, y) { + var popup = confirm('Are you sure you want to import? this action will replace the current compositio' + + 'n!'); + if (popup == true) { + $http({ + method: 'GET', + url: window.host + 'utils/clone/resource/' + x.uuid + '/' + y.uuid, + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + } // set the headers so angular passing info as form data (not request payload) + }) + .then(function (response) { + console.log("Clone response:", response); + $rootScope.updateTime = Date.now(); + }) + .catch(function (res) { + $rootScope.errorMsg = errorHanlder(res); + }); + + // $rootScope.component = x; $rootScope.updateTime = Date.now(); + // $scope.goComposition(y); + } + }; + + $scope.openImport = function () { + // debugger; jQuery.noConflict(); + jQuery('#import').modal("show"); + } + + $scope.goArtifact = function () { + //$location.url('/general'); + $scope.page = "artifact"; + $state.go('dcae.app.artifact'); + } + + $scope.showAttach = function () { + if (typeof $rootScope.service !== 'undefined' && typeof $rootScope.vnfi !== 'undefined' && !jQuery.isEmptyObject($rootScope.service) && !jQuery.isEmptyObject($rootScope.vnfi)) { + return false; + } else { + return true; + } + } + + $scope.saveServiceSelection = function (x, y, z) { + $scope.loader = true; + + $rootScope.service = y; + $rootScope.vnfi = z; + $rootScope.resultInformation2 = false; + $http({ + method: 'POST', + url: window.host + x.uuid + '/attachment', + // / ' + x.uuid + ' / ' + y.uuid + ' / ' + z.name, + data: { + 'serviceUuid': y.uuid, + 'instanceName': z.name + }, + + headers: { + 'Content-Type': 'application/json' + } + }) + .then(function (response) { + $scope.loader = false; + console.log(response.data); + $rootScope.resultInformation2 = true; + }) + .catch(function (res) { + $rootScope.errorMsg = errorHanlder(res); + }); + } + + $scope.save = function () { + var generalUserInput = {}; + $scope.createMode = true; + $scope.loader = true; + generalUserInput.name = this.component.name; + generalUserInput.description = this.component.description; + console.log(JSON.stringify(generalUserInput, null, 4)); + var config = { + headers: { + 'Content-Type': 'application/json' + } + }; + + $rootScope.resultInformation = ""; + + dcaeFactory + .postData(window.host + 'createVFCMT', generalUserInput, config) + .then(function (res) { + $scope.PostDataResponse = res.data; + console.log(res.data); + $rootScope.component = $scope.component = res.data; + $rootScope + .VNFs + .push($rootScope.component); + $rootScope.service = {}; + $rootScope.vnfi = {}; + showResultInfo("VFCMT Created/Saved.", 5000); + }) + .catch(function (res) { + console.log("Error: ", res.data.notes); + showResultInfo(res.data, 5000); + $rootScope.resultInformation = errorHanlder(res); + }) + . finally(function () { + $scope.loader = false; + }); + + function showResultInfo(msg, msDuration) { + $rootScope.resultInformation = msg; + setTimeout(function () { + $rootScope.resultInformation = ""; + }, msDuration); + } + } + + $scope.add = function () { + var f = document + .getElementById('file') + .files[0], + r = new FileReader(); + r.onloadend = function (e) { + var binary = ""; + var bytes = new Uint8Array(e.target.result); + var length = bytes.byteLength; + + for (var i = 0; i < length; i++) { + binary += String.fromCharCode(bytes[i]); + } + + $scope.data = (binary).toString(); + alert($scope.data); + } + r.readAsArrayBuffer(f); + } + + $scope.showTypeFilter = function (type) { + if ($rootScope.component == null) { + return true; + } else { + return !(type.invariantUUID).includes($rootScope.component.invariantUUID); + } + } + + $scope.pullArtifacts = function (x) { + console.log('pull artifacts commenced'); + $http({ + method: 'GET', + url: window.host + x.uuid + '/attachment', + headers: { + 'Content-Type': 'application/json' + } // set the headers so angular passing info as form data (not request payload) + }) + .then(function (response) { + + $rootScope.typeFlag = true; + var res = response.data.successResponse; + + if (res != "No Artifacts") { + $rootScope.typeFlag = false; + var uuid = res.substring(0, res.indexOf("/")); + var name = res.substring(res.indexOf("resources/") + 10); + //$scope.Services(); $scope.VNFIs(uuid); + $rootScope.s = uuid + ' / ' + name; + $rootScope.service = { + uuid: uuid + }; + $rootScope.vnfi = { + name: name + }; + } else { + var uuid = null; + var name = null; + } + $rootScope.typeFlag = true; + console.log($rootScope.s); + // final navigation + $scope.page = "general"; + $state.go('dcae.app.general'); + }) + .catch(function (res) { + $rootScope.errorMsg = errorHanlder(res); + }); + }; + + $scope.Services = function () { + // clear dropDown + $scope.loader = true; + if (jQuery.isEmptyObject($rootScope.service) && jQuery.isEmptyObject($rootScope.vnfi)) { + $rootScope.resultInformation2 = false; + $rootScope.vnfis = []; + } else { + $rootScope.resultInformation2 = true; + $scope.VNFIs($rootScope.service.uuid); + } + $http({ + method: 'GET', + url: window.host + 'services/' + $rootScope.component.uuid, + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + } // set the headers so angular passing info as form data (not request payload) + }) + .then(function (response) { + $rootScope.services = response.data; + console.log($rootScope.services); + $rootScope.services = $rootScope + .services + .map(function (service) { + if (!(service.lifeCycleState === CHECKOUT && service.lastUpdaterUserId !== $rootScope.userId)) { + return service; + } else { + console.log("remove form dropDown:" + service.name + " " + service.lifeCycleState + " " + service.lastUpdaterUserId); + } + }) + .filter(function (item) { + return item !== undefined; + }); + + $scope.loader = false; + $rootScope.vnfiTouch = false; + $scope.page = "services"; + $state.go('dcae.app.services'); + }) + .catch(function (res) { + $rootScope.errorMsg = errorHanlder(res); + }) + . finally(function () { + $scope.loader = false; + }); + }; + + $scope.vnfiChange = function (y) { + $rootScope.vnfi = {}; + if (y) { + $rootScope.vnfi.name = y; + } + } + + $scope.VNFIs = function (x) { + $http({ + method: 'GET', + url: window.host + 'service/' + x, + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + } // set the headers so angular passing info as form data (not request payload) + }) + .then(function (response) { + $rootScope.service = {}; + $rootScope.service.uuid = x; + $rootScope.vnfis = []; + $rootScope.vnfiTouch = true; + if (response.data.resources) { + response + .data + .resources + .forEach(function (x) { + var v = { + 'name': x.resourceInstanceName, + 'uuid': x.resourceInvariantUUID + }; + $rootScope + .vnfis + .push(v); + }); + } + console.log($rootScope.vnfis); + return response.data; + }) + .catch(function (res) { + $rootScope.errorMsg = errorHanlder(res); + }) + . finally(function () { + $scope.loader = false; + }); + } + }; + + DashboardDCAEController.$inject = [ + '$rootScope', + '$scope', + '$log', + '$location', + 'dcaeFactory', + '$stateParams', + '$state', + 'appSettings', + '$http', + '$templateCache' + ]; + + angular + .module('dcaeApp.dashboard.dcae') + .controller('DashboardDCAEController', DashboardDCAEController); + + angular + .module('dcaeApp.dashboard.dcae') + .directive('leftMenu', function ($state) { + return { + templateUrl: 'main/dashboard/dcaedt/leftMenu.html', + controller: function ($scope, $state) { + $scope.page = $state + .current + .url + .substring(1, $state.current.url.length); + console.log("page: " + $scope.page); + } + } + }); + +})(); + +function errorHanlder(res) { + console.log("Error: ", res.data.notes); + var tempError = Object + .keys(res.data.requestError) + .map(function (key) { + return res.data.requestError[key]; + }); + return tempError[0].formattedErrorMessage; +} diff --git a/app/main/dashboard/dcaedt/dcaedt.factory.js b/app/main/dashboard/dcaedt/dcaedt.factory.js new file mode 100644 index 0000000..934ed76 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt.factory.js @@ -0,0 +1,27 @@ +(function () { + + 'use strict'; + + var dcaeFactory = function ($http, appSettings) { + + var factory = {}; + + factory.getVNFList = function () { + return $http.get(window.host + 'getResourcesByCategory'); + }; + + factory.postData = function (url, data, config) { + return $http.post(url, data, config); + }; + + return factory; + }; + + dcaeFactory.$inject = ['$http', 'appSettings']; + + angular + .module('dcaeApp.dashboard.dcae') + .factory('dcaeFactory', dcaeFactory); + + +})(); diff --git a/app/main/dashboard/dcaedt/dcaedt.html b/app/main/dashboard/dcaedt/dcaedt.html new file mode 100644 index 0000000..7084cf0 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt.html @@ -0,0 +1,69 @@ +<div ng-controller="AppController as vm" class="{{state.current.bodyClass || ''}} dcaeApp dcae-module"> + <loader data-display="isLoading"></loader> + + <div class="dcae-main-container" style="padding: 1rem;"> + + <div style="display: flex; justify-content: space-between; margin:10px 0;"> + <span style="padding-left: 10px; display: flex; align-items: center;"> + <span ng-if="!VNFs" style="padding-right:3px;">0</span> {{ VNFs.length }} VFCMTS + </span> + + <div style="position: relative; margin-right:9px;"> + <input type='text' ng-model='searchVfc' placeholder="Search" class="form-control" style="border-radius: 2px;width: 400px; height: 32px;line-height: 32px;border: 1px solid #d2d2d2;outline: none;text-indent: 10px; background: white;" + /> + <span class="glyphicon glyphicon-search form-control-feedback" aria-hidden="true"></span> + </div> + </div> + <!-- <br /> + <br /> + <footer>Version: {{ appSettings.version }} </footer> --> + <div style="display: flex; flex-wrap: wrap; justify-content: flex-start;"> + <div class="dcae-dashboard-card"> + <div class="dcae-dashboard-card-new-content" data-tests-id="AddButtonsArea" data-ng-click="goGeneral(null, true, true)"> + <div class="dcae-dashboard-card-new-content-plus" data-ng-show="!displayActions"></div> + <div class="sdc-dashboard-create-element-container" data-ng-show="displayActions"> + <!-- <button data-tests-id="createResourceButton" class="tlv-btn-svc_assu outline blue" data-ng-click="goGeneral(null, true, true)">Add VNF + Assurance Template</button> + <button data-tests-id="createResourceButton" class="tlv-btn-svc_assu outline blue" data-ng-click="goGeneral(null, true, false)">Add Service + Assurance Template</button> --> + </div> + </div> + </div> + + <div class="tlv-loader large" ng-if="!VNFs"></div> + + <div data-ng-class="{'sdc-hide-popover': hidePopover}" data-ng-init="component.filterTerm = component.name + ' ' + component.description + ' ' + component.tags.toString() + ' ' + component.version" + class="dcae-dashboard-card ng-scope" data-ng-repeat="component in VNFs | filter:searchVfc" data-ng-class="{'resource' : component.resourceType === 'VFC', 'service' : component.isService(), 'product' : component.isProduct()}"> + + + <div class="dcae-dashboard-card-body" data-ng-click="gui.isLoading || goGeneral(component, false, null)"> + <!-- <div class="dcae-dashboard-card-avatar"> + <span data-tests-id="asset-type" class="{{component.resourceType}}"></span> + </div> --> + <div class="dcae-vfcmt-title"> + <span>{{component.resourceType}}</span> + </div> + + <!-- <div class="dcae-dashboard-card-edit " data-ng-class="component.lifecycleState" data-tests-id="assetlifecycleState {{getStatus()}}"></div> --> + <div class="dcae-dashboard-card-schema-image sprite-resource-icons defaulticon" style="background-image: url(/sdc1/scripts/images/sprite-resource-icons.e1bcf178b7b79fd5c93f.png);display: inline-block;" + data-tests-id="{{component.categories[0].subcategories[0].uniqueId}}"></div> + + <div class="dcae-dashboard-card-description">{{component.description}}</div> + <div class="dcae-dashboard-card-info-name-container" style="text-align: left"> + <span class="dcae-dashboard-card-info-name" tooltips tooltip-content="{{component.name}}r"> {{component.name}}</span> + <div class="dcae-dashboard-card-info-user">V {{component.version}} + </div> + </div> + </div> + + <div class="dcae-dashboard-card-footer"> + <div class="dcae-dashboard-card-info"> + <div class="dcae-dashboard-card-info-user" style="font-size: 10px;"> + {{component.lifecycleState}} + </div> + </div> + </div> + </div> + </div> + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt.module.js b/app/main/dashboard/dcaedt/dcaedt.module.js new file mode 100644 index 0000000..d5c6a64 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt.module.js @@ -0,0 +1,148 @@ +(function () { + + 'use strict'; + + angular + .module('dcaeApp.dashboard.dcae', []) + .config(config); + + function config($stateProvider) { + + $stateProvider.state('dcae.app.home', { + url: '/home', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + + .state('dcae.app.general', { + url: '/general', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_general.html', + controller: 'DashboardDCAEController as vm' + }, + 'leftMenu': { + templateUrl: 'main/dashboard/dcaedt/leftMenu.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + + .state('dcae.app.services', { + url: '/services', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_services.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + /* + .state('dcae.app.general_vnf', { + url: '/general_vnf', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_general_vnf.html', + controller: 'DashboardDCAEController as vm' + } + }, + + /*onEnter: function () { + //i hide header tabs, you can add your code here + openNav(); + }, + onExit: function () { + //i hide header tabs, you can add your code here + closeNav(); + }, ////////// + bodyClass: 'about' + }) + .state('dcae.app.general_service', { + url: '/general_service', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_general_service.html', + controller: 'DashboardDCAEController as vm' + } + }, + + /*onEnter: function () { + //i hide header tabs, you can add your code here + openNav(); + }, + onExit: function () { + //i hide header tabs, you can add your code here + closeNav(); + }, ////////// + bodyClass: 'about' + })*/ + .state('dcae.app.import', { + url: '/import', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_import.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + .state('dcae.app.self_serve', { + url: '/self_serve', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_self_serve.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + .state('dcae.app.artifact', { + url: '/artifact', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_artifact.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }) + .state('dcae.app.comp-fe', { + url: '/comp-fe', + views: { + 'content@dcae.app': { + templateUrl: 'comp-fe/icecat.html', + controller: '' + } + }, + bodyClass: 'about' + }) + .state('dcae.app.composition', { + url: '/composition', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/dcaedt/dcaedt_composition.html', + controller: 'DashboardDCAEController as vm' + } + }, + bodyClass: 'about' + }); + + } + + function openNav() { + document.getElementById("dcaeSidenav").style.width = "150px"; + document.getElementById("content-container").style.marginLeft = "150px"; + } + + function closeNav() { + document.getElementById("dcaeSidenav").style.width = "0"; + } + +})(); diff --git a/app/main/dashboard/dcaedt/dcaedt.values.js b/app/main/dashboard/dcaedt/dcaedt.values.js new file mode 100644 index 0000000..9285ca8 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt.values.js @@ -0,0 +1,6 @@ +angular.module('dcaeApp.dashboard.dcae').value('appSettings', { + title: 'DCAE Application', + version: '1.0', + + backend_url: window.host +}); diff --git a/app/main/dashboard/dcaedt/dcaedt_artifact.html b/app/main/dashboard/dcaedt/dcaedt_artifact.html new file mode 100644 index 0000000..b2f9751 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_artifact.html @@ -0,0 +1,18 @@ + <div class="dcae-main-container"> + <div class="dcae-left-sidebar" > + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ui-sref="dcae.app.home">Home</div> + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ng-click="goGeneral(component, false)">General</div> + <div class="dcae-menu-item" ng-class="{selected:page==='import'}" ng-click="goImport(component, false)">Import</div> + <div class="dcae-menu-item" ng-class="{selected:page==='composition'}" ng-click="goComposition()" data-tests-id="dcae-menu-item-Composition">Composition</div> + <div class="dcae-menu-item selected" ng-class="{selected:page==='artifact'}" ng-click="goArtifact()">Artifact</div> + </div> + + <div class="dcae-main-right-container"> + <ul class="navigation-top-menu"> + <li><a ui-sref="dcae.app.home">Home</a></li> + <li><a ui-sref="dcae.app.general">General</a></li> + <li><a ui-sref="dcae.app.artifact">Artifact</a></li> + </ul> + <h1>This is Artifact</h1> + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt_composition.html b/app/main/dashboard/dcaedt/dcaedt_composition.html new file mode 100644 index 0000000..8801a79 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_composition.html @@ -0,0 +1,158 @@ +<div class="dcae-main-container"> + <div class="dcae-left-sidebar" left-menu></div> + + <div class="dcae-main-right-container" style="overflow:hidden; margin-top:0px; padding:0"> + + <div id="composition-loader" class="tlv-loader large"></div> + + <div style="display: flex; justify-content: space-between; padding-bottom: 20px; +align-items: center; padding: 1rem;"> + <!-- <div ng-if="!readOnlyComponent"> + <button class="dcae-round-btn" ng-disabled="disableImport" ng-click="openImport()" style="position: absolute; left:7%"> + <div class="dcae-image-text-btn"> + <span class="dcae-import-icon"></span> + <span style="line-height: 25px;">import</span> + </div> + </button> + </div> --> + <div style="display: flex; justify-content: flex-end; padding: 9px 0;"> + <button class="tlv-btn blue" ng-if="!component.uuid" ng-disabled="!createMode" ng-click="save()" style="margin-right: 10px;"> + save + </button> + <button class="tlv-btn outline blue" ng-click="goToBreadcrumbHome()"> + cancel + </button> + </div> + </div> + + <div id="icecat" class="embed-responsive embed-responsive-16by9" style="background-color:white;box-shadow: 0 0 10px #AAA;"> + + <div ng-include="catalogImport+'/icecat.html?updated=' + updateTime" onload="loadComposition()" componentid={{component.uuid}} + serviceuuid={{service.uuid}} vnfiname={{vnfi.name}} user_id={{userId}} typeFlag={{typeFlag}} componentUser={{componentUser}} + id="iframe" class="embed-responsive-item" readOnlyComponent={{readOnlyComponent}}></div> + + </div> + </div> +</div> + +<!-- Modal --> +<div class="modal fade" id="import" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header" style="border-bottom: 3px solid #009fdb; margin: 0 10px;"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + <h4 class="modal-title" id="myModalLabel">Import Composition</h4> + </div> + <div class="modal-body" style="height:600px; overflow:scroll;"> + + <div style="display: flex; justify-content: space-between; margin:10px 0;"> + <span style="padding-left: 10px; display: flex; align-items: center;">{{ VNFs.length }} VFCMTS </span> + <div style="position: relative;"> + <input type='text' ng-model='searchVfc' placeholder="Search" style="border-radius: 2px;width: 300px; height: 32px;line-height: 32px;border: 1px solid #d2d2d2;outline: none;text-indent: 10px; background: white;" + /> + <span class="glyphicon glyphicon-search form-control-feedback" aria-hidden="true"></span> + </div> + </div> + + <div class="tlv-loader large" ng-if="!VNFs"></div> + + <table class="table table-bordered"> + <thead style="background: #eaeaea;"> + <tr> + <th>name</th> + <th>version</th> + </tr> + </thead> + <tbody> + <tr data-ng-init="componentx.filterTerm = componentx.name + ' ' + componentx.description + ' ' + componentx.tags.toString() + ' ' + componentx.version" + ng-repeat="componentx in importVNFs | filter:searchVfc" ng-click="selectVfcmtRow(componentx,component, $index)" + ng-class="{info: $index == selectedRow}"> + <td> + {{componentx.name}} + </td> + <td> + {{componentx.version}} + </td> + </tr> + </tbody> + </table> + </div> + <div class="modal-footer" style="background: #eaeaea;"> + <button type="button" class="tlv-btn blue" ng-click="importVfcmt()" data-dismiss="modal"> + import + </button> + <button type="button" class="tlv-btn outline blue" data-dismiss="modal"> + cancel + </button> + </div> + </div> + </div> +</div> + + +<!-- Modal Rule-Editor --> +<div class="modal fade rule-editor-modal" id="rule-editor-modal" tabindex="-1" role="dialog"> + <div class="modal-dialog" role="document" style="width: 90vw;"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + </div> + <div class="tlv-loader large" id="modal-loader"></div> + <div width="100%" style="height: 90vh; width: 100%;"> + <iframe frameborder="0" width="100%" height="100%"></iframe> + </div> + </div> + </div> +</div> + +<!-- confirm modal --> +<div class="modal fade" id="confirm-modal" tabindex="-1" role="dialog"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + <h4 class="modal-title">Save composition</h4> + </div> + <div class="modal-body"> + Do you want to save composition? + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal" id="btn-confirm-save" ng-click="saveOnSdcExit('ok')">Ok</button> + <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="saveOnSdcExit('cancel')">Cancel</button> + </div> + </div> + <!-- /.modal-content --> + </div> + <!-- /.modal-dialog --> +</div> +<!-- /.modal --> + +<!-- alert modal --> +<div class="modal fade" id="alert-modal" tabindex="-1" role="dialog"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + <h4 class="modal-title">Error</h4> + <hr class="modal-header-error" /> + </div> + <div class="modal-body"> + <!-- message is inserted via JS --> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal" id="btn-confirm-save">Ok</button> + </div> + </div> + <!-- /.modal-content --> + </div> + <!-- /.modal-dialog --> +</div> +<!-- /.modal --> diff --git a/app/main/dashboard/dcaedt/dcaedt_general.html b/app/main/dashboard/dcaedt/dcaedt_general.html new file mode 100644 index 0000000..3cd3b7f --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_general.html @@ -0,0 +1,202 @@ +<meta http-equiv="cache-control" content="no-cache" /> +<div class="dcae-main-container"> + <div class="dcae-left-sidebar" left-menu></div> + + <div class="dcae-main-right-container"> + + <div class="sdc-workspace-top-bar-buttons" style="display: flex; justify-content: flex-end; border-bottom: 1px solid #cdcdcd; padding: 9px 0;"> + <button class="tlv-btn blue" ng-if="!component.uuid" ng-disabled="$parent.editForm.$valid == false" ng-click="save()" style="margin-right: 10px;" + data-tests-id="Save-General"> + save + </button> + <button class="tlv-btn outline blue" ng-click="goToBreadcrumbHome()" data-tests-id="Cancel-General"> + cancel + </button> + </div> + + <!-- <div class="dcae-workspace-top-bar"> + <div ng-hide="createMode" class="version-container "> + <span class="lifecycle-state-text ng-binding ng-scope" data-tests-id="formlifecyclestate">V{{component.version}}</span> + </div> + + <div ng-hide="createMode" class="lifecycle-state"> + <div data-ng-hide="showLifecycleIcon()" class="lifecycle-state-icon" data-ng-class="{'in-design-status-icon': createMode, '': !createMode}"></div> + <span class="lifecycle-state-text ng-binding ng-scope" data-tests-id="formlifecyclestate">{{component.lifecycleState}}</span> + </div> + + + <div ng-if="!createMode" class="progress-container"> + <div class="general-view-top-progress top-progress ng-isolate-scope" progress-value="progressService.getProgressValue(component.uniqueId)" + progress-message="progressMessage"></div> + </div> + + <div class="sdc-workspace-top-bar-buttons"> + + <span data-ng-if="isDesigner()" data-ng-class="{'disabled' :isDisableMode() || isViewMode()}" ng-click="revert()" class="dcae-sprite-new revert-btn ng-scope disabled" + data-tests-id="revert" data-ng-show="showFullIcons()" sdc-smart-tooltip="" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Revert</span> + <span class="delimiter"></span> <span class="dcae-sprite-new x-btn" data-ng-click="goToBreadcrumbHome()" + sdc-smart-tooltip="" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Close</span> + + </div> + + + </div> --> + <div class="tlv-loader large" ng-if="loader"></div> + + <div class="dcae-asset-creation-info" ng-if="component.uuid"> + <div> + <b>UUID:</b> {{component.uuid}} + <b style="padding-left: 15px;"> Invariant UUID:</b> {{component.invariantUUID}} + </div> + <div> + <b>last updater:</b> + {{component.lastUpdaterUserId}} + <b style="padding-left: 15px;">lifecycle state:</b> + {{component.lifecycleState}} + </div> + </div> + + <div include-padding="true" class="sdc-workspace-general-step ng-scope"> + + <form novalidate="" class="w-sdc-form ng-pristine ng-valid-name-exist ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength" + name="editForm"> + + <div class="w-sdc-form-section-container"> + + <div class="i-sdc-form-item"> + <div class="general-view-top-progress top-progress ng-isolate-scope" progress-value="progressValue" progress-message="progressMessage"> + + <!--======================= Top progress var =======================--> + <!-- ngIf: progressValue>0 && progressValue<100 --> + + <!-- ngIf: progressValue===100 --> + + <!-- ngIf: progressValue===-1 --> + <!--======================= Top progress var =======================--> + + </div> + </div> + + + <div class="w-sdc-form-columns-wrapper"> + + <div class="w-sdc-form-column"> + + <!--------------------- NAME --------------------> + <div class="i-sdc-form-item" data-ng-class="{'error': validateField(editForm.componentName)}"> + <label class="i-sdc-form-label required">Name</label> + <input type="text" class="i-sdc-form-input dcae-input-text" ng-readonly="component.uuid" data-ng-class="{'view-mode': isViewMode()}" + name="componentName" data-ng-init="isCreateMode() && validateName(true)" data-ng-model="component.name" + data-ng-disabled="component.isAlreadyCertified()" data-tests-id="name" autofocus="" placeholder="Name" + ng-readonly="isViewMode()" data-ng-maxlength="50" maxlength="50" data-ng-minlength="0" minlength="0" + data-required="" data-ng-model-options="{ debounce: 500 }" data-ng-pattern="/^[\s\w\&_.:-]{1,1024}$/"> + <!--<input + class="i-sdc-form-input ng-pristine ng-valid-name-exist ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength ng-touched" + data-ng-class="{'view-mode': isViewMode()}" + name="componentName" + data-ng-init="isCreateMode() && validateName(true)" + data-ng-maxlength="50" maxlength="50" data-ng-minlength="0" + minlength="0" data-ng-model="component.name" type="text" + data-required="" data-ng-model-options="{ debounce: 500 }" + data-ng-pattern="/^[\s\w\&_.:-]{1,1024}$/" + data-ng-disabled="component.isAlreadyCertified()" + data-tests-id="name" autofocus="" ng-readonly="isViewMode()">--> + + <div class="input-error ng-hide" data-ng-show="validateField(editForm.componentName)"> + <span ng-show="editForm.componentName.$error.required" translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_NAME_REQUIRED" class="ng-scope"> + Name is required. + </span> + <span ng-show="editForm.componentName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '50' }" + class="ng-scope ng-hide"> + Max length 50 characters. + </span> + <span ng-show="editForm.componentName.$error.minlength" translate="VALIDATION_ERROR_MIN_LENGTH" translate-values="{'min': '4' }" + class="ng-scope ng-hide">Min length 4 characters.</span> + <span ng-show="editForm.componentName.$error.nameExist" translate="NEW_SERVICE_RESOURCE_ERROR_NAME_EXISTS" class="ng-scope ng-hide">Name already exists.</span> + <span ng-show="editForm.componentName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED" class="ng-scope ng-hide">Special characters not allowed. + </span> + </div> + </div> + <!--------------------- NAME --------------------> + + <!--------------------- FULL NAME --------------------> + <!-- ngIf: component.isProduct() --> + <!--------------------- NAME --------------------> + + <!--------------------- DESCRIPTION --------------------> + <div class="i-sdc-form-item" data-ng-class="{'error': validateField(editForm.description)}"> + <label class="i-sdc-form-label required">Description</label> + <textarea class="description dcae-input-text" ng-readonly="component.uuid" name="description" data-ng-class="{'view-mode': isViewMode()}" + data-ng-maxlength="1024" placeholder="Description" data-required="" data-ng-model="component.description" + data-ng-model-options="{ debounce: 500 }" data-ng-pattern="/^[\u0000-\u00BF]*$/" maxlength="1024" + data-tests-id="description"></textarea> + <!-- placeholder="Description here..." --> + + <div class="input-error" ng-if="editForm.description.$dirty"> + <span ng-if="editForm.description.$error.required" translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_DESCRIPTION_REQUIRED" class="ng-scope">Description is required.</span> + <span ng-if="editForm.description.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '1024' }" + class="ng-scope ng-hide">Max length 1024 characters.</span> + <span ng-if="editForm.description.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED">Special characters not allowed. + </span> + </div> + </div> + <!--------------------- DESCRIPTION --------------------> + + <!--------------------- CATEGORIES --------------------> + <!-- ngIf: !component.isProduct() --> + <!-- end ngIf: !component.isProduct() --> + <!--------------------- CATEGORIES --------------------> + <br> + <!-- <button ng-if="!component.uuid" ng-disabled="!createMode" ng-click="save()" class="tlv-btn outline green ng-scope">Create + </button> --> + + <!--{{PostDataResponse}}--> + + {{resultInformation}} + + </div> + <!-- Close w-sdc-form-column --> + + </div> + + </div> + <!-- Close w-sdc-form-section-container --> + + </form> + + </div> + + <!-- <div ng-hide="typeFlag" class="dcae-main-container-body-content ng-scope" data-ng-class="{'third-party':thirdParty}" data-ui-view=""> + <div class="row"> + <div class="col-sm-4"> + <select class="form-control" ng-model="service.uuid" ng-change="VNFIs(service.uuid)" data-ng-options="service.uuid as service.name for service in services"> + <option value="">Select Service</option> + </select> + </div> + </div> + <br> + <div class="row"> + <div class="col-sm-4"> + <select class="form-control" ng-model="vnfi.name" ng-change="" data-ng-options="vnfi.name as vnfi.name for vnfi in vnfis"> + <option value="">Select VNFI</option> + </select> + </div> + </div> + <br> + + <div class="row"> + <div class="col-sm-2"> + <div class="btn"> + <button class="btn btn-default" type="button" ng-click="saveServiceSelection(component,service,vnfi)">Save Service Selection + </button> + </div> + </div> + </div> + + {{resultInformation2}} + + </div> --> + + + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt_general_service.html b/app/main/dashboard/dcaedt/dcaedt_general_service.html new file mode 100644 index 0000000..ffefaae --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_general_service.html @@ -0,0 +1,274 @@ +<div class="dcae-main-container"> + <div class="dcae-left-sidebar"> + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ui-sref="dcae.app.home">Home</div> + <div class="dcae-menu-item selected" ng-class="{selected:page==='general'}" + ng-click="goGeneral(component, component==null)">General + </div> + <div class="dcae-menu-item" ng-class="{selected:page==='import'}" + ng-click="goImport(component,component==null)">Import + </div> + <div class="dcae-menu-item" ng-class="{selected:page==='composition'}" ng-click="goComposition(component, selfAssurance)" data-tests-id="dcae-menu-item-Composition"> + Composition + </div> + <!--<div class="dcae-menu-item" ng-class="{selected:page==='artifact'}" ng-click="goArtifact()">Artifact</div>--> + </div> + <!-- BOOTSTRAP COMPONENTS --> + <!-- Latest compiled and minified CSS --> + <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> + <!-- Latest compiled and minified JavaScript --> + <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> + + <div class="dcae-main-right-container"> + + <div class="dcae-workspace-top-bar"> + <div ng-show="!createMode" class="version-container"> + <!-- ngIf: !isCreateMode() && !component.isLatestVersion() --> + <!-- ngIf: !isCreateMode() --> + <span class="lifecycle-state-text ng-binding" + data-tests-id="formlifecyclestate">V{{component.version}}</span> + <!-- end ngIf: !isCreateMode() --> + </div> + + <div ng-show="!createMode" class="lifecycle-state"> + <div data-ng-show="showLifecycleIcon()" class="lifecycle-state-icon" + data-ng-class="{'in-design-status-icon': createMode, '': !createMode}"></div> + <span class="lifecycle-state-text ng-binding" + data-tests-id="formlifecyclestate">{{component.lifecycleState}}</span> + </div> + + + <div ng-if="!createMode" class="progress-container"> + <div class="general-view-top-progress top-progress ng-isolate-scope" + progress-value="progressService.getProgressValue(component.uniqueId)" + progress-message="progressMessage"></div> + </div> + + <div class="sdc-workspace-top-bar-buttons"> + + <!-- ngIf: !isCreateMode() && !component.isLatestVersion() && !showChangeStateButton() --> + + <!-- ngIf: isDesigner() && !isCreateMode() --> + <!-- isDesigner() && !isCreateMode() --> + <!--<button class="btn btn-default" ng-show="!createMode" ng-click="save()" + class="tlv-btn blue ng-scope" data-tests-id="create/save" + sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Update + </button>--> + <!-- end ngIf: isDesigner() && !isCreateMode() --> + + <!-- ngRepeat: (key,button) in changeLifecycleStateButtons --> + + <!-- ngIf: !isViewMode() && isCreateMode() --> + + <!-- ngIf: (isDesigner() || isProductManager()) && !isCreateMode() && component.lifecycleState === 'NOT_CERTIFIED_CHECKOUT' --> + + <!-- ngIf: isDesigner() --> + <span data-ng-if="isDesigner()" + data-ng-class="{'disabled' :isDisableMode() || isViewMode()}" + ng-click="revert()" + class="dcae-sprite-new revert-btn ng-scope disabled" + data-tests-id="revert" data-ng-show="showFullIcons()" + sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Revert</span> + <!-- end ngIf: isDesigner() --> + + <!-- ngIf: isComposition && !component.isProduct() --> + <span class="delimiter"></span> <span class="dcae-sprite-new x-btn" + data-ng-click="goToBreadcrumbHome()" sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Close</span> + + </div> + + + </div> + + + <div data-ng-show="!createMode" + class="dcae-asset-creation-info ng-binding ng-scope"> + <b>UUID:</b> {{component.uuid}}<b> Invariant UUID:</b> {{component.invariantUUID}} + </div> + + <br> + {{s}} + <br> + <br> + + <div include-padding="true" + class="sdc-workspace-general-step ng-scope"> + + <form novalidate="" + class="w-sdc-form ng-pristine ng-valid-name-exist ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength" + name="editForm"> + + <div class="w-sdc-form-section-container"> + + <div class="i-sdc-form-item"> + <div + class="general-view-top-progress top-progress ng-isolate-scope" + progress-value="progressValue" + progress-message="progressMessage"> + + <!--======================= Top progress var =======================--> + <!-- ngIf: progressValue>0 && progressValue<100 --> + + <!-- ngIf: progressValue===100 --> + + <!-- ngIf: progressValue===-1 --> + <!--======================= Top progress var =======================--> + + </div> + </div> + + + <div class="w-sdc-form-columns-wrapper"> + + <div class="w-sdc-form-column"> + + <!--------------------- NAME --------------------> + <div class="i-sdc-form-item" + data-ng-class="{'error': validateField(editForm.componentName)}"> + <label class="i-sdc-form-label required">Name</label> <input + class="i-sdc-form-input ng-pristine ng-valid-name-exist ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength ng-touched" + data-ng-class="{'view-mode': isViewMode()}" + name="componentName" + data-ng-init="isCreateMode() && validateName(true)" + data-ng-maxlength="50" maxlength="50" data-ng-minlength="0" + minlength="0" data-ng-model="component.name" type="text" + data-required="" data-ng-model-options="{ debounce: 500 }" + data-ng-pattern="/^[\s\w\&_.:-]{1,1024}$/" + data-ng-disabled="component.isAlreadyCertified()" + data-tests-id="name" autofocus="" ng-readonly="isViewMode()"> + + <div class="input-error ng-hide" + data-ng-show="validateField(editForm.componentName)"> + <span ng-show="editForm.componentName.$error.required" + translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_NAME_REQUIRED" + class="ng-scope">Name is required.</span> <span + ng-show="editForm.componentName.$error.maxlength" + translate="VALIDATION_ERROR_MAX_LENGTH" + translate-values="{'max': '50' }" class="ng-scope ng-hide">Max + length 50 characters.</span> <span + ng-show="editForm.componentName.$error.minlength" + translate="VALIDATION_ERROR_MIN_LENGTH" + translate-values="{'min': '4' }" class="ng-scope ng-hide">Min + length 4 characters.</span> <span + ng-show="editForm.componentName.$error.nameExist" + translate="NEW_SERVICE_RESOURCE_ERROR_NAME_EXISTS" + class="ng-scope ng-hide">Name already exists.</span> <span + ng-show="editForm.componentName.$error.pattern" + translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED" + class="ng-scope ng-hide">Special characters not + allowed.</span> + </div> + </div> + <!--------------------- NAME --------------------> + + <!--------------------- FULL NAME --------------------> + <!-- ngIf: component.isProduct() --> + <!--------------------- NAME --------------------> + + <!--------------------- DESCRIPTION --------------------> + <div class="i-sdc-form-item" + data-ng-class="{'error': validateField(editForm.description)}"> + <label class="i-sdc-form-label required">Description</label> + <textarea + class="description ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-maxlength" + name="description" data-ng-class="{'view-mode': isViewMode()}" + data-ng-maxlength="1024" data-required="" + data-ng-model="component.description" + data-ng-model-options="{ debounce: 500 }" + data-ng-pattern="/^[\u0000-\u00BF]*$/" maxlength="1024" + data-tests-id="description"></textarea> + <!-- placeholder="Description here..." --> + + <div class="input-error ng-hide" data-ng-show="true"> + <span ng-show="editForm.description.$error.required" + translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_DESCRIPTION_REQUIRED" + class="ng-scope">Description is required.</span> <span + ng-show="editForm.description.$error.maxlength" + translate="VALIDATION_ERROR_MAX_LENGTH" + translate-values="{'max': '1024' }" class="ng-scope ng-hide">Max + length 1024 characters.</span> <span + ng-show="editForm.description.$error.pattern" + translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED" + class="ng-scope ng-hide">Special characters not + allowed.</span> + </div> + </div> + <!--------------------- DESCRIPTION --------------------> + + <!--------------------- CATEGORIES --------------------> + <!-- ngIf: !component.isProduct() --> + <!-- end ngIf: !component.isProduct() --> + <!--------------------- CATEGORIES --------------------> + <br> + <button ng-show="createMode" ng-click="save()" + class="tlv-btn outline green ng-scope">Create + </button> + + <!--{{PostDataResponse}}--> + + {{resultInformation}} + + </div> + <!-- Close w-sdc-form-column --> + + </div> + + </div> + <!-- Close w-sdc-form-section-container --> + + </form> + + </div> + <br><br> + + <br><br> + + <div ng-hide="hideDropDowns" class="dcae-main-container-body-content ng-scope" + data-ng-class="{'third-party':thirdParty}" data-ui-view=""> + <div class="row"> + <div class="col-sm-4"> + <select class="form-control" ng-model="service.uuid" ng-change="VNFIs(service.uuid)" + data-ng-options="service.uuid as service.name for service in services"> + <option value="">Select Service</option> + </select> + </div> + </div> + <br> + <div class="row"> + <div class="col-sm-4"> + <select class="form-control" ng-model="vnfi.name" ng-change="" + data-ng-options="vnfi.name as vnfi.name for vnfi in vnfis"> + <option value="">Select VNFI</option> + </select> + </div> + </div> + <br> + + <div class="row"> + <div class="col-sm-2"> + <div class="btn"> + <button class="btn btn-default" type="button" + ng-click="saveServiceSelection(component,service,vnfi)">Save Service Selection + </button> + </div> + </div> + </div> + <!-- + <div class="row"> + <div class="col-sm-2"> + <div class="btn"> + <button class="btn btn-default" type="button" ng-click="">Upload Blue Print</button> + </div> + </div> + </div> + --> + {{resultInformation2}} + + </div> + + + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt_general_vnf.html b/app/main/dashboard/dcaedt/dcaedt_general_vnf.html new file mode 100644 index 0000000..00e3d63 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_general_vnf.html @@ -0,0 +1,228 @@ +<div class="dcae-main-container"> + <div class="dcae-left-sidebar"> + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ui-sref="dcae.app.home">Home</div> + <div class="dcae-menu-item selected" ng-class="{selected:page==='general'}" + ng-click="goGeneral(component, component==null)">General + </div> + <div class="dcae-menu-item" ng-class="{selected:page==='import'}" + ng-click="goImport(component,component==null)">Import + </div> + <div class="dcae-menu-item" ng-class="{selected:page==='composition'}" ng-click="goComposition(component, selfAssurance)" data-tests-id="dcae-menu-item-Composition"> + Composition + </div> + <!--<div class="dcae-menu-item" ng-class="{selected:page==='artifact'}" ng-click="goArtifact()">Artifact</div>--> + </div> + <!-- BOOTSTRAP COMPONENTS --> + <!-- Latest compiled and minified CSS --> + <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> + <!-- Latest compiled and minified JavaScript --> + <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> + + <div class="dcae-main-right-container"> + + <div class="dcae-workspace-top-bar"> + <div ng-show="!createMode" class="version-container"> + <!-- ngIf: !isCreateMode() && !component.isLatestVersion() --> + <!-- ngIf: !isCreateMode() --> + <span class="lifecycle-state-text ng-binding" + data-tests-id="formlifecyclestate">V{{component.version}}</span> + <!-- end ngIf: !isCreateMode() --> + </div> + + <div ng-show="!createMode" class="lifecycle-state"> + <div data-ng-show="showLifecycleIcon()" class="lifecycle-state-icon" + data-ng-class="{'in-design-status-icon': createMode, '': !createMode}"></div> + <span class="lifecycle-state-text ng-binding" + data-tests-id="formlifecyclestate">{{component.lifecycleState}}</span> + </div> + + + <div ng-show="!createMode" class="progress-container"> + <div class="general-view-top-progress top-progress ng-isolate-scope" + progress-value="progressService.getProgressValue(component.uniqueId)" + progress-message="progressMessage"></div> + </div> + + <div class="sdc-workspace-top-bar-buttons"> + + <!-- ngIf: !isCreateMode() && !component.isLatestVersion() && !showChangeStateButton() --> + + <!-- ngIf: isDesigner() && !isCreateMode() --> + <!-- isDesigner() && !isCreateMode() --> + <!--<button class="btn btn-default" ng-show="!createMode" ng-click="save()" + class="tlv-btn blue ng-scope" data-tests-id="create/save" + sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Update + </button>--> + <!-- end ngIf: isDesigner() && !isCreateMode() --> + + <!-- ngRepeat: (key,button) in changeLifecycleStateButtons --> + + <!-- ngIf: !isViewMode() && isCreateMode() --> + + <!-- ngIf: (isDesigner() || isProductManager()) && !isCreateMode() && component.lifecycleState === 'NOT_CERTIFIED_CHECKOUT' --> + + <!-- ngIf: isDesigner() --> + <span data-ng-if="isDesigner()" + data-ng-class="{'disabled' :isDisableMode() || isViewMode()}" + ng-click="revert()" + class="dcae-sprite-new revert-btn ng-scope disabled" + data-tests-id="revert" data-ng-show="showFullIcons()" + sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Revert</span> + <!-- end ngIf: isDesigner() --> + + <!-- ngIf: isComposition && !component.isProduct() --> + <span class="delimiter"></span> <span class="dcae-sprite-new x-btn" + data-ng-click="goToBreadcrumbHome()" sdc-smart-tooltip="" + style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">Close</span> + + </div> + + + </div> + + + <div data-ng-show="!createMode" + class="dcae-asset-creation-info ng-binding ng-scope"> + <b>UUID:</b> {{component.uuid}}<b> Invariant UUID:</b> {{component.invariantUUID}} + </div> + + <br> + {{s}} + <br> + <br> + <div class="dcae-main-container-body-content ng-scope" + data-ng-class="{'third-party':thirdParty}" data-ui-view=""> + + <div include-padding="true" + class="sdc-workspace-general-step ng-scope"> + + <form novalidate="" + class="w-sdc-form ng-pristine ng-valid-name-exist ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength" + name="editForm"> + + <div class="w-sdc-form-section-container"> + + <div class="i-sdc-form-item"> + <div + class="general-view-top-progress top-progress ng-isolate-scope" + progress-value="progressValue" + progress-message="progressMessage"> + + <!--======================= Top progress var =======================--> + <!-- ngIf: progressValue>0 && progressValue<100 --> + + <!-- ngIf: progressValue===100 --> + + <!-- ngIf: progressValue===-1 --> + <!--======================= Top progress var =======================--> + + + </div> + </div> + + + <div class="w-sdc-form-columns-wrapper"> + + <div class="w-sdc-form-column"> + + + <!--------------------- NAME --------------------> + <div class="i-sdc-form-item" + data-ng-class="{'error': validateField(editForm.componentName)}"> + <label class="i-sdc-form-label required">Name</label> <input + class="i-sdc-form-input ng-pristine ng-valid-name-exist ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength ng-touched" + data-ng-class="{'view-mode': isViewMode()}" + name="name" + data-ng-init="isCreateMode() && validateName(true)" + data-ng-maxlength="50" maxlength="50" data-ng-minlength="0" + minlength="0" data-ng-model="component.name" type="text" + data-required="" data-ng-model-options="{ debounce: 500 }" + data-ng-pattern="/^[\s\w\&_.:-]{1,1024}$/" + data-ng-disabled="component.isAlreadyCertified()" + data-tests-id="name" autofocus="" ng-readonly="isViewMode()"> + + <div class="input-error ng-hide" + data-ng-show="validateField(editForm.componentName)"> + <span ng-show="editForm.componentName.$error.required" + translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_NAME_REQUIRED" + class="ng-scope">Name is required.</span> <span + ng-show="editForm.componentName.$error.maxlength" + translate="VALIDATION_ERROR_MAX_LENGTH" + translate-values="{'max': '50' }" class="ng-scope ng-hide">Max + length 50 characters.</span> <span + ng-show="editForm.componentName.$error.minlength" + translate="VALIDATION_ERROR_MIN_LENGTH" + translate-values="{'min': '4' }" class="ng-scope ng-hide">Min + length 4 characters.</span> <span + ng-show="editForm.componentName.$error.nameExist" + translate="NEW_SERVICE_RESOURCE_ERROR_NAME_EXISTS" + class="ng-scope ng-hide">Name already exists.</span> <span + ng-show="editForm.componentName.$error.pattern" + translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED" + class="ng-scope ng-hide">Special characters not + allowed.</span> + </div> + </div> + <!--------------------- NAME --------------------> + + <!--------------------- FULL NAME --------------------> + <!-- ngIf: component.isProduct() --> + <!--------------------- NAME --------------------> + + <!--------------------- DESCRIPTION --------------------> + <div class="i-sdc-form-item" + data-ng-class="{'error': validateField(editForm.description)}"> + <label class="i-sdc-form-label required">Description</label> + <textarea + class="description ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-maxlength" + name="description" data-ng-class="{'view-mode': isViewMode()}" + data-ng-maxlength="1024" data-required="" + data-ng-model="component.description" + data-ng-model-options="{ debounce: 500 }" + data-ng-pattern="/^[\u0000-\u00BF]*$/" maxlength="1024" + data-tests-id="description"></textarea> + <!-- placeholder="Description here..." --> + + <div class="input-error ng-hide" data-ng-show="true"> + <span ng-show="editForm.description.$error.required" + translate="NEW_SERVICE_RESOURCE_ERROR_RESOURCE_DESCRIPTION_REQUIRED" + class="ng-scope">Description is required.</span> <span + ng-show="editForm.description.$error.maxlength" + translate="VALIDATION_ERROR_MAX_LENGTH" + translate-values="{'max': '1024' }" class="ng-scope ng-hide">Max + length 1024 characters.</span> <span + ng-show="editForm.description.$error.pattern" + translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED" + class="ng-scope ng-hide">Special characters not + allowed.</span> + </div> + </div> + <!--------------------- DESCRIPTION --------------------> + + <!--------------------- CATEGORIES --------------------> + <!-- ngIf: !component.isProduct() --> + <!-- end ngIf: !component.isProduct() --> + <!--------------------- CATEGORIES --------------------> + <button ng-show="createMode" ng-click="save()" + class="tlv-btn outline green ng-scope">Create + </button> + + + + </div> + <!-- Close w-sdc-form-column --> + + </div> + + </div> + <!-- Close w-sdc-form-section-container --> + + </form> + + </div> + </div> + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt_import.html b/app/main/dashboard/dcaedt/dcaedt_import.html new file mode 100644 index 0000000..05e8bb5 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_import.html @@ -0,0 +1,61 @@ +<div class="dcae-main-container"> + <div class="dcae-left-sidebar"> + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ui-sref="dcae.app.home">Home</div> + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ng-click="goGeneral(component, component==null)">General + </div> + <div class="dcae-menu-item selected" ng-class="{selected:page==='import'}" ng-click="goImport(component, component==null)">Import + </div> + <div class="dcae-menu-item" ng-class="{selected:page==='composition'}" ng-click="goComposition(component, typeFlag)" data-tests-id="dcae-menu-item-Composition"> + Composition + </div> + <!--<div class="dcae-menu-item" ng-class="{selected:page==='artifact'}" ng-click="goArtifact()">Artifact</div>--> + </div> + + <div class="dcae-main-right-container"> + + <div style="display: flex; justify-content: space-between; padding-bottom:0;"> + <span>{{ VNFs.length }} VFCMTS </span> + <div> + <input type='text' ng-model='searchVfc' placeholder="Search" style="border-radius: 2px;width: 245px;height: 32px;line-height: 32px;border: 1px solid #d2d2d2;outline: none;text-indent: 10px; background: white;" + /> + </div> + </div> + <br/> + <br/> + <footer>Version: {{ appSettings.version }}</footer> + + + <div data-ng-class="{'sdc-hide-popover': hidePopover}" data-ng-init="componentx.filterTerm = componentx.name + ' ' + componentx.description + ' ' + componentx.tags.toString() + ' ' + componentx.version" + class="dcae-dashboard-card ng-scope" data-ng-repeat="componentx in VNFs |filter:showTypeFilter |filter:searchVfc" + data-ng-class="{'resource' : componentx.resourceType === 'VFC', 'service' : componentx.isService(), 'product' : componentx.isProduct()}"> + + + <div class="dcae-dashboard-card-body" data-ng-click="gui.isLoading || clone(componentx,component)"> + <div class="dcae-dashboard-card-avatar"> + <span data-tests-id="asset-type" class="{{componentx.resourceType}}"></span> + </div> + <div class="dcae-dashboard-card-edit " data-ng-class="componentx.lifecycleState" data-tests-id="assetlifecycleState {{getStatus()}}"></div> + <div class="dcae-dashboard-card-schema-image sprite-resource-icons defaulticon" style="background-image: url(dcae/79291b5162b83fdab4bc9c42d2a6f4db.png);display: inline-block;" + data-tests-id="{{componentx.categories[0].subcategories[0].uniqueId}}"></div> + <!--<div class="dcae-dashboard-card-schema-image {{componentx.icon}}" data-tests-id="{{componentx.categories[0].subcategories[0].uniqueId}}" + data-ng-class="{'sprite-resource-icons':componentx.componentType === 'RESOURCE', 'sprite-services-icons':componentx.componentType === 'SERVICE', 'sprite-product-icons':componentx.componentType === 'PRODUCT'}"></div>--> + <div class="dcae-dashboard-card-description">{{componentx.description}}</div> + <div class="dcae-dashboard-card-info-name-container"> + <span class="dcae-dashboard-card-info-name" tooltips tooltip-content="{{componentx.name}}"> {{componentx.name}}</span> + </div> + </div> + + <div class="dcae-dashboard-card-footer"> + <div class="dcae-dashboard-card-info"> + <div class="dcae-dashboard-card-info-lifecycleState"> + <span class="dcae-dashboard-card-info-lifecycleState"> + {{componentx.getStatus(sdcMenu)}}</span> + </div> + <div class="dcae-dashboard-card-info-user">V {{componentx.version}} + </div> + </div> + <!--<div class="dcae-dashboard-card-info-lifecycleState-icon sprite-new {{sdcMenu.LifeCycleStatuses[componentx.lifecycleState].icon}}"></div>--> + </div> + </div> + </div> +</div> diff --git a/app/main/dashboard/dcaedt/dcaedt_self_serve.html b/app/main/dashboard/dcaedt/dcaedt_self_serve.html new file mode 100644 index 0000000..499358d --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_self_serve.html @@ -0,0 +1,74 @@ +<div class="dcae-main-container"> + <div class="dcae-left-sidebar"> + <div class="dcae-menu-item selected" + ng-class="{selected:page==='general'}" + ng-click="goGeneral(component, false)">General + </div> + + </div> + + <div class="dcae-main-right-container"> + + <div class="dcae-main-container-body-content ng-scope" + data-ng-class="{'third-party':thirdParty}" data-ui-view=""> + + <div include-padding="true" + class="sdc-workspace-general-step ng-scope"> + + <form novalidate="" + class="w-sdc-form ng-pristine ng-valid-name-exist ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength" + name="editForm"> + + <div class="w-sdc-form-section-container"> + + + <div class="w-sdc-form-columns-wrapper"> + + <div class="w-sdc-form-column"> + + <!--------------------- NAME --------------------> + <div class="i-sdc-form-item"> + <label class="i-sdc-form-label required">Service</label> + <select class="i-sdc-form-select"> + <option id="XXX">XXX</option> + <option id="YYY">YYY</option> + <option id="ZZZ">ZZZ</option> + </select> + </div> + + <div class="i-sdc-form-item"> + <label class="i-sdc-form-label required">VNFi</label> + <select class="i-sdc-form-select"> + <option id="XXX">XXX</option> + <option id="YYY">YYY</option> + <option id="ZZZ">ZZZ</option> + </select> + </div> + <div class="i-sdc-form-item"> + <label class="i-sdc-form-label required">Location</label> + <select class="i-sdc-form-select"> + <option id="XXX">XXX</option> + <option id="YYY">YYY</option> + <option id="ZZZ">ZZZ</option> + </select> + </div> + <div class="i-sdc-form-item"> + <label class="i-sdc-form-label required">Upload Blue Print</label> + </div> + <input type="file" id="file" name="file"/> + <button class="tlv-btn outline green" ng-click="add()">Add</button> + <p>{{data}}</p> + <button ng-show="createMode" ng-click="save()" + class="tlv-btn outline green ng-scope">Create + </button> + + {{PostDataResponse}} + </div> + </div> + </div> + </form> + </div> + </div> + </div> +</div> + diff --git a/app/main/dashboard/dcaedt/dcaedt_services.html b/app/main/dashboard/dcaedt/dcaedt_services.html new file mode 100644 index 0000000..c879427 --- /dev/null +++ b/app/main/dashboard/dcaedt/dcaedt_services.html @@ -0,0 +1,79 @@ +<meta http-equiv="cache-control" content="no-cache" /> + +<div class="dcae-main-container"> + <!-- <div class="dcae-left-sidebar"> + + <div class="dcae-menu-item" ui-sref="dcae.app.home">Home</div> + <div class="dcae-menu-item" ng-click="goGeneral(component, component==null)">General + </div> + <div class="dcae-menu-item selected" ng-click="goServices(component)" data-tests-id="dcae-menu-item-Services"> + Services + </div> + <div class="dcae-menu-item" ng-click="goComposition(component, typeFlag)" data-tests-id="dcae-menu-item-Composition"> + Composition + </div> + </div> --> + <div class="dcae-left-sidebar" left-menu></div> + + <div class="dcae-main-right-container" style="display: flex; justify-content: space-around;"> + + <div class="dcae-main-container-body-content" data-ng-class="{'third-party':thirdParty}" data-ui-view=""> + + <div class="tlv-loader large" ng-if="loader"></div> + + <div class="left-content"> + <h2 style="padding-bottom:30px;"> + Attach new services + </h2> + <div class="row"> + <div class="col-sm-12"> + <label for="service">Service Name</label> + <select class="form-control" ng-model="service.uuid" ng-change="VNFIs(service.uuid)" data-ng-options="service.uuid as service.name for service in services" + data-tests-id="Service Name SelectList"> + <option value="">Select Service</option> + </select> + </div> + </div> + <br> + <div class="row"> + <div class="col-sm-12" ng-if="vnfis.length > 0"> + <label for="vnfi">VNFI Name</label> + + <select class="form-control" ng-model="vnfi.name" ng-change="vnfiChange(vnfi.name)" data-ng-options="vnfi.name as vnfi.name for vnfi in vnfis" + data-tests-id="VNFI Name SelectList"> + <option value="">Select VNFI</option> + </select> + </div> + <div class="col-sm-12" ng-if="vnfis.length == 0 && vnfiTouch" style="color:red"> + The selected service has no resource of type VF, please select a different service + </div> + </div> + <br> + + <div class="row"> + <div class="col-sm-offset-7 col-sm-2"> + <button class="tlv-btn blue" type="button" ng-disabled="showAttach()" ng-click="saveServiceSelection(component,service,vnfi)" + data-tests-id="Attach Button"> + Attach + </button> + </div> + </div> + + <!-- {{resultInformation2}} --> + + </div> + </div> + + <div class="right-content"> + <h2 style="padding-bottom: 30px;">Service attached</h2> + <div style="border: 1px solid #cdcdcd; padding: 1rem;" ng-if="resultInformation2"> + <span style="padding-right:5px; border-right: 1px solid #cdcdcd;"> + {{service.uuid}} + </span> + <span style="padding-left:5px;" data-tests-id={{vnfi.name}}> + {{vnfi.name}} + </span> + </div> + </div> + </div> +</div> diff --git a/app/main/dashboard/dcaedt/leftMenu.html b/app/main/dashboard/dcaedt/leftMenu.html new file mode 100644 index 0000000..700c9c8 --- /dev/null +++ b/app/main/dashboard/dcaedt/leftMenu.html @@ -0,0 +1,22 @@ +<div class="dcae-left-sidebar"> + + <div class="dcae-menu-item" ng-class="{selected:page==='home'}" ui-sref="dcae.app.home"> + Home + </div> + + <div class="dcae-menu-item" ng-class="{selected:page==='general'}" ng-click="goGeneral(component, component==null)"> + General + </div> + + <!-- <div class="dcae-menu-item" ng-class="{selected:page==='services'}" ng-style="readOnlyComponent && {'opacity': '0.5','pointer-events':'none' }" + ng-click="goServices(component)" data-tests-id="dcae-menu-item-Services"> + Services + </div> --> + + + <div class="dcae-menu-item" ng-if="component.uuid" ng-class="{selected:page==='composition'}" ng-click="goComposition(component, typeFlag)" + ng-style="readOnlyComponent && {'opacity': '0.5','pointer-events':'none' }" data-tests-id="dcae-menu-item-Composition"> + Composition + </div> + +</div> diff --git a/app/main/dashboard/home/home.controller.js b/app/main/dashboard/home/home.controller.js new file mode 100644 index 0000000..3604530 --- /dev/null +++ b/app/main/dashboard/home/home.controller.js @@ -0,0 +1,16 @@ +(function () { + + 'use strict'; + + angular + .module('dcaeApp.dashboard.home') + .controller('DashboardHomeController', dashboardHomeController); + + function dashboardHomeController($state) { + + var vm = this; + + + } + +})(); diff --git a/app/main/dashboard/home/home.html b/app/main/dashboard/home/home.html new file mode 100644 index 0000000..ae27a0b --- /dev/null +++ b/app/main/dashboard/home/home.html @@ -0,0 +1 @@ +<h1>This is home</h1> diff --git a/app/main/dashboard/home/home.less b/app/main/dashboard/home/home.less new file mode 100644 index 0000000..fb5647d --- /dev/null +++ b/app/main/dashboard/home/home.less @@ -0,0 +1,5 @@ +.home { + h1 { + font-size: 160px; + } +} diff --git a/app/main/dashboard/home/home.module.js b/app/main/dashboard/home/home.module.js new file mode 100644 index 0000000..e496791 --- /dev/null +++ b/app/main/dashboard/home/home.module.js @@ -0,0 +1,25 @@ +(function () { + + 'use strict'; + + angular + .module('dcaeApp.dashboard.home', []) + .config(config); + + function config($stateProvider) { + + $stateProvider + .state('dcae1.app.home', { + url: '/home', + views: { + 'content@dcae.app': { + templateUrl: 'main/dashboard/home/home.html', + controller: 'DashboardHomeController as vm' + } + }, + bodyClass: 'home' + }); + + } + +})(); diff --git a/app/main/errors/404.html b/app/main/errors/404.html new file mode 100644 index 0000000..3a7c1e8 --- /dev/null +++ b/app/main/errors/404.html @@ -0,0 +1,152 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>Page Not Found :(</title> + <style> + ::-moz-selection { + background: #b3d4fc; + text-shadow: none; + } + + ::selection { + background: #b3d4fc; + text-shadow: none; + } + + html { + padding: 30px 10px; + font-size: 20px; + line-height: 1.4; + color: #737373; + background: #f0f0f0; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + } + + html, + input { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + } + + body { + max-width: 500px; + padding: 30px 20px 50px; + border: 1px solid #b3b3b3; + border-radius: 4px; + margin: 0 auto; + box-shadow: 0 1px 10px #a7a7a7, inset 0 1px 0 #fff; + background: #fcfcfc; + } + + h1 { + margin: 0 10px; + font-size: 50px; + text-align: center; + } + + h1 span { + color: #bbb; + } + + h3 { + margin: 1.5em 0 0.5em; + } + + p { + margin: 1em 0; + } + + ul { + padding: 0 0 0 40px; + margin: 1em 0; + } + + .container { + max-width: 380px; + margin: 0 auto; + } + + /* google search */ + + #goog-fixurl ul { + list-style: none; + padding: 0; + margin: 0; + } + + #goog-fixurl form { + margin: 0; + } + + #goog-wm-qt, + #goog-wm-sb { + border: 1px solid #bbb; + font-size: 16px; + line-height: normal; + vertical-align: top; + color: #444; + border-radius: 2px; + } + + #goog-wm-qt { + width: 220px; + height: 20px; + padding: 5px; + margin: 5px 10px 0 0; + box-shadow: inset 0 1px 1px #ccc; + } + + #goog-wm-sb { + display: inline-block; + height: 32px; + padding: 0 10px; + margin: 5px 0 0; + white-space: nowrap; + cursor: pointer; + background-color: #f5f5f5; + background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), #f1f1f1); + background-image: -moz-linear-gradient(rgba(255, 255, 255, 0), #f1f1f1); + background-image: -ms-linear-gradient(rgba(255, 255, 255, 0), #f1f1f1); + background-image: -o-linear-gradient(rgba(255, 255, 255, 0), #f1f1f1); + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + } + + #goog-wm-sb:hover, + #goog-wm-sb:focus { + border-color: #aaa; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); + background-color: #f8f8f8; + } + + #goog-wm-qt:hover, + #goog-wm-qt:focus { + border-color: #105cb6; + outline: 0; + color: #222; + } + + input::-moz-focus-inner { + padding: 0; + border: 0; + } + </style> +</head> +<body> +<div class="container"> + <h1>Not found <span>:(</span></h1> + <p>Sorry, but the page you were trying to view does not exist.</p> + <p>It looks like this was the result of either:</p> + <ul> + <li>a mistyped address</li> + <li>an out-of-date link</li> + </ul> + <script> + var GOOG_FIXURL_LANG = (navigator.language || '').slice(0, 2), GOOG_FIXURL_SITE = location.host; + </script> + <script src="//linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script> +</div> +</body> +</html> diff --git a/app/main/main.controller.js b/app/main/main.controller.js new file mode 100644 index 0000000..709e67e --- /dev/null +++ b/app/main/main.controller.js @@ -0,0 +1,22 @@ +(function () { + 'use strict'; + + /** @ngInject */ + function mainController($scope, $rootScope) { + // Data + + ////////// + + // Remove the splash screen + $scope.$on('$viewContentAnimationEnded', function (event) { + if (event.targetScope.$id === $scope.$id) { + $rootScope.$broadcast('msSplashScreen::remove'); + } + }); + } + + angular + .module('dcaeApp.main', []) + .controller('MainController', mainController); + +})(); |