Browse Source

Added new client header.

raman 5 years ago
parent
commit
51459f63f1
2 changed files with 140 additions and 76 deletions
  1. 42 18
      public/css/z.css
  2. 98 58
      resources/views/layouts/patient.blade.php

+ 42 - 18
public/css/z.css

@@ -1,43 +1,67 @@
 .z {
     font-size: 0.81em;
-    padding: 40px 0;
 } .z button {
     background: #efefef;
     border: 1px solid #767676;
-    display: block;
     font-size: 0.9em;
-    margin-bottom: 2px;
     width: 64px;
 } .z h4 {
     display: inline-block;
     margin: 0;
+} .z label {
+    font-weight: 500;
+    margin-bottom: 0;
+} .z ul {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
 }
 
+
 .z .hbox {
     align-items: center;
     display: flex;
 } .z .hbox > *:not(:first-child) {
-    margin-left: 7px;
+    margin-left: 10px;
 }
 
-.z [data-title]:before {
-    content: attr(data-title) ': ';
-    font-weight: 500;
+.z .vbox {
+    display: flex;
+    flex-direction: column;
+} .z .vbox > *:not(:first-child) {
+    margin-top: 2px;
 }
 
-.z .camera {
-    font-size: 16px;
-    opacity: 0.25;
-} .z .camera.yes {
-    opacity: 1;
+.z .separators {
+    display: flex;
+} .z .separators > *:empty {
+    display: none;
+} .z .separators > *:not(:first-child):before {
+    content: '|';
+    font-weight: bold;
+    margin: 0 5px;
 }
 
-.z .header > *:not(:first-child) {
-    margin-left: 20px;
+.z [moe] form input {
+    display: block;
+    margin-bottom: 3px;
 }
 
-.z .online-status {
-    color: #aaa;
-} .z .online-status.online {
-    color: #28a745;
+
+.z .header {}
+.z .thumbnail {
+    --shadow-color: #aaa;
+    --size: 64px;
+    align-items: center;
+    background: #ccc;
+    box-shadow: 0 0 20px var(--shadow-color);
+    border-radius: 50%;
+    display: flex;
+    flex-shrink: 0;
+    justify-content: center;
+    font-size: 18px;
+    height: var(--size);
+    width: var(--size);
+} .z .thumbnail {
+    --shadow-color: #50a746;
 }

+ 98 - 58
resources/views/layouts/patient.blade.php

@@ -68,7 +68,104 @@
             </nav>
             <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
                 <div class="card mt-3">
-                    <div class="card-header">
+                    <div class=card-header>
+                        <?
+                            $thumbnail = $patient->profile_picture_base64;
+                            $initials = !$thumbnail ? substr($patient->name_first, 0, 1).substr($patient->name_last, 0, 1) : '';
+                            $online = $patient->is_online ? 'online' : '';
+                            $patientName = implode(', ', array_filter([$patient->name_last, $patient->name_first]));
+
+                            $confirmedCell = $patient->is_cell_number_confirmed ? $patient->cell_number : null;
+                            $confirmedEmail = $patient->is_email_address_confirmed ? $patient->email_address : null;
+                            $location = implode(', ', array_filter([$patient->home_address_city, $patient->home_address_state]));
+
+                            $mcpName = implode(', ', array_filter([$patient->mcp->name_last, $patient->mcp->name_first]));
+                            $cmName = $patient->cm ? implode(', ', array_filter([$patient->cm->name_last, $patient->cm->name_first])) : null;
+
+                            $memberSince = date_diff(date_create($patient->created_at), date_create('now'))->days;
+                            if ($memberSince > 30) $memberSince = date('F, Y', strtotime($patient->created_at));
+                            else if ($memberSince > 1) $memberSince .= ' days ago';
+                            else if ($memberSince === 1) $memberSince = 'yesterday';
+                            else if ($memberSince === 0) $memberSince = 'today';
+                        ?>
+
+                        <div class=z><div class=header>
+                            @if($patient->is_duplicate)
+                                <h5>This chart is a duplicate of <a href=javascript:void(0)>Cooper, Amiele</a>.</h5><br>
+                            @endif
+                            <div class=hbox>
+                                <div class="thumbnail {{$online}}" style="background-image:<?=$thumbnail?>"><?=$initials?></div>
+                                <section>
+                                    <div class=hbox>
+                                        <h4>{{$patientName}}</h4>
+                                        <i class=chart>[#{{$patient->chart_number}}]</i>
+                                    </div>
+                                    <div class=separators>
+                                        <div>{{$patient->dob}} ({{$patient->age_in_years}} y.o {{$patient->sex}})</div>
+                                        <div>
+                                            <label>MCN:</label>
+                                            @if($patient->was_medicare_validation_successful)
+                                                <span>
+                                                    Valid #,
+                                                    @if($patient->is_part_b_primary == 'YES')
+                                                        Medicare Part B
+                                                    @else
+                                                        Not Medicare Part B <i class="fa fa-times"></i>
+                                                        @if($patient->is_medicare_advantage == 'YES')
+                                                            , Medicare Advantage,
+                                                            {{$patient->medicare_advantage_plan}}
+                                                        @endif
+                                                    @endif
+                                                </span>
+                                            @else
+                                                <div moe>
+                                                    <a href="" start show>
+                                                        @if($patient->mcn)
+                                                            {{$patient->mcn}} INVALID! <i class="fa fa-times"></i>
+                                                        @else
+                                                            None provided.
+                                                        @endif
+                                                    </a>                                            
+                                                    <form url="/api/client/putMcn">
+                                                        <input type="hidden" name="uid" value="{{$patient->uid}}">
+                                                        <input type="text" name="name_first" value="{{$patient->name_first}}">
+                                                        <input type="text" name="name_last" value="{{$patient->name_last}}">
+                                                        <input type="text" name="dob" value="{{$patient->dob}}">
+                                                        <input type="text" name="mcn" value="{{$patient->mcn}}">
+                                                        <div>
+                                                            <button submit>Submit</button>
+                                                            <button cancel>Cancel</button>
+                                                        </div>
+                                                    </form>
+                                                </div>
+                                            @endif
+                                        </div>
+                                    </div>
+                                    <ul class=hbox>
+                                        <li><i class="fa fa-phone-alt" aria-hidden="true"></i> {{$confirmedCell}}</li>
+                                        <li><i class="fa fa-envelope" aria-hidden="true"></i> {{$confirmedEmail}}</li>
+                                        <li><i class="fa fa-map-marker-alt" aria-hidden="true"></i> {{$location}}</li>
+                                    </ul>                            
+                                    <div class=separators>
+                                        <div>Joined <?=$memberSince?></div>
+                                        <div><label>PCP:</label> {{$mcpName}}</div>
+                                        <div><label>MA:</label> {{$cmName}}</div>
+                                    </div>
+                                </section>
+                                <section>
+                                    <div><label>Allergies:</label> Grass, Pollen, Latex</div>
+                                    <div><label>Next Appt:</label> {{$patient->mcp_onboarding_visit_date}}</div>
+                                </section>
+                                <section class=vbox>
+                                    <button>+ Note</button>
+                                    <button>Pt. Ed.</button>
+                                    <button>Video</button>
+                                </section>
+                            </div>
+                        </div></div> <!-- z -->
+                    </div>
+
+                    <div class="card-header" style=display:none>
                         @if($patient->is_duplicate)
                             <div class="alert alert-danger">
                                 This chart is a duplicate of: __________
@@ -397,63 +494,6 @@
                         </div>
                     </div>
                 </div>
-
-
-
-                <div class=z>
-                    @if($patient->is_duplicate)
-                        <h5>This chart is a duplicate of <a href=javascript:void(0)>Cooper, Amiele</a>.</h5><br>
-                    @endif
-                    <div class=hbox>
-                        <section>
-                            <div class=hbox>
-                                <i class="online-status online fa fa-circle" title=Online></i>
-                                <i class="camera yes fa fa-camera" title="Camera available"></i>
-                            </div>
-                            <h4>{{$patient->name_last}}, {{$patient->name_first}}</h4>
-                            <div>Born <b>{{$patient->dob}}</b>, <b>{{$patient->age_in_years}}</b> y.o {{$patient->sex}} [<i>#{{$patient->chart_number}}</i>]</div>
-                        </section>
-                        @if($patient->mcp)
-                        <section>
-                            <div data-title=PCP>{{$patient->mcp->name_last}}, {{$patient->mcp->name_first}}</div>
-                            <div data-title=MA>{{$patient->mcp->name_last}}, {{$patient->mcp->name_first}}</div>
-                        </section>
-                        @endif
-                        <section data-title=MCN>
-                            @if($patient->mcn)
-                                @if($patient->was_medicare_validation_successful)
-                                    <div>
-                                        Valid #,
-                                        @if($patient->is_part_b_primary == 'YES')
-                                            Medicare Part B <i class="fa fa-check"></i>
-                                        @else
-                                            Not Medicare Part B <i class="fa fa-times"></i>
-                                            @if($patient->is_medicare_advantage == 'YES')
-                                                , Medicare Advantage,
-                                                {{$patient->medicare_advantage_plan}}
-                                            @endif
-                                        @endif
-                                    </div>
-                                @else
-                                    {{$patient->mcn}}
-                                    <div>INVALID! <i class="fa fa-times"></i></div>
-                                @endif
-                            @else
-                                <div>None provided. <i class="fa fa-times"></i></div>
-                            @endif
-                        </section>
-                        <section>
-                            <div data-title=Allergies>Grass, Pollen, Latex</div>
-                            <div data-title=Focus>T2DM, CAD, HTN, Weight Loss</div>
-                            <div data-title="Next Appt">{{$patient->mcp_onboarding_visit_date}}</div>
-                        </section>
-                        <section>
-                            <button>+ Note</button>
-                            <button>Pt. Ed.</button>
-                            <button>Video</button>
-                        </section>
-                    </div>
-                </div> <!-- z -->
             </main>
         </div>
     </div>