Support picking of recurring's interval in TransactionWizard component
MODIFY
app/Http/Controllers/RecurringController.php
app/Http/Controllers/RecurringController.php
@@ -50,7 +50,7 @@ class RecurringController extends Controller
$recurring = $this->recurringRepository->create(
session('space')->id,
$request->type,
- 'monthly',
+ $request->interval,
(int) ltrim($request->input('day'), 0),
$request->input('end', null),
$request->input('tag', null),

MODIFY
app/Http/Controllers/TransactionController.php
app/Http/Controllers/TransactionController.php
namespace App\Http\Controllers;
+use App\Repositories\RecurringRepository;
use App\Repositories\TransactionRepository;
use Illuminate\Http\Request;
class TransactionController extends Controller
{
- public function __construct(TransactionRepository $transactionRepository)
+ private $recurringRepository;
+
+ public function __construct(TransactionRepository $transactionRepository, RecurringRepository $recurringRepository)
{
$this->repository = $transactionRepository;
+ $this->recurringRepository = $recurringRepository;
}
public function index(Request $request)
@@ -37,6 +41,9 @@ class TransactionController extends Controller
];
}
- return view('transactions.create', compact('tags'));
+ return view('transactions.create', [
+ 'tags' => $tags,
+ 'recurringsIntervals' => $this->recurringRepository->getSupportedIntervals()
+ ]);
}
}

MODIFY
app/Repositories/RecurringRepository.php
app/Repositories/RecurringRepository.php
@@ -12,6 +12,7 @@ class RecurringRepository
{
return [
'type' => 'required|in:earning,spending',
+ 'interval' => 'required|in:' . implode(',', $this->getSupportedIntervals()),
'day' => ['required',
'regex:/\b(0?[1-9]|[12][0-9]|3[01])\b/',
],

MODIFY
resources/assets/js/app.js
resources/assets/js/app.js
@@ -43,6 +43,14 @@ Vue.directive('click-outside', {
}
})
+Vue.filter('capitalize', function (value) {
+ if (!value) return '';
+
+ value = value.toString();
+
+ return value.charAt(0).toUpperCase() + value.slice(1);
+});
+
const app = new Vue({
el: '#app',

MODIFY
resources/assets/js/components/TransactionWizard.vue
resources/assets/js/components/TransactionWizard.vue
</div>
</div>
<div v-if="isRecurring">
+ <div class="bg mb-2">
+ <button
+ v-for="interval in recurringsIntervals"
+ :key="'recurringsIntervals-' + interval"
+ class="bg__button"
+ :class="{ 'bg__button--active': recurringInterval == interval }"
+ @click="switchRecurringInterval(interval)">{{ interval | capitalize }}</button>
+ </div>
<div class="input">
<label>How long will this spending go on for?</label>
<div class="row">
<script>
export default {
- props: ['tags'],
+ props: [
+ 'tags',
+ 'recurringsIntervals'
+ ],
data() {
return {
description: '',
amount: '10.00',
isRecurring: false,
+ recurringInterval: 'monthly',
recurringEnd: 'forever',
recurringEndDate: this.get100DaysFutureDate(),
return (now.getFullYear() + 1) + '-' + ('0' + (now.getMonth() + 1)).slice(-2) + '-' + ('0' + now.getDate()).slice(-2)
},
+ switchRecurringInterval(interval) {
+ this.recurringInterval = interval;
+ },
+
createEarning() {
if (!this.loading) {
this.loading = true
let body = {
_token: document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
type: this.type,
+ interval: this.recurringInterval,
day: this.date.slice(-2),
description: this.description,
amount: this.amount

MODIFY
resources/views/transactions/create.blade.php
resources/views/transactions/create.blade.php
@section('body')
<div class="wrapper mw-400 my-3">
<h2 class="mb-3">{{ __('actions.create') }} Transaction</h2>
- <transaction-wizard :tags='@json($tags)'></transaction-wizard>
+ <transaction-wizard :tags='@json($tags)' :recurrings-intervals='@json($recurringsIntervals)'></transaction-wizard>
</div>
@endsection

MODIFY
tests/Feature/RecurringTest.php
tests/Feature/RecurringTest.php
@@ -32,6 +32,7 @@ class RecurringTest extends TestCase
{
$requestData = [
'type' => 'spending',
+ 'interval' => 'monthly',
'day' => 1,
'description' => 'Test',
'amount' => 123

Support picking of recurring's interval in TransactionWizard component