From 0c9362334c46a50d52590c6c682bb7f987f9725e Mon Sep 17 00:00:00 2001 From: Muhammad Fajar Date: Thu, 8 Dec 2022 08:51:25 +0700 Subject: [PATCH] add switch corporate & fix table & fix policy --- ...ller.php => CorporateManageController.php} | 4 +- ...ller.php => CorporatePolicyController.php} | 4 +- .../Controllers/Api/DivisionController.php | 12 +- .../Http/Controllers/Api/MemberController.php | 35 +++--- Modules/Client/Routes/api.php | 22 ++-- .../Client/Transformers/MemberResources.php | 8 +- app/Models/Member.php | 5 - .../src/contexts/UserCurrentCorporate.tsx | 8 ++ .../dashboard/header/CorporatePopover.tsx | 48 ++++++++ .../src/layouts/dashboard/header/index.tsx | 2 + .../src/layouts/dashboard/index.tsx | 36 ++++-- .../src/pages/Dashboard/Dashboard.tsx | 89 +++++---------- .../client-portal/src/pages/auth/Login.tsx | 6 +- .../sections/auth/login/VerifyCodeForm.tsx | 8 +- .../src/sections/dashboard/CardBalance.tsx | 6 +- .../src/sections/dashboard/TableList.tsx | 104 +++++++++++++----- .../client-portal/src/utils/formatNumber.ts | 4 + 17 files changed, 227 insertions(+), 174 deletions(-) rename Modules/Client/Http/Controllers/Api/{CorporateController.php => CorporateManageController.php} (93%) rename Modules/Client/Http/Controllers/Api/{DashboardController.php => CorporatePolicyController.php} (96%) create mode 100755 frontend/client-portal/src/contexts/UserCurrentCorporate.tsx create mode 100755 frontend/client-portal/src/layouts/dashboard/header/CorporatePopover.tsx diff --git a/Modules/Client/Http/Controllers/Api/CorporateController.php b/Modules/Client/Http/Controllers/Api/CorporateManageController.php similarity index 93% rename from Modules/Client/Http/Controllers/Api/CorporateController.php rename to Modules/Client/Http/Controllers/Api/CorporateManageController.php index 6cde4742..efd87ce6 100755 --- a/Modules/Client/Http/Controllers/Api/CorporateController.php +++ b/Modules/Client/Http/Controllers/Api/CorporateManageController.php @@ -7,7 +7,7 @@ use Illuminate\Http\Request; use Illuminate\Routing\Controller; use Illuminate\Support\Facades\Auth; -class CorporateController extends Controller +class CorporateManageController extends Controller { /** * Display a listing of the resource. @@ -18,8 +18,6 @@ class CorporateController extends Controller $userLogin = Auth::user(); $corporate = $userLogin->managedCorporates()->select(['corporates.id', 'corporates.name'])->get(); - // corporate policy, all member list, notification - return response()->json($corporate); } diff --git a/Modules/Client/Http/Controllers/Api/DashboardController.php b/Modules/Client/Http/Controllers/Api/CorporatePolicyController.php similarity index 96% rename from Modules/Client/Http/Controllers/Api/DashboardController.php rename to Modules/Client/Http/Controllers/Api/CorporatePolicyController.php index 441c97af..45eba51d 100755 --- a/Modules/Client/Http/Controllers/Api/DashboardController.php +++ b/Modules/Client/Http/Controllers/Api/CorporatePolicyController.php @@ -8,7 +8,7 @@ use Illuminate\Routing\Controller; use Illuminate\Support\Facades\Auth; use Modules\Client\Transformers\DashboardResources; -class DashboardController extends Controller +class CorporatePolicyController extends Controller { /** * Display a listing of the resource. @@ -20,7 +20,7 @@ class DashboardController extends Controller $currentCorporate = $user->managedCorporates() ->with(['currentPolicy', 'employees']) ->find($corporate_id); - + $data = DashboardResources::make($currentCorporate); return response()->json($data); diff --git a/Modules/Client/Http/Controllers/Api/DivisionController.php b/Modules/Client/Http/Controllers/Api/DivisionController.php index 3068f338..0ddfde4b 100755 --- a/Modules/Client/Http/Controllers/Api/DivisionController.php +++ b/Modules/Client/Http/Controllers/Api/DivisionController.php @@ -15,17 +15,13 @@ class DivisionController extends Controller * Display a listing of the resource. * @return Renderable */ - public function index(Request $request) + public function index(Request $request, $corporate_id) { - $user = Auth::user(); - - $corporate = $user->managedCorporates()->where('active', 1)->first(); - - $benefits = CorporateDivision::query() - ->where('corporate_id', $corporate->id) + $division = CorporateDivision::query() + ->where('corporate_id', $corporate_id) ->get(['id', 'name']); - return $benefits; + return response()->json($division); } /** diff --git a/Modules/Client/Http/Controllers/Api/MemberController.php b/Modules/Client/Http/Controllers/Api/MemberController.php index 9897450d..2283fc3f 100755 --- a/Modules/Client/Http/Controllers/Api/MemberController.php +++ b/Modules/Client/Http/Controllers/Api/MemberController.php @@ -7,6 +7,7 @@ use App\Models\Member; use Illuminate\Contracts\Support\Renderable; use Illuminate\Http\Request; use Illuminate\Routing\Controller; +use Modules\Client\Transformers\MemberResources; class MemberController extends Controller { @@ -14,29 +15,25 @@ class MemberController extends Controller * Display a listing of the resource. * @return Renderable */ - public function index(Request $request) + public function index(Request $request, $corporate_id) { - $user = auth()->user(); - - $corporate = $user->managedCorporates()->first(); - // $plans = + $limit = $request->has('per_page') ? $request->per_page : 10; $members = Member::query() - ->whereHas('employeds', function($corporateEmployee) use ($corporate) { - $corporateEmployee->where('corporate_id', $corporate->id); - }); - if ($request->has('search')) { - $members - ->where('member_id', 'like', "%" . $request->search . "%") - ->orWhere('payor_id', 'like', "%" . $request->search . "%") - ->orWhere('name', 'like', "%" . $request->search . "%"); - } + ->whereHas('employeds', function ($corporateEmployee) use ($corporate_id) { + $corporateEmployee->where('corporate_id', $corporate_id); + })->when($request->input('division'), function ($division, $division_id) { + $division->whereHas('division', function ($corporateEmployee) use ($division_id) { + $corporateEmployee->where('division_id', $division_id); + }); + })->when($request->input('search'), function ($query, $search) { + $query->where('member_id', 'like', "%" . $search . "%") + ->orWhere('name', 'like', "%" . $search . "%"); + })->when($request->has('orderBy'), function ($query) use ($request) { + $query->orderBy($request->orderBy, $request->order); + })->paginate($limit); - $members = $members->paginate(); - - return response()->json([ - 'members' => Helper::paginateResources($members) - ]); + return response()->json(Helper::paginateResources(MemberResources::collection($members))); } /** diff --git a/Modules/Client/Routes/api.php b/Modules/Client/Routes/api.php index 30810f4c..533a78d6 100755 --- a/Modules/Client/Routes/api.php +++ b/Modules/Client/Routes/api.php @@ -1,8 +1,8 @@ group(function () { Route::middleware('auth:sanctum')->group(function () { Route::post('logout', [AuthController::class, 'logout'])->name('logout'); - Route::get('user', [UserController::class, 'index']); + Route::get('user', [UserController::class, 'index']); - Route::prefix('{corporate_id}')->group(function() { - Route::get('asd', function ($corporate_id) { - return $corporate_id; + Route::get('corporate-manage', [CorporateManageController::class, 'index']); + Route::prefix('{corporate_id}')->group(function () { + Route::get('policy', [CorporatePolicyController::class, 'index']); + Route::get('division', [DivisionController::class, 'index']); + Route::get('members', [MemberController::class, 'index']); }); - - - Route::get('dashboard', [DashboardController::class, 'index']); - Route::get('corporate', [CorporateController::class, 'index']); - Route::get('corporate/{corporate_id}', [CorporateController::class, 'show']); - Route::get('division', [DivisionController::class, 'index']); - Route::get('members', [MemberController::class, 'index']); - }); }); }); diff --git a/Modules/Client/Transformers/MemberResources.php b/Modules/Client/Transformers/MemberResources.php index 384998e4..6a25d1fd 100644 --- a/Modules/Client/Transformers/MemberResources.php +++ b/Modules/Client/Transformers/MemberResources.php @@ -16,9 +16,13 @@ class MemberResources extends JsonResource { return [ 'memberId' => $this->member_id, - 'full_name' => $this->full_name, + 'fullName' => $this->full_name, 'division' => $this->division->name, - 'employeeLimit' => '', + 'limit' => [ + 'current' => 2000000, + 'total' => 4000000, + 'percentage' => (2000000 / 4000000) * 100 + ], 'status' => $this->active ]; } diff --git a/app/Models/Member.php b/app/Models/Member.php index 5737fb1e..afe28934 100755 --- a/app/Models/Member.php +++ b/app/Models/Member.php @@ -183,11 +183,6 @@ class Member extends Model }); } - // public function corporateEmployee() - // { - // return $this->hasOne(CorporateEmployee::class, 'member_id'); - // } - public function division() { return $this->hasOneThrough(CorporateDivision::class, CorporateEmployee::class, 'member_id', 'id', 'id', 'division_id'); diff --git a/frontend/client-portal/src/contexts/UserCurrentCorporate.tsx b/frontend/client-portal/src/contexts/UserCurrentCorporate.tsx new file mode 100755 index 00000000..5f1ffcdc --- /dev/null +++ b/frontend/client-portal/src/contexts/UserCurrentCorporate.tsx @@ -0,0 +1,8 @@ +import { createContext } from 'react'; + +const UserCurrentCorporateContext = createContext({ + corporateValue: '', + setCorporateValue: (value: string) => Promise, +}); + +export { UserCurrentCorporateContext }; diff --git a/frontend/client-portal/src/layouts/dashboard/header/CorporatePopover.tsx b/frontend/client-portal/src/layouts/dashboard/header/CorporatePopover.tsx new file mode 100755 index 00000000..331af30f --- /dev/null +++ b/frontend/client-portal/src/layouts/dashboard/header/CorporatePopover.tsx @@ -0,0 +1,48 @@ +import { FormControl, InputLabel, MenuItem, Select, SelectChangeEvent } from '@mui/material'; +import { useContext, useEffect, useState } from 'react'; +import { UserCurrentCorporateContext } from '../../../contexts/UserCurrentCorporate'; +import axios from '../../../utils/axios'; + +/* ---------------------------------- types --------------------------------- */ +type CorporateDataProps = { + id: number; + name: string; +}; +/* -------------------------------------------------------------------------- */ + +export default function CorporatePopover() { + const { corporateValue, setCorporateValue } = useContext(UserCurrentCorporateContext); + const [corporateData, setCorporateData] = useState([]); + + const handleCorporateChange = (event: SelectChangeEvent) => { + setCorporateValue(event.target.value as string); + }; + + useEffect(() => { + (async () => { + // @ts-ignore + const corporateManages = await axios.get(`/corporate-manage`); + setCorporateData(corporateManages.data); + })(); + }, []); + + return ( + + Corporate + + + ); +} diff --git a/frontend/client-portal/src/layouts/dashboard/header/index.tsx b/frontend/client-portal/src/layouts/dashboard/header/index.tsx index f39781e7..4b1a488f 100755 --- a/frontend/client-portal/src/layouts/dashboard/header/index.tsx +++ b/frontend/client-portal/src/layouts/dashboard/header/index.tsx @@ -18,6 +18,7 @@ import AccountPopover from './AccountPopover'; import LanguagePopover from './LanguagePopover'; import ContactsPopover from './ContactsPopover'; import NotificationsPopover from './NotificationsPopover'; +import CorporatePopover from './CorporatePopover'; // ---------------------------------------------------------------------- @@ -92,6 +93,7 @@ export default function DashboardHeader({ + diff --git a/frontend/client-portal/src/layouts/dashboard/index.tsx b/frontend/client-portal/src/layouts/dashboard/index.tsx index 569ddb4c..b0426c7a 100755 --- a/frontend/client-portal/src/layouts/dashboard/index.tsx +++ b/frontend/client-portal/src/layouts/dashboard/index.tsx @@ -13,6 +13,9 @@ import { HEADER, NAVBAR } from '../../config'; import DashboardHeader from './header'; import NavbarVertical from './navbar/NavbarVertical'; import NavbarHorizontal from './navbar/NavbarHorizontal'; +import useLocalStorage from '../../hooks/useLocalStorage'; +import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate'; +import useAuth from '../../hooks/useAuth'; // ---------------------------------------------------------------------- @@ -47,6 +50,7 @@ export default function DashboardLayout() { const { collapseClick, isCollapse } = useCollapseDrawer(); const { themeLayout } = useSettings(); + const { user } = useAuth(); const isDesktop = useResponsive('up', 'lg'); @@ -54,6 +58,12 @@ export default function DashboardLayout() { const verticalLayout = themeLayout === 'vertical'; + const [corporateValue, setCorporateValue] = useLocalStorage( + 'corporateValue', + `${user.corporate.id}` + ); + const value = { corporateValue, setCorporateValue }; + if (verticalLayout) { return ( <> @@ -86,19 +96,21 @@ export default function DashboardLayout() { } return ( - - setOpen(true)} /> + + + setOpen(true)} /> - setOpen(false)} /> + setOpen(false)} /> - - - - + + + + + ); } diff --git a/frontend/client-portal/src/pages/Dashboard/Dashboard.tsx b/frontend/client-portal/src/pages/Dashboard/Dashboard.tsx index d9082d08..1cd1f3dc 100755 --- a/frontend/client-portal/src/pages/Dashboard/Dashboard.tsx +++ b/frontend/client-portal/src/pages/Dashboard/Dashboard.tsx @@ -1,13 +1,5 @@ // @mui -import { - Typography, - Container, - Grid, - FormControl, - InputLabel, - MenuItem, - Select, -} from '@mui/material'; +import { Typography, Container, Grid } from '@mui/material'; // hooks import useSettings from '../../hooks/useSettings'; // components @@ -16,11 +8,10 @@ import Page from '../../components/Page'; import CardNotification from '../../sections/dashboard/CardNotification'; import CardBalance from '../../sections/dashboard/CardBalance'; import TableList from '../../sections/dashboard/TableList'; -import { useEffect, useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import axios from '../../utils/axios'; import { Stack } from '@mui/system'; -import { SelectChangeEvent } from '@mui/material/Select'; -import useAuth from '../../hooks/useAuth'; +import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate'; // ---------------------------------------------------------------------- @@ -35,12 +26,7 @@ const itemList = [ /* ---------------------------------- types --------------------------------- */ -type CorporateDataProps = { - id: number; - name: string; -}; - -type CardBalanceProps = { +type PolicyProps = { myLimit: { balance: number; total: number; @@ -54,42 +40,35 @@ type CardBalanceProps = { /* -------------------------------------------------------------------------- */ +/* ------------------------------ default data ------------------------------ */ +const defaultPolicyData = { + myLimit: { + balance: 0, + total: 0, + percentage: 0, + }, + lockLimit: { + balance: 0, + percentage: 0, + }, +}; +/* -------------------------------------------------------------------------- */ + export default function Dashboard() { const { themeStretch } = useSettings(); - const { user } = useAuth(); - const [currentCorporate, setCurrentCorporate] = useState({id: 1}); + const { corporateValue } = useContext(UserCurrentCorporateContext); - // @ts-ignore - const [corporateValue, setCorporateValue] = useState(`${user.corporate.id}`); - const [corporateData, setCorporateData] = useState([]); - const [tableData, setTableData] = useState([]); - const [policyData, setPolicyData] = useState({ - myLimit: { - balance: 0, - total: 0, - percentage: 0, - }, - lockLimit: { - balance: 0, - percentage: 0, - }, - }); - - const handleCorporateChange = (event: SelectChangeEvent) => { - setCorporateValue(event.target.value as string); - }; + // const [tableData, setTableData] = useState([]); + const [policyData, setPolicyData] = useState(defaultPolicyData); useEffect(() => { (async () => { - const corporates = await axios.get(`${currentCorporate.id}/dashboard`); - const dashboard = await axios.get(`${currentCorporate.id}/dashboard`); - - console.log(dashboard); - - setCorporateData(corporates.data); + setPolicyData(defaultPolicyData); + await new Promise((resolve) => setTimeout(resolve, 250)); + const dashboard = await axios.get(`${corporateValue}/policy`); setPolicyData(dashboard.data.policy); })(); - }, [user, corporateValue]); + }, [corporateValue]); return ( @@ -98,24 +77,6 @@ export default function Dashboard() { Dashboard - - - Corporate - - diff --git a/frontend/client-portal/src/pages/auth/Login.tsx b/frontend/client-portal/src/pages/auth/Login.tsx index b0e37c57..78694ecd 100755 --- a/frontend/client-portal/src/pages/auth/Login.tsx +++ b/frontend/client-portal/src/pages/auth/Login.tsx @@ -83,11 +83,7 @@ export default function Login() { - + Tidak mendapatkan kode? diff --git a/frontend/client-portal/src/sections/auth/login/VerifyCodeForm.tsx b/frontend/client-portal/src/sections/auth/login/VerifyCodeForm.tsx index 7580971d..97e797b5 100755 --- a/frontend/client-portal/src/sections/auth/login/VerifyCodeForm.tsx +++ b/frontend/client-portal/src/sections/auth/login/VerifyCodeForm.tsx @@ -17,8 +17,6 @@ import useAuth from '../../../hooks/useAuth'; type VerifyCodeFormProps = { emailOrPhone: string; - setEmailOrPhoneForm: Function; - setLoginOrVerifyCode: Function; }; type FormValuesProps = { @@ -39,11 +37,7 @@ type responseProps = { /* -------------------------------------------------------------------------- */ -export default function VerifyCodeForm({ - emailOrPhone, - setEmailOrPhoneForm, - setLoginOrVerifyCode, -}: VerifyCodeFormProps) { +export default function VerifyCodeForm({ emailOrPhone }: VerifyCodeFormProps) { const navigate = useNavigate(); const { validateOtp } = useAuth(); const { enqueueSnackbar } = useSnackbar(); diff --git a/frontend/client-portal/src/sections/dashboard/CardBalance.tsx b/frontend/client-portal/src/sections/dashboard/CardBalance.tsx index bd14afea..e2ef813a 100644 --- a/frontend/client-portal/src/sections/dashboard/CardBalance.tsx +++ b/frontend/client-portal/src/sections/dashboard/CardBalance.tsx @@ -13,7 +13,7 @@ import Iconify from '../../components/Iconify'; // React import { useState } from 'react'; // utils -import { fCurrency } from '../../utils/formatNumber'; +import { fCurrency, fSplit } from '../../utils/formatNumber'; /* -------------------------------- sections -------------------------------- */ import DialogTopUpLimit from './DialogTopUpLimit'; import DialogClaimSubmitMember from './DialogClaimSubmitMember'; @@ -97,7 +97,7 @@ export default function CardBalance(props: CardBalanceProps) { {fCurrency(myLimit ? myLimit.balance : 0)} - / {myLimit ? myLimit.total : 0} + / {fSplit(myLimit ? myLimit.total : 0)} @@ -127,7 +127,7 @@ export default function CardBalance(props: CardBalanceProps) { - {lockLimit ? lockLimit.balance : 0} / {myLimit ? myLimit.total : 0} + {fSplit(lockLimit ? lockLimit.balance : 0)} / {fSplit(myLimit ? myLimit.total : 0)} diff --git a/frontend/client-portal/src/sections/dashboard/TableList.tsx b/frontend/client-portal/src/sections/dashboard/TableList.tsx index b8f4a08f..a263765f 100755 --- a/frontend/client-portal/src/sections/dashboard/TableList.tsx +++ b/frontend/client-portal/src/sections/dashboard/TableList.tsx @@ -1,4 +1,5 @@ /* ---------------------------------- @mui ---------------------------------- */ +import { styled } from '@mui/material/styles'; import { Paper, Table, @@ -19,19 +20,25 @@ import { Select, MenuItem, SelectChangeEvent, + Stack, + Typography, + LinearProgress, + linearProgressClasses, } from '@mui/material'; import { visuallyHidden } from '@mui/utils'; import { Add as AddIcon } from '@mui/icons-material'; /* ---------------------------------- axios --------------------------------- */ import axios from '../../utils/axios'; /* ---------------------------------- react --------------------------------- */ -import { useEffect, useRef, useState } from 'react'; +import { useContext, useEffect, useRef, useState } from 'react'; /* -------------------------------- component ------------------------------- */ import Iconify from '../../components/Iconify'; import BaseTablePagination from '../../components/BaseTablePagination'; /* ---------------------------------- theme --------------------------------- */ import palette from '../../theme/palette'; import { useSearchParams } from 'react-router-dom'; +import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate'; +import { fSplit } from '../../utils/formatNumber'; /* ---------------------------------- types --------------------------------- */ type PaginationTableProps = { @@ -46,11 +53,15 @@ type PaginationTableProps = { }; type DataTableProps = { - name: string; - member_id: string; + fullName: string; + memberId: string; division: string; - limit: string; - status: string; + limit: { + current: number; + total: number; + percentage: number; + }; + status: number; }; type Order = 'asc' | 'desc'; @@ -74,6 +85,20 @@ type DivisionDataProps = { }; /* -------------------------------------------------------------------------- */ +/* --------------------------------- styled --------------------------------- */ +const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({ + height: 10, + borderRadius: 6, + [`&.${linearProgressClasses.colorPrimary}`]: { + backgroundColor: '#D1F1F1', + }, + [`& .${linearProgressClasses.bar}`]: { + borderRadius: 6, + backgroundColor: theme.palette.primary.main, + }, +})); +/* -------------------------------------------------------------------------- */ + /* -------------------------- enchanced table head -------------------------- */ const headCells: readonly HeadCell[] = [ { @@ -92,16 +117,16 @@ const headCells: readonly HeadCell[] = [ id: 'division', align: 'center', label: 'Divisi', - isSort: true, + isSort: false, }, { id: 'limit', align: 'center', label: 'Limit', - isSort: true, + isSort: false, }, { - id: 'status', + id: 'active', align: 'center', label: 'Status', isSort: true, @@ -150,14 +175,9 @@ function EnhancedTableHead({ order, orderBy, onRequestSort }: EnhancedTableProps /* -------------------------------------------------------------------------- */ export default function TableList(props: any) { - const [order, setOrder] = useState('asc'); - const [orderBy, setOrderBy] = useState('name'); - const [searchParams, setSearchParams] = useSearchParams(); - const [isLoading, setIsLoading] = useState(true); + const { corporateValue } = useContext(UserCurrentCorporateContext); + const [dataTable, setDataTable] = useState([]); - const [page, setPage] = useState(0); - const [rowsPerPage, setRowsPerPage] = useState(10); - const [appliedParams, setAppliedParams] = useState({}); const [paginationTable, setPaginationTable] = useState({ current_page: 0, from: 0, @@ -169,6 +189,15 @@ export default function TableList(props: any) { total: 0, }); + const [isLoading, setIsLoading] = useState(true); + const [searchParams, setSearchParams] = useSearchParams(); + const [appliedParams, setAppliedParams] = useState({}); + + const [order, setOrder] = useState('asc'); + const [orderBy, setOrderBy] = useState('name'); + const [page, setPage] = useState(0); + const [rowsPerPage, setRowsPerPage] = useState(10); + /* ------------------------------- handle sort ------------------------------ */ const handleRequestSort = async (event: React.MouseEvent, property: string) => { const isAsc = orderBy === property && order === 'asc'; @@ -211,9 +240,15 @@ export default function TableList(props: any) { const handleSearchSubmit = async (event: React.FormEvent) => { event.preventDefault(); setIsLoading(true); - const params = Object.fromEntries([...searchParams.entries(), ['search', searchText]]); + if (searchText === '') { + searchParams.delete('search'); + const params = Object.fromEntries([...searchParams.entries()]); + setAppliedParams(params); + } else { + const params = Object.fromEntries([...searchParams.entries(), ['search', searchText]]); + setAppliedParams(params); + } await new Promise((resolve) => setTimeout(resolve, 500)); - setAppliedParams(params); setIsLoading(false); }; /* -------------------------------------------------------------------------- */ @@ -275,7 +310,7 @@ export default function TableList(props: any) { (async () => { setIsLoading(true); - const division = await axios.get('/division'); + const division = await axios.get(`${corporateValue}/division`); setDivisionData(division.data); const params = @@ -283,19 +318,17 @@ export default function TableList(props: any) { ? appliedParams : Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]); - const response = await axios.get('/dashboard', { - params: params, + const corporateMembers = await axios.get(`${corporateValue}/members`, { + params, }); - console.log(response); - setSearchParams(params); - // setDataTable(response.data.data); + setDataTable(corporateMembers.data.data); // setPaginationTable(response.data.meta); // setRowsPerPage(response.data.meta.per_page); setIsLoading(false); })(); - }, [appliedParams, searchParams, order, orderBy, setSearchParams]); + }, [appliedParams, searchParams, order, orderBy, setSearchParams, corporateValue]); return ( @@ -388,12 +421,23 @@ export default function TableList(props: any) { ) : dataTable.length >= 1 ? ( dataTable.map((row: DataTableProps, index) => ( - {row.member_id} - {row.name} + {row.memberId} + {row.fullName} {row.division} - {row.limit} + + + + + {fSplit(row.limit.current)} / {fSplit(row.limit.total)} + + + - {row.status.toLowerCase() === 'active' ? ( + {row.status === 1 ? ( ) : ( )} diff --git a/frontend/client-portal/src/utils/formatNumber.ts b/frontend/client-portal/src/utils/formatNumber.ts index 353c0299..834dd5f4 100755 --- a/frontend/client-portal/src/utils/formatNumber.ts +++ b/frontend/client-portal/src/utils/formatNumber.ts @@ -28,6 +28,10 @@ export function fCurrency(number: string | number) { return numeral(number).format('$0,0'); } +export function fSplit(number: string | number) { + return numeral(number).format('0,0'); +} + export function fPercent(number: number) { return numeral(number / 100).format('0.0%'); }