fix issue from QA testing and added previous button
This commit is contained in:
+22
-21
@@ -9,29 +9,30 @@ export default class WizardAciController {
|
||||
this.NameValidator = NameValidator;
|
||||
}
|
||||
|
||||
async addAciEndpoint() {
|
||||
const { name, azureApplicationId, azureTenantId, azureAuthenticationKey } = this.formValues;
|
||||
const groupId = 1;
|
||||
const tagIds = [];
|
||||
addAciEndpoint() {
|
||||
return this.$async(async () => {
|
||||
const { name, azureApplicationId, azureTenantId, azureAuthenticationKey } = this.formValues;
|
||||
const groupId = 1;
|
||||
const tagIds = [];
|
||||
|
||||
try {
|
||||
this.state.actionInProgress = true;
|
||||
// Check name is duplicated or not
|
||||
let nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
try {
|
||||
this.state.actionInProgress = true;
|
||||
// Check name is duplicated or not
|
||||
let nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
}
|
||||
await this.EndpointService.createAzureEndpoint(name, azureApplicationId, azureTenantId, azureAuthenticationKey, groupId, tagIds);
|
||||
this.Notifications.success('Environment connected', name);
|
||||
this.clearForm();
|
||||
this.onUpdate();
|
||||
} catch (err) {
|
||||
this.Notifications.error('Failure', err, 'Unable to connect your environment');
|
||||
this.state.actionInProgress = false;
|
||||
}
|
||||
await this.EndpointService.createAzureEndpoint(name, azureApplicationId, azureTenantId, azureAuthenticationKey, groupId, tagIds);
|
||||
this.Notifications.success('Environment connected', name);
|
||||
this.clearForm();
|
||||
this.onUpdate();
|
||||
} catch (err) {
|
||||
this.Notifications.error('Failure', err, 'Unable to connect your environment');
|
||||
this.state.actionInProgress = false;
|
||||
}
|
||||
|
||||
this.onAnalytics('aci-api');
|
||||
this.onAnalytics('aci-api');
|
||||
});
|
||||
}
|
||||
|
||||
clearForm() {
|
||||
|
||||
@@ -55,7 +55,7 @@
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm wizard-connect-button"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.azureApplicationId || !$ctrl.formValues.azureTenantId || !$ctrl.formValues.azureAuthenticationKey"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.azureApplicationId || !$ctrl.formValues.azureTenantId || !$ctrl.formValues.azureAuthenticationKey || $ctrl.state.actionInProgress"
|
||||
ng-click="$ctrl.addAciEndpoint()"
|
||||
button-spinner="$ctrl.state.actionInProgress"
|
||||
>
|
||||
|
||||
+35
-33
@@ -40,43 +40,45 @@ export default class WizardDockerController {
|
||||
}
|
||||
|
||||
// connect docker environment
|
||||
async connectEnvironment(type) {
|
||||
const name = this.formValues.name;
|
||||
const url = this.$filter('stripprotocol')(this.formValues.url);
|
||||
const publicUrl = url.split(':')[0];
|
||||
const overrideUrl = this.formValues.socketPath;
|
||||
const groupId = this.formValues.groupId;
|
||||
const tagIds = this.formValues.tagIds;
|
||||
const securityData = this.formValues.securityFormData;
|
||||
const socketUrl = this.formValues.overrideSocket ? overrideUrl : url;
|
||||
connectEnvironment(type) {
|
||||
return this.$async(async () => {
|
||||
const name = this.formValues.name;
|
||||
const url = this.$filter('stripprotocol')(this.formValues.url);
|
||||
const publicUrl = url.split(':')[0];
|
||||
const overrideUrl = this.formValues.socketPath;
|
||||
const groupId = this.formValues.groupId;
|
||||
const tagIds = this.formValues.tagIds;
|
||||
const securityData = this.formValues.securityFormData;
|
||||
const socketUrl = this.formValues.overrideSocket ? overrideUrl : url;
|
||||
|
||||
var creationType = null;
|
||||
var creationType = null;
|
||||
|
||||
if (type === 'agent') {
|
||||
creationType = PortainerEndpointCreationTypes.AgentEnvironment;
|
||||
}
|
||||
if (type === 'agent') {
|
||||
creationType = PortainerEndpointCreationTypes.AgentEnvironment;
|
||||
}
|
||||
|
||||
if (type === 'api') {
|
||||
creationType = PortainerEndpointCreationTypes.LocalDockerEnvironment;
|
||||
}
|
||||
if (type === 'api') {
|
||||
creationType = PortainerEndpointCreationTypes.LocalDockerEnvironment;
|
||||
}
|
||||
|
||||
// Check name is duplicated or not
|
||||
const nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
}
|
||||
switch (type) {
|
||||
case 'agent':
|
||||
await this.addDockerAgentEndpoint(name, creationType, url, publicUrl, groupId, tagIds);
|
||||
break;
|
||||
case 'api':
|
||||
await this.addDockerApiEndpoint(name, creationType, url, publicUrl, groupId, tagIds, securityData);
|
||||
break;
|
||||
case 'socket':
|
||||
await this.addDockerLocalEndpoint(name, socketUrl, publicUrl, groupId, tagIds);
|
||||
break;
|
||||
}
|
||||
// Check name is duplicated or not
|
||||
const nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
}
|
||||
switch (type) {
|
||||
case 'agent':
|
||||
await this.addDockerAgentEndpoint(name, creationType, url, publicUrl, groupId, tagIds);
|
||||
break;
|
||||
case 'api':
|
||||
await this.addDockerApiEndpoint(name, creationType, url, publicUrl, groupId, tagIds, securityData);
|
||||
break;
|
||||
case 'socket':
|
||||
await this.addDockerLocalEndpoint(name, socketUrl, publicUrl, groupId, tagIds);
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Docker Agent Endpoint
|
||||
|
||||
+6
-6
@@ -138,9 +138,9 @@
|
||||
ng-if="$ctrl.state.endpointType === 'agent'"
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm wizard-connect-button"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.url"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.url || $ctrl.state.actionInProgress"
|
||||
ng-click="$ctrl.connectEnvironment('agent')"
|
||||
button-spinner="state.actionInProgress"
|
||||
button-spinner="$ctrl.state.actionInProgress"
|
||||
>
|
||||
<span ng-hide="$ctrl.state.actionInProgress"><i class="fa fa-plug" style="margin-right: 5px;"></i>Connect </span>
|
||||
<span ng-show="$ctrl.state.actionInProgress">Connecting environment...</span>
|
||||
@@ -149,9 +149,9 @@
|
||||
ng-if="$ctrl.state.endpointType === 'api'"
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm wizard-connect-button"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.url"
|
||||
ng-disabled="!$ctrl.formValues.name || !$ctrl.formValues.url || $ctrl.state.actionInProgress"
|
||||
ng-click="$ctrl.connectEnvironment('api')"
|
||||
button-spinner="state.actionInProgress"
|
||||
button-spinner="$ctrl.state.actionInProgress"
|
||||
>
|
||||
<span ng-hide="$ctrl.state.actionInProgress"><i class="fa fa-plug" style="margin-right: 5px;"></i>Connect </span>
|
||||
<span ng-show="$ctrl.state.actionInProgress">Connecting environment...</span>
|
||||
@@ -160,9 +160,9 @@
|
||||
ng-if="$ctrl.state.endpointType === 'socket'"
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm wizard-connect-button"
|
||||
ng-disabled="!$ctrl.formValues.name"
|
||||
ng-disabled="!$ctrl.formValues.name || $ctrl.state.actionInProgress"
|
||||
ng-click="$ctrl.connectEnvironment('socket')"
|
||||
button-spinner="state.actionInProgress"
|
||||
button-spinner="$ctrl.state.actionInProgress"
|
||||
>
|
||||
<span ng-hide="$ctrl.state.actionInProgress"><i class="fa fa-plug" style="margin-right: 5px;"></i>Connect </span>
|
||||
<span ng-show="$ctrl.state.actionInProgress">Connecting environment...</span>
|
||||
|
||||
+23
-21
@@ -14,28 +14,30 @@ export default class WizardKubernetesController {
|
||||
this.NameValidator = NameValidator;
|
||||
}
|
||||
|
||||
async addKubernetesAgent() {
|
||||
const name = this.state.formValues.name;
|
||||
const groupId = 1;
|
||||
const tagIds = [];
|
||||
const url = this.$filter('stripprotocol')(this.state.formValues.url);
|
||||
const publicUrl = url.split(':')[0];
|
||||
const creationType = PortainerEndpointCreationTypes.AgentEnvironment;
|
||||
const tls = true;
|
||||
const tlsSkipVerify = true;
|
||||
const tlsSkipClientVerify = true;
|
||||
const tlsCaFile = null;
|
||||
const tlsCertFile = null;
|
||||
const tlsKeyFile = null;
|
||||
addKubernetesAgent() {
|
||||
return this.$async(async () => {
|
||||
const name = this.state.formValues.name;
|
||||
const groupId = 1;
|
||||
const tagIds = [];
|
||||
const url = this.$filter('stripprotocol')(this.state.formValues.url);
|
||||
const publicUrl = url.split(':')[0];
|
||||
const creationType = PortainerEndpointCreationTypes.AgentEnvironment;
|
||||
const tls = true;
|
||||
const tlsSkipVerify = true;
|
||||
const tlsSkipClientVerify = true;
|
||||
const tlsCaFile = null;
|
||||
const tlsCertFile = null;
|
||||
const tlsKeyFile = null;
|
||||
|
||||
// Check name is duplicated or not
|
||||
let nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
}
|
||||
this.addRemoteEndpoint(name, creationType, url, publicUrl, groupId, tagIds, tls, tlsSkipVerify, tlsSkipClientVerify, tlsCaFile, tlsCertFile, tlsKeyFile);
|
||||
this.onAnalytics('kubernetes-agent');
|
||||
// Check name is duplicated or not
|
||||
let nameUsed = await this.NameValidator.validateEnvironmentName(name);
|
||||
if (nameUsed) {
|
||||
this.Notifications.error('Failure', true, 'This name is been used, please try another one');
|
||||
return;
|
||||
}
|
||||
await this.addRemoteEndpoint(name, creationType, url, publicUrl, groupId, tagIds, tls, tlsSkipVerify, tlsSkipClientVerify, tlsCaFile, tlsCertFile, tlsKeyFile);
|
||||
this.onAnalytics('kubernetes-agent');
|
||||
});
|
||||
}
|
||||
|
||||
async addRemoteEndpoint(name, creationType, url, publicURL, groupId, tagIds, tls, tlsSkipVerify, tlsSkipClientVerify, tlsCaFile, tlsCertFile, tlsKeyFile) {
|
||||
|
||||
+2
-2
@@ -53,9 +53,9 @@
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm wizard-connect-button"
|
||||
ng-disabled="!$ctrl.state.formValues.name || !$ctrl.state.formValues.url"
|
||||
ng-disabled="!$ctrl.state.formValues.name || !$ctrl.state.formValues.url || $ctrl.state.actionInProgress"
|
||||
ng-click="$ctrl.addKubernetesAgent()"
|
||||
button-spinner="state.actionInProgress"
|
||||
button-spinner="$ctrl.state.actionInProgress"
|
||||
>
|
||||
<span ng-hide="$ctrl.state.actionInProgress"><i class="fa fa-plug" style="margin-right: 5px;"></i> Connect </span>
|
||||
<span ng-show="$ctrl.state.actionInProgress">Connecting environment...</span>
|
||||
|
||||
@@ -44,6 +44,14 @@ export default class WizardEndpointsController {
|
||||
this.state.currentStep++;
|
||||
}
|
||||
|
||||
previousStep() {
|
||||
this.state.section = this.state.selections[this.state.currentStep - 2].endpoint;
|
||||
this.state.selections[this.state.currentStep - 2].stage = 'active';
|
||||
this.state.selections[this.state.currentStep - 1].stage = '';
|
||||
this.state.nextStep = 'Next Step';
|
||||
this.state.currentStep--;
|
||||
}
|
||||
|
||||
nextStep() {
|
||||
if (this.state.currentStep >= this.state.maxStep - 1) {
|
||||
this.state.nextStep = 'Finish';
|
||||
@@ -137,6 +145,7 @@ export default class WizardEndpointsController {
|
||||
kubernetesActive: '',
|
||||
aciActive: '',
|
||||
maxStep: '',
|
||||
previousStep: 'Previous',
|
||||
nextStep: 'Next Step',
|
||||
selections: [],
|
||||
analytics: {
|
||||
|
||||
@@ -62,6 +62,15 @@
|
||||
border-top: 1px solid #777;
|
||||
}
|
||||
|
||||
.next-btn {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.previous-btn {
|
||||
float: left;
|
||||
margin-left: 0px !important;
|
||||
}
|
||||
|
||||
.wizard-wrapper {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 400px;
|
||||
|
||||
@@ -23,7 +23,16 @@
|
||||
</div>
|
||||
|
||||
<div class="wizard-step-action">
|
||||
<button ng-click="$ctrl.nextStep()" ng-show="$ctrl.state.currentStep !== 0" type="submit" class="btn btn-primary btn-sm">
|
||||
<button
|
||||
ng-click="$ctrl.previousStep()"
|
||||
ng-show="$ctrl.state.currentStep !== 0"
|
||||
type="submit"
|
||||
class="btn btn-primary btn-sm previous-btn"
|
||||
ng-disabled="$ctrl.state.currentStep === 1"
|
||||
>
|
||||
<i class="fas fa-arrow-left space-right"></i>{{ $ctrl.state.previousStep }}
|
||||
</button>
|
||||
<button ng-click="$ctrl.nextStep()" ng-show="$ctrl.state.currentStep !== 0" type="submit" class="btn btn-primary btn-sm next-btn">
|
||||
{{ $ctrl.state.nextStep }} <i class="fas fa-arrow-right space-left"></i
|
||||
></button>
|
||||
</div>
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
import { PortainerEndpointCreationTypes } from 'Portainer/models/endpoint/models';
|
||||
|
||||
export default class WizardViewController {
|
||||
/* @ngInject */
|
||||
constructor($async, $state, EndpointService, $analytics) {
|
||||
@@ -80,13 +82,13 @@ export default class WizardViewController {
|
||||
}
|
||||
} else {
|
||||
const addedLocalEndpoint = endpoints.value[0];
|
||||
if (addedLocalEndpoint.Type === 1) {
|
||||
if (addedLocalEndpoint.Type === PortainerEndpointCreationTypes.LocalDockerEnvironment) {
|
||||
this.state.endpoint.added = true;
|
||||
this.state.endpoint.connected = 'docker';
|
||||
this.state.local.icon = 'fab fa-docker';
|
||||
}
|
||||
|
||||
if (addedLocalEndpoint.Type === 5) {
|
||||
if (addedLocalEndpoint.Type === PortainerEndpointCreationTypes.LocalKubernetesEnvironment) {
|
||||
this.state.endpoint.added = true;
|
||||
this.state.endpoint.connected = 'kubernetes';
|
||||
this.state.local.icon = 'fas fa-dharmachakra';
|
||||
|
||||
Reference in New Issue
Block a user