From 9015d0d86d23a83e578ded1bd95485d467515208 Mon Sep 17 00:00:00 2001
From: "Christopher Lott (cl778h)" <clott@research.att.com>
Date: Thu, 17 Aug 2017 14:52:44 -0400
Subject: Publish seed code for the OOM Dashboard

First open-source release of the ONAP Operations Manager Dashboard web application.

Issue: CCSDK-61
Change-Id: I902f789692d76ee583aa967682e39f03b6578fe9
Signed-off-by: Christopher Lott (cl778h) <clott@research.att.com>
---
 .../webapp/app/ecdapp/home/executions_view.html    | 165 +++++++++++++++++++++
 1 file changed, 165 insertions(+)
 create mode 100644 ecd-app-overlay/src/main/webapp/app/ecdapp/home/executions_view.html

(limited to 'ecd-app-overlay/src/main/webapp/app/ecdapp/home/executions_view.html')

diff --git a/ecd-app-overlay/src/main/webapp/app/ecdapp/home/executions_view.html b/ecd-app-overlay/src/main/webapp/app/ecdapp/home/executions_view.html
new file mode 100644
index 0000000..f527b2f
--- /dev/null
+++ b/ecd-app-overlay/src/main/webapp/app/ecdapp/home/executions_view.html
@@ -0,0 +1,165 @@
+<link rel="stylesheet" href="app/ecdapp/external/bootstrap.min.css" />
+<style>
+.csep-root1 {
+	background: white;
+}
+
+.dropdown-submenu {
+	position: relative;
+}
+
+.dropdown-submenu .dropdown-menu {
+	top: 0;
+	left: 100%;
+	margin-top: -1px;
+}
+
+.parent-item {
+	box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	-webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	-moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	background: #efefef;
+	padding: 15px;
+	cursor: pointer;
+}
+
+.child-item {
+	box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	-webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	-moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .8);
+	background: #efefef;
+	padding: 15px;
+}
+
+.button-style {
+	padding: 2px 5px;
+	width: auto;
+	margin: 3px;
+	min-width: 15px;
+}
+
+.no-padding {
+	padding: 0 !important;
+}
+
+.line-height {
+	height: 2.5em;
+}
+
+.activeStatus {
+	background: #0568ae;
+}
+
+.activeStatus a {
+	color: #FFF;
+}
+
+.popover {
+	width: 400px;
+}
+</style>
+
+<div id="page-content">
+	<h4 class="heading-page" id="controllers">OOM Managed Executions</h4>
+
+	<div ng-show="ecdapp.isDataLoading">
+		<i class="icon-primary-spinner small" role="img"
+			aria-label="Please wait while the content loads"></i> 
+			Please wait	while the content loads.
+	</div>
+
+	<div class="table-responsive col-sm-12"
+		style="position: relative; left: 150px;" ng-if="controllerCallDone">
+		<div class="col-sm-12">
+			<div class="col-sm-4 no-padding" style="margin-top: 20px;">
+				<div class="col-sm-12 no-padding" style="display: flex;">
+					<div class="parent-item col-sm-10 no-padding">
+						<div class="col-sm-12 no-padding line-height">
+							<div class="col-xs-10 no-padding text-center">
+								<b>{{parent.blueprint_id}}</b>
+							</div>
+							<div class="col-xs-2 no-padding dropdown">
+								<button
+									class="btn btn-default button-style icon-controls-gear dropdown-toggle"
+									data-toggle="dropdown" ng-click="closeSubMenu()"></button>
+								<ul class="dropdown-menu">
+									<li class="dropdown-submenu">
+										<a href="javascript:void(0);" tabindex="-1" 
+											ng-click="showsubDropdown($event)">
+											Execution Status<span class="icon-controls-right pull-right" style="position: absolute;margin-right: 60px; padding-left: 50px;"></span>
+										</a>
+										<ul class="dropdown-menu" id="submenu">
+											<li ng-class="{activeStatus: status == 'active'}"><a
+												href="javascript:void(0);"
+												ng-click="ecdapp.loadTable('active')">Active</a></li>
+											<li ng-class="{activeStatus: status == 'cancelled'}"><a
+												href="javascript:void(0);"
+												ng-click="ecdapp.loadTable('cancelled')">Cancelled</a></li>
+											<li ng-class="{activeStatus: status == 'failed'}"><a
+												href="javascript:void(0);"
+												ng-click="ecdapp.loadTable('failed')">Failed</a></li>
+											<li ng-class="{activeStatus: status == 'started'}"><a
+												href="javascript:void(0);"
+												ng-click="ecdapp.loadTable('started')">Started</a></li>
+											<li ng-class="{activeStatus: status == 'terminated'}"><a
+												href="javascript:void(0);"
+												ng-click="ecdapp.loadTable('terminated')">Terminated</a></li>
+										</ul></li>
+									<li><a href="javascript:void(0);"
+										ng-click="showEcompCInstancesModalPopup()">Select ECOMP-C
+											Instance...</a></li>
+								</ul>
+							</div>
+						</div>
+						<div>
+							<img src="app/ecdapp/images/ecomp-login-550x360.jpg">
+						</div>
+						<div class="col-sm-12 text-center line-height">
+							<span ng-if="orgChartData.length"></span>
+						</div>
+					</div>
+					<div class="col-sm-2 no-padding" ng-if="orgChartData.length">
+						<span
+							style="position: absolute; width: 100%; border: 1px solid #333; top: 50%;"></span>
+					</div>
+				</div>
+			</div>
+
+			<div class="col-sm-4 no-padding" style="margin-top: 20px;">
+				<div class="col-sm-12 no-padding" style="position: absolute; margin-top: -23px; margin-left: 54px;" ng-if="orgChartData.length > 0">
+					<b>Status: {{status}}</b>
+				</div>
+				<div class="col-sm-12 no-padding" style="margin-top: 100px;" ng-if="orgChartData.length == 0 && status">
+					<b>No components found with status {{status}}</b>
+				</div>
+				<div class="col-sm-12 no-padding" ng-if="orgChartData.length"
+					ng-repeat="item in orgChartData"
+					style="display: flex; padding-bottom: 20px !important; border-left: 1px solid #333;">
+					<div class="col-sm-2 no-padding">
+						<span ng-if="$index == 0"
+							style="position: absolute; height: 50%; width: 100%; border-left: 2px solid #FFF; left: -2%;"></span>
+						<span
+							style="position: absolute; width: 100%; border: 1px solid #333; top: 50%;"></span>
+						<span ng-if="$index == orgChartData.length-1"
+							style="position: absolute; top: 50%; width: 100%; height: calc(50% + 20px); left: -5%; border-left: 2px solid #FFFFFF;"></span>
+					</div>
+					<div class="col-sm-10 no-padding child-item"
+						id="callToggle{{$index}}" data-toggle='popover'
+						data-placement='right' data-trigger='hover'
+						data-content="Execution Id: {{item.id}}">
+						<div class="col-sm-12 no-padding line-height">
+							<div class="col-xs-12 no-padding text-center">
+								<b>{{item.blueprint_id}}</b>
+							</div>
+						</div>
+						<div>
+							<img src="app/ecdapp/images/ecomp.png">
+						</div>
+						<div class="col-sm-12 text-center line-height"></div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+
+</div>
\ No newline at end of file
-- 
cgit 1.2.3-korg