Add machines CSV file import
Change-Id: I3ac7cad8755aa02d837b5e1568320b1d8533f39e
This commit is contained in:
jiahuay
parent
7e2ebed331
commit
ad669f322b
|
|
@ -383,6 +383,12 @@ compassAppDev.run(function($httpBackend, settings, $http) {
|
|||
return [200, switchState, {}];
|
||||
});
|
||||
|
||||
$httpBackend.whenPOST(settings.apiUrlBase + '/batch-machines').respond(function(method, url, data) {
|
||||
console.log(method, url, data);
|
||||
|
||||
return [200, {}, {}];
|
||||
});
|
||||
|
||||
$httpBackend.whenGET(/\.*\/switches\/([0-9]|[1-9][0-9])\/machines$/).respond(function(method, url, data) {
|
||||
console.log(method, url, data);
|
||||
var index = url.indexOf("switches/");
|
||||
|
|
|
|||
|
|
@ -58,6 +58,10 @@ define(['angular','uiBootstrap'], function(ng, uiBootstrap) {
|
|||
}
|
||||
};
|
||||
|
||||
this.addMultiMachines = function(machines) {
|
||||
return $http.post(settings.apiUrlBase + '/batch-machines');
|
||||
};
|
||||
|
||||
this.getSwitches = function() {
|
||||
return $http.get(settings.apiUrlBase + '/switches');
|
||||
};
|
||||
|
|
|
|||
|
|
@ -9,6 +9,47 @@
|
|||
<findservers results="foundResults"></findservers>
|
||||
</div>
|
||||
</div>
|
||||
<div collapse="importServersPanel.isCollapsed">
|
||||
<div class="dashed-panel">
|
||||
<span class="action pull-right" ng-click="importServersPanel.isCollapsed = true;">
|
||||
<i class="ace-icon fa fa-times-circle bigger-120 light-grey"></i>
|
||||
</span>
|
||||
<div class="clearfix"></div>
|
||||
<h4>Import Servers by CSV file</h4>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
<center style="margin-top: 20px; margin-bottom: 30px;">
|
||||
<input style="display: inline" type="file" accept=".csv" file-reader="fileContent" />
|
||||
<button style="display: inline" type="button" class="btn btn-primary" ng-click="importServers(fileContent)" ng-show="fileContent && fileContent.length > 0">Import</button>
|
||||
</center>
|
||||
<div style="margin-bottom: 30px;">
|
||||
<alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">{{alert.msg}}</alert>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive" ng-show="fileContent && fileContent.length > 0">
|
||||
<table class="table table-hover table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>MAC Addr</th>
|
||||
<th>Switch IP</th>
|
||||
<th>Port</th>
|
||||
<th>VLAN</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="machine in fileContent">
|
||||
<td>{{machine.mac}}</td>
|
||||
<td>{{machine.switch_ip}}</td>
|
||||
<td>{{machine.port}}</td>
|
||||
<td>{{machine.vlan}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="pull-left">
|
||||
|
|
@ -28,20 +69,25 @@
|
|||
<a class="action">
|
||||
<span ng-class="{'opacity-zero': !column.visible}">
|
||||
<i class="ace-icon fa fa-check blue"></i>
|
||||
</span>
|
||||
{{column.title}}
|
||||
</span> {{column.title}}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<button class="btn btn-info" ng-click="findNewServersPanel.isCollapsed = !findNewServersPanel.isCollapsed" ng-init="findNewServersPanel.isCollapsed = true;">
|
||||
<button class="btn btn-info" ng-click="findNewServersPanel.isCollapsed = !findNewServersPanel.isCollapsed; importServersPanel.isCollapsed = findNewServersPanel.isCollapsed?importServersPanel.isCollapsed : true;" ng-init="findNewServersPanel.isCollapsed = true;">
|
||||
Discover Servers
|
||||
<i class="ace-icon fa fa-plus" ng-class="{'fa-minus': !findNewServersPanel.isCollapsed}"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="pull-right side-padding-20">
|
||||
<div class="pull-right side-padding-10">
|
||||
<button class="btn btn-info" ng-click="importServersPanel.isCollapsed = !importServersPanel.isCollapsed; findNewServersPanel.isCollapsed = importServersPanel.isCollapsed?importServersPanel.isCollapsed : true;" ng-init="importServersPanel.isCollapsed = true;">
|
||||
Import Servers
|
||||
<i class="ace-icon fa fa-plus" ng-class="{'fa-minus': !importServersPanel.isCollapsed}"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input ng-model="hideunselected" ng-change="hideUnselected()" type="checkbox" class="ace">
|
||||
|
|
@ -88,18 +134,18 @@
|
|||
<label>
|
||||
<input ng-model="server.reinstallos" type="checkbox" class="ace">
|
||||
<span class="lbl"></span>
|
||||
</label>
|
||||
</span>
|
||||
<span ng-if="!server['os_name']">
|
||||
</label>
|
||||
</span>
|
||||
<span ng-if="!server['os_name']">
|
||||
-
|
||||
</span>
|
||||
</span>
|
||||
<span ng-switch-when="clusters">
|
||||
</span>
|
||||
<span ng-switch-when="clusters">
|
||||
<span ng-repeat="cluster in server.clusters">
|
||||
{{cluster.name}}
|
||||
</span>
|
||||
</span>
|
||||
<span ng-switch-default>
|
||||
</span>
|
||||
<span ng-switch-default>
|
||||
{{server[column.field]}}
|
||||
</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinner', 'angularAnimate'], function() {
|
||||
define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinner', 'angularAnimate', 'fileHelper'], function() {
|
||||
var wizardModule = angular.module('compass.wizard', [
|
||||
'ui.router',
|
||||
'ui.bootstrap',
|
||||
|
|
@ -8,7 +8,8 @@ define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinne
|
|||
'ngDragDrop',
|
||||
'ngTouch',
|
||||
'angularSpinner',
|
||||
'ngAnimate'
|
||||
'ngAnimate',
|
||||
'compass.filereader'
|
||||
]);
|
||||
|
||||
wizardModule.config(function config($stateProvider) {
|
||||
|
|
@ -344,6 +345,7 @@ define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinne
|
|||
wizardModule.controller('svSelectCtrl', function($scope, wizardFactory, dataService, $filter, ngTableParams, sortingService) {
|
||||
$scope.hideunselected = '';
|
||||
$scope.search = {};
|
||||
$scope.alerts = [];
|
||||
|
||||
var cluster = wizardFactory.getClusterInfo();
|
||||
|
||||
|
|
@ -426,6 +428,25 @@ define(['uiRouter', 'angularTable', 'angularDragDrop', 'angularTouch', 'ngSpinne
|
|||
}
|
||||
};
|
||||
|
||||
$scope.importServers = function(servers) {
|
||||
dataService.addMultiMachines(servers).success(function(data) {
|
||||
$scope.alerts[0] = {
|
||||
type: "success",
|
||||
msg: "Import success!"
|
||||
};
|
||||
//TODO: add servers to the machine-host table
|
||||
}).error(function(response) {
|
||||
$scope.alerts[0] = {
|
||||
type: "danger",
|
||||
msg: "Import failed!"
|
||||
};
|
||||
});
|
||||
|
||||
};
|
||||
$scope.closeAlert = function(index) {
|
||||
$scope.alerts.splice(index, 1);
|
||||
};
|
||||
|
||||
$scope.$watch(function() {
|
||||
return wizardFactory.getCommitState()
|
||||
}, function(newCommitState, oldCommitState) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,54 @@
|
|||
define(['angular', 'fileHelper'], function(angular, fileHelper) {
|
||||
|
||||
var fileReaderModule = angular.module('compass.filereader', []);
|
||||
|
||||
fileReaderModule.directive('fileReader', function() {
|
||||
return {
|
||||
scope: {
|
||||
fileReader: "="
|
||||
},
|
||||
link: function(scope, element) {
|
||||
$(element).on('change', function(changeEvent) {
|
||||
var files = changeEvent.target.files;
|
||||
if (files.length) {
|
||||
var r = new FileReader();
|
||||
r.onload = function(e) {
|
||||
var contents = e.target.result;
|
||||
scope.$apply(function() {
|
||||
scope.fileReader = csvJSON(contents);
|
||||
});
|
||||
};
|
||||
|
||||
r.readAsText(files[0]);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
function csvJSON(csv) {
|
||||
|
||||
var lines = csv.split("\r");
|
||||
|
||||
var result = [];
|
||||
|
||||
var headers = lines[0].split(",");
|
||||
|
||||
for (var i = 1; i < lines.length; i++) {
|
||||
|
||||
var obj = {};
|
||||
var currentline = lines[i].split(",");
|
||||
|
||||
for (var j = 0; j < headers.length; j++) {
|
||||
obj[headers[j]] = currentline[j];
|
||||
}
|
||||
|
||||
result.push(obj);
|
||||
|
||||
}
|
||||
|
||||
return result; //JavaScript object
|
||||
//return JSON.stringify(result); //JSON
|
||||
}
|
||||
|
||||
});
|
||||
|
|
@ -34,7 +34,8 @@ require.config({
|
|||
'userSetting': 'app/user/usersetting',
|
||||
'monitoring': 'app/monitoring/monitoring',
|
||||
'charts': 'common/charts',
|
||||
'findservers': 'common/findservers/findservers'
|
||||
'findservers': 'common/findservers/findservers',
|
||||
'fileHelper': 'common/filehelper'
|
||||
},
|
||||
shim: {
|
||||
"jquery": {
|
||||
|
|
|
|||
Loading…
Reference in New Issue