tbfajri/aso
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

[Clien Portal] Alarm Center - Service Monitoring

Browse Source
This commit is contained in:
Muhammad Fajar
2024-01-14 11:35:44 +07:00
parent d659e8fd4e
commit 62d5dce772
9 changed files with 698 additions and 456 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
Modules/Client/Http/Controllers/Api/CorporateMemberController.php
View File

@@ -201,15 +201,45 @@ class CorporateMemberController extends Controller
public function serviceMonitoring(int $corporate_id, int $request_log_id) public function serviceMonitoring(int $corporate_id, int $request_log_id)
{ {
// $data = Claim::where('id', $claim_id)->first();
// return $request_log_id;
$data = RequestLog::query() $data = RequestLog::query()
->with(['member' => ['currentCorporate', 'person'], 'organization', 'requestLogBenefits' => ['benefit'], 'requestLogDailyMonitorings' => ['requestLogMedicalPlans'],]) ->with([
->find($request_log_id); 'member:id,member_id,person_id,birth_date,email,name_prefix,name,name_suffix' => [
'currentCorporate',
'person:id,email,name_prefix,name,name_suffix,phone'
],
'organization:id,name',
'requestLogBenefits:id,request_log_id,benefit_id,amount_incurred,amount_approved,amount_not_approved,excess_paid,keterangan' => [
'benefit'
],
'requestLogDailyMonitorings:id,request_log_id,created_at,subject,body_temperature,sistole,diastole,respiration_rate,analysis,lab_date,provider,examination' => [
'requestLogMedicalPlans:request_log_daily_monitoring_id,plan,type'
],
'service:code,name',
])
->find($request_log_id, ['id', 'submission_date', 'discharge_date', 'member_id', 'service_code', 'organization_id']);
$dataBenefit = [];
if (count($data->requestLogBenefits) > 0) {
$totalIncurred = 0;
$totalApprove = 0;
$totalNotApporve = 0;
$totalExcess = 0;
foreach ($data->requestLogBenefits as $itemBenefit) {
$totalIncurred += $itemBenefit->amount_incurred;
$totalApprove += $itemBenefit->amount_approved;
$totalNotApporve += $itemBenefit->amount_not_approved;
$totalExcess += $itemBenefit->excess_paid;
}
$dataBenefit['totalIncurred'] = $totalIncurred;
$dataBenefit['totalApprove'] = $totalApprove;
$dataBenefit['totalNotApprove'] = $totalNotApporve;
$dataBenefit['totalExcess'] = $totalExcess;
}
$data->benefitTotal = $dataBenefit;
// return $data;
return Helper::responseJson(DataServiceMonitoring::make($data)); return Helper::responseJson(DataServiceMonitoring::make($data));
} }
} }

124
Modules/Client/Transformers/AlarmCenter/DataServiceMonitoring.php
View File

