diff --git a/app/Http/Controllers/Customer/DepositController.php b/app/Http/Controllers/Customer/DepositController.php index cda863e..ae6d610 100644 --- a/app/Http/Controllers/Customer/DepositController.php +++ b/app/Http/Controllers/Customer/DepositController.php @@ -11,21 +11,33 @@ use App\Models\Setting; use App\Services\GeneralService; use App\Services\MidtransService; use Illuminate\Http\Request; +use Illuminate\Support\Carbon; use Illuminate\Support\Facades\DB; use Illuminate\Support\Str; use Illuminate\Validation\Rule; class DepositController extends Controller { - public function index() + public function index(Request $request) { $histories = DepositHistory::where('customer_id', auth()->id()) ->orderBy('updated_at', 'desc') ->orderBy('is_valid', 'desc') ->where('type', DepositHistory::TYPE_DEPOSIT); + $start_date = now()->startOfMonth(); + $end_date = now()->endOfMonth(); + if ($request->startDate != '' && $request->endDate != '') { + $start_date = Carbon::parse($request->startDate); + $end_date = Carbon::parse($request->endDate); + } + + $histories->whereBetween('created_at', [$start_date, $end_date]); + return inertia('Deposit/Index', [ 'histories' => $histories->paginate(20), + '_start_date' => $start_date->format('m/d/Y'), + '_end_date' => $end_date->format('m/d/Y') ]); } diff --git a/app/Http/Controllers/Customer/PoinController.php b/app/Http/Controllers/Customer/PoinController.php index f0a4820..62ede3f 100644 --- a/app/Http/Controllers/Customer/PoinController.php +++ b/app/Http/Controllers/Customer/PoinController.php @@ -4,16 +4,29 @@ namespace App\Http\Controllers\Customer; use App\Http\Controllers\Controller; use App\Models\PoinHistory; +use Illuminate\Http\Request; +use Illuminate\Support\Carbon; class PoinController extends Controller { - public function index() + public function index(Request $request) { $poins = PoinHistory::where('customer_id', auth()->id()) ->orderBy('updated_at', 'desc'); + $start_date = now()->startOfMonth(); + $end_date = now()->endOfMonth(); + if ($request->startDate != '' && $request->endDate != '') { + $start_date = Carbon::parse($request->startDate); + $end_date = Carbon::parse($request->endDate); + } + + $poins->whereBetween('created_at', [$start_date, $end_date]); + return inertia('Poin/Index', [ 'poins' => $poins->paginate(20), + '_start_date' => $start_date->format('m/d/Y'), + '_end_date' => $end_date->format('m/d/Y') ]); } diff --git a/app/Http/Controllers/Customer/TransactionController.php b/app/Http/Controllers/Customer/TransactionController.php index 49acbb8..4b8b8bd 100644 --- a/app/Http/Controllers/Customer/TransactionController.php +++ b/app/Http/Controllers/Customer/TransactionController.php @@ -4,16 +4,29 @@ namespace App\Http\Controllers\Customer; use App\Http\Controllers\Controller; use App\Models\Sale; +use Illuminate\Http\Request; +use Illuminate\Support\Carbon; class TransactionController extends Controller { - public function index() + public function index(Request $request) { $query = Sale::where('customer_id', auth()->id()) ->orderBy('created_at', 'desc'); + $start_date = now()->startOfMonth(); + $end_date = now()->endOfMonth(); + if ($request->startDate != '' && $request->endDate != '') { + $start_date = Carbon::parse($request->startDate); + $end_date = Carbon::parse($request->endDate); + } + + $query->whereBetween('created_at', [$start_date, $end_date]); + return inertia('Trx/Index', [ - 'query' => $query->paginate(), + 'query' => $query->paginate(20), + '_start_date' => $start_date->format('m/d/Y'), + '_end_date' => $end_date->format('m/d/Y') ]); } diff --git a/resources/js/Customer/Components/HeaderTrx.jsx b/resources/js/Customer/Components/HeaderTrx.jsx index 7612c91..ada1ce6 100644 --- a/resources/js/Customer/Components/HeaderTrx.jsx +++ b/resources/js/Customer/Components/HeaderTrx.jsx @@ -1,15 +1,49 @@ +import React, { useState, useEffect } from 'react' import { usePage, router, Link } from '@inertiajs/react' -import { useState } from 'react' +import { usePrevious } from 'react-use' +import { HiOutlineFilter } from 'react-icons/hi' import { HiOutlineQuestionMarkCircle } from 'react-icons/hi2' -export default function HeaderTrx({ enable = 'deposit' }) { +import { useModalState } from '@/hooks' +import BottomSheet from './BottomSheet' +import FormInputDateRanger from '@/Components/FormInputDateRange' + +const FilterSheet = ({ state, dates, setDates, setApply }) => { + const apply = () => { + setApply(true) + state.toggle() + } + + return ( + state.toggle()}> +
+
Filter Tanggal
+ setDates(dates)} + /> +
apply()} + className="mt-5 font-semibold h-11 border bg-blue-700 text-white px-5 py-2 rounded-full hover:text-black hover:bg-white" + > + Apply +
+
+ + ) +} + +export default function HeaderTrx({ enable = 'deposit', dates, setDates }) { const { props: { auth: { user }, }, } = usePage() + const filterModal = useModalState() + const [popover, setPopover] = useState(false) + const [isApply, setApply] = useState(false) return ( <> @@ -50,39 +84,61 @@ export default function HeaderTrx({ enable = 'deposit' }) {
-
- - Deposit - - - Pembelian - - +
+ + Deposit + + + Pembelian + + + Poin + +
+
filterModal.toggle()} > - Poin - + + {/* only show on filter */} + {isApply && ( +
+
+ 1 +
+
+ )} +
+ ) } diff --git a/resources/js/Customer/Deposit/Index.jsx b/resources/js/Customer/Deposit/Index.jsx index 4c21529..686b38c 100644 --- a/resources/js/Customer/Deposit/Index.jsx +++ b/resources/js/Customer/Deposit/Index.jsx @@ -1,19 +1,41 @@ -import React, { useState } from 'react' +import React, { useState, useEffect } from 'react' import { Head, router } from '@inertiajs/react' +import { usePrevious } from 'react-use' + import CustomerLayout from '@/Layouts/CustomerLayout' -import { HiOutlineQuestionMarkCircle } from 'react-icons/hi2' import HeaderTrx from '../Components/HeaderTrx' +import { formatIDDate } from '@/utils' + +const EmptyHere = () => { + return ( +
+
Transaksi kosong
+
+ Yuk, topup saldo kamu sekarang juga +
+
+ ) +} + +export default function Index(props) { + const { + histories: { data, next_page_url }, + _start_date, + _end_date, + } = props -export default function Index({ - auth: { user }, - histories: { data, next_page_url }, -}) { const [deposites, setDeposites] = useState(data) + const [dates, setDates] = useState({ + startDate: _start_date, + endDate: _end_date, + }) + const preValue = usePrevious(`${dates}`) + const handleNextPage = () => { router.get( next_page_url, - {}, + { startDate: dates.startDate, endDate: dates.endDate }, { replace: true, preserveState: true, @@ -25,13 +47,41 @@ export default function Index({ ) } + useEffect(() => { + if (preValue) { + router.get( + route(route().current()), + { + startDate: dates.startDate, + endDate: dates.endDate, + }, + { + replace: true, + preserveState: true, + only: ['histories'], + onSuccess: (res) => { + setDeposites(res.props.histories.data) + }, + } + ) + } + }, [dates]) + return (
- + + {deposites.length <= 0 && } +
+ {deposites.length > 0 && ( +
+ {formatIDDate(dates.startDate)} s/d{' '} + {formatIDDate(dates.endDate)} +
+ )} {deposites.map((history) => (
{ ) } -export default function Index({ - auth: { user }, - poins: { data, next_page_url }, -}) { +export default function Index(props) { + const { + poins: { data, next_page_url }, + _start_date, + _end_date, + } = props const [_poins, setpoins] = useState(data) + const [dates, setDates] = useState({ + startDate: _start_date, + endDate: _end_date, + }) + const preValue = usePrevious(`${dates}`) + const handleNextPage = () => { router.get( next_page_url, - {}, + { startDate: dates.startDate, endDate: dates.endDate }, { replace: true, preserveState: true, @@ -36,14 +47,40 @@ export default function Index({ ) } + useEffect(() => { + if (preValue) { + router.get( + route(route().current()), + { + startDate: dates.startDate, + endDate: dates.endDate, + }, + { + replace: true, + preserveState: true, + only: ['poins'], + onSuccess: (res) => { + setpoins(res.props.poins.data) + }, + } + ) + } + }, [dates]) + return (
- + {_poins.length <= 0 && }
+ {_poins.length > 0 && ( +
+ {formatIDDate(dates.startDate)} s/d{' '} + {formatIDDate(dates.endDate)} +
+ )} {_poins.map((poin) => (
{ ) } -export default function Index({ query: { data, next_page_url } }) { +export default function Index(props) { + const { + query: { data, next_page_url }, + _start_date, + _end_date, + } = props + const [sales, setSales] = useState(data) + const [dates, setDates] = useState({ + startDate: _start_date, + endDate: _end_date, + }) + const preValue = usePrevious(`${dates}`) + const handleNextPage = () => { router.get( next_page_url, - {}, + { + startDate: dates.startDate, + endDate: dates.endDate, + }, { replace: true, preserveState: true, @@ -32,14 +50,40 @@ export default function Index({ query: { data, next_page_url } }) { ) } + useEffect(() => { + if (preValue) { + router.get( + route(route().current()), + { + startDate: dates.startDate, + endDate: dates.endDate, + }, + { + replace: true, + preserveState: true, + only: ['query'], + onSuccess: (res) => { + setSales(res.props.query.data) + }, + } + ) + } + }, [dates]) + return (
- + {sales.length <= 0 && }
+ {sales.length > 0 && ( +
+ {formatIDDate(dates.startDate)} s/d{' '} + {formatIDDate(dates.endDate)} +
+ )} {sales.map((sale) => (
{