Merge remote-tracking branch 'origin/staging' into origin/production
This commit is contained in:
Linksehat Staging Server
@@ -341,6 +341,8 @@ class RequestLogController extends Controller
|
||||
'status_final_log' => 'requested',
|
||||
'final_log' => 1,
|
||||
'discharge_date' => $request->discharge_date,
|
||||
'created_final_by'=> auth()->user()->id,
|
||||
'created_final_at'=> date('Y-m-d H:i:s'),
|
||||
]);
|
||||
if ($request->hasFile('result_files')) {
|
||||
foreach ($request->result_files as $file) {
|
||||
|
||||
192
Modules/Internal/Http/Controllers/Api/ReportLogController.php
Normal file
192
Modules/Internal/Http/Controllers/Api/ReportLogController.php
Normal file
@@ -0,0 +1,192 @@
|
||||
<?php
|
||||
|
||||
namespace Modules\Internal\Http\Controllers\Api;
|
||||
|
||||
use App\Helpers\Helper;
|
||||
use App\Models\RequestLog;
|
||||
use App\Models\Organization;
|
||||
use App\Models\Icd;
|
||||
use App\Services\ClaimService;
|
||||
use App\Services\ImportService;
|
||||
use Illuminate\Contracts\Support\Renderable;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Routing\Controller;
|
||||
use Modules\Internal\Transformers\ReportLogResource;
|
||||
use Illuminate\Support\Facades\Storage;
|
||||
use App\Exceptions\ImportRowException;
|
||||
use App\Events\RequestLoged;
|
||||
use Carbon\Carbon;
|
||||
|
||||
use Maatwebsite\Excel\Facades\Excel;
|
||||
use Box\Spout\Reader\Common\Creator\ReaderEntityFactory;
|
||||
use Box\Spout\Writer\Common\Creator\WriterEntityFactory;
|
||||
|
||||
|
||||
use Exception;
|
||||
use PDF;
|
||||
|
||||
|
||||
|
||||
use App\Models\File;
|
||||
use App\Models\FilesMcu;
|
||||
use Illuminate\Support\Facades\DB;
|
||||
use App\Models\Member;
|
||||
use Modules\Internal\Services\RequestLogService;
|
||||
use App\Services\RequestLogService as AppRequestLogService;
|
||||
|
||||
class ReportLogController extends Controller
|
||||
{
|
||||
|
||||
|
||||
public function index(Request $request)
|
||||
{
|
||||
$requestLog = RequestLog::query()
|
||||
->where('deleted_at', null)
|
||||
->when($request->final_log, function($q, $final_log) {
|
||||
$q->where('final_log', $final_log);
|
||||
})
|
||||
->when($request->search, function ($q, $search) {
|
||||
$q->where('code', 'LIKE', "%".$search."%");
|
||||
$q->orWhereHas('member', function ($subQuery) use ($search) {
|
||||
$subQuery->where('name', 'LIKE', "%".$search."%");
|
||||
});
|
||||
})
|
||||
->when($request->orderBy, function ($q, $orderBy) use ($request) {
|
||||
if (in_array($orderBy, ['submission_date', 'code', 'service_code', 'status'])) {
|
||||
$q->orderBy($orderBy, $request->order);
|
||||
}
|
||||
})
|
||||
->when(empty($request->orderBy), function ($q) {
|
||||
$q->orderBy('submission_date', 'desc');
|
||||
})
|
||||
->when($request->service_code, function($q, $service_code) {
|
||||
if ($service_code == 'IP'){ // Penjagaan sementara agar ini hanya muncul di inpatient monitoring
|
||||
$q->where('service_code', $service_code);
|
||||
} else {
|
||||
$q->where('service_code', '!=', 'IP'); // Dan selain IP muncul di final LOG
|
||||
}
|
||||
})
|
||||
// ->where('status', $request->status)
|
||||
->with(['member', 'files', 'service', 'member.currentPolicy'])
|
||||
->paginate();
|
||||
|
||||
return Helper::paginateResources(ReportLogResource::collection($requestLog));
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the form for creating a new resource.
|
||||
* @return Renderable
|
||||
*/
|
||||
public function create()
|
||||
{
|
||||
return view('internal::create');
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the specified resource.
|
||||
* @param int $id
|
||||
* @return Renderable
|
||||
*/
|
||||
public function show($id)
|
||||
{
|
||||
$claimRequest = RequestLog::findOrFail($id);
|
||||
$claimRequest->load([
|
||||
'histories' => function ($history) {
|
||||
$history->latest();
|
||||
},
|
||||
'files',
|
||||
'member',
|
||||
'member.currentPlan' => function($memberPlan) {
|
||||
$memberPlan->join('request_logs', 'request_logs.service_code', '=', 'plans.service_code');
|
||||
},
|
||||
// 'member.current_policy',
|
||||
'claim',
|
||||
'organization',
|
||||
|
||||
]);
|
||||
|
||||
return Helper::responseJson(data: RequestLogShowResource::make($claimRequest));
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the form for editing the specified resource.
|
||||
* @param int $id
|
||||
* @return Renderable
|
||||
*/
|
||||
public function edit($id)
|
||||
{
|
||||
return view('internal::edit');
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the specified resource in storage.
|
||||
* @param Request $request
|
||||
* @param int $id
|
||||
* @return Renderable
|
||||
*/
|
||||
public function update(Request $request, $id)
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the specified resource from storage.
|
||||
* @param int $id
|
||||
* @return Renderable
|
||||
*/
|
||||
public function destroy(Request $request, $id)
|
||||
{
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Generate Export Excel Request LOG
|
||||
*/
|
||||
|
||||
public function generateDataRequestLogExcel(){
|
||||
$file_name = 'Data Request LOG';
|
||||
// Membuat penulis entitas Spout
|
||||
$writer = WriterEntityFactory::createXLSXWriter();
|
||||
// Membuka penulis untuk menulis ke file
|
||||
$writer->openToFile(public_path('files/Data Request LOG.xlsx'));
|
||||
|
||||
// Sheet 1
|
||||
$writer->getCurrentSheet()->setName('Data');
|
||||
$headers_map_to_table_fields = RequestLog::$listing_data_doc_headers;
|
||||
$headerRow = WriterEntityFactory::createRowFromArray($headers_map_to_table_fields);
|
||||
$writer->addRow($headerRow);
|
||||
|
||||
$dataRequestLog = RequestLog::query()
|
||||
// ->whereHas('corporatePlan', function ($corporatePlan) use ($corporate_id) {
|
||||
// $corporatePlan->where('corporate_id', $corporate_id);
|
||||
// })
|
||||
->with('member')
|
||||
->orderBy('id', 'desc')
|
||||
->get()->toArray();
|
||||
|
||||
// dd($dataRequestLog);
|
||||
foreach ($dataRequestLog as $index => $row){
|
||||
$serviceType = $this->getServiceName($row['service_code']);
|
||||
|
||||
$rowData = [
|
||||
$row['id'], // id
|
||||
$row['code'], // code
|
||||
$row['member']['name'], // name
|
||||
$row['submission_date'], // submission date
|
||||
$serviceType, // service type
|
||||
$row['payment_type_name'], // service type
|
||||
$row['status'], // service type
|
||||
];
|
||||
$row = WriterEntityFactory::createRowFromArray($rowData);
|
||||
$writer->addRow($row);
|
||||
}
|
||||
$writer->close();
|
||||
|
||||
return Helper::responseJson([
|
||||
'file_name' => "Data Request Log " . date('Y-m-d h:i:s'),
|
||||
"file_url" => url('files/Data Request LOG.xlsx')
|
||||
]);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -63,8 +63,8 @@ class RequestLogController extends Controller
|
||||
});
|
||||
})
|
||||
->when($request->orderBy, function ($q, $orderBy) use ($request) {
|
||||
if (in_array($orderBy, ['submission_date', 'code'])) {
|
||||
$q->orderBy($orderBy, $request->orderBy);
|
||||
if (in_array($orderBy, ['submission_date', 'code', 'service_code', 'status'])) {
|
||||
$q->orderBy($orderBy, $request->order);
|
||||
}
|
||||
})
|
||||
->when(empty($request->orderBy), function ($q) {
|
||||
|
||||
@@ -45,6 +45,9 @@ use Modules\Internal\Http\Controllers\Api\LaboratoriumResultController;
|
||||
use Modules\Internal\Http\Controllers\Api\CorporateManageController;
|
||||
use Modules\Internal\Http\Controllers\ClaimEncounterController;
|
||||
|
||||
// Report
|
||||
use Modules\Internal\Http\Controllers\Api\ReportLogController;
|
||||
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
@@ -315,6 +318,12 @@ Route::prefix('internal')->group(function () {
|
||||
|
||||
Route::get('claim-requests/service/{id}', [ClaimRequestController::class, 'getServiceMember']);
|
||||
|
||||
// Report API
|
||||
Route::prefix('report')->group(function () {
|
||||
Route::prefix('/logs')->group(function () {
|
||||
Route::get('/', [ReportLogController::class, 'index']);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
70
Modules/Internal/Transformers/ReportLogResource.php
Normal file
70
Modules/Internal/Transformers/ReportLogResource.php
Normal file
@@ -0,0 +1,70 @@
|
||||
<?php
|
||||
|
||||
namespace Modules\Internal\Transformers;
|
||||
|
||||
use App\Helpers\Helper;
|
||||
use Illuminate\Http\Resources\Json\JsonResource;
|
||||
use Illuminate\Support\Str;
|
||||
use App\Models\Organization;
|
||||
use App\Models\File;
|
||||
use App\Models\User;
|
||||
use App\Models\RequestLogBenefit;
|
||||
use Carbon\Carbon;
|
||||
|
||||
class ReportLogResource extends JsonResource
|
||||
{
|
||||
/**
|
||||
* Transform the resource into an array.
|
||||
*
|
||||
* @param \Illuminate\Http\Request
|
||||
* @return array
|
||||
*/
|
||||
public function toArray($request)
|
||||
{
|
||||
$filesGroupByType = $this->files->mapToGroups(function($file) {
|
||||
return [Str::slug($file->type, '_') => $file];
|
||||
});
|
||||
$provider = Organization::where('id', $this->organization_id)->first();
|
||||
$documentQty = File::where(['fileable_type' => 'App\Models\RequestLog', 'fileable_id' => $this->id])->get()->toArray();
|
||||
$parsedDateTime = Carbon::parse($this->created_at);
|
||||
$formattedDateTime = $parsedDateTime->format('Y-m-d H:i:s');
|
||||
|
||||
$timeInsertBenefit = RequestLogBenefit::where('request_log_id', $this->id)->first();
|
||||
|
||||
if ($timeInsertBenefit){
|
||||
$created_final_at = $timeInsertBenefit->created_at;
|
||||
$durationFinalGl = Helper::differenceTime($timeInsertBenefit->created_at, $this->approved_final_log_at);
|
||||
} else {
|
||||
$durationFinalGl = 0;
|
||||
$created_final_at = null;
|
||||
}
|
||||
|
||||
$durationGl = Helper::differenceTime($formattedDateTime, $this->submission_date);
|
||||
|
||||
|
||||
$data = [
|
||||
'id' => $this->id,
|
||||
'code' => $this->code,
|
||||
'created_at' => $formattedDateTime,
|
||||
'created_final_at' => $created_final_at,
|
||||
'submission_date' => $this->submission_date,
|
||||
'approved_by' => Helper::userName($this->approved_by),
|
||||
'approved_final_log_at' => $this->approved_final_log_at,
|
||||
'approved_final_log_by' => Helper::userName($this->approved_final_log_by),
|
||||
'service_name' => $this->service ? $this->service->name : '',
|
||||
'provider' => $provider ? $provider->name : '-',
|
||||
'document_qty' => count($documentQty),
|
||||
'status' => $this->status ?? '-',
|
||||
'status_final_log' => $this->status_final_log ?? '-',
|
||||
'member_name' => $this->member->name,
|
||||
'payment_type' => $this->payment_type,
|
||||
'payment_type_name' => $this->payment_type_name,
|
||||
'duration_gl' => $durationGl,
|
||||
'duration_final_gl' => $this->final_log == 1 ? $durationFinalGl : '-',
|
||||
'files_by_type' => $filesGroupByType,
|
||||
'time_insert_benefit' => $filesGroupByType,
|
||||
];
|
||||
|
||||
return $data;
|
||||
}
|
||||
}
|
||||
@@ -9,6 +9,7 @@ use Symfony\Component\HttpFoundation\Response;
|
||||
use PHPMailer\PHPMailer\PHPMailer;
|
||||
use Illuminate\Support\Facades\DB;
|
||||
use App\Models\Member;
|
||||
use App\Models\User;
|
||||
use App\Models\Service;
|
||||
|
||||
class Helper
|
||||
@@ -89,6 +90,22 @@ class Helper
|
||||
return $principalName->name;
|
||||
}
|
||||
|
||||
public static function userName($id)
|
||||
{
|
||||
$user = User::find($id);
|
||||
if ($user) {
|
||||
$person = $user->person;
|
||||
if ($person) {
|
||||
return $person->name;
|
||||
} else {
|
||||
return 'Person not found for this user.';
|
||||
}
|
||||
} else {
|
||||
return 'User not found.';
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
public static function serviceName($code)
|
||||
{
|
||||
$serviceName = Service::where('code', $code)->get()->first();
|
||||
@@ -138,6 +155,14 @@ class Helper
|
||||
return $datesAvailabilities;
|
||||
}
|
||||
|
||||
public static function differenceTime($startDate, $endDate){
|
||||
$startTime = Carbon::parse($startDate);
|
||||
$endTime = Carbon::parse($endDate);
|
||||
|
||||
$interval = $endTime->diff($startTime);
|
||||
return $interval->format('%d days, %h hours and %i minutes');
|
||||
}
|
||||
|
||||
public static function dailyAvailabilities($availabilities)
|
||||
{
|
||||
$hours = [
|
||||
|
||||
@@ -47,6 +47,8 @@ class RequestLog extends Model
|
||||
'approved_at',
|
||||
'approved_final_log_by',
|
||||
'approved_final_log_at',
|
||||
'created_final_at',
|
||||
'created_final_by',
|
||||
];
|
||||
|
||||
protected $hidden = [
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
<?php
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
/**
|
||||
* Run the migrations.
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
public function up()
|
||||
{
|
||||
Schema::table('request_logs', function (Blueprint $table) {
|
||||
$table->dateTime('created_final_at');
|
||||
$table->bigInteger('created_final_by');
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Reverse the migrations.
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
public function down()
|
||||
{
|
||||
Schema::table('request_logs', function (Blueprint $table) {
|
||||
$table->dropColumn('created_final_at');
|
||||
$table->dropColumn('created_final_by');
|
||||
});
|
||||
}
|
||||
};
|
||||
131
frontend/dashboard/src/@types/table.ts
Normal file
131
frontend/dashboard/src/@types/table.ts
Normal file
@@ -0,0 +1,131 @@
|
||||
import { SelectChangeEvent } from '@mui/material';
|
||||
import { Dispatch, FormEvent, SetStateAction } from 'react';
|
||||
|
||||
/* ------------------------------- pagination ------------------------------- */
|
||||
export type PaginationTableProps = {
|
||||
current_page: number;
|
||||
from: number;
|
||||
last_page: number;
|
||||
links: [];
|
||||
path: string;
|
||||
per_page: number;
|
||||
to: number;
|
||||
total: number;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ---------------------------------- order --------------------------------- */
|
||||
export type Order = 'asc' | 'desc';
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* --------------------------------- filter --------------------------------- */
|
||||
export type DivisionDataProps = {
|
||||
id: number;
|
||||
name: string;
|
||||
};
|
||||
|
||||
export type StatusDataProps = {
|
||||
id: number;
|
||||
name: string;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* -------------------------------- headcell -------------------------------- */
|
||||
export type HeadCell<DataType> = {
|
||||
id: Extract<keyof DataType, string>;
|
||||
align: string;
|
||||
label: string;
|
||||
isSort: boolean;
|
||||
width?: number;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ----------------------------- division filter ---------------------------- */
|
||||
export type DivisionData = {
|
||||
id: number;
|
||||
name: string;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ----------------------------- status filter ---------------------------- */
|
||||
export type Status = {
|
||||
id: number;
|
||||
name: string;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ----------------------------------- row ---------------------------------- */
|
||||
export type TableListProps<DataType> = {
|
||||
headCells?: HeadCell<DataType>[];
|
||||
rows?: Array<DataType>;
|
||||
paginations?: {
|
||||
page: number;
|
||||
setPage: Dispatch<SetStateAction<number>>;
|
||||
rowsPerPage: number;
|
||||
setRowsPerPage: Dispatch<SetStateAction<number>>;
|
||||
paginationTable: PaginationTableProps;
|
||||
setPaginationTable: Dispatch<SetStateAction<PaginationTableProps>>;
|
||||
};
|
||||
orders?: {
|
||||
order: Order;
|
||||
setOrder: Dispatch<SetStateAction<Order>>;
|
||||
orderBy: string;
|
||||
setOrderBy: Dispatch<SetStateAction<string>>;
|
||||
};
|
||||
loadings: {
|
||||
isLoading: boolean;
|
||||
setIsLoading: Dispatch<SetStateAction<boolean>>;
|
||||
};
|
||||
params?: {
|
||||
searchParams: URLSearchParams;
|
||||
setSearchParams: any;
|
||||
appliedParams: {};
|
||||
setAppliedParams: Dispatch<SetStateAction<{}>>;
|
||||
};
|
||||
searchs?: {
|
||||
useSearchs: boolean;
|
||||
fullWidth?: boolean;
|
||||
searchText: string;
|
||||
setSearchText: Dispatch<SetStateAction<string>>;
|
||||
handleSearchSubmit: (event: FormEvent<HTMLFormElement>) => void;
|
||||
};
|
||||
filters?: {
|
||||
useFilter: boolean;
|
||||
config: {
|
||||
label: string;
|
||||
divisionValue: string;
|
||||
divisionData: DivisionData[];
|
||||
handleDivisionChange: (event: SelectChangeEvent) => void;
|
||||
};
|
||||
};
|
||||
filterStatus?: {
|
||||
useFilter: boolean;
|
||||
config: {
|
||||
label: string;
|
||||
statusValue: string;
|
||||
statusData: Status[];
|
||||
handleStatusChange: (event: SelectChangeEvent) => void;
|
||||
};
|
||||
};
|
||||
filterStartDate?: {
|
||||
useFilter: boolean;
|
||||
startDate: string;
|
||||
setStartDate: Dispatch<SetStateAction<string>>;
|
||||
handleStartDateChange: (event: FormEvent<HTMLFormElement>) => void;
|
||||
};
|
||||
filterEndDate?: {
|
||||
useFilter: boolean;
|
||||
endDate: string;
|
||||
setEndDate: Dispatch<SetStateAction<string>>;
|
||||
handleEndDateChange: (event: FormEvent<HTMLFormElement>) => void;
|
||||
};
|
||||
exportReport?: {
|
||||
useExport: boolean;
|
||||
startDate: string;
|
||||
endDate: string;
|
||||
status: string;
|
||||
handleExportReport: (event: FormEvent<HTMLFormElement>) => void;
|
||||
};
|
||||
exportLoading?: boolean;
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
25
frontend/dashboard/src/components/BaseTablePagination.tsx
Normal file
25
frontend/dashboard/src/components/BaseTablePagination.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
/* ---------------------------------- @mui ---------------------------------- */
|
||||
import { TablePagination, TablePaginationProps } from '@mui/material';
|
||||
import { Box } from '@mui/system';
|
||||
|
||||
export default function BaseTablePagination({
|
||||
count,
|
||||
onPageChange,
|
||||
page,
|
||||
rowsPerPage,
|
||||
onRowsPerPageChange,
|
||||
}: TablePaginationProps) {
|
||||
return (
|
||||
<Box>
|
||||
<TablePagination
|
||||
component="div"
|
||||
rowsPerPageOptions={[10, 25]}
|
||||
count={count}
|
||||
page={page}
|
||||
onPageChange={onPageChange}
|
||||
rowsPerPage={rowsPerPage}
|
||||
onRowsPerPageChange={onRowsPerPageChange}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
395
frontend/dashboard/src/components/Table.tsx
Normal file
395
frontend/dashboard/src/components/Table.tsx
Normal file
@@ -0,0 +1,395 @@
|
||||
/* ---------------------------------- @mui ---------------------------------- */
|
||||
import {
|
||||
Paper,
|
||||
Table as TableContent,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableContainer,
|
||||
TableHead,
|
||||
TableRow,
|
||||
TextField,
|
||||
Button,
|
||||
TableSortLabel,
|
||||
Box,
|
||||
Grid,
|
||||
FormControl,
|
||||
InputLabel,
|
||||
Select,
|
||||
MenuItem,
|
||||
InputAdornment,
|
||||
Typography,
|
||||
} from '@mui/material';
|
||||
import { visuallyHidden } from '@mui/utils';
|
||||
/* ---------------------------------- react --------------------------------- */
|
||||
import { Fragment } from 'react';
|
||||
/* -------------------------------- component ------------------------------- */
|
||||
import BaseTablePagination from './BaseTablePagination';
|
||||
/* ---------------------------------- utils --------------------------------- */
|
||||
import { Download, Search as SearchIcon } from '@mui/icons-material';
|
||||
/* ---------------------------------- types --------------------------------- */
|
||||
import { DivisionDataProps, StatusDataProps, TableListProps } from '../@types/table';
|
||||
import { LoadingButton } from '@mui/lab';
|
||||
|
||||
export default function Table<T>({
|
||||
headCells,
|
||||
rows,
|
||||
paginations,
|
||||
orders,
|
||||
loadings,
|
||||
params,
|
||||
filters,
|
||||
filterStatus,
|
||||
filterStartDate,
|
||||
filterEndDate,
|
||||
searchs,
|
||||
exportReport,
|
||||
exportLoading,
|
||||
}: TableListProps<T>) {
|
||||
/* ------------------------------- handle sort ------------------------------ */
|
||||
const handleRequestSort = async (event: React.MouseEvent<unknown>, property: string) => {
|
||||
const isAsc = orders?.orderBy === property && orders?.order === 'asc';
|
||||
|
||||
orders?.setOrder(isAsc ? 'desc' : 'asc');
|
||||
orders?.setOrderBy(property);
|
||||
const parameters = Object.fromEntries([
|
||||
...(params?.searchParams.entries() as IterableIterator<[string, string]>),
|
||||
['order', isAsc ? 'desc' : 'asc'],
|
||||
['orderBy', property],
|
||||
]);
|
||||
params?.setAppliedParams(parameters);
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* -------------------------- enchanced table head -------------------------- */
|
||||
const EnhancedTableHead = () => {
|
||||
const createSortHandler = (property: string) => (event: React.MouseEvent<unknown>) => {
|
||||
handleRequestSort(event, property);
|
||||
};
|
||||
|
||||
return (
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
{headCells &&
|
||||
headCells.map((headCell, index) => (
|
||||
<TableCell
|
||||
key={index}
|
||||
sortDirection={orders?.orderBy === headCell.id ? orders.order : false}
|
||||
// @ts-ignore
|
||||
align={headCell.align}
|
||||
sx={{ padding: 2 }}
|
||||
width={headCell.width ? headCell.width : 'auto'}
|
||||
>
|
||||
{headCell.isSort ? (
|
||||
<TableSortLabel
|
||||
active={orders?.orderBy === headCell.id}
|
||||
direction={orders?.orderBy === headCell.id ? orders.order : 'asc'}
|
||||
onClick={createSortHandler(headCell.id)}
|
||||
>
|
||||
{headCell.label}
|
||||
{orders?.orderBy === headCell.id ? (
|
||||
<Box component="span" sx={visuallyHidden}>
|
||||
{orders.order === 'desc' ? 'sorted descending' : 'sorted ascending'}
|
||||
</Box>
|
||||
) : null}
|
||||
</TableSortLabel>
|
||||
) : (
|
||||
headCell.label
|
||||
)}
|
||||
</TableCell>
|
||||
))}
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
);
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ------------------------ button change pagination ------------------------ */
|
||||
const onPageChangeHandle = async (
|
||||
event: React.MouseEvent<HTMLButtonElement> | null,
|
||||
newPage: number
|
||||
) => {
|
||||
const parameters = Object.fromEntries([
|
||||
...(params?.searchParams.entries() as IterableIterator<[string, string]>),
|
||||
['page', newPage + 1],
|
||||
['per_page', paginations?.rowsPerPage],
|
||||
]);
|
||||
paginations?.setPage(newPage);
|
||||
await new Promise((resolve) => setTimeout(resolve, 500));
|
||||
params?.setAppliedParams(parameters);
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* --------------------------- row page per limit --------------------------- */
|
||||
const onRowsPerPageChangeHandle = async (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
params?.searchParams.delete('page');
|
||||
const parameters = Object.fromEntries([
|
||||
...(params?.searchParams.entries() as IterableIterator<[string, string]>),
|
||||
['per_page', parseInt(event.target.value, 10)],
|
||||
]);
|
||||
|
||||
paginations?.setPage(0);
|
||||
paginations?.setRowsPerPage(parseInt(event.target.value, 10));
|
||||
await new Promise((resolve) => setTimeout(resolve, 500));
|
||||
params?.setAppliedParams(parameters);
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
return (
|
||||
// <Card>
|
||||
<Grid container>
|
||||
{/* Field 1 */}
|
||||
<Grid item xs={12} paddingX="24px" paddingY="20px">
|
||||
<Grid container spacing={2}>
|
||||
{filters && filters.useFilter ? (
|
||||
<Fragment>
|
||||
<Grid item xs={12} lg={3} xl={2}>
|
||||
<FormControl fullWidth>
|
||||
<InputLabel id="simple-division-select-lable">Division</InputLabel>
|
||||
<Select
|
||||
labelId="simple-division-select-lable"
|
||||
id="division-select-lable"
|
||||
value={filters.config.divisionValue}
|
||||
label="Division"
|
||||
onChange={filters.config.handleDivisionChange}
|
||||
>
|
||||
<MenuItem value="all">All</MenuItem>
|
||||
{filters.config.divisionData.map((row: DivisionDataProps, index) => (
|
||||
<MenuItem key={index} value={row.id}>
|
||||
{row.name}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
<Grid item xs={12} lg={9} xl={10}>
|
||||
<form onSubmit={searchs?.handleSearchSubmit}>
|
||||
<TextField
|
||||
id="search-input"
|
||||
label="Search"
|
||||
variant="outlined"
|
||||
onChange={(event) => searchs?.setSearchText(event.target.value)}
|
||||
value={searchs?.searchText}
|
||||
fullWidth
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
</Fragment>
|
||||
) : null}
|
||||
|
||||
{searchs && searchs.useSearchs ? (
|
||||
<Fragment>
|
||||
{filterStatus && filterStatus.useFilter ? (
|
||||
<Grid item xs={12} lg={4} xl={4}>
|
||||
<form onSubmit={searchs.handleSearchSubmit}>
|
||||
<TextField
|
||||
id="search-input"
|
||||
variant="outlined"
|
||||
onChange={(event) => searchs.setSearchText(event.target.value)}
|
||||
value={searchs.searchText}
|
||||
fullWidth
|
||||
InputProps={{
|
||||
startAdornment: (
|
||||
<InputAdornment position="start">
|
||||
<SearchIcon />
|
||||
</InputAdornment>
|
||||
),
|
||||
}}
|
||||
placeholder="Search Name or Member ID... "
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
) : exportReport && exportReport.useExport && filterStatus === undefined ? (
|
||||
<Grid item xs={12} lg={10} xl={10}>
|
||||
<form onSubmit={searchs.handleSearchSubmit}>
|
||||
<TextField
|
||||
id="search-input"
|
||||
variant="outlined"
|
||||
onChange={(event) => searchs.setSearchText(event.target.value)}
|
||||
value={searchs.searchText}
|
||||
fullWidth
|
||||
InputProps={{
|
||||
startAdornment: (
|
||||
<InputAdornment position="start">
|
||||
<SearchIcon />
|
||||
</InputAdornment>
|
||||
),
|
||||
}}
|
||||
placeholder="Search Name or Member ID... "
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
) : (
|
||||
<Grid item xs={12} lg={searchs.fullWidth ? 12 : 6} xl={searchs.fullWidth ? 12 : 6}>
|
||||
<form onSubmit={searchs.handleSearchSubmit}>
|
||||
<TextField
|
||||
id="search-input"
|
||||
variant="outlined"
|
||||
onChange={(event) => searchs.setSearchText(event.target.value)}
|
||||
value={searchs.searchText}
|
||||
fullWidth
|
||||
InputProps={{
|
||||
startAdornment: (
|
||||
<InputAdornment position="start">
|
||||
<SearchIcon />
|
||||
</InputAdornment>
|
||||
),
|
||||
}}
|
||||
placeholder="Search Name or Member ID... "
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
)}
|
||||
</Fragment>
|
||||
) : null}
|
||||
|
||||
{/* Start date */}
|
||||
{filterStartDate && filterStartDate.useFilter ? (
|
||||
<Grid item xs={12} lg={2} xl={2}>
|
||||
<form onChange={filterStartDate.handleStartDateChange}>
|
||||
<TextField
|
||||
id="date-input"
|
||||
type="date"
|
||||
variant="outlined"
|
||||
value={filterStartDate.startDate}
|
||||
onChange={(event) => filterStartDate.setStartDate(event.target.value)}
|
||||
fullWidth
|
||||
label="Start Date"
|
||||
InputLabelProps={{
|
||||
shrink: true,
|
||||
}}
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
) : null}
|
||||
|
||||
{/* End Date */}
|
||||
|
||||
{filterEndDate && filterEndDate.useFilter ? (
|
||||
<Grid item xs={12} lg={2} xl={2}>
|
||||
<form onChange={filterEndDate.handleEndDateChange}>
|
||||
<TextField
|
||||
id="date-input"
|
||||
type="date"
|
||||
variant="outlined"
|
||||
value={filterEndDate.endDate}
|
||||
onChange={(event) => filterEndDate.setEndDate(event.target.value)}
|
||||
fullWidth
|
||||
label="End Date"
|
||||
InputLabelProps={{
|
||||
shrink: true,
|
||||
}}
|
||||
/>
|
||||
</form>
|
||||
</Grid>
|
||||
) : null}
|
||||
|
||||
{/* Filter status */}
|
||||
{filterStatus && filterStatus.useFilter ? (
|
||||
<Grid item xs={12} lg={2} xl={2}>
|
||||
<FormControl fullWidth>
|
||||
<InputLabel id="simple-status-select-lable">Status</InputLabel>
|
||||
<Select
|
||||
labelId="simple-status-select-lable"
|
||||
id="status-select-lable"
|
||||
value={filterStatus.config.statusValue}
|
||||
label="Status"
|
||||
onChange={filterStatus.config.handleStatusChange}
|
||||
>
|
||||
<MenuItem value="all">All</MenuItem>
|
||||
{filterStatus.config.statusData.map((row: StatusDataProps, index) => (
|
||||
<MenuItem key={index} value={row.id}>
|
||||
{row.name}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
) : null}
|
||||
|
||||
{/* Export Report */}
|
||||
{exportReport && exportReport.useExport ? (
|
||||
<Grid item xs={12} lg={2} xl={2}>
|
||||
<FormControl fullWidth>
|
||||
<LoadingButton
|
||||
id="upload-button"
|
||||
variant="contained"
|
||||
startIcon={<Download />}
|
||||
sx={{ p: 1.8 }}
|
||||
onClick={() => exportReport.handleExportReport()}
|
||||
loading={exportLoading}
|
||||
>
|
||||
<Typography variant="inherit" sx={{ marginLeft: 1 }}>
|
||||
Export
|
||||
</Typography>
|
||||
</LoadingButton>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
) : null}
|
||||
</Grid>
|
||||
</Grid>
|
||||
{/* End Field 1 */}
|
||||
{/* Field 2 */}
|
||||
<Grid item xs={12}>
|
||||
{/* Table */}
|
||||
<TableContainer component={Paper}>
|
||||
<TableContent aria-label="collapsible table" size="small">
|
||||
{/* Table Header */}
|
||||
<EnhancedTableHead />
|
||||
{/* End Table Header */}
|
||||
{/* Table Body */}
|
||||
<TableBody>
|
||||
{loadings.isLoading && rows && rows.length >= 1 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={headCells?.length} align="center">
|
||||
Loading . . .
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
) : rows && rows.length >= 1 ? (
|
||||
rows.map((row, rowIndex) => (
|
||||
<TableRow key={rowIndex}>
|
||||
{headCells &&
|
||||
//@ts-ignore
|
||||
headCells.map((head, headIndex) => (
|
||||
//@ts-ignore
|
||||
<TableCell align={head.align} key={headIndex}>
|
||||
{row[head.id]}
|
||||
</TableCell>
|
||||
))}
|
||||
</TableRow>
|
||||
))
|
||||
) : loadings.isLoading === false && rows && rows.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={6} align="center">
|
||||
No Data Found
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
) : (
|
||||
<TableRow>
|
||||
<TableCell colSpan={6} align="center">
|
||||
Loading . . .
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)}
|
||||
</TableBody>
|
||||
{/* End Table Body */}
|
||||
</TableContent>
|
||||
</TableContainer>
|
||||
{/* End Table */}
|
||||
|
||||
{/* Pagination */}
|
||||
{paginations && (
|
||||
<BaseTablePagination
|
||||
count={paginations.paginationTable.total}
|
||||
onPageChange={onPageChangeHandle}
|
||||
page={paginations.page}
|
||||
rowsPerPage={paginations.rowsPerPage}
|
||||
onRowsPerPageChange={onRowsPerPageChangeHandle}
|
||||
/>
|
||||
)}
|
||||
{/* End Pagination */}
|
||||
</Grid>
|
||||
{/* End Field 2 */}
|
||||
</Grid>
|
||||
// </Card>
|
||||
);
|
||||
}
|
||||
@@ -91,6 +91,7 @@ const navConfig = [
|
||||
{
|
||||
title: 'REPORT',
|
||||
children: [
|
||||
{ title: 'Letter of Guarantee', path: '/report/logs' },
|
||||
{ title: 'Appointment', path: '/report/appointments' },
|
||||
{ title: 'Live Chat', path: '/report/live-chat' },
|
||||
{ title: 'Linksehat Payment', path: '/report/linksehat-payments' },
|
||||
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableSortLabel,
|
||||
TableRow,
|
||||
TextField,
|
||||
Typography,
|
||||
@@ -26,6 +27,7 @@ import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
|
||||
import AddIcon from '@mui/icons-material/Add';
|
||||
import UploadIcon from '@mui/icons-material/Upload';
|
||||
import CancelIcon from '@mui/icons-material/Cancel';
|
||||
import { visuallyHidden } from '@mui/utils';
|
||||
|
||||
import FindInPageOutlinedIcon from '@mui/icons-material/FindInPageOutlined';
|
||||
import ApprovalIcon from '../../../../build/icons/ic_approval.svg';
|
||||
@@ -57,6 +59,7 @@ import { RequestLogType } from '../Request/Model/Types';
|
||||
import SvgIconStyle from '../../../components/SvgIconStyle';
|
||||
import { Delete } from '@mui/icons-material';
|
||||
import DialogDeleteRequestLOG from '../Request/Components/DialogDeleteRequestLOG';
|
||||
import { HeadCell, Order } from '@/@types/table';
|
||||
// import LoadingButton from '@/theme/overrides/LoadingButton';
|
||||
|
||||
export default function List() {
|
||||
@@ -298,8 +301,15 @@ export default function List() {
|
||||
|
||||
const loadDataTableData = async (appliedFilter: any | null = null) => {
|
||||
setDataTableLoading(true);
|
||||
const filter = appliedFilter ? appliedFilter : Object.fromEntries([...searchParams.entries()]);
|
||||
const response = await axios.get('/customer-service/request', { params: filter });
|
||||
const parameters =
|
||||
Object.keys(appliedParams).length !== 0
|
||||
? appliedParams
|
||||
: Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]);
|
||||
|
||||
const response = await axios.get('/customer-service/request', {
|
||||
params: { ...parameters },
|
||||
});
|
||||
|
||||
setDataTableLoading(false);
|
||||
setDataTableData(response.data);
|
||||
};
|
||||
@@ -319,10 +329,6 @@ export default function List() {
|
||||
const [idRequestLog, setidRequestLog] = useState<number>();
|
||||
const [openDialogDeleteRequestLog, setDialogDeleteRequestLog] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
loadDataTableData();
|
||||
}, []);
|
||||
|
||||
const headStyle = {
|
||||
fontWeight: 'bold',
|
||||
};
|
||||
@@ -484,6 +490,104 @@ export default function List() {
|
||||
/* ------------------ END TABLE ROW ------------------ */
|
||||
}
|
||||
|
||||
/* -------------------------------- headCell -------------------------------- */
|
||||
const headCells: HeadCell<never>[] = [
|
||||
{
|
||||
id: 'code',
|
||||
align: 'left',
|
||||
label: 'Code',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'provider',
|
||||
align: 'left',
|
||||
label: 'Provider',
|
||||
isSort: false,
|
||||
},
|
||||
|
||||
{
|
||||
id: 'name',
|
||||
align: 'left',
|
||||
label: 'Name',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'submission_date',
|
||||
align: 'left',
|
||||
label: 'Submision Date',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'service_code',
|
||||
align: 'left',
|
||||
label: 'Service Type',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'claim_method',
|
||||
align: 'left',
|
||||
label: 'Claim Method',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'status',
|
||||
align: 'left',
|
||||
label: 'Status',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Action',
|
||||
isSort: false,
|
||||
},
|
||||
];
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
const createSortHandler = (property: string) => (event: React.MouseEvent<unknown>) => {
|
||||
handleRequestSort(event, property);
|
||||
};
|
||||
|
||||
/* ------------------------------ handle params ----------------------------- */
|
||||
const [appliedParams, setAppliedParams] = useState({});
|
||||
|
||||
const params = {
|
||||
searchParams: searchParams,
|
||||
setSearchParams: setSearchParams,
|
||||
appliedParams: appliedParams,
|
||||
setAppliedParams: setAppliedParams,
|
||||
};
|
||||
|
||||
/* ------------------------------ handle order ------------------------------ */
|
||||
const [order, setOrder] = useState<Order>('desc');
|
||||
const [orderBy, setOrderBy] = useState('submission_date');
|
||||
|
||||
const orders = {
|
||||
order: order,
|
||||
setOrder: setOrder,
|
||||
orderBy: orderBy,
|
||||
setOrderBy: setOrderBy,
|
||||
};
|
||||
|
||||
/* ------------------------------- handle sort ------------------------------ */
|
||||
const handleRequestSort = async (event: React.MouseEvent<unknown>, property: string) => {
|
||||
const isAsc = orders?.orderBy === property && orders?.order === 'asc';
|
||||
|
||||
orders?.setOrder(isAsc ? 'desc' : 'asc');
|
||||
orders?.setOrderBy(property);
|
||||
const parameters = Object.fromEntries([
|
||||
...(params?.searchParams.entries() as IterableIterator<[string, string]>),
|
||||
['order', isAsc ? 'desc' : 'asc'],
|
||||
['orderBy', property],
|
||||
]);
|
||||
params?.setAppliedParams(parameters);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
loadDataTableData();
|
||||
}, [appliedParams, searchParams, order, orderBy, setSearchParams]);
|
||||
|
||||
|
||||
function TableContent() {
|
||||
return (
|
||||
<Table aria-label="collapsible table">
|
||||
@@ -494,7 +598,7 @@ export default function List() {
|
||||
{/* <TableCell style={headStyle} align="left">
|
||||
ID Request LOG
|
||||
</TableCell> */}
|
||||
<TableCell style={headStyle} align="left">
|
||||
{/* <TableCell style={headStyle} align="left">
|
||||
Code
|
||||
</TableCell>
|
||||
<TableCell style={headStyle} align="left">
|
||||
@@ -504,7 +608,17 @@ export default function List() {
|
||||
Name
|
||||
</TableCell>
|
||||
<TableCell style={headStyle} align="left">
|
||||
Date of Submission
|
||||
<TableSortLabel
|
||||
active={true}
|
||||
direction={'desc'}
|
||||
onClick={() => {}}
|
||||
>
|
||||
Submision Date
|
||||
|
||||
<Box component="span" sx={visuallyHidden}>
|
||||
sorted ascending
|
||||
</Box>
|
||||
</TableSortLabel>
|
||||
</TableCell>
|
||||
<TableCell style={headStyle} align="left">
|
||||
Service Type
|
||||
@@ -515,7 +629,37 @@ export default function List() {
|
||||
<TableCell style={headStyle} align="left">
|
||||
Status
|
||||
</TableCell>
|
||||
<TableCell style={headStyle} align="right"></TableCell>
|
||||
<TableCell style={headStyle} align="right"></TableCell> */}
|
||||
|
||||
{headCells &&
|
||||
headCells.map((headCell, index) => (
|
||||
<TableCell
|
||||
key={index}
|
||||
sortDirection={orders?.orderBy === headCell.id ? orders.order : false}
|
||||
// @ts-ignore
|
||||
align={headCell.align}
|
||||
sx={{ padding: 2 }}
|
||||
width={headCell.width ? headCell.width : 'auto'}
|
||||
>
|
||||
{headCell.isSort ? (
|
||||
<TableSortLabel
|
||||
active={orders?.orderBy === headCell.id}
|
||||
direction={orders?.orderBy === headCell.id ? orders.order : 'asc'}
|
||||
onClick={createSortHandler(headCell.id)}
|
||||
>
|
||||
{headCell.label}
|
||||
{orders?.orderBy === headCell.id ? (
|
||||
<Box component="span" sx={visuallyHidden}>
|
||||
{orders.order === 'desc' ? 'sorted descending' : 'sorted ascending'}
|
||||
</Box>
|
||||
) : null}
|
||||
</TableSortLabel>
|
||||
) : (
|
||||
headCell.label
|
||||
)}
|
||||
</TableCell>
|
||||
))}
|
||||
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
{/* ------------------ END TABLE HEADER ------------------ */}
|
||||
|
||||
93
frontend/dashboard/src/pages/Report/Log/Create.tsx
Normal file
93
frontend/dashboard/src/pages/Report/Log/Create.tsx
Normal file
@@ -0,0 +1,93 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { paramCase } from 'change-case';
|
||||
import { useParams, useLocation } from 'react-router-dom';
|
||||
// @mui
|
||||
import { Container, Stack } from '@mui/material';
|
||||
import useSettings from '../../../hooks/useSettings';
|
||||
import Page from '../../../components/Page';
|
||||
import Form from './Form';
|
||||
import HeaderBreadcrumbs from '../../../components/HeaderBreadcrumbs';
|
||||
import axios from '../../../utils/axios';
|
||||
import { Practitioner } from '../../../@types/doctor';
|
||||
import ButtonBack from '../../../components/ButtonBack';
|
||||
|
||||
export default function Create() {
|
||||
const { themeStretch } = useSettings();
|
||||
const { id } = useParams();
|
||||
|
||||
const isEdit = id ? true : false;
|
||||
|
||||
const [currentPractitioner, setCurrentPractitioner] = useState<Practitioner>();
|
||||
|
||||
useEffect(() => {
|
||||
if (isEdit) {
|
||||
axios.get('/doctors/' + id).then((res) => {
|
||||
setCurrentPractitioner(res.data);
|
||||
});
|
||||
}
|
||||
}, [id]);
|
||||
|
||||
return (
|
||||
<Page title="Membership: Create a new Dokter">
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<Stack direction="row" alignItems="center">
|
||||
{/* <ButtonBack /> */}
|
||||
<HeaderBreadcrumbs
|
||||
heading={!isEdit ? 'Manage a new Dokter' : 'Manage Dokter'}
|
||||
links={[
|
||||
{ name: 'Master', href: '/master' },
|
||||
{
|
||||
name: 'Doctors',
|
||||
href: '/master/doctors',
|
||||
},
|
||||
{ name: !isEdit ? 'Create' : currentPractitioner?.name ?? '' },
|
||||
]}
|
||||
/>
|
||||
</Stack>
|
||||
|
||||
<Form
|
||||
// isSubmitting={isSubmitting}
|
||||
isEdit={isEdit}
|
||||
currentPractitioner={currentPractitioner}
|
||||
/>
|
||||
</Container>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
// const pageTitle = 'Create Data Dokter';
|
||||
// return (
|
||||
// <Page title={pageTitle}>
|
||||
// <Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
// <HeaderBreadcrumbs
|
||||
// heading={pageTitle}
|
||||
// links={[
|
||||
// {
|
||||
// name: 'Master',
|
||||
// href: '/master',
|
||||
// },
|
||||
// {
|
||||
// name: 'Dokter',
|
||||
// href: '/master/organizations/',
|
||||
// },
|
||||
// {
|
||||
// name: 'Create',
|
||||
// href: '/master/organizations/create/',
|
||||
// },
|
||||
// ]}
|
||||
// />
|
||||
|
||||
// <Grid container spacing={2}>
|
||||
// <Grid item xs={12}>
|
||||
// <Card sx={{ p: 2 }}>
|
||||
// <Form
|
||||
// isSubmitting={isSubmitting}
|
||||
// isEdit={isEdit}
|
||||
// currentOrganizations={currentOrganizations}
|
||||
// />
|
||||
// </Card>
|
||||
// </Grid>
|
||||
// </Grid>
|
||||
// </Container>
|
||||
// </Page>
|
||||
// );
|
||||
// }
|
||||
260
frontend/dashboard/src/pages/Report/Log/Form.tsx
Normal file
260
frontend/dashboard/src/pages/Report/Log/Form.tsx
Normal file
@@ -0,0 +1,260 @@
|
||||
import * as Yup from 'yup';
|
||||
import { useSnackbar } from 'notistack';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
|
||||
import Select, { SelectChangeEvent } from '@mui/material/Select';
|
||||
import * as React from 'react';
|
||||
|
||||
// form
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { yupResolver } from '@hookform/resolvers/yup';
|
||||
// @mui
|
||||
import { styled } from '@mui/material/styles';
|
||||
import { LoadingButton } from '@mui/lab';
|
||||
import {
|
||||
Box,
|
||||
Avatar,
|
||||
Button,
|
||||
ButtonGroup,
|
||||
Card,
|
||||
FormHelperText,
|
||||
Grid,
|
||||
Stack,
|
||||
Typography,
|
||||
TextField,
|
||||
Chip,
|
||||
} from '@mui/material';
|
||||
|
||||
import CancelIcon from '@mui/icons-material/Cancel';
|
||||
|
||||
// components
|
||||
import {
|
||||
FormProvider,
|
||||
RHFTextField,
|
||||
RHFRadioGroup,
|
||||
RHFUploadAvatar,
|
||||
RHFSwitch,
|
||||
RHFEditor,
|
||||
RHFDatepicker,
|
||||
RHFMultiCheckbox,
|
||||
RHFCheckbox,
|
||||
RHFCustomMultiCheckbox,
|
||||
} from '../../../components/hook-form';
|
||||
import axios from '../../../utils/axios';
|
||||
import { fCurrency } from '../../../utils/formatNumber';
|
||||
import { Practitioner } from '../../../@types/doctor';
|
||||
|
||||
import { Label, Rowing } from '@mui/icons-material';
|
||||
|
||||
const LabelStyle = styled(Typography)(({ theme }) => ({
|
||||
...theme.typography.subtitle2,
|
||||
color: theme.palette.text.secondary,
|
||||
marginBottom: theme.spacing(1),
|
||||
}));
|
||||
|
||||
const HeaderStyle = styled('header')(({ theme }) => ({
|
||||
paddingBottom: theme.spacing(5),
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
}));
|
||||
|
||||
const Title = styled(Typography)(({ theme }) => ({
|
||||
...theme.typography.h4,
|
||||
boxShadow: 'none',
|
||||
// paddingBottom: theme.spacing(3),
|
||||
fontWeight: 700,
|
||||
color: '#005B7F',
|
||||
}));
|
||||
|
||||
interface FormValuesProps extends Partial<Practitioner> {
|
||||
taxes: boolean;
|
||||
inStock: boolean;
|
||||
}
|
||||
|
||||
type Props = {
|
||||
isEdit: boolean;
|
||||
currentPractitioner?: Practitioner;
|
||||
};
|
||||
|
||||
const Span = styled(Typography)(({ theme }) => ({
|
||||
boxShadow: 'none',
|
||||
paddingBottom: theme.spacing(1),
|
||||
}));
|
||||
|
||||
const Text = styled(Typography)(({ theme }) => ({
|
||||
boxShadow: 'none',
|
||||
paddingBottom: theme.spacing(3),
|
||||
}));
|
||||
|
||||
export default function PractitionerForm({ isEdit, currentPractitioner }: Props) {
|
||||
const navigate = useNavigate();
|
||||
const [practitioner_group, setPractitionerGroups] = useState([]);
|
||||
|
||||
// const [ errors, setErrors ] = useState<{ [key: string]: string }>({});
|
||||
|
||||
const { enqueueSnackbar } = useSnackbar();
|
||||
|
||||
const NewCorporateSchema = Yup.object().shape({
|
||||
name: Yup.string().required('Name is required'),
|
||||
// file: Yup.boolean().required('Corporate Status is required'),
|
||||
});
|
||||
|
||||
const defaultValues = useMemo(
|
||||
() => ({
|
||||
id: currentPractitioner?.id,
|
||||
name: currentPractitioner?.name || '',
|
||||
address: currentPractitioner?.address || '',
|
||||
birth_date: currentPractitioner?.birth_date || '',
|
||||
gender: currentPractitioner?.gender || '',
|
||||
description: currentPractitioner?.description || '',
|
||||
birth_place: currentPractitioner?.birth_place || '',
|
||||
active: currentPractitioner?.active === 1 ? true : false,
|
||||
avatar_url: currentPractitioner?.avatar_url || '',
|
||||
doctor_id: currentPractitioner?.doctor_id || '',
|
||||
organizations: currentPractitioner?.organizations || [],
|
||||
specialities: currentPractitioner?.specialities || [],
|
||||
}),
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[currentPractitioner]
|
||||
);
|
||||
|
||||
console.log('defaultValues', defaultValues);
|
||||
|
||||
function StatusLabel({ value }: { value: boolean }) {
|
||||
return (
|
||||
<Chip
|
||||
label={value ? 'Aktif' : 'Tidak Aktif'}
|
||||
size="medium"
|
||||
sx={{
|
||||
backgroundColor: value ? 'rgba(84, 214, 44, 0.16)' : 'rgba(255, 72, 66, 0.16)',
|
||||
color: value ? '#229A16' : '#B72136',
|
||||
padding: '1 8 1 8 px',
|
||||
borderRadius: '4px',
|
||||
fontSize: '12px',
|
||||
fontWeight: 'bold',
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
const methods = useForm<FormValuesProps>({
|
||||
resolver: yupResolver(NewCorporateSchema),
|
||||
defaultValues,
|
||||
});
|
||||
|
||||
const {
|
||||
reset,
|
||||
watch,
|
||||
control,
|
||||
setValue,
|
||||
getValues,
|
||||
setError,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting },
|
||||
} = methods;
|
||||
|
||||
const values = watch();
|
||||
|
||||
useEffect(() => {
|
||||
if (isEdit && currentPractitioner) {
|
||||
reset(defaultValues);
|
||||
}
|
||||
if (!isEdit) {
|
||||
reset(defaultValues);
|
||||
}
|
||||
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [isEdit, currentPractitioner]);
|
||||
|
||||
const handleActivate = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setValue('active', event.target.checked);
|
||||
|
||||
console.log('event.target.checked', event.target.checked);
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append('active', event.target.checked ? '1' : '0');
|
||||
formData.append('_method', 'PUT');
|
||||
axios.post('/doctors/' + currentPractitioner?.id ?? '', formData);
|
||||
|
||||
enqueueSnackbar('active Updated Successfully!', { variant: 'success' });
|
||||
};
|
||||
|
||||
return (
|
||||
<FormProvider methods={methods}>
|
||||
<Stack spacing={3}>
|
||||
<Box sx={{ width: '100%' }}>
|
||||
{/* <Stack spacing={3}> */}
|
||||
<Card sx={{ p: 5 }}>
|
||||
<HeaderStyle>
|
||||
<Grid item xs={6} md={6}>
|
||||
<Title>Data Dokter</Title>
|
||||
</Grid>
|
||||
<Grid item xs={6} md={6}>
|
||||
{/* <Typography>Status Rumah Sakit</Typography> */}
|
||||
<RHFSwitch name="active" label="" onClick={handleActivate} />
|
||||
<StatusLabel value={values.active} />
|
||||
</Grid>
|
||||
</HeaderStyle>
|
||||
<Title variant="h5">Informasi Umum</Title>
|
||||
<Avatar
|
||||
alt="Remy Sharp"
|
||||
src={currentPractitioner?.avatar_url}
|
||||
sx={{ width: 120, height: 120, marginBottom: 2 }}
|
||||
/>
|
||||
|
||||
<Grid container rowSpacing={1} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Grid item xs={7}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Nama Dokter</Span>
|
||||
<Text>{currentPractitioner?.name ? currentPractitioner?.name : '-'}</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>No Telp</Span>
|
||||
<Text>{currentPractitioner?.phone ? currentPractitioner?.phone : '-'}</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Tempat Lahir</Span>
|
||||
<Text>
|
||||
{currentPractitioner?.birth_place ? currentPractitioner?.birth_place : '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Alamat</Span>
|
||||
<Text>{currentPractitioner?.address ? currentPractitioner?.address : '-'}</Text>
|
||||
</Grid>
|
||||
<Grid item xs={5} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Jenis Kelamin</Span>
|
||||
<Text>{currentPractitioner?.gender ? currentPractitioner?.gender : '-'}</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Email</Span>
|
||||
<Text>{currentPractitioner?.email ? currentPractitioner?.email : '-'}</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Tanggal Lahir</Span>
|
||||
<Text>
|
||||
{currentPractitioner?.birth_date ? currentPractitioner?.birth_date : '-'}
|
||||
</Text>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Card>
|
||||
<Card sx={{ p: 5, marginTop: 2 }}>
|
||||
<Title variant="h5">Tempat Praktik</Title>
|
||||
{currentPractitioner?.organizations?.map((item, index) => (
|
||||
<Box key={index} sx={{ mt: 3 }}>
|
||||
<Grid container rowSpacing={1} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Grid item xs={7}>
|
||||
<Text>{item.name}</Text>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
))}
|
||||
</Card>
|
||||
<Card sx={{ p: 5, marginTop: 2 }}>
|
||||
<Title variant="h5">Spesialisasi</Title>
|
||||
{currentPractitioner?.specialities?.map((item, index) => (
|
||||
<Box key={index} sx={{ mt: 3 }}>
|
||||
<Grid container rowSpacing={1} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Grid item xs={7}>
|
||||
<Text>{item.name}</Text>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Box>
|
||||
))}
|
||||
</Card>
|
||||
</Box>
|
||||
</Stack>
|
||||
</FormProvider>
|
||||
);
|
||||
}
|
||||
35
frontend/dashboard/src/pages/Report/Log/Index.tsx
Normal file
35
frontend/dashboard/src/pages/Report/Log/Index.tsx
Normal file
@@ -0,0 +1,35 @@
|
||||
import { Card, Grid, Container } from '@mui/material';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import HeaderBreadcrumbs from '../../../components/HeaderBreadcrumbs';
|
||||
import Page from '../../../components/Page';
|
||||
import useSettings from '../../../hooks/useSettings';
|
||||
import List from './List';
|
||||
|
||||
export default function Doctors() {
|
||||
const { themeStretch } = useSettings();
|
||||
|
||||
const { id } = useParams();
|
||||
|
||||
const pageTitle = 'Letter of Guarantee';
|
||||
return (
|
||||
<Page title={pageTitle}>
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<HeaderBreadcrumbs
|
||||
heading={pageTitle}
|
||||
links={[
|
||||
{
|
||||
name: 'Report',
|
||||
href: '#',
|
||||
},
|
||||
{
|
||||
name: 'Letter of Guarantee',
|
||||
href: '/report/logs',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
|
||||
<List />
|
||||
</Container>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
605
frontend/dashboard/src/pages/Report/Log/List.tsx
Normal file
605
frontend/dashboard/src/pages/Report/Log/List.tsx
Normal file
@@ -0,0 +1,605 @@
|
||||
// @mui
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Card,
|
||||
Collapse,
|
||||
IconButton,
|
||||
MenuItem,
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableSortLabel,
|
||||
TableRow,
|
||||
TextField,
|
||||
Typography,
|
||||
Stack,
|
||||
Menu,
|
||||
ButtonGroup,
|
||||
Link,
|
||||
Chip,
|
||||
TableHead,
|
||||
Grid,
|
||||
SvgIcon,
|
||||
} from '@mui/material';
|
||||
import UploadIcon from '@mui/icons-material/Upload';
|
||||
import CancelIcon from '@mui/icons-material/Cancel';
|
||||
import { visuallyHidden } from '@mui/utils';
|
||||
|
||||
import FindInPageOutlinedIcon from '@mui/icons-material/FindInPageOutlined';
|
||||
|
||||
|
||||
// hooks
|
||||
import React, { ChangeEvent, useEffect, useRef, useState } from 'react';
|
||||
import { Navigate, useNavigate, useSearchParams } from 'react-router-dom';
|
||||
import useSettings from '@/hooks/useSettings';
|
||||
// components
|
||||
import axios from '../../../utils/axios';
|
||||
import { LaravelPaginatedData, LaravelPaginatedDataDefault } from '../../../@types/paginated-data';
|
||||
import DataTable from '../../../components/LaravelTable';
|
||||
import { LoadingButton } from '@mui/lab';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import { fDateTimesecond } from '@/utils/formatTime';
|
||||
import { capitalizeFirstLetter } from '@/utils/formatString';
|
||||
import Label from '@/components/Label';
|
||||
import TableMoreMenu from '@/components/table/TableMoreMenu';
|
||||
import { Import } from '@/@types/claims';
|
||||
// import DialogDeleteRequestLOG from '../Request/Components/DialogDeleteRequestLOG';
|
||||
import { HeadCell, Order } from '@/@types/table';
|
||||
// import LoadingButton from '@/theme/overrides/LoadingButton';
|
||||
|
||||
export default function List() {
|
||||
const { themeColorPresets } = useSettings();
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
const [importResult, setImportResult] = useState<Import>(null);
|
||||
|
||||
const navigate = useNavigate()
|
||||
|
||||
function SearchInput(props: any) {
|
||||
// SEARCH
|
||||
const searchInput = useRef<HTMLInputElement>(null);
|
||||
const [searchText, setSearchText] = useState('');
|
||||
|
||||
const handleSearchChange = (event: any) => {
|
||||
const newSearchText = event.target.value ?? '';
|
||||
setSearchText(newSearchText);
|
||||
};
|
||||
|
||||
const handleSearchSubmit = (event: any) => {
|
||||
event.preventDefault();
|
||||
props.onSearch({ search: searchText }); // Trigger to Parent
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
// Trigger First Search
|
||||
setSearchText(searchParams.get('search') ?? '');
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSearchSubmit} style={{ width: '100%' }}>
|
||||
<TextField
|
||||
id="search-input"
|
||||
ref={searchInput}
|
||||
label="Search"
|
||||
variant="outlined"
|
||||
fullWidth
|
||||
onChange={handleSearchChange}
|
||||
value={searchText}
|
||||
placeholder='Search Code or Name...'
|
||||
/>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
function ImportForm(props: any) {
|
||||
// IMPORT
|
||||
// Create Button Menu
|
||||
const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
|
||||
const createMenu = Boolean(anchorEl);
|
||||
const importForm = useRef<HTMLInputElement>(null);
|
||||
const [currentImportFileName, setCurrentImportFileName] = useState(null);
|
||||
const [importLoading, setImportLoading] = useState(false);
|
||||
|
||||
const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
const handleClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
const handleImportButton = () => {
|
||||
if (importForm?.current) {
|
||||
handleClose();
|
||||
importForm.current ? importForm.current.click() : console.log('No File selected');
|
||||
} else {
|
||||
alert('No file selected');
|
||||
}
|
||||
};
|
||||
|
||||
const handleCancelImportButton = () => {
|
||||
importForm.current.value = '';
|
||||
importForm.current.dispatchEvent(new Event('change', { bubbles: true }));
|
||||
};
|
||||
|
||||
const handleImportChange = (event: any) => {
|
||||
if (event.target.files[0]) {
|
||||
setCurrentImportFileName(event.target.files[0].name);
|
||||
} else {
|
||||
setCurrentImportFileName(null);
|
||||
}
|
||||
};
|
||||
|
||||
const handleUpload = () => {
|
||||
if (importForm.current?.files.length) {
|
||||
const formData = new FormData();
|
||||
formData.append('file', importForm.current?.files[0]);
|
||||
|
||||
setImportLoading(true);
|
||||
axios
|
||||
.post(`customer-service/request/import`, formData)
|
||||
.then((response) => {
|
||||
handleCancelImportButton();
|
||||
loadDataTableData();
|
||||
setImportResult(response.data);
|
||||
// alert('Succesfully read '+ response.data.total_successed_row + ' with ' + response.data.total_failed_row + ' failed rows');
|
||||
setImportLoading(false);
|
||||
})
|
||||
.catch((response) => {
|
||||
enqueueSnackbar(
|
||||
'Looks like something went wrong. Please check your data and try again. ' +
|
||||
response.message,
|
||||
{ variant: 'error' }
|
||||
);
|
||||
setImportLoading(false);
|
||||
});
|
||||
} else {
|
||||
enqueueSnackbar('No File Selected', { variant: 'warning' });
|
||||
}
|
||||
};
|
||||
|
||||
const handleGetTemplate = (type :string) => {
|
||||
axios.get('corporates/import-document-example/' + type)
|
||||
.then((response) => {
|
||||
const link = document.createElement('a');
|
||||
link.href = response.data.data.file_url;
|
||||
link.setAttribute('download', response.data.data.file_name);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
handleClose();
|
||||
})
|
||||
}
|
||||
|
||||
const handleGetData = (type :string) => {
|
||||
axios.get(`customer-service/request/data`)
|
||||
.then((response) => {
|
||||
const link = document.createElement('a');
|
||||
link.href = response.data.data.file_url;
|
||||
link.setAttribute('download', response.data.data.file_name);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
handleClose();
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<input
|
||||
type="file"
|
||||
id="file"
|
||||
ref={importForm}
|
||||
style={{ display: 'none' }}
|
||||
onChange={handleImportChange}
|
||||
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, text/plain"
|
||||
/>
|
||||
{!currentImportFileName && (
|
||||
<Stack direction={'row'} spacing={2} sx={{ p: 2 }}>
|
||||
<SearchInput onSearch={applyFilter} />
|
||||
<Button
|
||||
variant="outlined"
|
||||
startIcon={<UploadIcon />}
|
||||
sx={{ p: 1.8 }}
|
||||
onClick={handleClick}
|
||||
>
|
||||
Import
|
||||
</Button>
|
||||
<Menu
|
||||
id="import-button"
|
||||
anchorEl={anchorEl}
|
||||
open={createMenu}
|
||||
onClose={handleClose}
|
||||
MenuListProps={{
|
||||
'aria-labelledby': 'basic-button',
|
||||
}}
|
||||
>
|
||||
<MenuItem onClick={handleImportButton}>Import</MenuItem>
|
||||
<MenuItem onClick={() => {handleGetTemplate('template-request-log')}}>Download Template</MenuItem>
|
||||
<MenuItem onClick={() => {handleGetData('data-request-log')}}>Download Request LOG</MenuItem>
|
||||
</Menu>
|
||||
</Stack>
|
||||
)}
|
||||
|
||||
{currentImportFileName && (
|
||||
<Stack direction={'row'} spacing={2} sx={{ p: 2 }}>
|
||||
<ButtonGroup variant="outlined" aria-label="outlined button group" fullWidth>
|
||||
<Button onClick={handleImportButton} fullWidth>
|
||||
{currentImportFileName ?? 'No File Selected'}
|
||||
</Button>
|
||||
<Button
|
||||
onClick={handleCancelImportButton}
|
||||
size="small"
|
||||
fullWidth={false}
|
||||
sx={{ p: 1.8 }}
|
||||
>
|
||||
<CancelIcon color="error" />
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
|
||||
<LoadingButton
|
||||
id="upload-button"
|
||||
variant="outlined"
|
||||
startIcon={<UploadIcon />}
|
||||
sx={{ p: 1.8 }}
|
||||
onClick={handleUpload}
|
||||
loading={importLoading}
|
||||
>
|
||||
Upload
|
||||
</LoadingButton>
|
||||
</Stack>
|
||||
)}
|
||||
|
||||
{importResult && (
|
||||
<Stack direction={'row'} sx={{ px: 2, pb: 2 }}>
|
||||
<Box sx={{ color: 'text.secondary' }}>
|
||||
Last Import Result :{' '}
|
||||
<Box sx={{ color: 'success.main', display: 'inline' }}>
|
||||
{importResult.total_success_row ?? 0}
|
||||
</Box>{' '}
|
||||
Row Processed,{' '}
|
||||
<Box sx={{ color: 'error.main', display: 'inline' }}>
|
||||
{importResult.total_failed_row}
|
||||
</Box>{' '}
|
||||
Failed, Report :{' '}
|
||||
<a href={importResult.result_file?.url ?? '#'}>
|
||||
{importResult.result_file?.name ?? '-'}
|
||||
</a>
|
||||
</Box>
|
||||
</Stack>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// Dummy Default Data
|
||||
const [dataTableIsLoading, setDataTableLoading] = useState(true);
|
||||
const [dataTableData, setDataTableData] = useState<LaravelPaginatedData>(
|
||||
LaravelPaginatedDataDefault
|
||||
);
|
||||
|
||||
const loadDataTableData = async (appliedFilter: any | null = null) => {
|
||||
setDataTableLoading(true);
|
||||
const parameters =
|
||||
Object.keys(appliedParams).length !== 0
|
||||
? appliedParams
|
||||
: Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]);
|
||||
|
||||
const response = await axios.get('/report/logs', {
|
||||
params: { ...parameters },
|
||||
});
|
||||
|
||||
setDataTableLoading(false);
|
||||
setDataTableData(response.data);
|
||||
};
|
||||
|
||||
const applyFilter = async (searchFilter: { search: string }) => {
|
||||
await loadDataTableData(searchFilter);
|
||||
setSearchParams(searchFilter);
|
||||
};
|
||||
|
||||
const handlePageChange = (event: ChangeEvent, value: number): void => {
|
||||
const filter = Object.fromEntries([...searchParams.entries(), ['page', value]]);
|
||||
loadDataTableData(filter);
|
||||
setSearchParams(filter);
|
||||
};
|
||||
|
||||
// Called on every row to map the data to the columns
|
||||
function createData(data: any): any {
|
||||
return {
|
||||
...data,
|
||||
};
|
||||
}
|
||||
|
||||
{
|
||||
/* ------------------ TABLE ROW ------------------ */
|
||||
}
|
||||
function Row(props: { row: ReturnType<typeof createData> }) {
|
||||
const { row } = props;
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const [loadingApprove, setLoadingApprove] = React.useState(false);
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<TableRow sx={{ '& > *': { borderBottom: 'unset' } }}>
|
||||
<TableCell align="left">{row.code}</TableCell>
|
||||
<TableCell align="left">{row.member_name}</TableCell>
|
||||
<TableCell align="left"><Label>{row.created_at ? fDateTimesecond(row.created_at) : '-'}</Label></TableCell>
|
||||
<TableCell align="left"><Label>{fDateTimesecond(row.submission_date)}</Label></TableCell>
|
||||
<TableCell align="left">{row.approved_by}</TableCell>
|
||||
<TableCell align="left"><Label>{row.created_final_at != null ? fDateTimesecond(row.created_final_at) : '-' }</Label></TableCell>
|
||||
<TableCell align="left"><Label>{row.approved_final_log_at ? fDateTimesecond(row.approved_final_log_at) : '-' }</Label></TableCell>
|
||||
<TableCell align="left">{row.approved_final_log_by}</TableCell>
|
||||
<TableCell align="left">{row.service_name}</TableCell>
|
||||
<TableCell align="left">{row.provider}</TableCell>
|
||||
<TableCell align="left">{row.document_qty}</TableCell>
|
||||
<TableCell align="left">{row.duration_gl}</TableCell>
|
||||
<TableCell align="left">{row.duration_final_gl}</TableCell>
|
||||
<TableCell align="left">
|
||||
{ row.status == "requested" ?
|
||||
(<Label variant='ghost' color='primary'>{capitalizeFirstLetter(row.status)}</Label>) :
|
||||
row.status == "declined" ?
|
||||
(<Label color='error'> {capitalizeFirstLetter(row.status)}</Label>)
|
||||
:
|
||||
row.status == "canceled" ?
|
||||
(<Label color='warning'> {capitalizeFirstLetter(row.status)}</Label>)
|
||||
:
|
||||
(<Label color='success'> {capitalizeFirstLetter(row.status)}</Label>)
|
||||
}
|
||||
</TableCell>
|
||||
<TableCell align="left">
|
||||
{ row.status_final_log == "requested" ?
|
||||
(<Label variant='ghost' color='primary'>{capitalizeFirstLetter(row.status_final_log)}</Label>) :
|
||||
row.status_final_log == "declined" ?
|
||||
(<Label color='error'> {capitalizeFirstLetter(row.status_final_log)}</Label>)
|
||||
:
|
||||
row.status_final_log == "canceled" ?
|
||||
(<Label color='warning'> {capitalizeFirstLetter(row.status_final_log)}</Label>)
|
||||
:
|
||||
row.status_final_log == "unknown" ?
|
||||
(<Label color='warning'> {capitalizeFirstLetter(row.status_final_log)}</Label>)
|
||||
:
|
||||
(<Label color='success'> {capitalizeFirstLetter(row.status_final_log)}</Label>)
|
||||
}
|
||||
</TableCell>
|
||||
{/* <TableCell align="right">
|
||||
<TableMoreMenu actions={
|
||||
<>
|
||||
<MenuItem onClick={() => navigate ('/custormer-service/request/detail/'+row.id+'')}>
|
||||
<FindInPageOutlinedIcon />
|
||||
Detail
|
||||
</MenuItem>
|
||||
</>
|
||||
} />
|
||||
</TableCell> */}
|
||||
</TableRow>
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
{
|
||||
/* ------------------ END TABLE ROW ------------------ */
|
||||
}
|
||||
|
||||
/* -------------------------------- headCell -------------------------------- */
|
||||
const headCells: HeadCell<never>[] = [
|
||||
{
|
||||
id: 'code',
|
||||
align: 'left',
|
||||
label: 'Code',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'name',
|
||||
align: 'left',
|
||||
label: 'Member',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'created_at',
|
||||
align: 'left',
|
||||
label: 'GL Create Time',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'submission_date',
|
||||
align: 'left',
|
||||
label: 'GL Submit Time',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'approved_by',
|
||||
align: 'left',
|
||||
label: 'GL Created by',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'name',
|
||||
align: 'left',
|
||||
label: 'FGL Create Time',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'fgl_submission_date',
|
||||
align: 'left',
|
||||
label: 'FGL Submit Time',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'service_code',
|
||||
align: 'left',
|
||||
label: 'FGL Created by',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'claim_method',
|
||||
align: 'left',
|
||||
label: 'Service',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: 'status',
|
||||
align: 'left',
|
||||
label: 'Provider',
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Document Qty ',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Duration GL ',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Duration FGL ',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Status GL ',
|
||||
isSort: false,
|
||||
},
|
||||
{
|
||||
id: '',
|
||||
align: 'left',
|
||||
label: 'Status Final GL ',
|
||||
isSort: false,
|
||||
},
|
||||
];
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
const createSortHandler = (property: string) => (event: React.MouseEvent<unknown>) => {
|
||||
handleRequestSort(event, property);
|
||||
};
|
||||
|
||||
/* ------------------------------ handle params ----------------------------- */
|
||||
const [appliedParams, setAppliedParams] = useState({});
|
||||
|
||||
const params = {
|
||||
searchParams: searchParams,
|
||||
setSearchParams: setSearchParams,
|
||||
appliedParams: appliedParams,
|
||||
setAppliedParams: setAppliedParams,
|
||||
};
|
||||
|
||||
/* ------------------------------ handle order ------------------------------ */
|
||||
const [order, setOrder] = useState<Order>('desc');
|
||||
const [orderBy, setOrderBy] = useState('submission_date');
|
||||
|
||||
const orders = {
|
||||
order: order,
|
||||
setOrder: setOrder,
|
||||
orderBy: orderBy,
|
||||
setOrderBy: setOrderBy,
|
||||
};
|
||||
|
||||
/* ------------------------------- handle sort ------------------------------ */
|
||||
const handleRequestSort = async (event: React.MouseEvent<unknown>, property: string) => {
|
||||
const isAsc = orders?.orderBy === property && orders?.order === 'asc';
|
||||
|
||||
orders?.setOrder(isAsc ? 'desc' : 'asc');
|
||||
orders?.setOrderBy(property);
|
||||
const parameters = Object.fromEntries([
|
||||
...(params?.searchParams.entries() as IterableIterator<[string, string]>),
|
||||
['order', isAsc ? 'desc' : 'asc'],
|
||||
['orderBy', property],
|
||||
]);
|
||||
params?.setAppliedParams(parameters);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
loadDataTableData();
|
||||
}, [appliedParams, searchParams, order, orderBy, setSearchParams]);
|
||||
|
||||
|
||||
function TableContent() {
|
||||
return (
|
||||
<Table aria-label="collapsible table">
|
||||
{/* ------------------ TABLE HEADER ------------------ */}
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
{headCells &&
|
||||
headCells.map((headCell, index) => (
|
||||
<TableCell
|
||||
key={index}
|
||||
sortDirection={orders?.orderBy === headCell.id ? orders.order : false}
|
||||
// @ts-ignore
|
||||
align={headCell.align}
|
||||
sx={{ padding: 2 }}
|
||||
width={headCell.width ? headCell.width : 'auto'}
|
||||
>
|
||||
{headCell.isSort ? (
|
||||
<TableSortLabel
|
||||
active={orders?.orderBy === headCell.id}
|
||||
direction={orders?.orderBy === headCell.id ? orders.order : 'asc'}
|
||||
onClick={createSortHandler(headCell.id)}
|
||||
>
|
||||
{headCell.label}
|
||||
{orders?.orderBy === headCell.id ? (
|
||||
<Box component="span" sx={visuallyHidden}>
|
||||
{orders.order === 'desc' ? 'sorted descending' : 'sorted ascending'}
|
||||
</Box>
|
||||
) : null}
|
||||
</TableSortLabel>
|
||||
) : (
|
||||
headCell.label
|
||||
)}
|
||||
</TableCell>
|
||||
))}
|
||||
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
{/* ------------------ END TABLE HEADER ------------------ */}
|
||||
|
||||
{/* ------------------ TABLE ROW ------------------ */}
|
||||
{dataTableIsLoading ? (
|
||||
<TableBody>
|
||||
<TableRow>
|
||||
<TableCell colSpan={8} align="center">
|
||||
Loading
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableBody>
|
||||
) : dataTableData.data.length === 0 ? (
|
||||
<TableBody>
|
||||
<TableRow>
|
||||
<TableCell colSpan={8} align="center">
|
||||
No Data
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableBody>
|
||||
) : (
|
||||
<TableBody>
|
||||
{dataTableData.data.map((row) => (
|
||||
<Row key={row.id} row={row} />
|
||||
))}
|
||||
</TableBody>
|
||||
)}
|
||||
{/* ------------------ END TABLE ROW ------------------ */}
|
||||
</Table>
|
||||
);
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------
|
||||
return (
|
||||
<Grid container>
|
||||
<Grid item sm={12}>
|
||||
<ImportForm />
|
||||
</Grid>
|
||||
|
||||
<Grid item sm={12}>
|
||||
<DataTable
|
||||
isLoading={dataTableIsLoading}
|
||||
lastRequest={0}
|
||||
data={dataTableData}
|
||||
handlePageChange={handlePageChange}
|
||||
TableContent={<TableContent />}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
);
|
||||
}
|
||||
53
frontend/dashboard/src/pages/Report/Log/Show.tsx
Normal file
53
frontend/dashboard/src/pages/Report/Log/Show.tsx
Normal file
@@ -0,0 +1,53 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { paramCase } from 'change-case';
|
||||
import { useParams, useLocation } from 'react-router-dom';
|
||||
// @mui
|
||||
import { Container, Stack } from '@mui/material';
|
||||
import useSettings from '../../../hooks/useSettings';
|
||||
import Page from '../../../components/Page';
|
||||
import View from './View';
|
||||
import HeaderBreadcrumbs from '../../../components/HeaderBreadcrumbs';
|
||||
import axios from '../../../utils/axios';
|
||||
import { Appointment } from '../../../@types/doctor';
|
||||
|
||||
export default function Create() {
|
||||
const { themeStretch } = useSettings();
|
||||
const { id } = useParams();
|
||||
|
||||
const isEdit = id ? true : false;
|
||||
|
||||
const [currentAppointment, setCurrentAppointment] = useState<Appointment>();
|
||||
|
||||
useEffect(() => {
|
||||
if (isEdit) {
|
||||
axios.get('/appointments/' + id).then((res) => {
|
||||
setCurrentAppointment(res.data);
|
||||
});
|
||||
}
|
||||
}, [id]);
|
||||
|
||||
return (
|
||||
<Page title="Appointment">
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<Stack direction="row" alignItems="center">
|
||||
<HeaderBreadcrumbs
|
||||
heading={!isEdit ? 'Appointment' : 'Appointment'}
|
||||
links={[
|
||||
{ name: 'Report', href: '/report' },
|
||||
{
|
||||
name: 'Appointments',
|
||||
href: '/report/appointments',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Stack>
|
||||
|
||||
<View
|
||||
// isSubmitting={isSubmitting}
|
||||
isEdit={isEdit}
|
||||
currentAppointment={currentAppointment}
|
||||
/>
|
||||
</Container>
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
275
frontend/dashboard/src/pages/Report/Log/View.tsx
Normal file
275
frontend/dashboard/src/pages/Report/Log/View.tsx
Normal file
@@ -0,0 +1,275 @@
|
||||
import * as Yup from 'yup';
|
||||
import { useSnackbar } from 'notistack';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
|
||||
import Select, { SelectChangeEvent } from '@mui/material/Select';
|
||||
import * as React from 'react';
|
||||
|
||||
// form
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { yupResolver } from '@hookform/resolvers/yup';
|
||||
// @mui
|
||||
import { styled } from '@mui/material/styles';
|
||||
import { LoadingButton } from '@mui/lab';
|
||||
import {
|
||||
Box,
|
||||
Avatar,
|
||||
Button,
|
||||
ButtonGroup,
|
||||
Card,
|
||||
FormHelperText,
|
||||
Grid,
|
||||
Stack,
|
||||
Typography,
|
||||
TextField,
|
||||
Chip,
|
||||
Badge,
|
||||
Divider,
|
||||
} from '@mui/material';
|
||||
|
||||
import CancelIcon from '@mui/icons-material/Cancel';
|
||||
|
||||
// components
|
||||
import {
|
||||
FormProvider,
|
||||
RHFTextField,
|
||||
RHFRadioGroup,
|
||||
RHFUploadAvatar,
|
||||
RHFSwitch,
|
||||
RHFEditor,
|
||||
RHFDatepicker,
|
||||
RHFMultiCheckbox,
|
||||
RHFCheckbox,
|
||||
RHFCustomMultiCheckbox,
|
||||
} from '../../../components/hook-form';
|
||||
import axios from '../../../utils/axios';
|
||||
import { fCurrency } from '../../../utils/formatNumber';
|
||||
import { Appointment } from '../../../@types/doctor';
|
||||
|
||||
import { Label, Rowing, Spa } from '@mui/icons-material';
|
||||
import { border } from '@mui/system';
|
||||
|
||||
const LabelStyle = styled(Typography)(({ theme }) => ({
|
||||
...theme.typography.subtitle2,
|
||||
color: theme.palette.text.secondary,
|
||||
marginBottom: theme.spacing(1),
|
||||
}));
|
||||
|
||||
const HeaderStyle = styled('header')(({ theme }) => ({
|
||||
paddingBottom: theme.spacing(5),
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
}));
|
||||
|
||||
const Title = styled(Typography)(({ theme }) => ({
|
||||
...theme.typography.h4,
|
||||
boxShadow: 'none',
|
||||
// paddingBottom: theme.spacing(3),
|
||||
fontWeight: 700,
|
||||
color: '#005B7F',
|
||||
}));
|
||||
|
||||
interface FormValuesProps extends Partial<Appointment> {
|
||||
taxes: boolean;
|
||||
inStock: boolean;
|
||||
}
|
||||
|
||||
type Props = {
|
||||
isEdit: boolean;
|
||||
currentAppointment?: Appointment;
|
||||
};
|
||||
|
||||
const Span = styled(Typography)(({ theme }) => ({
|
||||
boxShadow: 'none',
|
||||
paddingBottom: theme.spacing(1),
|
||||
}));
|
||||
|
||||
const Text = styled(Typography)(({ theme }) => ({
|
||||
boxShadow: 'none',
|
||||
paddingBottom: theme.spacing(3),
|
||||
}));
|
||||
|
||||
export default function AppointmentForm({ isEdit, currentAppointment }: Props) {
|
||||
const navigate = useNavigate();
|
||||
|
||||
// const [ errors, setErrors ] = useState<{ [key: string]: string }>({});
|
||||
|
||||
const { enqueueSnackbar } = useSnackbar();
|
||||
|
||||
const NewCorporateSchema = Yup.object().shape({
|
||||
name: Yup.string().required('Name is required'),
|
||||
// file: Yup.boolean().required('Corporate Status is required'),
|
||||
});
|
||||
|
||||
const defaultValues = useMemo(
|
||||
() => ({
|
||||
id: currentAppointment?.id,
|
||||
name: currentAppointment?.name || '',
|
||||
address: currentAppointment?.address || '',
|
||||
birth_date: currentAppointment?.birth_date || '',
|
||||
gender: currentAppointment?.gender || '',
|
||||
description: currentAppointment?.description || '',
|
||||
birth_place: currentAppointment?.birth_place || '',
|
||||
active: currentAppointment?.active === 1 ? true : false,
|
||||
avatar_url: currentAppointment?.avatar_url || '',
|
||||
doctor_id: currentAppointment?.doctor_id || '',
|
||||
organizations: currentAppointment?.organizations || [],
|
||||
specialities: currentAppointment?.specialities || [],
|
||||
}),
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[currentAppointment]
|
||||
);
|
||||
|
||||
const methods = useForm<FormValuesProps>({
|
||||
resolver: yupResolver(NewCorporateSchema),
|
||||
defaultValues,
|
||||
});
|
||||
|
||||
const {
|
||||
reset,
|
||||
watch,
|
||||
control,
|
||||
setValue,
|
||||
getValues,
|
||||
setError,
|
||||
handleSubmit,
|
||||
formState: { isSubmitting },
|
||||
} = methods;
|
||||
|
||||
const values = watch();
|
||||
|
||||
useEffect(() => {
|
||||
if (isEdit && currentAppointment) {
|
||||
reset(defaultValues);
|
||||
}
|
||||
if (!isEdit) {
|
||||
reset(defaultValues);
|
||||
}
|
||||
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [isEdit, currentAppointment]);
|
||||
|
||||
return (
|
||||
<FormProvider methods={methods}>
|
||||
<Stack spacing={3}>
|
||||
<Box sx={{ width: '100%' }}>
|
||||
{/* <Stack spacing={3}> */}
|
||||
<Card sx={{ p: 5 }}>
|
||||
<HeaderStyle>
|
||||
<Grid item xs={6} md={6}>
|
||||
<Stack
|
||||
direction="row"
|
||||
divider={<Divider orientation="vertical" flexItem />}
|
||||
spacing={2}
|
||||
>
|
||||
<Title>Data Appointment</Title>
|
||||
<Chip label={currentAppointment?.status} variant="outlined" />
|
||||
</Stack>
|
||||
</Grid>
|
||||
</HeaderStyle>
|
||||
|
||||
<Grid container rowSpacing={1} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Grid item xs={12}>
|
||||
<Stack direction="row" spacing={2}>
|
||||
<Grid item xs={6}>
|
||||
<Stack direction="row" spacing={2}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Tanggal Booking :</Span>
|
||||
<Text>
|
||||
{currentAppointment?.date_created ? currentAppointment?.date_created : '-'}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Stack direction="row" spacing={2}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Tanggal Appointment :</Span>
|
||||
<Text>
|
||||
{currentAppointment?.date_appointment
|
||||
? currentAppointment?.date_appointment
|
||||
: '-'}
|
||||
</Text>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Nama Dokter</Span>
|
||||
<Text>
|
||||
{currentAppointment?.doctor_name ? currentAppointment?.doctor_name : '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Faskes</Span>
|
||||
<Text>
|
||||
{currentAppointment?.health_care ? currentAppointment?.health_care : '-'}
|
||||
</Text>
|
||||
</Grid>
|
||||
<Grid item xs={6} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Spesialis</Span>
|
||||
<Text>{currentAppointment?.speciality ? currentAppointment?.speciality : '-'}</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Appointment Via Web/App</Span>
|
||||
<Text>
|
||||
{currentAppointment?.appointment_media
|
||||
? currentAppointment?.appointment_media
|
||||
: '-'}
|
||||
</Text>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Card>
|
||||
<Card sx={{ mt: 5, p: 5 }}>
|
||||
<HeaderStyle>
|
||||
<Grid item xs={6} md={6}>
|
||||
<Title>Data Pembayaran</Title>
|
||||
</Grid>
|
||||
</HeaderStyle>
|
||||
|
||||
{currentAppointment?.payment_detail !== null ? (
|
||||
<Grid container rowSpacing={1} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Grid item xs={6}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Metode Pembayaran</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_method ? currentAppointment?.payment_method : '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Harga</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_detail?.gross_amount
|
||||
? currentAppointment?.payment_detail?.gross_amount
|
||||
: '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Mata Uang</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_detail?.currency
|
||||
? currentAppointment?.payment_detail?.currency
|
||||
: '-'}
|
||||
</Text>
|
||||
</Grid>
|
||||
<Grid item xs={6} columnSpacing={{ xs: 1, sm: 2, md: 3 }}>
|
||||
<Span style={{ fontWeight: 'bold' }}>Tipe Pembayaran</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_detail?.payment_type
|
||||
? currentAppointment?.payment_detail?.payment_type
|
||||
: '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Waktu Transaksi</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_detail?.transaction_time
|
||||
? currentAppointment?.payment_detail?.transaction_time
|
||||
: '-'}
|
||||
</Text>
|
||||
<Span style={{ fontWeight: 'bold' }}>Status</Span>
|
||||
<Text>
|
||||
{currentAppointment?.payment_detail?.status_message
|
||||
? currentAppointment?.payment_detail?.status_message
|
||||
: '-'}
|
||||
</Text>
|
||||
</Grid>
|
||||
</Grid>
|
||||
) : (
|
||||
<Span>Belum ada pembayaran</Span>
|
||||
)}
|
||||
</Card>
|
||||
</Box>
|
||||
</Stack>
|
||||
</FormProvider>
|
||||
);
|
||||
}
|
||||
@@ -385,6 +385,19 @@ export default function Router() {
|
||||
element: <MasterFormulariumTemplateDetailV2 />
|
||||
},
|
||||
|
||||
{
|
||||
path: 'report/logs',
|
||||
element: <Log />,
|
||||
},
|
||||
{
|
||||
path: 'report/logs/:id',
|
||||
element: <LogCreate />,
|
||||
},
|
||||
{
|
||||
path: 'report/logs/:id/show',
|
||||
element: <LogShow />,
|
||||
},
|
||||
|
||||
{
|
||||
path: 'report/appointments',
|
||||
element: <Appointment />,
|
||||
@@ -637,6 +650,10 @@ const MasterDoctorsCreate = Loadable(lazy(() => import('../pages/Master/Doctors/
|
||||
const MasterHospitals = Loadable(lazy(() => import('../pages/Master/Hospitals/Index')));
|
||||
const MasterHospitalsCreate = Loadable(lazy(() => import('../pages/Master/Hospitals/Create')));
|
||||
|
||||
const Log = Loadable(lazy(() => import('../pages/Report/Log/Index')));
|
||||
const LogCreate = Loadable(lazy(() => import('../pages/Report/Log/Create')));
|
||||
const LogShow = Loadable(lazy(() => import('../pages/Report/Log/Show')));
|
||||
|
||||
const Appointment = Loadable(lazy(() => import('../pages/Report/Appointments/Index')));
|
||||
const AppointmentCreate = Loadable(lazy(() => import('../pages/Report/Appointments/Create')));
|
||||
const AppointmentShow = Loadable(lazy(() => import('../pages/Report/Appointments/Show')));
|
||||
|
||||
Reference in New Issue
Block a user