cleanup source detail page (#500)

- hide image if there is no brand
- show complete address
- use the source id instead of endpoint_id in breadcrumbs

Co-authored-by: Jason Kulatunga <jason@thesparktree.com>
This commit is contained in:
David Radcliffe 2024-08-13 03:06:39 -04:00 committed by GitHub
parent 860c5836e8
commit 7d07157550
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 6 deletions

View File

@ -4,10 +4,9 @@
<div class="az-content-body"> <div class="az-content-body">
<div class="panel panel-default patient col-xs-12"> <div class="panel panel-default patient col-xs-12">
<div class="row"> <div class="row">
<div class="col-xs-2 col-sm-2 col-md-1"> <div *ngIf="isExternal()" class="col-xs-2 col-sm-2 col-md-1">
<div class=""> <div class="">
<div class="patient-image-wrap embed-responsive-item"> <div class="patient-image-wrap embed-responsive-item">
<img [src]="'assets/sources/'+selectedSource?.brand_id+'.png'" <img [src]="'assets/sources/'+selectedSource?.brand_id+'.png'"
alt="{{selectedSource?.endpoint_id}}" alt="{{selectedSource?.endpoint_id}}"
class="img-fluid"> class="img-fluid">
@ -30,12 +29,14 @@
<div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">{{getPatientDOB()}}</div> <div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">{{getPatientDOB()}}</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Age:</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Age:</div>
<div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0">{{getPatientAge()}} Years Old</div> <div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0">{{getPatientAge()}} Years Old</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Email</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Email:</div>
<div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">{{getPatientEmail()}}</div> <div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">{{getPatientEmail()}}</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Phone:</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Phone:</div>
<div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0">{{getPatientPhone()}}</div> <div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0">{{getPatientPhone()}}</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Address:</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">Address:</div>
<div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">{{getPatientAddress()}}</div> <div class="col-xs-8 col-sm-5 col-lg-3 text-left p-0">
<div *ngFor="let line of getPatientAddress()">{{line}}</div>
</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">ID:</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">ID:</div>
<div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0 text-overflow-ellipsis ">{{selectedPatient?.source_resource_id}}</div> <div class="col-xs-8 col-sm-3 col-lg-3 text-left p-0 text-overflow-ellipsis ">{{selectedPatient?.source_resource_id}}</div>
<div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">MRN:</div> <div class="col-xs-4 col-sm-2 col-lg-1 text-right text-muted">MRN:</div>
@ -51,7 +52,7 @@
<div class="az-content-left"> <div class="az-content-left">
<div class="az-content-breadcrumb"> <div class="az-content-breadcrumb">
<span>Sources</span> <span>Sources</span>
<span>{{selectedSource?.endpoint_id}}</span> <span class="text-nowrap">{{selectedSource?.id}}</span>
<span>Details</span> <span>Details</span>
</div> </div>

View File

@ -47,6 +47,10 @@ export class SourceDetailComponent implements OnInit {
this.selectedTotalElements = this.resourceTypeCounts[resourceType] this.selectedTotalElements = this.resourceTypeCounts[resourceType]
} }
isExternal(){
return this.selectedSource?.brand_id != '00000000-0000-0000-0000-000000000000';
}
//functions to call on patient //functions to call on patient
getPatientName(){ getPatientName(){
// @ts-ignore // @ts-ignore
@ -88,7 +92,8 @@ export class SourceDetailComponent implements OnInit {
const line = getPath(this.selectedPatient?.resource_raw, 'address.0.line') const line = getPath(this.selectedPatient?.resource_raw, 'address.0.line')
const city = getPath(this.selectedPatient?.resource_raw, 'address.0.city') const city = getPath(this.selectedPatient?.resource_raw, 'address.0.city')
const state = getPath(this.selectedPatient?.resource_raw, 'address.0.state') const state = getPath(this.selectedPatient?.resource_raw, 'address.0.state')
return `${line}, ${city}, ${state}` const zip = getPath(this.selectedPatient?.resource_raw, 'address.0.postalCode')
return [`${line}`, `${city}, ${state} ${zip}`]
} }
} }