change payment
This commit is contained in:
parent
40d38ec0db
commit
f8fcbbea85
|
@ -2,7 +2,9 @@
|
|||
.module('bit.organization')
|
||||
|
||||
.controller('organizationBillingChangePaymentController', function ($scope, $state, $uibModalInstance, apiService, stripe,
|
||||
$analytics) {
|
||||
$analytics, toastr, existingPaymentMethod) {
|
||||
$scope.existingPaymentMethod = existingPaymentMethod;
|
||||
|
||||
$scope.submit = function () {
|
||||
$scope.submitPromise = stripe.card.createToken($scope.card).then(function (response) {
|
||||
var request = {
|
||||
|
@ -12,7 +14,15 @@
|
|||
return apiService.organizations.putPayment({ id: $state.params.orgId }, request).$promise;
|
||||
}).then(function (response) {
|
||||
$scope.card = null;
|
||||
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();
|
||||
});
|
||||
};
|
||||
|
|
|
@ -9,8 +9,34 @@
|
|||
$scope.loading = true;
|
||||
|
||||
$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) {
|
||||
$scope.loading = false;
|
||||
$scope.noSubscription = org.PlanType === 0;
|
||||
|
||||
$scope.plan = {
|
||||
name: org.Plan,
|
||||
|
@ -18,14 +44,24 @@
|
|||
seats: org.Seats
|
||||
};
|
||||
|
||||
$scope.subscription = null;
|
||||
if (org.Subscription) {
|
||||
$scope.subscription = {
|
||||
trialEndDate: org.Subscription.TrialEndDate,
|
||||
nextBillDate: org.Subscription.NextBillDate,
|
||||
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 = [];
|
||||
for (var i = 0; i < org.Subscription.Items.length; i++) {
|
||||
$scope.subscription.items.push({
|
||||
|
@ -37,6 +73,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
$scope.paymentSource = null;
|
||||
if (org.PaymentSource) {
|
||||
$scope.paymentSource = {
|
||||
type: org.PaymentSource.Type,
|
||||
|
@ -60,21 +97,5 @@
|
|||
}
|
||||
$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>
|
||||
<dt>Status</dt>
|
||||
<dd style="text-transform: capitalize;">{{subscription.status || '-'}}</dd>
|
||||
<dt>Next Bill Date</dt>
|
||||
<dd>{{subscription.nextBillDate ? (subscription.nextBillDate | date: format: mediumDate) : '-'}}</dd>
|
||||
<dt>Next Charge</dt>
|
||||
<dd>{{nextBillDate ? ((nextBillDate | date: format: mediumDate) + ', ' + (nextBillAmount | currency:'$')) : '-'}}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row" ng-if="!noSubscription">
|
||||
<div class="col-md-6">
|
||||
<strong>Details</strong>
|
||||
<div ng-show="loading">
|
||||
|
@ -54,11 +54,32 @@
|
|||
<button type="button" class="btn btn-default btn-flat" ng-click="changePlan()">
|
||||
Change Plan
|
||||
</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
|
||||
</button>
|
||||
</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-header with-border">
|
||||
<h3 class="box-title">Payment Method</h3>
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
<div class="modal-header">
|
||||
<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>
|
||||
<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
|
||||
<div class="modal-body">
|
||||
|
|
Loading…
Reference in New Issue