updates for replication and destination integration with api

This commit is contained in:
kunw 2016-06-04 23:59:02 +08:00
parent 86e13b6c02
commit 3613c95576
14 changed files with 149 additions and 177 deletions

View File

@ -36,7 +36,7 @@
.css-form input.ng-invalid.ng-dirty {
.css-form input.ng-invalid.ng-touched {
border-color: red;
}

View File

@ -1,5 +1,6 @@
<div class="modal fade" id="createPolicyModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<form name="form" class="form-horizontal css-form" novalidate>
<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>
@ -7,7 +8,6 @@
</div>
<div class="modal-body">
<div class="create-policy">
<form name="form" class="form-horizontal" ng-submit="form.$valid" novalidate>
<div class="col-md-12">
<h4>General</h4>
<hr class="hr-line"/>
@ -15,8 +15,8 @@
<div class="form-group col-md-12 form-group-custom">
<label for="name" class="col-md-3 control-label">Name:</label>
<div class="col-md-9">
<input type="text" class="form-control form-control-custom" id="name" ng-model="policy.name" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.policy.name" name="uName" required>
<div ng-messages="form.$dirty && form.uName.$error">
<input type="text" class="form-control form-control-custom" id="name" ng-model="replication.policy.name" ng-model-options="{ debounce: 500 }" name="uName" required>
<div ng-messages="form.$submitted && form.uName.$error">
<span ng-message="required">Name is required.</span>
</div>
</div>
@ -24,8 +24,8 @@
<div class="form-group col-md-12 form-group-custom">
<label for="description" class="col-md-3 control-label">Description:</label>
<div class="col-md-9">
<textarea class="form-control form-control-custom" id="description" ng-model="policy.description" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.policy.enable" name="uDescription" required ></textarea>
<div ng-messages="form.$dirty && form.uDescription.$error">
<textarea class="form-control form-control-custom" id="description" ng-model="replication.policy.description" ng-model-options="{ updateOn: 'blur' }" ng-value="description" name="uDescription" required ></textarea>
<div ng-messages="form.$submitted && form.uDescription.$error">
<span ng-message="required">Description is required.</span>
</div>
</div>
@ -33,7 +33,7 @@
<div class="form-group col-md-12 form-group-custom">
<label for="enable" class="col-md-3 control-label">Enable:</label>
<div class="col-md-9">
<input type="checkbox" class="form-control" style="margin-top: 10px; height: auto;" id="enable" ng-model="policy.enable" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.policy.enable" name="uEnable">
<input type="checkbox" class="form-control" style="margin-top: 10px; height: auto;" ng-model="replication.policy.enabled" ng-model-options="{ updateOn: 'blur' }" ng-checked="enabled">
</div>
</div>
<div class="col-md-12">
@ -43,14 +43,14 @@
<div class="form-group col-md-12 form-group-custom">
<label for="destinationName" class="col-md-3 control-label">Name:</label>
<div class="col-md-7">
<select class="form-control form-control-custom" id="destinationName" ng-model="policy.destinationName" ng-options="d as d.name for d in vm.destinations track by d.id" ng-click="vm.selectDestination()"></select>
<select class="form-control form-control-custom" id="destinationName" ng-model="replication.destinations" ng-options="d as d.name for d in vm.destinations track by d.id" ng-click="vm.selectDestination()"></select>
</div>
</div>
<div class="form-group col-md-12 form-group-custom">
<label for="endpoint" class="col-md-3 control-label">Endpoint:</label>
<div class="col-md-9">
<input type="text" class="form-control form-control-custom" id="endpoint" ng-model="policy.endpoint" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.endpoint" name="uEndpoint" required>
<div ng-messages="form.$dirty && form.uEndpoint.$error">
<input type="text" class="form-control form-control-custom" id="endpoint" ng-model="replication.destination.endpoint" ng-model-options="{ updateOn: 'blur' }" ng-value="endpoint" name="uEndpoint" required>
<div ng-messages="form.$submitted && form.uEndpoint.$error">
<span ng-message="required">Endpoint is required.</span>
</div>
</div>
@ -58,8 +58,8 @@
<div class="form-group col-md-12 form-group-custom">
<label for="username" class="col-md-3 control-label">Username:</label>
<div class="col-md-9">
<input type="text" class="form-control" id="username" ng-model="policy.username" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.username" name="uUsername" required>
<div ng-messages="form.$dirty && form.uUsername.$error">
<input type="text" class="form-control" id="username" ng-model="replication.destination.username" ng-model-options="{ updateOn: 'blur' }" ng-value="username" name="uUsername" required>
<div ng-messages="form.$submitted && form.uUsername.$error">
<span ng-message="required">Username is required.</span>
</div>
</div>
@ -67,8 +67,8 @@
<div class="form-group col-md-12 form-group-custom">
<label for="password" class="col-md-3 control-label">Password:</label>
<div class="col-md-9">
<input type="password" class="form-control" id="password" ng-model="policy.password" ng-model-options="{ updateOn: 'blur' }" ng-value="vm.password" name="uPassword" required>
<div ng-messages="form.$dirty && form.uPassword.$error">
<input type="password" class="form-control" id="password" ng-model="replication.destination.password" ng-model-options="{ updateOn: 'blur' }" ng-value="password" name="uPassword" required>
<div ng-messages="form.$submitted && form.uPassword.$error">
<span ng-message="required">Password is required.</span>
</div>
</div>
@ -79,13 +79,14 @@
<button class="btn btn-default" ng-click="vm.testConnection()">Test Connection</button>
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" id="btnOk">// 'ok' | tr //</button>
<button type="submit" class="btn btn-primary" id="btnOk">// 'ok' | tr //</button>
<button type="button" class="btn btn-default" data-dismiss="modal">// 'close' | tr //</button>
</div>
</form>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

View File

@ -8,6 +8,12 @@
function CreatePolicyController() {
var vm = this;
vm.enabled = true;
vm.save = save;
function save(policy) {
console.log(angular.toJson(policy));
}
}
function createPolicy() {

View File

@ -45,7 +45,7 @@
<hr class="hr-line"/>
<div class="form-inline">
<div class="input-group">
<input type="text" class="form-control" placeholder="" ng-model="vm.replicationJob" size="30">
<input type="text" class="form-control" placeholder="" ng-model="vm.replicationJobnName" size="30">
<span class="input-group-btn">
<button class="btn btn-primary" type="button" ng-click="vm.search()"><span class="glyphicon glyphicon-search"></span></button>
</span>

View File

@ -6,11 +6,13 @@
.module('harbor.replication')
.directive('listReplication', listReplication);
ListReplicationController.$inject = ['ListReplicationPolicyService', 'ListReplicationJobService'];
ListReplicationController.$inject = ['getParameterByName', '$location', 'ListReplicationPolicyService', 'ListReplicationJobService'];
function ListReplicationController(ListReplicationPolicyService, ListReplicationJobService) {
function ListReplicationController(getParameterByName, $location, ListReplicationPolicyService, ListReplicationJobService) {
var vm = this;
vm.projectId = getParameterByName('project_id', $location.absUrl());
vm.addReplication = addReplication;
vm.retrievePolicy = retrievePolicy;
vm.retrieveJob = retrieveJob;
@ -19,13 +21,15 @@
vm.retrievePolicy();
function retrievePolicy() {
ListReplicationPolicyService()
.then(listReplicationPolicySuccess, listReplicationPolicyFailed);
ListReplicationPolicyService(vm.projectId, vm.replicationName)
.success(listReplicationPolicySuccess)
.error(listReplicationPolicyFailed);
}
function retrieveJob(policyId) {
ListReplicationJobService(policyId)
.then(listReplicationJobSuccess, listReplicationJobFailed);
ListReplicationJobService(policyId, vm.replicationJobName)
.success(listReplicationJobSuccess)
.error(listReplicationJobFailed);
}
function listReplicationPolicySuccess(data, status) {
@ -46,7 +50,6 @@
function addReplication() {
vm.modalTitle = 'Create New Policy';
vm.modalMessage = '';
}
}

View File

@ -54,7 +54,7 @@
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" id="btnOk">// 'ok' | tr //</button>
<button type="button" class="btn btn-primary" id="btnOk" ng-click="vm.save(destination)">// 'ok' | tr //</button>
<button type="button" class="btn btn-default" data-dismiss="modal">// 'close' | tr //</button>
</div>
</div><!-- /.modal-content -->

View File

@ -6,10 +6,30 @@
.module('harbor.system.management')
.directive('createDestination', createDestination);
CreateDestinationController.$inject = [];
CreateDestinationController.$inject = ['CreateDestinationService'];
function CreateDestinationController() {
function CreateDestinationController(CreateDestinationService) {
var vm = this;
vm.save = save;
function save(destination) {
if(destination) {
console.log('destination:' + angular.toJson(destination));
CreateDestinationService(destination.name, destination.endpoint,
destination.username, destination.password)
.success(createDestinationSuccess)
.error(createDestinationFailed);
}
}
function createDestinationSuccess(data, status) {
alert('Successful created destination.');
}
function createDestinationFailed(data, status) {
console.log('Failed create destination:' + data);
}
}
function createDestination() {

View File

@ -25,7 +25,7 @@
</tr>
<tr ng-if="vm.destinations.length > 0" ng-repeat="r in vm.destinations">
<td>//r.name//</td>
<td>//r.endpoint//</td>
<td>//r.url//</td>
<td>//r.creation_time//</td>
<td></td>
</tr>

View File

@ -11,12 +11,29 @@
function DestinationController(ListDestinationService) {
var vm = this;
ListDestinationService()
.then(function(data) {
vm.destinations = data;
}, function() {
});
vm.retrieve = retrieve;
vm.search = search;
vm.retrieve();
function retrieve() {
ListDestinationService()
.success(listDestinationSuccess)
.error(listDestinationFailed);
}
function search() {
vm.retrieve();
}
function listDestinationSuccess(data, status) {
vm.destinations = data;
}
function listDestinationFailed(data, status) {
console.log('Failed list destination:' + data);
}
}
function destination() {

View File

@ -6,12 +6,18 @@
.module('harbor.services.destination')
.factory('CreateDestinationService', CreateDestinationService);
CreateDestinationService.$inject = ['$http', '$q', '$timeout'];
CreateDestinationService.$inject = ['$http'];
function CreateDestinationService($http, $q, $timeout) {
function CreateDestinationService($http) {
return createDestination;
function createDestination() {
function createDestination(name, endpoint, username, password) {
return $http
.post('/api/targets', {
'name': name,
'url': endpoint,
'username': username,
'password': password
});
}
}

View File

@ -6,38 +6,17 @@
.module('harbor.services.destination')
.factory('ListDestinationService', ListDestinationService);
ListDestinationService.$inject = ['$http', '$q', '$timeout'];
ListDestinationService.$inject = ['$http'];
function ListDestinationService($http, $q, $timeout) {
var mockData = [
{
'id' : 1,
'name': 'Target01',
'endpoint': 'http://10.117.170.69',
'creation_time': '2016-06-01 16:54:32'
},
{
'id' : 2,
'name': 'Target02',
'endpoint': 'http://10.117.171.41',
'creation_time': '2016-06-01 15:35:22'
},
{
'id' : 3,
'name': 'Target03',
'endpoint': 'http://10.117.171.63',
'creation_time': '2016-06-01 14:22:21'
}
];
function ListDestinationService($http) {
return listDestination;
function listDestination() {
var q = $q.defer();
$timeout(function() {
q.resolve(mockData);
});
return q.promise;
function listDestination(name) {
return $http
.get('/api/targets', {
'params': {
'name': name
}
});
}
}

View File

@ -6,62 +6,20 @@
.module('harbor.services.replication.job')
.factory('ListReplicationJobService', ListReplicationJobService);
ListReplicationJobService.$inject = ['$http', '$q', '$timeout'];
ListReplicationJobService.$inject = ['$http'];
function ListReplicationJobService($http, $q, $timeout) {
var mockData = [
{
'policy_id': 2,
'job_id': 1,
'name': 'Replicate Ubuntu:14.04',
'operation': 'copy',
'start_time': '2016-05-27 14:05:22',
'status': 'failed'
},
{
'policy_id': 1,
'job_id': 2,
'name': 'Replicate MySQL:5.6',
'operation': 'copy',
'start_time': '2016-05-27 15:15:22',
'status': 'success'
},
{
'policy_id': 1,
'job_id': 3,
'name': 'Replicate Alpine:1.1',
'operation': 'copy',
'start_time': '2016-05-27 13:15:22',
'status': 'success'
},
{
'policy_id': 2,
'job_id': 4,
'name': 'Replicate Alpine:1.1',
'operation': 'copy',
'start_time': '2016-05-27 13:15:22',
'status': 'success'
}
];
function ListReplicationJobService($http) {
return listReplicationJob;
function listReplicationJob(policyId) {
console.log('policyId=' + policyId);
var defer = $q.defer();
$timeout(function() {
var result = [];
for(var i = 0; i < mockData.length; i++) {
var item = mockData[i];
if(item['policy_id'] == policyId) {
result.push(item);
function listReplicationJob(policyId, name) {
return $http
.get('/api/jobs/replication/', {
'params': {
'policy_id': policyId,
'name': name
}
}
defer.resolve(result);
});
return defer.promise;
});
}
}
})();

View File

@ -0,0 +1,28 @@
(function() {
'use strict';
angular
.module('harbor.services.replication.policy')
.factory('CreateReplicationPolicyService', CreateReplicationPolicyService);
CreateReplicationPolicyService.$inject = ['$http'];
function CreateReplicationPolicyService($http) {
return createReplicaitonPolicy;
function createReplicationPolicy(policy) {
return $http
.post('/api/policies/replication', {
'project_id': policy.projectId,
'target_id': policy.targetId,
'name': policy.name,
'enabled': policy.enabled,
'description': policy.description,
'cron_str': policy.cronStr,
'start_time': policy.startTime
})
}
}
})();

View File

@ -6,66 +6,20 @@
.module('harbor.services.replication.policy')
.factory('ListReplicationPolicyService', ListReplicationPolicyService);
ListReplicationPolicyService.$inject = ['$http', '$q', '$timeout'];
ListReplicationPolicyService.$inject = ['$http'];
function ListReplicationPolicyService($http, $q, $timeout) {
var mockData = [
{
'policy_id': 1,
'name': 'test01',
'description': 'Sync image for current.',
'destination': '10.117.170.69',
'start_time': '2015-05-26 22:30:30',
'status': 'NORMAL',
'activation': true
},
{
'policy_id': 2,
'name': 'test02',
'description': 'Sync image for current.',
'destination': '10.117.170.69',
'start_time': '2015-05-27 20:00:00',
'status': 'WARNING',
'activation': true
},
{
'policy_id': 3,
'name': 'test03',
'description': 'Sync image for current.',
'destination': '10.117.170.69',
'start_time': '2015-05-27 20:00:00',
'status': 'WARNING',
'activation': true
},
{
'policy_id': 4,
'name': 'test04',
'description': 'Sync image for current.',
'destination': '10.117.170.69',
'start_time': '2015-05-27 20:00:00',
'status': 'WARNING',
'activation': true
},
{
'policy_id': 5,
'name': 'test05',
'description': 'Sync image for current.',
'destination': '10.117.170.69',
'start_time': '2015-05-27 20:00:00',
'status': 'WARNING',
'activation': true
}
];
function ListReplicationPolicyService($http) {
return listReplicationPolicy;
function listReplicationPolicy(policyName) {
var defer = $q.defer();
$timeout(function() {
defer.resolve(mockData);
});
return defer.promise;
function listReplicationPolicy(projectId, name) {
return $http
.get('/api/policies/replication', {
'params': {
'project_id': projectId,
'name': name
}
});
}
}