@@ -2,9 +2,8 @@
namespace Modules\Client\Transformers\AlarmCenter; namespace Modules\Client\Transformers\AlarmCenter;
use App\Helpers\Helper;
use App\Models\Service;
use Illuminate\Http\Resources\Json\JsonResource; use Illuminate\Http\Resources\Json\JsonResource;
use Illuminate\Support\Carbon;
class DataServiceMonitoring extends JsonResource class DataServiceMonitoring extends JsonResource
{ {
@@ -16,70 +15,89 @@ class DataServiceMonitoring extends JsonResource
*/ */
public function toArray($request) public function toArray($request)
{ {
$serviceData = Service::where('code', $this->service_code)->first();
if ($serviceData) {
$serviceName = $serviceData->name;
} else {
$serviceName = $this->service_cod;
}
$itemBenefits = $this->requestLogBenefits;
$dataBenefit = [];
if (count($itemBenefits)> 0){
$totalIncurred = 0;
$totalApprove = 0;
$totalNotApporve = 0;
$totalExcess = 0;
foreach($itemBenefits as $itemBenefit){
$totalIncurred += $itemBenefit->amount_incurred;
$totalApprove += $itemBenefit->amount_approved;
$totalNotApporve += $itemBenefit->amount_not_approved;
$totalExcess += $itemBenefit->excess_paid;
}
// array_push($dataBenefit, $itemBenefits);
$dataBenefit['total_incurred'] = $totalIncurred;
$dataBenefit['total_approve'] = $totalApprove;
$dataBenefit['total_not_approve'] = $totalNotApporve;
$dataBenefit['total_excess'] = $totalExcess;
}
return [ return [
'companyName' => $this->member->currentCorporate->name ?? null, 'companyName' => $this->member->currentCorporate->name ?? null,
'serviceCode' => $this->service_code ?? null,
'memberId' => $this->member->member_id ?? null, 'memberId' => $this->member->member_id ?? null,
'fullName' => $this->member->full_name ?? null, 'fullName' => $this->member->full_name ?? null,
'dateOfBirth' => $this->member->birth_date ?? null, 'dateOfBirth' => $this->member->birth_date ?? null,
'dateOfBirth' => $this->member->birth_date ?? null,
'phoneNumber' => $this->person->phone ?? null, 'phoneNumber' => $this->person->phone ?? null,
'email' => $this->member->email ?? ($this->member->person->email ?? null), 'email' => $this->member->email ?? ($this->member->person->email ?? null),
'serviceName' => $serviceName, 'serviceName' => $this->service->name ?? ($this->service_code ?? null),
'benefitName' => $this->requestLogBenefit->benefit->description ?? null, 'benefits' => collect($this->requestLogBenefits)->map(function ($requestLogBenefit) {
'benefit' => $itemBenefits ?? null, return [
'benefitTotal' => $dataBenefit ?? null, 'amountIncurred' => $requestLogBenefit->amount_incurred,
'amountApproved' => $requestLogBenefit->amount_approved,
'amountNotAprroved' => $requestLogBenefit->amount_not_approved,
'excessPaid' => $requestLogBenefit->excess_paid,
'description' => $requestLogBenefit->keterangan,
'name' => $requestLogBenefit->benefit->description,
];
})->all() ?? null,
'benefitTotal' => $this->benefitTotal ?? null,
'hospital' => $this->organization->name ?? null, 'hospital' => $this->organization->name ?? null,
'admissionDate' => $this->submission_date ?? null, 'admissionDate' => $this->submission_date ?? null,
'dischargeDate' => $this->discharge_date ?? null, 'dischargeDate' => $this->discharge_date ?? null,
'dailyMonitorings' => $this->when($this->service_code === 'IP', collect($this->requesLogDailyMonitorings)->map(function ($requesLogDailyMonitoring) { 'dailyMonitorings' => $this->when($this->service_code === 'IP', collect($this->requestLogDailyMonitorings)
->groupBy(function ($requestLogDailyMonitoring) {
return $requestLogDailyMonitoring->created_at->format('d M Y');
})
->map(function ($groupedItems) {
return collect($groupedItems)
->map(function ($requestLogDailyMonitoring) {
return [ return [
'date' => Helper::formatDateOnly($requesLogDailyMonitoring->created_at) ?? null, 'time' => $requestLogDailyMonitoring->created_at->format('H:i') ?? null,
'time' => Helper::formatTimeOnly($requesLogDailyMonitoring->created_at) ?? null,
'status' => 'Done' ?? null, 'status' => 'Done' ?? null,
'subject' => $requesLogDailyMonitoring->subject ?? null, 'subject' => $requestLogDailyMonitoring->subject ?? null,
'bodyTemperature' => $requesLogDailyMonitoring->body_temperature ?? null, 'bodyTemperature' => $requestLogDailyMonitoring->body_temperature ?? null,
'sistole' => $requesLogDailyMonitoring->sistole . 'mm[Hg]' ?? null, 'sistole' => $requestLogDailyMonitoring->sistole . 'mm[Hg]' ?? null,
'diastole' => $requesLogDailyMonitoring->diastole . 'mm[Hg]' ?? null, 'diastole' => $requestLogDailyMonitoring->diastole . 'mm[Hg]' ?? null,
'respirationRate' => $requesLogDailyMonitoring->respiration_rate . '/min' ?? null, 'respirationRate' => $requestLogDailyMonitoring->respiration_rate . '/min' ?? null,
'analysis' => $requesLogDailyMonitoring->analysis ?? null, 'analysis' => $requestLogDailyMonitoring->analysis ?? null,
'plan' => collect($requesLogDailyMonitoring->requestLogMedicalPlans)->map(function ($requestLogMedicalPlan) { 'complaints' => $requestLogDailyMonitoring->complaints ?? null,
return $requestLogMedicalPlan->type == 1 ? $requestLogMedicalPlan->plan : null; 'plans' => $this->when($requestLogDailyMonitoring->requestLogMedicalPlans, collect($requestLogDailyMonitoring->requestLogMedicalPlans)
})->all(), ->map(function ($requestLogMedicalPlan) {
return [
'type' => $requestLogMedicalPlan->type,
'plan' => $requestLogMedicalPlan->plan
]; ];
})->all()), })
// 'laboratoriumResults' => collect($this->dailyMonitorings)->map(function ($dailyMonitoring) { ->sortBy('type')
// $data['date'][Helper::formatDateOnly($dailyMonitoring->created_at)] ->all()) ?? null,
// })->all() ?? null ];
})
->sortByDesc(function ($item) {
return $item['time'];
})
->values();
})
->sortByDesc(function ($groupedItems, $date) {
return Carbon::createFromFormat('d M Y', $date)->format('Y-m-d');
})
->all()) ?? null,
'laboratoriumResults' => $this->whenLoaded('requestLogDailyMonitorings', collect($this->requestLogDailyMonitorings)
->groupBy(function ($requestLogDailyMonitoring) {
return Carbon::parse($requestLogDailyMonitoring->lab_date)->format('d M Y');
})
->map(function ($groupedItems) {
return collect($groupedItems)
->map(function ($requestLogDailyMonitoring) {
return [
'code' => $requestLogDailyMonitoring->code,
'date' => Carbon::parse($requestLogDailyMonitoring->lab_date)->format('d M Y') ?? null,
'examination' => $requestLogDailyMonitoring->examination ?? null,
'location' => $requestLogDailyMonitoring->provider ?? null,
];
})
->sortByDesc(function ($item) {
return $item['code'];
})
->values();
})
->sortByDesc(function ($groupedItems, $date) {
return Carbon::createFromFormat('d M Y', $date)->format('Y-m-d');
})
->all()) ?? null
]; ];
} }
} }

28
app/Models/Member.php
View File

@@ -394,22 +394,22 @@ class Member extends Model
// ); // );
// } // }
protected function corporateLogo(): Attribute // protected function corporateLogo(): Attribute
{ // {
$avatar = null; // $avatar = null;
if ($this->relationLoaded('currentPolicy')) { // if ($this->relationLoaded('currentPolicy')) {
$corporateId = $this->currentPolicy->corporate->id; // $corporateId = $this->currentPolicy->corporate->id;
$avatar = File::where(['type' => 'avatar', 'fileable_id' => $corporateId]) // $avatar = File::where(['type' => 'avatar', 'fileable_id' => $corporateId])
->orderBy('id', 'desc') // ->orderBy('id', 'desc')
->first(); // ->first();
} // }
$path = $avatar ? $_ENV['LMS_APP_STORAGE'] . $avatar->path : ''; // $path = $avatar ? $_ENV['LMS_APP_STORAGE'] . $avatar->path : '';
return Attribute::make( // return Attribute::make(
get: fn () => $path // get: fn () => $path
); // );
} // }
/* -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- */
} }

