- payment for subscription frontend

This commit is contained in:
Peter Papp
2021-03-23 11:12:41 +01:00
parent 97f13c0b62
commit 7521c588fc
9 changed files with 230 additions and 183 deletions
+3 -3
View File
@@ -45,9 +45,9 @@ PUSHER_APP_SECRET=
PUSHER_APP_CLUSTER=mt1
CASHIER_LOGGER=stack
CASHIER_CURRENCY=EUR
STRIPE_KEY=pk_test_51GsACaCBETHMUxzVsYkeApHtqb85paMuye7G77PDDQ28kXqDJ5HTmqLi13aM6xee81OQK1fhkTZ7vmDiWLStU9160061Yb2MtL
STRIPE_SECRET=sk_test_51GsACaCBETHMUxzVviYCrv0CeZMyWAOfBPe4uH5rkKJcJxrXhIciWQTr7UB1sgw9geoJMkNDVSWBQW36tuAsVznd00zhNHXhok
CASHIER_CURRENCY=CZK
STRIPE_KEY=pk_test_51HSO06BwlPpoyJNwCscZSl5kYHtck4ChaICquBQodULHWTQlQxpEpQ22rQAPY1B82k78dR2tquugI3qRv2HcFrx300pqiho4Dz
STRIPE_SECRET=sk_test_51HSO06BwlPpoyJNwOCWiJafj5ebRF5dYQ0VpaQnHVWLZYYgj8jl3CX2K51Sf1cjDKxUzzGMVsg6e98i2GgtFSSfu00Q1uo6Knz
STRIPE_WEBHOOK_SECRET=whsec_eKrDhqtpbMUXOKqrUHf78SrZxHHYOdrf
CASHIER_PAYMENT_NOTIFICATION=App\Notifications\ConfirmPayment
CASHIER_MODEL=App\Models\User
@@ -30,6 +30,21 @@ class SubscriptionController extends Controller
);
}
/**
* Get setup intent to register credit card
*
* @param SubscriptionRequest $order
* @return \Illuminate\Contracts\Foundation\Application|\Illuminate\Contracts\Routing\ResponseFactory|\Illuminate\Http\Response
*/
public function get_setup_intent(SubscriptionRequest $order)
{
// Create stripe customer if not exist
$order->user->createOrGetStripeCustomer();
// Return setup intent
return response($order->user->createSetupIntent(), 201);
}
/**
* Subscribe user
*
@@ -43,8 +58,7 @@ class SubscriptionController extends Controller
$order->user
->newSubscription('main', $order->requested_plan)
->create(
$this->stripe
->getOrSetDefaultPaymentMethod($request, $order->user)
$this->stripe->getOrSetDefaultPaymentMethod($request, $order->user)
);
// Get requested plan
+1 -1
View File
@@ -13,7 +13,7 @@ class SubscriptionRequest extends Model
use HasFactory;
protected $fillable = [
'requested_plan', 'creator'
'requested_plan', 'creator', 'status'
];
public $incrementing = false;
+84 -2
View File
@@ -175,7 +175,7 @@
"/js/main.55cf4e9bc02bec922581.hot-update.js": "/js/main.55cf4e9bc02bec922581.hot-update.js",
"/js/main.b52ecb4afdc47584e38f.hot-update.js": "/js/main.b52ecb4afdc47584e38f.hot-update.js",
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~74bf0fcb.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~74bf0fcb.js?id=6b6737a58e371fc4434b",
"/chunks/oasis/platba.js": "/chunks/oasis/platba.js?id=41fec8f562bfc988aa95",
"/chunks/oasis/platba.js": "/chunks/oasis/platba.js?id=49ac485fbad31f134cb9",
"/chunks/oasis/platba~chunks/upgrade-billing~chunks/upgrade-plan.js": "/chunks/oasis/platba~chunks/upgrade-billing~chunks/upgrade-plan.js?id=4781f8460c7f0f8b21a5",
"/vendors~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-i~0a9c5e33.js": "/vendors~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-i~0a9c5e33.js?id=b28978d3c8aae9b949a5",
"/vendors~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-i~8394cf85.js": "/vendors~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-i~8394cf85.js?id=d25da0762af813ea588c",
@@ -203,5 +203,87 @@
"/chunks/stripe-credentials.9b07cca19b41d1b68e00.hot-update.js": "/chunks/stripe-credentials.9b07cca19b41d1b68e00.hot-update.js",
"/chunks/subscription-plans.9b07cca19b41d1b68e00.hot-update.js": "/chunks/subscription-plans.9b07cca19b41d1b68e00.hot-update.js",
"/chunks/subscription-service.9b07cca19b41d1b68e00.hot-update.js": "/chunks/subscription-service.9b07cca19b41d1b68e00.hot-update.js",
"/chunks/oasis/platba.cba2f2943cb866639e8c.hot-update.js": "/chunks/oasis/platba.cba2f2943cb866639e8c.hot-update.js"
"/chunks/oasis/platba.cba2f2943cb866639e8c.hot-update.js": "/chunks/oasis/platba.cba2f2943cb866639e8c.hot-update.js",
"/js/main.031a4600b295390c58e8.hot-update.js": "/js/main.031a4600b295390c58e8.hot-update.js",
"/chunks/admin-account.031a4600b295390c58e8.hot-update.js": "/chunks/admin-account.031a4600b295390c58e8.hot-update.js",
"/chunks/app-setup.031a4600b295390c58e8.hot-update.js": "/chunks/app-setup.031a4600b295390c58e8.hot-update.js",
"/chunks/billings-detail.031a4600b295390c58e8.hot-update.js": "/chunks/billings-detail.031a4600b295390c58e8.hot-update.js",
"/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.031a4600b295390c58e8.hot-update.js": "/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.031a4600b295390c58e8.hot-update.js",
"/chunks/database.031a4600b295390c58e8.hot-update.js": "/chunks/database.031a4600b295390c58e8.hot-update.js",
"/chunks/environment-setup.031a4600b295390c58e8.hot-update.js": "/chunks/environment-setup.031a4600b295390c58e8.hot-update.js",
"/chunks/installation-disclaimer.031a4600b295390c58e8.hot-update.js": "/chunks/installation-disclaimer.031a4600b295390c58e8.hot-update.js",
"/chunks/purchase-code.031a4600b295390c58e8.hot-update.js": "/chunks/purchase-code.031a4600b295390c58e8.hot-update.js",
"/chunks/stripe-credentials.031a4600b295390c58e8.hot-update.js": "/chunks/stripe-credentials.031a4600b295390c58e8.hot-update.js",
"/chunks/subscription-plans.031a4600b295390c58e8.hot-update.js": "/chunks/subscription-plans.031a4600b295390c58e8.hot-update.js",
"/chunks/subscription-service.031a4600b295390c58e8.hot-update.js": "/chunks/subscription-service.031a4600b295390c58e8.hot-update.js",
"/chunks/user-create.031a4600b295390c58e8.hot-update.js": "/chunks/user-create.031a4600b295390c58e8.hot-update.js",
"/chunks/users.031a4600b295390c58e8.hot-update.js": "/chunks/users.031a4600b295390c58e8.hot-update.js",
"/js/main.e09be2a3c6f157576cd1.hot-update.js": "/js/main.e09be2a3c6f157576cd1.hot-update.js",
"/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.e09be2a3c6f157576cd1.hot-update.js": "/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.e09be2a3c6f157576cd1.hot-update.js",
"/chunks/user-create.e09be2a3c6f157576cd1.hot-update.js": "/chunks/user-create.e09be2a3c6f157576cd1.hot-update.js",
"/chunks/users.e09be2a3c6f157576cd1.hot-update.js": "/chunks/users.e09be2a3c6f157576cd1.hot-update.js",
"/js/main.0f9a8ae65e8eef72679b.hot-update.js": "/js/main.0f9a8ae65e8eef72679b.hot-update.js",
"/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.0f9a8ae65e8eef72679b.hot-update.js": "/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.0f9a8ae65e8eef72679b.hot-update.js",
"/chunks/user-create.0f9a8ae65e8eef72679b.hot-update.js": "/chunks/user-create.0f9a8ae65e8eef72679b.hot-update.js",
"/chunks/users.0f9a8ae65e8eef72679b.hot-update.js": "/chunks/users.0f9a8ae65e8eef72679b.hot-update.js",
"/js/main.71290e1b9d55d97cdb77.hot-update.js": "/js/main.71290e1b9d55d97cdb77.hot-update.js",
"/js/main.7bea7c94a5a2ebfec4aa.hot-update.js": "/js/main.7bea7c94a5a2ebfec4aa.hot-update.js",
"/js/main.b35488f9ab66392c897e.hot-update.js": "/js/main.b35488f9ab66392c897e.hot-update.js",
"/chunks/user-create.b35488f9ab66392c897e.hot-update.js": "/chunks/user-create.b35488f9ab66392c897e.hot-update.js",
"/chunks/users.b35488f9ab66392c897e.hot-update.js": "/chunks/users.b35488f9ab66392c897e.hot-update.js",
"/js/main.7e1fd694df45763849ec.hot-update.js": "/js/main.7e1fd694df45763849ec.hot-update.js",
"/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.7e1fd694df45763849ec.hot-update.js": "/chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-meth~0bfeabca.7e1fd694df45763849ec.hot-update.js",
"/chunks/user-create.7e1fd694df45763849ec.hot-update.js": "/chunks/user-create.7e1fd694df45763849ec.hot-update.js",
"/chunks/users.7e1fd694df45763849ec.hot-update.js": "/chunks/users.7e1fd694df45763849ec.hot-update.js",
"/chunks/oasis/platba.42fd0177e215d3516bfe.hot-update.js": "/chunks/oasis/platba.42fd0177e215d3516bfe.hot-update.js",
"/chunks/oasis/platba.2bfe3d5044285222d2a5.hot-update.js": "/chunks/oasis/platba.2bfe3d5044285222d2a5.hot-update.js",
"/chunks/oasis/platba.f0e5d3accb7dbdddb2a1.hot-update.js": "/chunks/oasis/platba.f0e5d3accb7dbdddb2a1.hot-update.js",
"/chunks/oasis/platba.53d1b1594090e41edee0.hot-update.js": "/chunks/oasis/platba.53d1b1594090e41edee0.hot-update.js",
"/chunks/oasis/platba.88046b64ea7a1ecadc41.hot-update.js": "/chunks/oasis/platba.88046b64ea7a1ecadc41.hot-update.js",
"/chunks/oasis/platba.8470878c9420955d827c.hot-update.js": "/chunks/oasis/platba.8470878c9420955d827c.hot-update.js",
"/chunks/oasis/platba.f770bc9c5f7ce1baf7bd.hot-update.js": "/chunks/oasis/platba.f770bc9c5f7ce1baf7bd.hot-update.js",
"/chunks/oasis/platba.c22211f85d4e9c4f0187.hot-update.js": "/chunks/oasis/platba.c22211f85d4e9c4f0187.hot-update.js",
"/chunks/oasis/platba.c6784090b07e1acea3a4.hot-update.js": "/chunks/oasis/platba.c6784090b07e1acea3a4.hot-update.js",
"/chunks/oasis/platba.6dca55ec338a4adf73d5.hot-update.js": "/chunks/oasis/platba.6dca55ec338a4adf73d5.hot-update.js",
"/chunks/oasis/platba.c179b9444a3c304bd743.hot-update.js": "/chunks/oasis/platba.c179b9444a3c304bd743.hot-update.js",
"/chunks/oasis/platba.e64577edb6db58c5ce89.hot-update.js": "/chunks/oasis/platba.e64577edb6db58c5ce89.hot-update.js",
"/chunks/oasis/platba.752087d6897e8437d5fd.hot-update.js": "/chunks/oasis/platba.752087d6897e8437d5fd.hot-update.js",
"/chunks/oasis/platba.4a0d0bb38b403c4f63dc.hot-update.js": "/chunks/oasis/platba.4a0d0bb38b403c4f63dc.hot-update.js",
"/chunks/oasis/platba.677433c80d5c448beadb.hot-update.js": "/chunks/oasis/platba.677433c80d5c448beadb.hot-update.js",
"/chunks/oasis/platba.2a47eb5d8bdf839e007c.hot-update.js": "/chunks/oasis/platba.2a47eb5d8bdf839e007c.hot-update.js",
"/chunks/oasis/platba.d722b95e88e73ea2eb8f.hot-update.js": "/chunks/oasis/platba.d722b95e88e73ea2eb8f.hot-update.js",
"/chunks/oasis/platba.c854da135da3e531f267.hot-update.js": "/chunks/oasis/platba.c854da135da3e531f267.hot-update.js",
"/chunks/oasis/platba.15eb2d0c40be7dab8890.hot-update.js": "/chunks/oasis/platba.15eb2d0c40be7dab8890.hot-update.js",
"/chunks/oasis/platba.fe7c9541b5daa645c34b.hot-update.js": "/chunks/oasis/platba.fe7c9541b5daa645c34b.hot-update.js",
"/chunks/oasis/platba.17abba54e59018b56c20.hot-update.js": "/chunks/oasis/platba.17abba54e59018b56c20.hot-update.js",
"/chunks/oasis/platba.3433a1392fa4859957a5.hot-update.js": "/chunks/oasis/platba.3433a1392fa4859957a5.hot-update.js",
"/chunks/oasis/platba.46173a77ba5029b94428.hot-update.js": "/chunks/oasis/platba.46173a77ba5029b94428.hot-update.js",
"/js/main.8665af5c4b5bb3b34562.hot-update.js": "/js/main.8665af5c4b5bb3b34562.hot-update.js",
"/chunks/files~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-files~chunks/shared/file~9d1352fd.js": "/chunks/files~chunks/oasis/platba~chunks/settings-subscription~chunks/shared-files~chunks/shared/file~9d1352fd.js?id=4030b241faac6b31341f",
"/chunks/oasis/platba.8665af5c4b5bb3b34562.hot-update.js": "/chunks/oasis/platba.8665af5c4b5bb3b34562.hot-update.js",
"/chunks/oasis/platba.80793d2faf022b06bc1b.hot-update.js": "/chunks/oasis/platba.80793d2faf022b06bc1b.hot-update.js",
"/chunks/oasis/platba.7e7c5b2678cf3b582143.hot-update.js": "/chunks/oasis/platba.7e7c5b2678cf3b582143.hot-update.js",
"/chunks/oasis/platba.faec9574fd98fd673669.hot-update.js": "/chunks/oasis/platba.faec9574fd98fd673669.hot-update.js",
"/chunks/oasis/platba.38cb9664a00c8d666200.hot-update.js": "/chunks/oasis/platba.38cb9664a00c8d666200.hot-update.js",
"/js/main.936a7e143e3f61eb3914.hot-update.js": "/js/main.936a7e143e3f61eb3914.hot-update.js",
"/chunks/oasis/platba.1808d1c8a24374407483.hot-update.js": "/chunks/oasis/platba.1808d1c8a24374407483.hot-update.js",
"/chunks/oasis/platba.1a91b409bac6643cd1ea.hot-update.js": "/chunks/oasis/platba.1a91b409bac6643cd1ea.hot-update.js",
"/js/main.95d371bd6f737548111d.hot-update.js": "/js/main.95d371bd6f737548111d.hot-update.js",
"/chunks/oasis/platba.95d371bd6f737548111d.hot-update.js": "/chunks/oasis/platba.95d371bd6f737548111d.hot-update.js",
"/js/main.f95f311e9ef928cbdb24.hot-update.js": "/js/main.f95f311e9ef928cbdb24.hot-update.js",
"/chunks/oasis/platba.f95f311e9ef928cbdb24.hot-update.js": "/chunks/oasis/platba.f95f311e9ef928cbdb24.hot-update.js",
"/chunks/oasis/platba.f70ad75ee7d8391c7ee9.hot-update.js": "/chunks/oasis/platba.f70ad75ee7d8391c7ee9.hot-update.js",
"/chunks/oasis/platba.311873ae6c05a6ed334c.hot-update.js": "/chunks/oasis/platba.311873ae6c05a6ed334c.hot-update.js",
"/chunks/oasis/platba.ab3e0239345bccbd7ceb.hot-update.js": "/chunks/oasis/platba.ab3e0239345bccbd7ceb.hot-update.js",
"/chunks/oasis/platba.549be1f1e9c63457b0b3.hot-update.js": "/chunks/oasis/platba.549be1f1e9c63457b0b3.hot-update.js",
"/chunks/oasis/platba.3e92922e3734893c7f75.hot-update.js": "/chunks/oasis/platba.3e92922e3734893c7f75.hot-update.js",
"/chunks/oasis/platba.a313317565ce32b43ea2.hot-update.js": "/chunks/oasis/platba.a313317565ce32b43ea2.hot-update.js",
"/chunks/oasis/platba.533a4dfdf46a35484a36.hot-update.js": "/chunks/oasis/platba.533a4dfdf46a35484a36.hot-update.js",
"/chunks/oasis/platba.f009c76893caadff04e9.hot-update.js": "/chunks/oasis/platba.f009c76893caadff04e9.hot-update.js",
"/chunks/oasis/platba.a611d3444f94bfdce48a.hot-update.js": "/chunks/oasis/platba.a611d3444f94bfdce48a.hot-update.js",
"/chunks/oasis/platba.da13b9373a1e8b01b6be.hot-update.js": "/chunks/oasis/platba.da13b9373a1e8b01b6be.hot-update.js",
"/chunks/oasis/platba.94b702f11bbb84b2a26a.hot-update.js": "/chunks/oasis/platba.94b702f11bbb84b2a26a.hot-update.js",
"/chunks/oasis/platba.7f2261220d4558187716.hot-update.js": "/chunks/oasis/platba.7f2261220d4558187716.hot-update.js",
"/chunks/oasis/platba.0cc8322034321a3f07a5.hot-update.js": "/chunks/oasis/platba.0cc8322034321a3f07a5.hot-update.js",
"/chunks/oasis/platba.097292fe9503aae25f5c.hot-update.js": "/chunks/oasis/platba.097292fe9503aae25f5c.hot-update.js"
}
@@ -4,9 +4,11 @@
<div class="content-page">
<div class="plan-title">
<credit-card-icon size="42" class="title-icon text-theme" />
<h1>{{ $t('page_upgrade_account.title') }}</h1>
<h2>{{ $t('page_upgrade_account.desription') }}</h2>
<img v-if="config.app_logo" class="logo" :src="$getImage(config.app_logo)" :alt="config.app_name">
<b v-if="! config.app_logo" class="auth-logo-text">{{ config.app_name }}</b>
<h1>Oasis Drive</h1>
<h2>Zaplacenim objednavky se Vas ucet automaticky zaktivuje a vytvori se Vam digitalni prostor pro Vase dulezite dokumenty.</h2>
</div>
<div class="order">
@@ -16,69 +18,28 @@
<FormLabel>{{ $t('page_upgrade_account.section_card') }}</FormLabel>
<!-- Pay by new credit card -->
<div class="register-card" v-show="! defaultPaymentMethod || payByNewCard">
<div class="register-card form block-form">
<InfoBox v-if="config.isDemo">
<p>For test your payment please use <b>4242 4242 4242 4242</b> or <b>5555 5555 5555 4444</b> as a card number, <b>11/22</b>
as the expiration date and <b>123</b> as CVC number and ZIP <b>12345</b>.</p>
</InfoBox>
<div ref="stripeCard" class="stripe-card" :class="{'is-error': isError }"></div>
<div class="card-error-message" v-if="isError">
<span>{{ errorMessage }}</span>
</div>
</div>
<div class="block-wrapper">
<label>Platebni karta:</label>
<div ref="stripeCard" class="stripe-card" :class="{'is-error': isError }"></div>
<!--User registered payment card-->
<div class="registered-cards" v-if="defaultPaymentMethod && ! payByNewCard">
<div class="credit-card" :class="{'is-error': isError}">
<div class="card-number">
<img class="credit-card-icon"
:src="$getCreditCardBrand(defaultPaymentMethod.data.attributes.brand)"
:alt="defaultPaymentMethod.data.attributes.brand">
<div class="credit-card-numbers">
{{ defaultPaymentMethod.data.attributes.last4 }}
</div>
<ColorLabel color="purple">{{ $t('global.default') }}</ColorLabel>
</div>
<div class="expiration-date">
<span>{{ defaultPaymentMethod.data.attributes.exp_month }} / {{ defaultPaymentMethod.data.attributes.exp_year }}</span>
<div class="card-error-message" v-if="isError">
<span>{{ errorMessage }}</span>
</div>
</div>
<!--Change payment-->
<div class="change-payment" v-if="! isError">
<span>
{{ $t('page_upgrade_account.change_payment.you_can') }}
</span>
<router-link v-if="PaymentMethods.data.length > 0" :to="{name: 'PaymentMethods'}">
{{ $t('page_upgrade_account.change_payment.change_payment') }}
</router-link>
<span v-if="PaymentMethods.data.length > 0">
{{ $t('global.or') }}
</span>
<a @click="payByNewCardForm">
{{ $t('page_upgrade_account.change_payment.pay_by_new_card') }}
</a>
</div>
<!--Card error-->
<div class="card-error-message" v-if="isError">
<span>{{ errorMessage }}</span>
<span @click="payByNewCardForm" class="link">
{{ $t('page_upgrade_account.errors.pay_by_another_card') }}
</span>
<span>
{{ $t('global.or') }}
</span>
<router-link :to="{name: 'PaymentMethods'}" class="link">
{{ $t('page_upgrade_account.change_payment.change_payment') }}
</router-link>
</div>
<InfoBox>
<ListInfo class="billing">
<ListInfoItem class="billing-item" title="Spolecnost" content="CMPortal, s.r.o." />
<ListInfoItem class="billing-item" title="Adresa" content="Korytná 47/3, Praha 10000, Česká Republika" />
</ListInfo>
</InfoBox>
</div>
</div>
</div>
@@ -162,12 +123,16 @@
import {mapGetters} from 'vuex'
import {events} from "@/bus"
import axios from 'axios'
import ListInfoItem from '@/components/Others/ListInfoItem'
import ListInfo from '@/components/Others/ListInfo'
let [stripe, card] = [undefined, undefined];
export default {
name: 'SubscriptionRequestPayment',
components: {
ListInfoItem,
ListInfo,
ValidationProvider,
ValidationObserver,
PlanPricingTables,
@@ -192,42 +157,63 @@
},
data() {
return {
requestedPlan: undefined,
errorMessage: undefined,
clientSecret: undefined,
isSubmitted: false,
complete: false,
isLoading: true,
isError: false,
stripeOptions: {
hidePostalCode: false
},
isLoading: true,
isSubmitted: false,
PaymentMethods: undefined,
defaultPaymentMethod: undefined,
errorMessage: undefined,
isError: false,
payByNewCard: false,
clientSecret: undefined,
requestedPlan: undefined
}
},
methods: {
initStripe() {
stripe = Stripe(this.config.stripe_public_key)
let elements = stripe.elements();
card = elements.create('card');
card.mount(this.$refs.stripeCard);
},
payByNewCardForm() {
this.payByNewCard = true
async submitOrder() {
// Remove error
this.isError = false
// Start loading
this.isSubmitted = true
const {setupIntent, error} = await stripe.confirmCardSetup(this.clientSecret, {
payment_method: {
card: card,
}
})
if (error) {
// Set error on
this.isError = true
// End button spinner
this.isSubmitted = false
// Show error message
this.errorMessage = error.message
} else {
axios
.post(`/api/oasis/subscribe/${this.$route.params.id}`, {
plan: this.requestedPlan,
payment: {
type: 'stripe',
meta: {
pm: setupIntent.payment_method,
}
}
})
.then(() => this.successOrder())
.catch((error) => this.errorOrder(error))
.finally(() => {
this.isSubmitted = false
})
}
},
successOrder() {
// Update user data
this.$store.dispatch('getAppData')
// Show toaster
events.$emit('toaster', {
@@ -235,8 +221,7 @@
message: this.$t('toaster.account_upgraded'),
})
// Go to User page
this.$router.push({name: 'Subscription'})
// TODO: perform next action
},
errorOrder(error) {
@@ -262,90 +247,32 @@
})
}
},
async submitOrder() {
initStripe() {
stripe = Stripe(this.config.stripe_public_key)
// Validate fields
const isValid = await this.$refs.order.validate();
let elements = stripe.elements();
if (!isValid) return;
card = elements.create('card');
// Remove error
this.isError = false
// Start loading
this.isSubmitted = true
// If user don't have credit card, register new
if (!this.defaultPaymentMethod || this.payByNewCard) {
const {setupIntent, error} = await stripe.confirmCardSetup(this.clientSecret, {
payment_method: {
card: card,
}
})
if (error) {
// Set error on
this.isError = true
// End button spinner
this.isSubmitted = false
// Show error message
this.errorMessage = error.message
} else {
axios
.post('/api/subscription/upgrade', {
billing: this.billing,
plan: this.requestedPlan,
payment: {
type: 'stripe',
meta: {
pm: setupIntent.payment_method,
}
}
})
.then(() => this.successOrder())
.catch((error) => this.errorOrder(error))
.finally(() => {
this.isSubmitted = false
})
}
}
// if user has credit card
if (this.defaultPaymentMethod && !this.payByNewCard) {
axios
.post('/api/subscription/upgrade', {
billing: this.billing,
plan: this.requestedPlan,
payment: {
type: 'stripe',
}
})
.then(() => this.successOrder())
.catch((error) => this.errorOrder(error))
.finally(() => {
this.isSubmitted = false
})
}
card.mount(this.$refs.stripeCard);
},
},
mounted: function () {
this.initStripe()
},
created() {
mounted() {
let StripeElementsScript = document.createElement('script')
StripeElementsScript.setAttribute('src', 'https://js.stripe.com/v3/')
document.head.appendChild(StripeElementsScript)
// Get setup intent for stripe
axios.get('/api/subscription/setup-intent')
axios.get(`/api/oasis/subscribe/${this.$route.params.id}/setup-intent`)
.then(response => {
this.clientSecret = response.data.client_secret
this.initStripe()
})
.catch(() => {
this.$isSomethingWrong()
})
.catch(() => this.$isSomethingWrong())
axios.get(`/api/oasis/subscription-request/${this.$route.params.id}`)
.then(response => {
@@ -355,9 +282,8 @@
this.$isSomethingWrong()
})
.finally(() => {
this.isLoading = false
}
)
this.isLoading = false
})
}
}
</script>
@@ -367,6 +293,18 @@
@import '@assets/vuefilemanager/_mixins';
@import '@assets/vuefilemanager/_forms';
.billing {
margin-top: 0 !important;
.billing-item {
margin-right: 30px;
&:last-child {
padding-bottom: 0;
}
}
}
.change-payment {
padding-top: 10px;
@@ -48,14 +48,13 @@
}
&.theme-solid {
background: $theme;
.content {
color: white;
}
polyline, path {
stroke: white;
color: inherit;
}
}
@@ -62,6 +62,7 @@
.input-area.is-active {border-color: #FF8200 !important}
{{-- ButtonBase --}}
.button-base.theme-solid {background: #FF8200}
.button-base.theme {background: #FF820010}
.button-base.theme .content {color: #FF8200}
.button-base.theme polyline,
+1
View File
@@ -10,4 +10,5 @@ Route::group(['middleware' => 'auth:sanctum', 'prefix' => 'admin'], function ()
});
Route::get('/subscription-request/{order}', [SubscriptionController::class, 'get_subscription_request']);
Route::get('/subscribe/{order}/setup-intent', [SubscriptionController::class, 'get_setup_intent']);
Route::post('/subscribe/{order}', [SubscriptionController::class, 'subscribe']);
+24 -12
View File
@@ -36,17 +36,6 @@ class OasisSubscriptionTest extends TestCase
],
],
];
// Define test billing to subscribe
$this->billing = [
'billing_address' => '2794 Alfreda Mount Suite 467 East Crystalberg',
'billing_city' => 'Christianfort',
'billing_country' => 'SK',
'billing_name' => 'Heidi Romaguera PhD',
'billing_phone_number' => '+421',
'billing_postal_code' => '59445',
'billing_state' => 'SK',
];
}
/**
@@ -72,6 +61,25 @@ class OasisSubscriptionTest extends TestCase
]);
}
/**
* @test
*/
public function it_get_setup_intent()
{
$user = User::factory(User::class)
->create(['role' => 'user']);
$user
->subscriptionRequest()
->create([
'requested_plan' => 'virtualni-sanon-basic',
'creator' => 'john@doe.com',
]);
$this->getJson("/api/oasis/subscribe/{$user->subscriptionRequest->id}/setup-intent")
->assertStatus(201);
}
/**
* @test
*/
@@ -105,9 +113,9 @@ class OasisSubscriptionTest extends TestCase
$user->createOrGetStripeCustomer();
$this->postJson("/api/oasis/subscribe/{$user->subscriptionRequest->id}", [
'billing' => $this->billing,
'plan' => $this->plan,
'payment' => [
'type' => 'stripe',
'meta' => [
'pm' => $paymentMethod['id']
],
@@ -118,6 +126,10 @@ class OasisSubscriptionTest extends TestCase
'stripe_status' => 'active'
]);
$this->assertDatabaseHas('subscription_requests', [
'status' => 'payed'
]);
$this->assertDatabaseHas('user_settings', [
'storage_capacity' => 50,
'payment_activation' => 1,