angular.module('app.gbp').controller('RootGbpCtrl', RootGbpCtrl);
- RootGbpCtrl.$inject = ['$state', '$scope', 'RootGbpService'];
+ RootGbpCtrl.$inject = ['$state', '$scope', 'RootGbpService', 'TenantListService', 'TenantService', 'ContractService'];
- function RootGbpCtrl($state, $scope, RootGbpService) {
+ function RootGbpCtrl($state, $scope, RootGbpService, TenantListService, TenantService, ContractService) {
/* properties */
$scope.stateUrl = null;
$scope.sidePanelPage = false;
+ $scope.rootTenant = TenantService.createObject();
+ $scope.rootTenants = TenantListService.createList();
+ $scope.policyDisabled = true;
/* methods */
+ $scope.broadcastFromRoot = broadcastFromRoot;
$scope.closeSidePanel = closeSidePanel;
$scope.openSidePanel = openSidePanel;
+ $scope.setRootTenant = setRootTenant;
+ $scope.disableButton = disableButton;
RootGbpService.setMainClass();
console.log('RootGbpCtrl initialized');
+ init();
+
/* implementations */
/**
* Sets '$scope.sidePanelPage' to false. This variable is watched in index.tpl.html template
* and opens/closes side panel
*/
+ function init() {
+ $scope.rootTenants.clear();
+ $scope.rootTenants.get('config');
+ }
+
+ function broadcastFromRoot(eventName, val) {
+ $scope.$broadcast(eventName, val);
+ }
+
+ function setRootTenant() {
+ $scope.broadcastFromRoot('ROOT_TENANT_CHANGED');
+ enableButtons();
+ }
+
function closeSidePanel() {
$scope.sidePanelPage = false;
}
$scope.sidePanelPage = true;
}
+ function disableButton() {
+ if (Object.keys($scope.rootTenant.data) > 0) {
+ return true;
+ }
+ else {
+ return false;
+ }
+ }
+
+ function enableButtons() {
+ $scope.policyDisabled = false;
+ }
/* event listeners */
/**
* Event fired after content loaded, setStateUrl function is called to fill stateUrl method
access: access.admin,
templateUrl: 'src/app/gbp/common/views/index.tpl.html',
views: {
- '': {
- controller: 'PolicyController',
- templateUrl: 'src/app/gbp/policy/policy.tpl.html',
+ 'main_top': {
+ controller: 'EpgController',
+ templateUrl: 'src/app/gbp/epg/epg.tpl.html',
+ },
+ 'main_bottom': {
+ controller: 'ContractController',
+ templateUrl: 'src/app/gbp/contract/contract.tpl.html',
},
},
});
},
});
- $stateProvider.state('main.gbp.index.policy.contract', {
- url: '/contract',
+ $stateProvider.state('main.gbp.index.contract', {
+ url: '/policy/contract',
access: access.admin,
templateUrl: 'src/app/gbp/common/views/index.tpl.html',
views: {
'': {
- controller: 'PolicyController',
- templateUrl: 'src/app/gbp/policy/policy.tpl.html',
+ controller: 'ContractController',
+ templateUrl: 'src/app/gbp/contract/contract.tpl.html',
},
- 'sidePanel': {
+ },
+ });
+
+ $stateProvider.state('main.gbp.index.contractId', {
+ url: '/policy/contract/{contractId}',
+ access: access.admin,
+ templateUrl: 'src/app/gbp/common/views/index.tpl.html',
+ views: {
+ '': {
controller: 'ContractController',
templateUrl: 'src/app/gbp/contract/contract.tpl.html',
},
<md-toolbar>
<div class="md-toolbar-tools">
<md-button ng-href="#/gbp/index/tenant" ng-click="closeSidePanel()" class="md-primary">Tenant</md-button>
- <md-button ng-href="#/gbp/index/policy" ng-click="closeSidePanel()" class="md-primary">Policy</md-button>
+ <!-- <md-button ng-href="#/gbp/index/policy" ng-click="closeSidePanel()" class="md-primary">Policy</md-button> -->
+
+ <md-menu class="md-primary" class="md-toolbar-tools" style="background-color:rgb(33,150,243);color:black;">
+ <md-button ng-click="$mdOpenMenu($event)" style="background-color:rgb(33,150,243);color:black;">Policy</md-button>
+ <md-menu-content style="background-color:rgb(33,150,243);color:black;">
+ <md-button ng-click="" ng-disabled="policyDisabled" ng-href="#/gbp/index/policy/epg" style="background-color:rgb(33,150,243);color:black;">EPGs</md-button>
+ <md-button ng-click="" ng-disabled="policyDisabled" ng-href="#/gbp/index/policy/contract" style="background-color:rgb(33,150,243);color:black;">Contracts</md-button>
+ </md-menu-content>
+ </md-menu>
+
<span flex></span>
- <md-button ng-if="stateUrl === '/policy'" ng-href="#/gbp/index/policy/epg" ng-click="openSidePanel()" class="md-primary">EPGs</md-button>
- <md-button ng-if="stateUrl === '/policy'" ng-href="#/gbp/index/policy/contract" ng-click="openSidePanel()" class="md-primary">Contracts</md-button>
+ <md-select ng-model="rootTenant" ng-change="setRootTenant()">
+ <md-option ng-repeat="item in rootTenants.data" ng-value="{{item}}">{{item.data.id}}</md-option>
+ </md-select>
+ <!-- <md-button ng-if="stateUrl === '/policy'" ng-href="#/gbp/index/policy/epg" ng-click="openSidePanel()" class="md-primary">EPGs</md-button>
+ <md-button ng-if="stateUrl === '/policy'" ng-href="#/gbp/index/policy/contract" ng-click="openSidePanel()" class="md-primary">Contracts</md-button> -->
</div>
</md-toolbar>
- <md-content md-scroll-y flex ui-view></md-content>
+ <!-- <md-content md-scroll-y flex ui-view></md-content> -->
+ <md-content md-scroll-y flex ui-view>
+ <md-content md-scroll-y flex ui-view="main_top" class="col-md-6"></md-content>
+ <md-content md-scroll-y flex ui-view="main_bottom" class="col-md-6"></md-content>
+ </md-content>
</div>
- <md-sidenav class="md-sidenav-right md-whiteframe-z1 detail-view" md-is-locked-open="sidePanelPage">
+ <!-- <md-sidenav class="md-sidenav-right md-whiteframe-z1 detail-view" md-is-locked-open="sidePanelPage">
<md-toolbar>
<div class="md-toolbar-tools">
<h2>
<md-content flex>
<div flex layout="column" ui-view="sidePanel"></div>
</md-content>
- </md-sidenav>
+ </md-sidenav> -->
</div>
function ContractList() {
/* properties */
this.data = [];
+
/* methods */
this.setData = setData;
this.get = get;
});
}
- function get(dataStore) {
+ function get(tenantId) {
/* jshint validthis:true */
var self = this;
- var restObj = Restangular.one('restconf').one(dataStore).one('policy:tenants')
- .one('tenant').one('tenant1').one('policy');
+ // var restObj = Restangular.one('restconf').one(dataStore).one('policy:tenants')
+ // .one('tenant').one('tenant1').one('policy');
+ var restObj = Restangular.one('restconf').one('config').one('policy:tenants')
+ .one('tenant').one(tenantId).one('policy');
return restObj.get().then(function (data) {
- if (data.policy.contract) {
- self.setData(data.policy.contract);
- }
+ // if (data.policy.contract) {
+ // self.setData(data.policy.contract);
+ self.setData(data.policy.contract);
});
}
}
angular.module('app.gbp').controller('ContractController', ContractController);
- ContractController.$inject = ['$scope', 'TenantService', 'ContractService', 'ContractListService'];
+ ContractController.$inject = ['$scope', 'TenantListService', 'TenantService', 'ContractService', 'ContractListService', '$stateParams'];
- function ContractController($scope, TenantService, ContractService, ContractListService) {
- $scope.tenant = TenantService.createObject();
- $scope.tenant.get('tenant1');
- console.log('tenant from CONTRACT CTRL:', $scope.tenant);
+ function ContractController($scope, TenantListService, TenantService, ContractService, ContractListService, $stateParams) {
+ $scope.contracts = ContractListService.createList();
+ $scope.contractsTableQuery = {
+ order: 'data.id',
+ limit: 25,
+ page: 1,
+ options: [25, 50, 100],
+ filter: '',
+ };
- $scope.contract = ContractService.createObject();
- $scope.contract.get('contract1');
- console.log('contract from CONTRACT CTRL', $scope.contract);
+ getContracts();
+
+ /* if ($stateParams.contractId) {
+ $scope.contractId = $stateParams.contractId;
+ console.log('contract.ctrl.if.$scope.contractId', $scope.contractId);
+ $scope.contract.get($scope.contractId);
+ }
+ else {
+ console.log('contract.ctrl.else.$scope.contractId', $scope.contractId);
+ $scope.contract.get($scope.$parent.tenantId);
+ }*/
+
+ function getContracts() {
+ $scope.contracts.data = [];
+ $scope.contracts.get($scope.rootTenant.data.id);
+ }
- $scope.contracts = ContractListService.createList();
- $scope.contracts.get('config');
- console.log('contracts from CONTRACT CTRL', $scope.contracts);
+ $scope.$on('ROOT_TENANT_CHANGED', getContracts);
}
});
function get(id) {
var self = this;
+ // var restObj = Restangular.one('restconf').one('config').one('policy:tenants')
+ // .one('tenant').one('tenant1').one('policy').one('contract').one(this.data.id || id);
+
var restObj = Restangular.one('restconf').one('config').one('policy:tenants')
- .one('tenant').one('tenant1').one('policy').one('contract').one(this.data.id || id);
+ .one('tenant').one(id).one('policy').one('contract').one(id);
return restObj.get().then(function (data) {
self.setData(data.contract[0]);
-<h1>Contrats of tenant: <u>tenant1</u></h1><br /><br />
-<h2><u>contract1:</u></h2><br />
-id: {{contract.data.id}}<br />
-description: {{contract.data.description}}<br />
-parent:{{contract.data.parent}}<br />
-<h2>his containers:</b></h2><br />
-<h3><u>Target object:</u></h3><br />{{contract.data.target}}
-<h3><u>Subject object:</u></h3><br />{{contract.data.subject}}
-<h3><u>Clause object:</u></h3><br />{{contract.data.clause}}
-<h3><u>Quality object:</u></h3><br />{{contract.data.quality}}
-<hr />
-<h2><u>tenant1 contracts list:</u></h2><br />
-<section ng-repeat="contractElement in contracts.data"><h5>{{contractElement.data}}</h5><br /></section>
+<section flex layout="column">
+ <md-table-container ng-if="contracts.data.length" ng-hide="contractId.length">
+ <table md-table>
+ <thead md-head md-order="contractsTableQuery.order">
+ <tr md-row>
+ <th md-column md-order-by="data.id"><span>Id</span></th>
+ <th md-column md-order-by="data.parent"><span>Parent</span></th>
+ <th md-column md-order-by="data.description"><span>Description</span></th>
+ <th md-column><span>Actions</span></th>
+ </tr>
+ </thead>
+ <tbody md-body>
+ <tr md-row ng-repeat="contract in contracts.data | filter: contractsTableQuery.filter | orderBy : contractsTableQuery.order | limitTo: contractsTableQuery.limit : (contractsTableQuery.page -1) * contractsTableQuery.limit">
+ <td md-cell>{{contract.data.id}}</td>
+ <td md-cell>{{contract.data.parent}}</td>
+ <td md-cell>{{contract.data.description}}</td>
+ <td md-cell>
+ <md-button class="md-icon-button" ng-click="edit(contract)">
+ <md-icon>edit</md-icon>
+ </md-button>
+ <md-button class="md-icon-button" ng-click="delete(contract)">
+ <md-icon>delete</md-icon>
+ </md-button>
+ </td>
+ </tr>
+
+ </tbody>
+ </table>
+ <md-table-pagination md-limit="contractsTableQuery.limit"
+ md-page="contractsTableQuery.page"
+ md-options="contractsTableQuery.options"
+ md-total="{{contracts.data.length}}"
+ md-page-select="options.pageSelect">
+ </md-table-pagination>
+ </md-table-container>
+
+ <section ng-if="contractId.length">
+ Details of contract: <u>{{contract1}}</u><br /><br />
+ <u>contract1:</u><br />
+ id: {{contract.data.id}}<br />
+ description: {{contract.data.description}}<br />
+ parent:{{contract.data.parent}}<br />
+ his containers:</b><br />
+ <u>Target object:</u><br />{{contract.data.target}}
+ <u>Subject object:</u><br />{{contract.data.subject}}
+ <u>Clause object:</u><br />{{contract.data.clause}}
+ <u>Quality object:</u><br />{{contract.data.quality}}
+ </section>
+
+
+
+
+
+</section>
+
+
+
+
+
+
+
+
+<!-- <div class="md-menu-demo" ng-controller="PositionDemoCtrl as ctrl" ng-cloak style="min-height:350px;">
+ <div class="menu-demo-container" layout-align="start center" layout="column" >
+ <div layout-align="start center" layout="column" style="min-height:150px;" >
+ <h2 class="md-title">Position Mode Demos</h2>
+ <p>The <code>md-position-mode</code> attribute can be used to specify the positioning along the <code>x</code> and <code>y</code> axis.</p>
+ <hr/>
+ <h3 class="md-subhead">Target-Based Position Modes</h3>
+ </div>
+ <div class="menus" layout-wrap layout="row" layout-fill layout-align="space-between center" style="min-height:200px;">
+ <div layout="column" flex="33" flex-sm="100" layout-align="center center">
+ <p>Target Mode Positioning (default)</p>
+ <md-menu>
+ <md-button aria-label="Open demo menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
+ <md-icon md-menu-origin md-svg-icon="call:business"></md-icon>
+ </md-button>
+ <md-menu-content width="6">
+ <md-menu-item ng-repeat="item in [1, 2, 3]">
+ <md-button ng-click="ctrl.announceClick($index)">
+ <md-icon md-menu-align-target md-svg-icon="call:no-sim"></md-icon>
+ Option {{item}}
+ </md-button>
+ </md-menu-item>
+ </md-menu-content>
+ </md-menu>
+ </div>
+ <div layout="column" flex-sm="100" flex="33" layout-align="center center">
+ <p>Target mode with <code>md-offset</code></p>
+ <md-menu md-offset="0 -5">
+ <md-button aria-label="Open demo menu" class="md-icon-button" ng-click="ctrl.openMenu($mdOpenMenu, $event)">
+ <md-icon md-menu-origin md-svg-icon="call:ring-volume"></md-icon>
+ </md-button>
+ <md-menu-content width="4">
+ <md-menu-item ng-repeat="item in [1, 2, 3]">
+ <md-button ng-click="ctrl.announceClick($index)"> <span md-menu-align-target>Option</span> {{item}} </md-button>
+ </md-menu-item>
+ </md-menu-content>
+ </md-menu>
+ </div>
+ <div layout="column" flex-sm="100" flex="33" layout-align="center center">
+ <p><code>md-position-mode="target-right target"</code></p>
+ <md-menu md-position-mode="target-right target" >
+ <md-button aria-label="Open demo menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
+ <md-icon md-menu-origin md-svg-icon="call:portable-wifi-off"></md-icon>
+ </md-button>
+ <md-menu-content width="4" >
+ <md-menu-item ng-repeat="item in [1, 2, 3]">
+ <md-button ng-click="ctrl.announceClick($index)">
+ <div layout="row">
+ <p flex>Option {{item}}</p>
+ <md-icon md-menu-align-target md-svg-icon="call:portable-wifi-off" style="margin: auto 3px auto 0;"></md-icon>
+ </div>
+ </md-button>
+ </md-menu-item>
+ </md-menu-content>
+ </md-menu>
+ </div>
+ </div>
+ </div>
+ </div>
+</div> -->