5
app/Models/RequestLog.php
View File

@@ -241,11 +241,6 @@ class RequestLog extends Model
return $this->belongsTo(Service::class, 'service_code', 'code'); return $this->belongsTo(Service::class, 'service_code', 'code');
} }
public function requestLogBenefit()
{
return $this->hasOne(RequestLogBenefit::class, 'request_log_id');
}
public function requestLogBenefits() public function requestLogBenefits()
{ {
return $this->hasMany(RequestLogBenefit::class, 'request_log_id'); return $this->hasMany(RequestLogBenefit::class, 'request_log_id');

2
app/Models/RequestLogBenefit.php
View File

@@ -31,6 +31,6 @@ class RequestLogBenefit extends Model
public function requestLog() public function requestLog()
{ {
return $this->belongsTo(RequestLog::class, 'aa'); return $this->belongsTo(RequestLog::class);
} }
} }

10
app/Models/RequestLogDailyMonitoring.php
View File

@@ -2,6 +2,7 @@
namespace App\Models; namespace App\Models;
use Illuminate\Database\Eloquent\Casts\Attribute;
use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\Model;
@@ -18,4 +19,13 @@ class RequestLogDailyMonitoring extends Model
{ {
return $this->hasMany(RequestLogMedicalPlan::class); return $this->hasMany(RequestLogMedicalPlan::class);
} }
/* -------------------------------------------------------------------------- */
protected function code(): Attribute
{
return Attribute::make(
get: fn ($value, $attributes) => 'RE-' . str_pad($attributes['id'], 3, '0', STR_PAD_LEFT),
);
}
} }

2
app/Models/RequestLogMedicalPlan.php
View File

@@ -9,6 +9,8 @@ class RequestLogMedicalPlan extends Model
{ {
use HasFactory; use HasFactory;
protected $table = 'request_log_medical_plan';
public function requestLogDailyMonitoring() public function requestLogDailyMonitoring()
{ {
return $this->belongsTo(RequestLogDailyMonitoring::class); return $this->belongsTo(RequestLogDailyMonitoring::class);

4
app/Providers/AppServiceProvider.php
View File

@@ -48,7 +48,7 @@ class AppServiceProvider extends ServiceProvider
{ {
Schema::defaultStringLength(191); Schema::defaultStringLength(191);
Str::macro('initials', fn($value, $sep = ' ', $glue = '') => trim(collect(explode($sep, $value))->map(function ($segment) { Str::macro('initials', fn ($value, $sep = ' ', $glue = '') => trim(collect(explode($sep, $value))->map(function ($segment) {
return $segment[0] ?? ''; return $segment[0] ?? '';
})->join($glue))); })->join($glue)));
@@ -179,8 +179,6 @@ class AppServiceProvider extends ServiceProvider
}); });
Sanctum::usePersonalAccessTokenModel(PersonalAccessToken::class); Sanctum::usePersonalAccessTokenModel(PersonalAccessToken::class);
} }
private function logAuditTrail($model, $action) private function logAuditTrail($model, $action)

603
frontend/client-portal/src/pages/AlarmCenter/ServiceMonitoring.tsx
View File

