1 files changed, 158 insertions, 0 deletions
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">&times;</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">&times;</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">&times;</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">&times;</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 -->