diff options
Diffstat (limited to 'vbd/gui/module/src/main/resources/vpp/views')
10 files changed, 323 insertions, 0 deletions
diff --git a/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html new file mode 100644 index 000000000..a8b4689d1 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html @@ -0,0 +1,43 @@ +<div ng-controller="BridgeDomainsController"> + <md-progress-linear md-mode="indeterminate" ng-if="BridgeDomainsController.dataService.loading"></md-progress-linear> + + <div layout="row" layout-xs="column" style="height:100%"> + <div id="bridge-domains-next-app" style="height: 100%; width: 50%" flex></div> + <div class="md-sidenav-left md-whiteframe-z2" style="background-color: white" flex> + <md-content layout-padding ng-controller="TableController as TableCtrl"> + <md-input-container style="margin-right: 5px;" layout="row"> + <md-select ng-model='BridgeDomainsController.selectedBd.name' placeholder="Select BD" ng-change="BridgeDomainsController.bdChanged()" style="width: 100%;"> + <md-option ng-repeat="bd in BridgeDomainsController.bridgedomains" value="{{bd.name}}">{{bd.name}}</md-option> + </md-select> + <md-button class="md-raised" md-no-ink ng-click="BridgeDomainsController.addBd()" style="width: 25%;">Add BD</md-button> + <md-button class="md-raised" md-no-ink ng-click="BridgeDomainsController.removeBd()" style="width: 35%;" ng-if="BridgeDomainsController.dataService.injectedInterfaces.length===0 && BridgeDomainsController.dataService.selectedBd.name">Remove BD</md-button> + + </md-input-container> + <table st-table="TableCtrl.displayedCollection" class="table table-striped" st-safe-src="TableCtrl.rowCollection"> + <thead> + <tr> + <th>Assigned</th> + <th st-sort="name" st-sort-default="true">Interface Name</th> + <th st-sort="description">Description</th> + <th st-sort="bridge-domain">Bridge Domain</th> + </tr> + </thead> + <tbody> + <tr ng-repeat="row in TableCtrl.displayedCollection"> + <td> + <md-switch ng-model="row.assigned" aria-label="Assign Switch" ng-change="TableCtrl.updateAssignment(row);"> + </md-switch> + </td> + <td>{{row.label}}</td> + <td>{{row.description}}</td> + <td>{{row['v3po:l2']['bridge-domain']}}</td> + </tr> + </tbody> + </table> + <!--<md-input-container style="bottom: 10px">--> + <md-button class="md-raised" md-no-ink ng-click="BridgeDomainsController.deploy()" style="width: 94%;position: fixed;" ng-if="BridgeDomainsController.dataService.changedInterfaces.length">Deploy</md-button> + <!--</md-input-container>--> + </md-content> + </div> + </div> +</div>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/config-interface-dialog.html b/vbd/gui/module/src/main/resources/vpp/views/config-interface-dialog.html new file mode 100644 index 000000000..2d7084b7c --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/config-interface-dialog.html @@ -0,0 +1,38 @@ +<md-dialog ng-cloak aria-label="config interface dialog"> + <form> + <md-toolbar> + <div class="md-toolbar-tools"> + <h2 style="color: white"> + {{ConfigInterfaceDialogCtrl.interf.label}} + </h2> + <span flex></span> + <md-button class="md-icon-button" ng-click="ConfigInterfaceDialogCtrl.cancel()" aria-label="close button"> + <div class="glyphicon glyphicon-remove"></div> + </md-button> + </div> + </md-toolbar> + <md-dialog-content style="max-width:800px;max-height:810px; "> + <div class="md-dialog-content"> + <!--<md-content layout-padding>--> + <form name="bDConfigForm"> + <md-input-container flex ng-if="ConfigInterfaceDialogCtrl.interf.type==='iana-if-type:ethernetCsmacd'"> + <label> + Description + </label> + <input ng-model="ConfigInterfaceDialogCtrl.interf.description" flex> + <md-switch ng-model="ConfigInterfaceDialogCtrl.interf['admin-status']" ng-true-value="'up'" ng-false-value="'down'">Admin Status</md-switch> + </md-input-container> + </form> + <!--</md-content>--> + </div> + </md-dialog-content> + <md-progress-linear md-mode="indeterminate" ng-show="ConfigInterfaceDialogCtrl.waiting"></md-progress-linear> + <md-dialog-actions layout="row"> + <span flex></span> + <label ng-hide="ConfigInterfaceDialogCtrl.interf['v3po:l2']['bridge-domain']">Assign to BD first.</label> + <md-button ng-click="ConfigInterfaceDialogCtrl.updateConfig();" style="margin-right:20px;" class="md-accent" ng-if="(ConfigInterfaceDialogCtrl.interf.type==='iana-if-type:ethernetCsmacd')" ng-disabled="!ConfigInterfaceDialogCtrl.interf['v3po:l2']['bridge-domain']"> + Update + </md-button> + </md-dialog-actions> + </form> +</md-dialog>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/config-vpp-dialog.html b/vbd/gui/module/src/main/resources/vpp/views/config-vpp-dialog.html new file mode 100644 index 000000000..3fcd4a68b --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/config-vpp-dialog.html @@ -0,0 +1,67 @@ +<md-dialog ng-cloak aria-label="new vpp dialog"> + <form> + <md-toolbar> + <div class="md-toolbar-tools"> + <h2 style="color: white"> + Configuring {{ConfigVppDialogCtrl.vpp.name}} + </h2> + <span flex></span> + <md-button class="md-icon-button" ng-click="ConfigVppDialogCtrl.close()" aria-label="close button"> + <div>X</div> + </md-button> + </div> + </md-toolbar> + <md-dialog-content style="max-width:800px;max-height:810px; "> + <div class="md-dialog-content"> + <md-content layout-padding> + <form name="vppConfigForm"> + <div layout="row"> + <md-input-container flex> + <label> + Name + </label> + <input ng-model="ConfigVppDialogCtrl.vpp.name" disabled> + </md-input-container> + <md-input-container flex> + <label> + IP Address + </label> + <input ng-model="ConfigVppDialogCtrl.vpp.ip" ng-disabled="ConfigVppDialogCtrl.vpp.status === 'connected'"> + </md-input-container> + <md-input-container flex> + <label> + Port + </label> + <input ng-model="ConfigVppDialogCtrl.vpp.port" ng-disabled="ConfigVppDialogCtrl.vpp.status === 'connected'"> + </md-input-container> + </div> + <div layout="row"> + <md-input-container flex ng-if="ConfigVppDialogCtrl.vpp.status != 'connected'"> + <label> + Username + </label> + <input ng-model="ConfigVppDialogCtrl.vpp.un"> + </md-input-container> + <md-input-container flex ng-if="ConfigVppDialogCtrl.vpp.status != 'connected'"> + <label> + Password + </label> + <input ng-model="ConfigVppDialogCtrl.vpp.pw" type="password"> + </md-input-container> + </div> + + </form> + </md-content> + + </div> + </md-dialog-content> + <md-progress-linear md-mode="indeterminate" ng-show="ConfigVppDialogCtrl.waiting"></md-progress-linear> + <md-dialog-actions layout="row"> + <span flex></span> + <md-button ng-click="ConfigVppDialogCtrl.updateConfig();" style="margin-right:20px;" class="md-accent" ng-if="ConfigVppDialogCtrl.vpp.status != 'connected'"> + Update + </md-button> + + </md-dialog-actions> + </form> +</md-dialog>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/index.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/index.tpl.html new file mode 100644 index 000000000..add7f7854 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/index.tpl.html @@ -0,0 +1,16 @@ +<div ng-controller="vppCtrl"> + <md-toolbar> + <div class="md-toolbar-tools float-left"> + <span flex></span> + <md-button ng-click="setMainView('inventory')">Inventory</md-button> + <span flex></span> + <md-button ng-click="setMainView('bridgeDomains')">Bridge Domains</md-button> + <span flex></span> + </div> + </md-toolbar> + + <div ng-view style="height: 100%"> + <section ng-if="mainView === 'inventory'" ng-include src="view_path+'inventory-table.tpl.html'"></section> + <section ng-if="mainView === 'bridgeDomains'" ng-include src="view_path+'bridge-domains.tpl.html'"></section> + </div> +</div>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/inventory-table.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/inventory-table.tpl.html new file mode 100644 index 000000000..ad24bce14 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/inventory-table.tpl.html @@ -0,0 +1,28 @@ +<div ng-controller="InventoryTableController"> + <md-button ng-click="addVppShowForm()">Mount VPP</md-button> + <md-button ng-click="getVppList()">Reload VPPs</md-button> + <table class="footable"> + <thead> + <tr> + <th>VPP Name</th> + <th>IP Address</th> + <th>Port</th> + <th>Connection Status</th> + <th>Actions</th> + </tr> + </thead> + <tbody> + <tr ng-repeat="vpp in vppList"> + <td>{{vpp.name}}</td> + <td>{{vpp.ipAddress}}</td> + <td>{{vpp.port}}</td> + <td>{{vpp.status}}</td> + <td> + <md-button ng-click="viewTopology(vpp)">View Topology</md-button> + <md-button ng-click="editVppShowForm(vpp)" ng-hide="vpp.status === 'connected'">Edit</md-button> + <md-button ng-click="deleteVpp(vpp)" >Delete</md-button> + </td> + </tr> + </tbody> + </table> +</div>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/inventory.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/inventory.tpl.html new file mode 100644 index 000000000..9d5e19d5e --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/inventory.tpl.html @@ -0,0 +1,7 @@ +<div ng-controller="InventoryController"> + <md-progress-linear md-mode="indeterminate" ng-if="InventoryController.dataService.loading"></md-progress-linear> + <div id="inventory-next-app" style="height: 100%"></div> + <md-button class="md-fab md-primary md-fab-bottom-right" md-no-ink aria-label="Add VPP" ng-click="InventoryController.addVpp()"> + <div class="glyphicon glyphicon-plus"></div> + </md-button> +</div>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/new-bd-dialog.html b/vbd/gui/module/src/main/resources/vpp/views/new-bd-dialog.html new file mode 100644 index 000000000..fd04f8e84 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/new-bd-dialog.html @@ -0,0 +1,39 @@ +<md-dialog ng-cloak aria-label="new bd dialog"> + <form> + <md-toolbar> + <div class="md-toolbar-tools"> + <h2 style="color: white"> + New BD + </h2> + <span flex></span> + <md-button class="md-icon-button" ng-click="NewBdDialogCtrl.close()" aria-label="close button"> + <div class="glyphicon glyphicon-remove"></div> + </md-button> + </div> + </md-toolbar> + <md-dialog-content style="max-width:800px;max-height:810px; "> + <div class="md-dialog-content"> + <md-content layout-padding> + <form name="bDConfigForm"> + <div layout layout-sm="column"> + <md-input-container flex> + <label> + Name + </label> + <input ng-model="NewBdDialogCtrl.bd.name"> + </md-input-container> + </div> + </form> + </md-content> + + </div> + </md-dialog-content> + <md-progress-linear md-mode="indeterminate" ng-show="NewBdDialogCtrl.waiting"></md-progress-linear> + <md-dialog-actions layout="row"> + <span flex></span> + <md-button ng-click="NewBdDialogCtrl.updateConfig();" style="margin-right:20px;" class="md-accent"> + Add + </md-button> + </md-dialog-actions> + </form> +</md-dialog>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/new-vpp-dialog.html b/vbd/gui/module/src/main/resources/vpp/views/new-vpp-dialog.html new file mode 100644 index 000000000..d0ce47604 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/new-vpp-dialog.html @@ -0,0 +1,66 @@ +<md-dialog ng-cloak aria-label="new vpp dialog"> + <form> + <md-toolbar> + <div class="md-toolbar-tools"> + <h2 style="color: white"> + Mount new VPP + </h2> + <span flex></span> + <md-button class="md-icon-button" ng-click="NewVppDialogCtrl.close()" aria-label="close button"> + <div>X</div> + </md-button> + </div> + </md-toolbar> + <md-dialog-content style="max-width:800px;max-height:810px; "> + <div class="md-dialog-content"> + <md-content layout-padding> + <form name="vppConfigForm"> + <div layout="row"> + <md-input-container flex> + <label> + Name + </label> + <input ng-model="NewVppDialogCtrl.vpp.name"> + </md-input-container> + <md-input-container flex> + <label> + IP Address + </label> + <input ng-model="NewVppDialogCtrl.vpp.ip"> + </md-input-container> + <md-input-container flex> + <label> + Port + </label> + <input ng-model="NewVppDialogCtrl.vpp.port"> + </md-input-container> + </div> + <div layout="row"> + <md-input-container flex> + <label> + Username + </label> + <input ng-model="NewVppDialogCtrl.vpp.un"> + </md-input-container> + <md-input-container flex> + <label> + Password + </label> + <input ng-model="NewVppDialogCtrl.vpp.pw" type="password"> + </md-input-container> + </div> + + </form> + </md-content> + + </div> + </md-dialog-content> + <md-progress-linear md-mode="indeterminate" ng-show="NewVppDialogCtrl.waiting"></md-progress-linear> + <md-dialog-actions layout="row"> + <span flex></span> + <md-button ng-click="NewVppDialogCtrl.updateConfig();" style="margin-right:20px;" class="md-accent"> + Mount + </md-button> + </md-dialog-actions> + </form> +</md-dialog>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/root.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/root.tpl.html new file mode 100644 index 000000000..b07c00c51 --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/root.tpl.html @@ -0,0 +1 @@ +<div class="main" ui-view></div>
\ No newline at end of file diff --git a/vbd/gui/module/src/main/resources/vpp/views/vpp-topo.html b/vbd/gui/module/src/main/resources/vpp/views/vpp-topo.html new file mode 100644 index 000000000..8b3c9fd8a --- /dev/null +++ b/vbd/gui/module/src/main/resources/vpp/views/vpp-topo.html @@ -0,0 +1,18 @@ +<md-dialog ng-cloak aria-label="vpp topo"> + <form> + <md-toolbar> + <div class="md-toolbar-tools"> + <h2 style="color: white"> + Topology for {{VppTopoCtrl.vpp.name}} + </h2> + <span flex></span> + <md-button class="md-icon-button" ng-click="VppTopoCtrl.close()" aria-label="close button"> + <div>X</div> + </md-button> + </div> + </md-toolbar> + <md-dialog-content style="max-width:500px;max-height:500px;overflow:hidden"> + <div id="next-vpp-topo"></div> + </md-dialog-content> + </form> +</md-dialog>
\ No newline at end of file |