@@ -14,9 +14,15 @@ import {
TableRow, TableRow,
MenuItem, MenuItem,
Skeleton, Skeleton,
List,
ListSubheader,
ListItem,
ListItemText,
ListItemButton,
Divider,
} from '@mui/material'; } from '@mui/material';
import { styled } from '@mui/material/styles'; import { styled } from '@mui/material/styles';
import DownloadIcon from '@mui/icons-material/Download'; import { Download as DownloadIcon, Circle as CircleIcon } from '@mui/icons-material';
// components // components
import Page from '../../components/Page'; import Page from '../../components/Page';
// utils // utils
@@ -55,11 +61,7 @@ function TabPanel(props: TabPanelProps) {
aria-labelledby={`simple-tab-${index}`} aria-labelledby={`simple-tab-${index}`}
{...other} {...other}
> >
{value === index && ( {value === index && children}
<Box sx={{ p: 3 }}>
<Typography>{children}</Typography>
</Box>
)}
</div> </div>
); );
} }
@@ -115,6 +117,7 @@ const StyledTab = styled((props: StyledTabProps) => <Tab disableRipple {...props
type ServiceMonitoringProps = { type ServiceMonitoringProps = {
companyName: string; companyName: string;
serviceCode: string;
memberId: string; memberId: string;
fullName: string; fullName: string;
dateOfBirth: string; dateOfBirth: string;
@@ -125,16 +128,52 @@ type ServiceMonitoringProps = {
mainDiagnose: string; mainDiagnose: string;
comparativeDiagnosis: string; comparativeDiagnosis: string;
serviceName: string; serviceName: string;
benefitName: string; benefits: {
amountIncurred: number;
amountApproved: number;
amountNotAprroved: number;
excessPaid: number;
description: string;
name: string;
}[];
hospital: string; hospital: string;
admissionDate: string; admissionDate: string;
dischargeDate: string; dischargeDate: string;
dailyMonitorings: Record<
string,
Array<{
time: string;
status: string;
subject: string;
bodyTemperature: string;
sistole: string;
diastole: string;
respirationRate: string;
analysis: string;
complaints: string;
plans: {
type: number;
plan: string;
}[];
}>
>;
laboratoriumResults: Record<
string,
Array<{
code: string;
date: string;
examination: string;
location: string;
}>
>;
}; };
export default function ServiceMonitoring() { export default function ServiceMonitoring() {
const navigate = useNavigate(); const navigate = useNavigate();
const controller = new AbortController();
const [value, setValue] = useState(0); const [value, setValue] = useState(0);
const [loading, setLoading] = useState(false);
const handleChange = (event: SyntheticEvent, newValue: number) => { const handleChange = (event: SyntheticEvent, newValue: number) => {
setValue(newValue); setValue(newValue);
}; };
@@ -146,26 +185,35 @@ export default function ServiceMonitoring() {
useEffect(() => { useEffect(() => {
(async () => { (async () => {
const response = await axios.get(`${corporateValue}/service-monitoring/${requestLogId}`); try {
setData(response.data.data); setLoading(true);
})();
}, [corporateValue]);
function handleDownloadClick(fileUrl: string) { const response = await axios.get(`${corporateValue}/service-monitoring/${requestLogId}`, {
const tempLink = document.createElement('a'); signal: controller.signal,
tempLink.href = fileUrl; });
tempLink.setAttribute('download', 'nama-file-yang-diunduh.pdf'); // Ganti 'nama-file-yang-diunduh.pdf' sesuai kebutuhan
tempLink.style.display = 'none'; setData(response.data.data);
document.body.appendChild(tempLink);
tempLink.click(); if (response.data.data.serviceCode !== 'IP') {
document.body.removeChild(tempLink); setValue(1);
} }
} catch (error: any) {
console.error('Error fetching data:', error.message);
} finally {
setLoading(false);
}
})();
return () => {
controller.abort();
};
}, [corporateValue]);
return ( return (
<Page title="Service Monitoring"> <Page title="Service Monitoring">
<Grid container spacing={3} paddingX={2} sx={{ marginBottom: 5, marginTop: 1 }}> <Grid container spacing={3} paddingX={2} sx={{ marginBottom: 5, marginTop: 1 }}>
<Grid item xs={12} paddingX="24px"> <Grid item xs={12} paddingX="24px">
<Stack direction="row" alignItems="center"> <Stack direction="row" alignItems="center" gap={3} marginLeft={1.5}>
<ArrowBackIosIcon <ArrowBackIosIcon
onClick={() => navigate(`/alarm-center/member/${memberId}}`)} onClick={() => navigate(`/alarm-center/member/${memberId}}`)}
sx={{ cursor: 'pointer' }} sx={{ cursor: 'pointer' }}
@@ -182,26 +230,24 @@ export default function ServiceMonitoring() {
<Grid container spacing={5}> <Grid container spacing={5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography component={'h6'} fontWeight={700} fontSize={18}> <Typography component={'h6'} fontWeight={700} fontSize={18}>
{data ? 'Employee Profile' : <Skeleton animation="wave" width={175} />} {loading ? <Skeleton animation="wave" width={175} /> : 'Employee Profile'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12} container spacing={3}> <Grid item xs={12} container spacing={3}>
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Company Name' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Company Name'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.companyName ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.companyName ? (
data.companyName data.companyName
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -209,19 +255,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Member ID' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Member ID'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.memberId ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.memberId ? (
data.memberId data.memberId
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -229,19 +273,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Full Name' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Full Name'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.fullName ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.fullName ? (
data.fullName data.fullName
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -249,19 +291,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Date of Birth' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Date of Birth'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.dateOfBirth ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.dateOfBirth ? (
fDateBirth(data.dateOfBirth) fDateBirth(data.dateOfBirth)
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -269,19 +309,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Phone Number' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Phone Number'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.phoneNumber ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.phoneNumber ? (
data.phoneNumber data.phoneNumber
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -289,19 +327,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} md={6} spacing={1.5}> <Grid item container xs={12} md={6} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Date of Birth' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Email'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.email ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.email ? (
data.email data.email
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -311,31 +347,29 @@ export default function ServiceMonitoring() {
</Card> </Card>
</Grid> </Grid>
<Grid item container xs={12} spacing={5}> <Grid item container xs={12} spacing={5}>
<Grid item container xs={6}> <Grid item container xs={12} md={6}>
<Card sx={{ borderRadius: 2, padding: 3 }}> <Card sx={{ borderRadius: 2, padding: 3 }}>
<Grid container spacing={5}> <Grid container spacing={5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography component={'h6'} fontWeight={700} fontSize={18}> <Typography component={'h6'} fontWeight={700} fontSize={18}>
{data ? 'Diagnose Summary' : <Skeleton animation="wave" width={175} />} {loading ? <Skeleton animation="wave" width={175} /> : 'Diagnose Summary'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12} container spacing={3}> <Grid item xs={12} container spacing={3}>
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Symptoms' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Symptoms'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.symptoms ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.symptoms ? (
data.symptoms data.symptoms
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -343,19 +377,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Sign' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Sign'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.sign ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.sign ? (
data.sign data.sign
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -363,19 +395,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Main Diagnose' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Main Diagnose'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.mainDiagnose ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.mainDiagnose ? (
data.mainDiagnose data.mainDiagnose
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -383,23 +413,21 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? ( {loading ? (
'Comparative Diagnosis'
) : (
<Skeleton animation={'wave'} width={200} /> <Skeleton animation={'wave'} width={200} />
) : (
'Comparative Diagnosis'
)} )}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.comparativeDiagnosis ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.comparativeDiagnosis ? (
data.comparativeDiagnosis data.comparativeDiagnosis
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -408,71 +436,154 @@ export default function ServiceMonitoring() {
</Grid> </Grid>
</Card> </Card>
</Grid> </Grid>
<Grid item container xs={6}> <Grid item container xs={12} md={6}>
<Card sx={{ borderRadius: 2, padding: 3 }}> <Card sx={{ borderRadius: 2, padding: 3 }}>
<Grid container spacing={5}> <Grid container spacing={5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography component={'h6'} fontWeight={700} fontSize={18}> <Typography component={'h6'} fontWeight={700} fontSize={18}>
{data ? 'Services' : <Skeleton animation="wave" width={175} />} {loading ? <Skeleton animation="wave" width={175} /> : 'Services'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12} container spacing={3}> <Grid item xs={12} container spacing={3}>
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Service Name' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Service Name'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.serviceName ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.serviceName ? (
data.serviceName data.serviceName
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
</Grid> </Grid>
<Grid item container spacing={1.5}>
<Grid item>
<Typography variant="subtitle2" color={'grey.600'}>
{loading ? <Skeleton animation={'wave'} width={200} /> : 'Benefits'}
</Typography>
</Grid>
<Grid item container>
<Grid item>
{loading ? (
<Skeleton animation="wave" width={300} />
) : data && data.benefits && data.benefits.length > 0 ? (
data.benefits.map((benefitValue, benefitIndex) => (
<List
subheader={
<ListSubheader>
<Typography variant="subtitle2" color={'grey.700'}>
{benefitIndex + 1 + `. ` + benefitValue.name}
</Typography>
</ListSubheader>
}
key={benefitIndex}
>
<ListItem sx={{ paddingLeft: 4 }}>
<ListItemText>
<Typography
variant="subtitle2"
color={'grey.900'}
component={'div'}
display="flex"
alignItems={'center'}
gap={1}
>
<CircleIcon sx={{ width: 8 }} />
Amount Incurred : {benefitValue.amountApproved}
</Typography>
</ListItemText>
</ListItem>
<ListItem sx={{ paddingLeft: 4 }}>
<ListItemText>
<Typography
variant="subtitle2"
color={'grey.900'}
component={'div'}
display="flex"
alignItems={'center'}
gap={1}
>
<CircleIcon sx={{ width: 8 }} />
Amount Approved : {benefitValue.amountApproved}
</Typography>
</ListItemText>
</ListItem>
<ListItem sx={{ paddingLeft: 4 }}>
<ListItemText>
<Typography
variant="subtitle2"
color={'grey.900'}
component={'div'}
display="flex"
alignItems={'center'}
gap={1}
>
<CircleIcon sx={{ width: 8 }} />
Amount Not Approved : {benefitValue.amountNotAprroved}
</Typography>
</ListItemText>
</ListItem>
<ListItem sx={{ paddingLeft: 4 }}>
<ListItemText>
<Typography
variant="subtitle2"
color={'grey.900'}
component={'div'}
display="flex"
alignItems={'center'}
gap={1}
>
<CircleIcon sx={{ width: 8 }} />
Excess Paid : {benefitValue.excessPaid}
</Typography>
</ListItemText>
</ListItem>
<ListItem sx={{ paddingLeft: 4 }}>
<ListItemText>
<Typography
variant="subtitle2"
color={'grey.900'}
component={'div'}
display="flex"
alignItems={'center'}
gap={1}
>
<CircleIcon sx={{ width: 8 }} />
Description : {benefitValue.description}
</Typography>
</ListItemText>
</ListItem>
</List>
))
) : (
<Typography variant="subtitle1" color={'grey.800'}>
-
</Typography>
)}
</Grid>
</Grid>
</Grid>
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Benefit Name' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Hospital'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.benefitName ? (
data.benefitName
) : (
'-'
)
) : (
<Skeleton animation={'wave'} width={300} /> <Skeleton animation={'wave'} width={300} />
)} ) : data && data.hospital ? (
</Typography>
</Grid>
</Grid>
<Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Hospital' : <Skeleton animation={'wave'} width={200} />}
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}>
{data ? (
data.hospital ? (
data.hospital data.hospital
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -480,19 +591,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Admission Date' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Admission Date'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.admissionDate ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.admissionDate ? (
fDateSuffix(data.admissionDate) fDateSuffix(data.admissionDate)
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -500,19 +609,17 @@ export default function ServiceMonitoring() {
<Grid item container xs={12} spacing={1.5}> <Grid item container xs={12} spacing={1.5}>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle2" color={'grey.600'}> <Typography variant="subtitle2" color={'grey.600'}>
{data ? 'Discharge Date' : <Skeleton animation={'wave'} width={200} />} {loading ? <Skeleton animation={'wave'} width={200} /> : 'Discharge Date'}
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={12}> <Grid item xs={12}>
<Typography variant="subtitle1" color={'grey.800'}> <Typography variant="subtitle1" color={'grey.800'}>
{data ? ( {loading ? (
data.dischargeDate ? ( <Skeleton animation={'wave'} width={300} />
) : data && data.dischargeDate ? (
fDateSuffix(data.dischargeDate) fDateSuffix(data.dischargeDate)
) : ( ) : (
'-' '-'
)
) : (
<Skeleton animation={'wave'} width={300} />
)} )}
</Typography> </Typography>
</Grid> </Grid>
@@ -523,6 +630,21 @@ export default function ServiceMonitoring() {
</Grid> </Grid>
</Grid> </Grid>
<Grid item xs={12} lg={12} md={12}> <Grid item xs={12} lg={12} md={12}>
{loading ? (
<Card sx={{ borderRadius: '16px', padding: '24px' }}>
<Grid container>
<Grid item xs={2}>
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
</Grid>
<Grid item xs={2}>
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
</Grid>
<Grid item xs={12} paddingTop={2}>
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
</Grid>
</Grid>
</Card>
) : (
<Card sx={{ borderRadius: '16px', padding: '24px' }}> <Card sx={{ borderRadius: '16px', padding: '24px' }}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}> <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<StyledTabs value={value} onChange={handleChange} aria-label="basic tabs example"> <StyledTabs value={value} onChange={handleChange} aria-label="basic tabs example">
@@ -531,61 +653,75 @@ export default function ServiceMonitoring() {
</StyledTabs> </StyledTabs>
</Box> </Box>
<TabPanel value={value} index={0}> <TabPanel value={value} index={0}>
<Grid container> <Grid item xs={12} md={12} padding={data && data.dailyMonitorings ? 0 : 3}>
<Grid item xs={12} md={12}> {data && data.dailyMonitorings ? (
<Timeline <Timeline
sx={{ sx={{
gap: 2,
paddingY: 2,
paddingX: 1.5,
[`& .${timelineItemClasses.root}:before`]: { [`& .${timelineItemClasses.root}:before`]: {
flex: 0, flex: 0,
padding: 0, padding: 0,
}, },
}} }}
> >
{/* {data?.dialy_monitoring.length > 0 ? ( {data &&
data?.dialy_monitoring.map((row, index) => ( data.dailyMonitorings &&
<TimelineItem key={index}> Object.keys(data.dailyMonitorings).length > 0 &&
Object.keys(data.dailyMonitorings).map((date, dateIndex) => (
<TimelineItem key={dateIndex}>
<TimelineSeparator> <TimelineSeparator>
<TimelineDot /> <TimelineDot />
<TimelineConnector <TimelineConnector />
sx={{
border: '0.5px dashed rgba(145, 158, 171, 0.32)',
backgrounSize: '4px 4px',
}}
/>
</TimelineSeparator> </TimelineSeparator>
<TimelineContent> <TimelineContent
<Typography variant="h5" sx={{ marginBottom: 2 }}> sx={{
{' '} '&.MuiTimelineContent-root': {
{row.date ? fDateSuffix(row.date) : '-'} paddingX: 2,
},
}}
>
<Typography variant="subtitle1" marginBottom={2}>
{date ? date : '-'}
</Typography> </Typography>
<Card sx={{ paddinX: 2, paddingY: 2 }}> {data.dailyMonitorings[date].map(
(dailyMonitoring, dailyMonitoringIndex) => (
<Card
key={dailyMonitoringIndex}
sx={{
padding: 3,
marginBottom:
dailyMonitoringIndex !==
data.dailyMonitorings[date].length - 1
? 2
: 0,
}}
>
<Stack <Stack
direction={'row'} direction={'row'}
sx={{ sx={{
alignItems: 'center', alignItems: 'center',
padding: 2,
justifyContent: 'space-between', justifyContent: 'space-between',
}} }}
> >
<Label> {row.time} </Label> <Label>
{dailyMonitoring.time ? dailyMonitoring.time : '-'}
</Label>
<Label color="success" sx={{ marginRight: 0 }}> <Label color="success" sx={{ marginRight: 0 }}>
{' '} {dailyMonitoring.status ? dailyMonitoring.status : '-'}
{row.status}{' '}
</Label> </Label>
</Stack> </Stack>
<hr <Divider sx={{ marginY: 2 }} />
style={{
margin: 10,
marginLeft: 15,
marginRight: 15,
color: 'rgba(145, 158, 171, 0.32)',
}}
/>
<Stack spacing={3} sx={{ paddingY: 1, paddingX: 3 }}> <Stack spacing={3} sx={{ paddingY: 1, paddingX: 3 }}>
<Grid item xs={12} lg={12} md={12}> <Grid item xs={12} lg={12} md={12}>
<Stack spacing={1}> <Stack spacing={1}>
<Typography variant="h6">Subject</Typography> <Typography variant="h6">Subject</Typography>
<Typography variant="inherit">{row.subject_title}</Typography> <Typography variant="inherit">
{dailyMonitoring.subject
? dailyMonitoring.subject
: '-'}
</Typography>
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={12} lg={12} md={12}> <Grid item xs={12} lg={12} md={12}>
@@ -597,13 +733,17 @@ export default function ServiceMonitoring() {
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}> <Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="inherit">Body Temperature</Typography> <Typography variant="inherit">
Body Temperature
</Typography>
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="subtitle1"> <Typography variant="subtitle1">
{row.body_temperature} {dailyMonitoring.bodyTemperature
? dailyMonitoring.bodyTemperature
: '-'}
</Typography> </Typography>
</Stack> </Stack>
</Grid> </Grid>
@@ -616,7 +756,11 @@ export default function ServiceMonitoring() {
</Grid> </Grid>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="subtitle1">{row.sistole}</Typography> <Typography variant="subtitle1">
{dailyMonitoring.sistole
? dailyMonitoring.sistole
: '-'}
</Typography>
</Stack> </Stack>
</Grid> </Grid>
</Stack> </Stack>
@@ -628,20 +772,44 @@ export default function ServiceMonitoring() {
</Grid> </Grid>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="subtitle1">{row.diastole}</Typography> <Typography variant="subtitle1">
{dailyMonitoring.diastole
? dailyMonitoring.diastole
: '-'}
</Typography>
</Stack> </Stack>
</Grid> </Grid>
</Stack> </Stack>
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}> <Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="inherit">Respiration Rate</Typography> <Typography variant="inherit">
Respiration Rate
</Typography>
</Stack> </Stack>
</Grid> </Grid>
<Grid item xs={6} lg={6} md={6}> <Grid item xs={6} lg={6} md={6}>
<Stack> <Stack>
<Typography variant="subtitle1"> <Typography variant="subtitle1">
{row.respiration_rate} {dailyMonitoring.respirationRate
? dailyMonitoring.respirationRate
: '-'}
</Typography>
</Stack>
</Grid>
</Stack>
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
<Grid item xs={6} lg={6} md={6}>
<Stack>
<Typography variant="inherit">Complaints</Typography>
</Stack>
</Grid>
<Grid item xs={6} lg={6} md={6}>
<Stack>
<Typography variant="subtitle1">
{dailyMonitoring.complaints
? dailyMonitoring.complaints
: '-'}
</Typography> </Typography>
</Stack> </Stack>
</Grid> </Grid>
@@ -655,7 +823,9 @@ export default function ServiceMonitoring() {
<Grid item xs={12} lg={12} md={12}> <Grid item xs={12} lg={12} md={12}>
<Stack> <Stack>
<Typography variant="inherit"> <Typography variant="inherit">
{row.analisis_title} {dailyMonitoring.analysis
? dailyMonitoring.analysis
: '-'}
</Typography> </Typography>
</Stack> </Stack>
</Grid> </Grid>
@@ -668,97 +838,116 @@ export default function ServiceMonitoring() {
<Stack direction={'row'} spacing={2}> <Stack direction={'row'} spacing={2}>
<Grid item xs={12} lg={12} md={12}> <Grid item xs={12} lg={12} md={12}>
<Stack marginLeft={5}> <Stack marginLeft={5}>
<ul> {data.dailyMonitorings ? (
{row.Perencanaan.length > 0 ? ( <ul style={{ listStyleType: 'disc' }}>
row.Perencanaan.map((r, index) => ( {dailyMonitoring.plans.length > 0 &&
<li key={index}>{r}</li> dailyMonitoring.plans.map((plan, planIndex) => (
)) <li key={planIndex}>{plan.plan}</li>
) : ( ))}
<li>-</li>
)}
</ul> </ul>
) : (
'-'
)}
</Stack> </Stack>
</Grid> </Grid>
</Stack> </Stack>
</Grid> </Grid>
</Stack> </Stack>
</Card> </Card>
)
)}
</TimelineContent> </TimelineContent>
</TimelineItem> </TimelineItem>
)) ))}
) : (
<Typography variant="subtitle1">No Data Found</Typography>
)} */}
No Data Found
</Timeline> </Timeline>
</Grid> ) : (
<Typography variant="subtitle1" textAlign={'center'}>
No Data Found
</Typography>
)}
</Grid> </Grid>
</TabPanel> </TabPanel>
<TabPanel value={value} index={1}> <TabPanel value={value} index={1}>
<Grid container> <Grid item xs={12} padding={data && data.laboratoriumResults ? 0 : 3}>
<Grid item xs={12} md={12}> {data &&
{/* {data?.laboratorium_result.length > 0 ? ( data.laboratoriumResults &&
data?.laboratorium_result.map((row, index) => ( Object.keys(data.laboratoriumResults).length > 0 ? (
<Card sx={{ paddinX: 2, paddingY: 2, paddingX: 1, marginTop: 2 }} key={index}> Object.keys(data.dailyMonitorings).map((date, dateIndex) => (
<Stack paddingX={5}> <Card
<Typography variant="subtitle1"> sx={{
{row[index]?.datetime ? fDateSuffix(row[index].datetime) : ''} padding: 3,
</Typography> border: '1px solid #919EAB52',
{row.length > 0 ? ( boxShadow: 'none',
row.map((list, i) => ( marginTop: 5,
<Card key={i} sx={{ marginTop: 2, paddingX: 2, paddingY: 2 }}> }}
<Label> {list.reimbursement_code}</Label> key={dateIndex}
>
<Stack>
<Typography variant="subtitle1">{date ? date : '-'}</Typography>
{data.laboratoriumResults[date].map(
(laboratoriumResult, laboratoriumResultIndex) => (
<Card
key={laboratoriumResultIndex}
sx={{ marginTop: 3, paddingX: 2.5, paddingY: 2 }}
>
<Label>
{laboratoriumResult.code ? laboratoriumResult.code : '-'}
</Label>
<Table sx={{ marginY: 2 }}> <Table sx={{ marginY: 2 }}>
<TableHead> <TableHead>
<TableRow> <TableRow>
<TableCell>Date</TableCell> <TableCell>Date</TableCell>
<TableCell>Examination</TableCell> <TableCell>Examination</TableCell>
<TableCell>Location</TableCell> <TableCell>Location</TableCell>
<TableCell /> {/* <TableCell /> */}
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody>
<TableRow> <TableRow>
<TableCell> <TableCell>
<Label> <Label>
{' '} {laboratoriumResult.date ? laboratoriumResult.date : '-'}
{list.datetime ? fDateTime(list.datetime) : '-'}
</Label> </Label>
</TableCell> </TableCell>
<TableCell>{list.examination}</TableCell> <TableCell>
<TableCell>{list.location}</TableCell> {laboratoriumResult.examination
<TableMoreMenu ? laboratoriumResult.examination
: '-'}
</TableCell>
<TableCell>
{laboratoriumResult.location
? laboratoriumResult.location
: '-'}
</TableCell>
{/* <TableMoreMenu
actions={ actions={
<> <>
<MenuItem <MenuItem
onClick={() => handleDownloadClick(list.file)} onClick={() => handleDownloadClick(laboratoriumResult.file)}
> >
<DownloadIcon /> <DownloadIcon />
Download Download
</MenuItem> </MenuItem>
</> </>
} }
/> /> */}
</TableRow> </TableRow>
</TableBody> </TableBody>
</Table> </Table>
</Card> </Card>
)) )
) : (
<Typography variant="subtitle1">Data Not Found</Typography>
)} )}
</Stack> </Stack>
</Card> </Card>
)) ))
) : ( ) : (
<Typography variant="subtitle1">Data Not Found</Typography> <Typography variant="subtitle1">Data Not Found</Typography>
)} */} )}
Data Not Found
</Grid>
</Grid> </Grid>
</TabPanel> </TabPanel>
</Card> </Card>
)}
</Grid> </Grid>
</Grid> </Grid>
</Page> </Page>