Skip to content

Commit

Permalink
card component select card future
Browse files Browse the repository at this point in the history
  • Loading branch information
@CihanSenturk
CihanSenturk committed Jan 17, 2021
1 parent d011b8e commit 33c1704
Show file tree
Hide file tree
Showing 4 changed files with 52 additions and 23 deletions.
55 changes: 44 additions & 11 deletions resources/assets/js/components/CreditCard/CardForm.vue
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,41 @@
<template>
<div>
<div class="card" v-if="card">
<div class="row align-items-center" v-if="Object.keys(cards).length">
<div class="row align-items-center">
<div class="col-md-12">
<div class="form-group">
<label for="item_name" class="form-control-label">Cards</label>
<div class="input-group-invoice-text" v-for="(name, key, id) in cards">
<div class="custom-control custom-radio mb-2">
<input
type="radio"
:name="'card-' + key"
:id="'card-'+ key + '-' + id"
:value="key"
v-model="card_id"
class="custom-control-input">
<label :for="'card-'+ key + '-' + id" class="custom-control-label">
{{ name }}
</label>
</div>
</div>
<div class="input-group-invoice-text">
<div class="custom-control custom-radio mb-2">
<input
type="radio"
name="card-new"
id="card-new-card"
value="new_card"
v-model="card_id"
class="custom-control-input">
<label for="card-new-card" class="custom-control-label">
New Card
</label>
</div>
</div>
</div>
</div>

<div class="col-md-6 p-5">
<div class="form-group">
<label for="cardName" class="form-control-label">{{ textCardName }}</label>
Expand Down Expand Up @@ -129,7 +163,7 @@
</div>
</div>

<div class="row align-items-center" v-if="!card">
<div class="row align-items-center" v-if="!Object.keys(cards).length">
<div class="col-md-6 p-5">
<div class="form-group">
<label for="cardNumber" class="form-control-label">{{ textCardNumber }}</label>
Expand Down Expand Up @@ -202,7 +236,6 @@
v-for="n in 12"
v-bind:disabled="n < minCardMonth"
v-bind:key="n"
:selected="selected == value"
>{{generateMonthValue(n)}}</option>
</select>
</div>
Expand All @@ -224,7 +257,6 @@
v-bind:value="$index + minCardYear"
v-for="(n, $index) in 12"
v-bind:key="n"
:selected="selected == value"
>{{$index + minCardYear}}</option>
</select>
</div>
Expand Down Expand Up @@ -267,7 +299,7 @@
</div>
</div>

<div class="row">
<div class="form-group">
<button class="btn btn-icon btn-success" v-on:click="invaildCard" :disabled="loading">
<div v-if="loading" class="aka-loader-frame">
<div class="aka-loader"></div>
Expand All @@ -277,7 +309,7 @@
</div>
</div>

<div class="col-md-6 mt--3">
<div class="col-md-6 mt--6">
<Card
:fields="fields"
:labels="formData"
Expand Down Expand Up @@ -331,10 +363,9 @@ export default {
},
props: {
card: {
type: Boolean,
default: false,
icon: '',
cards: {
type: [Array, Object],
default: [],
description: "Add Card Style"
},
Expand Down Expand Up @@ -427,6 +458,7 @@ export default {
cardYear: '',
cardCvv: '',
storeCard: false,
card_id: 0,
}
}
},
Expand Down Expand Up @@ -456,7 +488,8 @@ export default {
minCardYear: new Date().getFullYear(),
isCardNumberMasked: true,
mainCardNumber: this.cardNumber,
cardNumberMaxLength: 19
cardNumberMaxLength: 19,
card_id: 0,
}
},
Expand Down
3 changes: 3 additions & 0 deletions resources/assets/js/views/portal/invoices.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ const app = new Vue({
cardYear: '',
cardCvv: '',
storeCard: false,
card_id: 0,
}
}
},
Expand Down Expand Up @@ -97,6 +98,7 @@ const app = new Vue({
cardYear: '',
cardCvv: '',
storeCard: false,
card_id: 0,
}
}
},
Expand Down Expand Up @@ -187,6 +189,7 @@ const app = new Vue({
cardYear: '',
cardCvv: '',
storeCard: false,
card_id: 0,
}
}
},
Expand Down
4 changes: 2 additions & 2 deletions resources/views/partials/portal/payment_method/hosted.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
<card-form
:card="false"
:path="'{{ $confirm_url }}'"
placeholder-card-number="{{ trans('general.form.enter', ['field' => trans('general.card.number')]) }}"
placeholder-card-name="{{ trans('general.form.enter', ['field' => trans('general.card.name')]) }}"
Expand All @@ -12,6 +11,7 @@
text-cvv="{{ trans('general.card.cvv') }}"
textButton="{{ trans('general.confirm') }}"
textStoreCard="{{ trans('general.card.store') }} "
:store-card="true"
:store-card="{{ !empty($store_card) ? 'true' : 'false' }}"
:cards="{{ !empty($cards) ? json_encode($cards) : json_encode([]) }}"
:form-data="formData"
/>
13 changes: 3 additions & 10 deletions resources/views/portal/invoices/signed.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,16 +66,9 @@ class-header-status="col-md-8"
<div class="card-body">
<div class="tab-content" id="myTabContent">
@php $is_active = true; @endphp

@foreach ($payment_methods as $key => $name)
@stack('invoice_{{ $key }}_content_start')
<div class="tab-pane fade{{ ($is_active) ? ' show active': '' }}" id="tabs-payment-method-{{ $key }}" role="tabpanel" aria-labelledby="tabs-payment-method-{{ $key }}-tab">
<component v-bind:is="method_show_html" @interface="onRedirectConfirm"></component>
</div>
@stack('invoice_{{ $key }}_content_end')

@php $is_active = false; @endphp
@endforeach
<div class="tab-pane fade{{ ($is_active) ? ' show active': '' }}" id="tabs-payment-method" role="tabpanel" aria-labelledby="tabs-payment-method">
<component v-bind:is="method_show_html" @interface="onRedirectConfirm"></component>
</div>
</div>
</div>
</div>
Expand Down

0 comments on commit 33c1704

Please sign in to comment.