mirror of
https://github.com/bitwarden/browser.git
synced 2024-11-09 09:51:02 +01:00
change payment
This commit is contained in:
parent
40d38ec0db
commit
f8fcbbea85
@ -2,7 +2,9 @@
|
|||||||
.module('bit.organization')
|
.module('bit.organization')
|
||||||
|
|
||||||
.controller('organizationBillingChangePaymentController', function ($scope, $state, $uibModalInstance, apiService, stripe,
|
.controller('organizationBillingChangePaymentController', function ($scope, $state, $uibModalInstance, apiService, stripe,
|
||||||
$analytics) {
|
$analytics, toastr, existingPaymentMethod) {
|
||||||
|
$scope.existingPaymentMethod = existingPaymentMethod;
|
||||||
|
|
||||||
$scope.submit = function () {
|
$scope.submit = function () {
|
||||||
$scope.submitPromise = stripe.card.createToken($scope.card).then(function (response) {
|
$scope.submitPromise = stripe.card.createToken($scope.card).then(function (response) {
|
||||||
var request = {
|
var request = {
|
||||||
@ -12,7 +14,15 @@
|
|||||||
return apiService.organizations.putPayment({ id: $state.params.orgId }, request).$promise;
|
return apiService.organizations.putPayment({ id: $state.params.orgId }, request).$promise;
|
||||||
}).then(function (response) {
|
}).then(function (response) {
|
||||||
$scope.card = null;
|
$scope.card = null;
|
||||||
$analytics.eventTrack('Changed Payment Method');
|
if (existingPaymentMethod) {
|
||||||
|
$analytics.eventTrack('Changed Payment Method');
|
||||||
|
toastr.success('You have changed your payment method.');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$analytics.eventTrack('Added Payment Method');
|
||||||
|
toastr.success('You have added a payment method.');
|
||||||
|
}
|
||||||
|
|
||||||
$uibModalInstance.close();
|
$uibModalInstance.close();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -9,8 +9,34 @@
|
|||||||
$scope.loading = true;
|
$scope.loading = true;
|
||||||
|
|
||||||
$scope.$on('$viewContentLoaded', function () {
|
$scope.$on('$viewContentLoaded', function () {
|
||||||
|
load();
|
||||||
|
});
|
||||||
|
|
||||||
|
$scope.changePayment = function () {
|
||||||
|
var modal = $uibModal.open({
|
||||||
|
animation: true,
|
||||||
|
templateUrl: 'app/organization/views/organizationBillingChangePayment.html',
|
||||||
|
controller: 'organizationBillingChangePaymentController',
|
||||||
|
resolve: {
|
||||||
|
existingPaymentMethod: function () {
|
||||||
|
return $scope.paymentSource ? $scope.paymentSource.description : null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
modal.result.then(function () {
|
||||||
|
load();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
$scope.cancel = function () {
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
function load() {
|
||||||
apiService.organizations.getBilling({ id: $state.params.orgId }, function (org) {
|
apiService.organizations.getBilling({ id: $state.params.orgId }, function (org) {
|
||||||
$scope.loading = false;
|
$scope.loading = false;
|
||||||
|
$scope.noSubscription = org.PlanType === 0;
|
||||||
|
|
||||||
$scope.plan = {
|
$scope.plan = {
|
||||||
name: org.Plan,
|
name: org.Plan,
|
||||||
@ -18,14 +44,24 @@
|
|||||||
seats: org.Seats
|
seats: org.Seats
|
||||||
};
|
};
|
||||||
|
|
||||||
$scope.subscription = {
|
$scope.subscription = null;
|
||||||
trialEndDate: org.Subscription.TrialEndDate,
|
if (org.Subscription) {
|
||||||
nextBillDate: org.Subscription.NextBillDate,
|
$scope.subscription = {
|
||||||
cancelNext: org.Subscription.CancelAtNextBillDate,
|
trialEndDate: org.Subscription.TrialEndDate,
|
||||||
status: org.Subscription.Status
|
cancelNext: org.Subscription.CancelAtNextBillDate,
|
||||||
};
|
status: org.Subscription.Status
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
if (org.Subscription.Items) {
|
$scope.nextBill = null;
|
||||||
|
if (org.UpcomingInvoice) {
|
||||||
|
$scope.nextBill = {
|
||||||
|
date: org.UpcomingInvoice.Date,
|
||||||
|
amount: org.UpcomingInvoice.Amount
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
if (org.Subscription && org.Subscription.Items) {
|
||||||
$scope.subscription.items = [];
|
$scope.subscription.items = [];
|
||||||
for (var i = 0; i < org.Subscription.Items.length; i++) {
|
for (var i = 0; i < org.Subscription.Items.length; i++) {
|
||||||
$scope.subscription.items.push({
|
$scope.subscription.items.push({
|
||||||
@ -37,6 +73,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$scope.paymentSource = null;
|
||||||
if (org.PaymentSource) {
|
if (org.PaymentSource) {
|
||||||
$scope.paymentSource = {
|
$scope.paymentSource = {
|
||||||
type: org.PaymentSource.Type,
|
type: org.PaymentSource.Type,
|
||||||
@ -60,21 +97,5 @@
|
|||||||
}
|
}
|
||||||
$scope.charges = charges;
|
$scope.charges = charges;
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
|
|
||||||
$scope.changePayment = function () {
|
|
||||||
var modal = $uibModal.open({
|
|
||||||
animation: true,
|
|
||||||
templateUrl: 'app/organization/views/organizationBillingChangePayment.html',
|
|
||||||
controller: 'organizationBillingChangePaymentController'
|
|
||||||
});
|
|
||||||
|
|
||||||
modal.result.then(function () {
|
|
||||||
// TODO: reload
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
$scope.cancel = function () {
|
|
||||||
|
|
||||||
};
|
|
||||||
});
|
});
|
||||||
|
@ -23,12 +23,12 @@
|
|||||||
<dl>
|
<dl>
|
||||||
<dt>Status</dt>
|
<dt>Status</dt>
|
||||||
<dd style="text-transform: capitalize;">{{subscription.status || '-'}}</dd>
|
<dd style="text-transform: capitalize;">{{subscription.status || '-'}}</dd>
|
||||||
<dt>Next Bill Date</dt>
|
<dt>Next Charge</dt>
|
||||||
<dd>{{subscription.nextBillDate ? (subscription.nextBillDate | date: format: mediumDate) : '-'}}</dd>
|
<dd>{{nextBillDate ? ((nextBillDate | date: format: mediumDate) + ', ' + (nextBillAmount | currency:'$')) : '-'}}</dd>
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row" ng-if="!noSubscription">
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
<strong>Details</strong>
|
<strong>Details</strong>
|
||||||
<div ng-show="loading">
|
<div ng-show="loading">
|
||||||
@ -54,11 +54,32 @@
|
|||||||
<button type="button" class="btn btn-default btn-flat" ng-click="changePlan()">
|
<button type="button" class="btn btn-default btn-flat" ng-click="changePlan()">
|
||||||
Change Plan
|
Change Plan
|
||||||
</button>
|
</button>
|
||||||
<button type="button" class="btn btn-default btn-flat" ng-click="cancel()">
|
<button type="button" class="btn btn-default btn-flat" ng-click="cancel()" ng-if="!noSubscription">
|
||||||
Cancel Plan
|
Cancel Plan
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="box">
|
||||||
|
<div class="box-header with-border">
|
||||||
|
<h3 class="box-title">User Seats</h3>
|
||||||
|
</div>
|
||||||
|
<div class="box-body">
|
||||||
|
<div ng-show="loading">
|
||||||
|
Loading...
|
||||||
|
</div>
|
||||||
|
<div ng-show="!loading">
|
||||||
|
You plan currently has a total of <b>{{plan.seats}}</b> seats.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="box-footer" ng-if="!noSubscription">
|
||||||
|
<button type="button" class="btn btn-default btn-flat" ng-click="addSeats()">
|
||||||
|
Add Seats
|
||||||
|
</button>
|
||||||
|
<button type="button" class="btn btn-default btn-flat" ng-click="removeSeats()">
|
||||||
|
Remove Seats
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<div class="box-header with-border">
|
<div class="box-header with-border">
|
||||||
<h3 class="box-title">Payment Method</h3>
|
<h3 class="box-title">Payment Method</h3>
|
||||||
|
@ -1,6 +1,9 @@
|
|||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">×</span></button>
|
<button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||||
<h4 class="modal-title"><i class="fa fa-credit-card"></i> Change Payment Method</h4>
|
<h4 class="modal-title">
|
||||||
|
<i class="fa fa-credit-card"></i>
|
||||||
|
{{existingPaymentMethod ? 'Change Payment Method' : 'Add Payment Method'}}
|
||||||
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
|
<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
|
Loading…
Reference in New Issue
Block a user