MCP Patients table & filters

app/Http/Controllers/McpController.php

@@ -35,8 +35,8 @@ class McpController extends Controller
 
     public function patients(Request $request)
     {
-        $data = [];
-        return view('app.mcp.patients', $data);
+        $patients = Client::paginate(5);
+        return view('app.mcp.patients', compact('patients'));
     }
 
     public function notes(Request $request)

resources/views/app/mcp/patients.blade.php

@@ -1,6 +1,75 @@
 @extends ('layouts/template')
 
 @section('content')
-    <h1>Hi</h1>
-@endsection
+<div class="p-3 mcp-theme-1" id="patients-list">
+    <div class="card">
 
+        <div class="card-header px-3 py-2 d-flex align-items-center">
+            <strong class="mr-4">
+                <i class="fas fa-user-injured"></i>
+                Patients
+            </strong>
+        </div>
+
+        <div class="card-body p-0">
+            <div class="p-3">
+                @include('app.mcp.patients_filters')
+            </div>
+            <table class="table table-condensed p-0 m-0">
+                <thead class="bg-light">
+                    <tr>
+                        <th class="px-3 border-0">Chart #</th>
+                        <th class="px-3 border-0">Name (F.I. LAST)</th>
+                        <th class="px-3 border-0">DOB</th>
+                        <th class="px-3 border-0">Gender</th>
+                        <th class="px-3 border-0">BMI</th>
+                        <th class="px-3 border-0">Insurance</th>
+                        <th class="px-3 border-0">Last Visit</th>
+                        <th class="px-3 border-0">Next Appt.</th>
+                        <th class="px-3 border-0">Status</th>
+                        <th class="px-3 border-0">CCM</th>
+                        <th class="px-3 border-0">RPM</th>
+                        <th class="px-3 border-0">Last Weight-In</th>
+                        <th class="px-3 border-0">Last BP</th>
+                        <th class="px-3 border-0">Assigned On</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    @foreach($patients as $patient)
+                    <tr>
+                        <td class="px-3">
+                            <a href="{{route('patients.view.dashboard', $patient)}}">
+                                {{$patient->chart_number}}
+                            </a>
+                        </td>
+                        <td>{{$patient->displayName()}}</td>
+                        <td>{{ friendly_date_time($patient->dob, false) }}</td>
+                        <td>{{ $patient->sex === 'M' ? ', Male' : ($patient->sex === ', F' ? 'Female' : '') }}</td>
+                        <td>{{-- BMI --}} - </td>
+                        <td>{{-- Insurance --}} - </td>
+                        <td>{{-- Last Visit --}} - </td>
+                        <td>{{-- Next Appt. --}} - </td>
+                        <td>{{-- Status --}} - </td>
+                        <td>{{-- CCM --}} - </td>
+                        <td>{{-- RPM --}} - </td>
+                        <td>{{-- Last Weight-In --}} - </td>
+                        <td>{{-- Last BP --}} - </td>
+                        <td>{{-- Assigned On --}} - </td>
+                    </tr>
+                    @endforeach
+
+                    @if(count($patients) === 0)
+                    <tr>
+                        <td colspan="14">No records found!</td>
+                    </tr>
+                    @endif
+                </tbody>
+
+            </table>
+            <div class="ml-2 mt-2">
+                {{ $patients->appends(request()->input())->links() }}
+            </div>
+        </div>
+    </div>
+</div>
+@endsection

resources/views/app/mcp/patients_filters.blade.php

@@ -0,0 +1,237 @@
+<style>
+	#mcp-patients-filters label {
+		font-weight: bold;
+	}
+
+	#mcp-patients-filters .mw-100px {
+		min-width: 100px;
+	}
+</style>
+<form id="mcp-patients-filters" method="GET" action="{{ route('mcp.patients') }}" class="row align-items-end" v-cloak>
+	<!-- AGE	 -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Age:</label>
+			<select name="age_category" class="form-control input-sm" v-model="filters.age_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.age_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="age_value_1" value="{{ $age_value_1 ?? '' }}" type="number" class="form-control input-sm" :placeholder="(filters.age_category === 'BETWEEN' || filters.age_category === 'NOT_BETWEEN') ? 'From' : 'Age'" />
+		</div>
+	</div>
+	<div v-if="filters.age_category && (filters.age_category === 'BETWEEN' || filters.age_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="age_value_2" value="{{ $age_value_2 ?? '' }}" type="number" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+	<!-- SEX -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Sex:</label>
+			<select name="sex" class="form-control input-sm" v-model="filters.sex">
+				<option value="ALL">All</option>
+				<option value="M">Male</option>
+				<option value="F">Female</option>
+			</select>
+		</div>
+	</div>
+	<!-- BMI -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>BMI:</label>
+			<select name="bmi_category" class="form-control input-sm" v-model="filters.bmi_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.bmi_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="bmi_value_1" value="{{ $bmi_value_1 ?? '' }}" type="number" class="form-control input-sm" :placeholder="(filters.bmi_category === 'BETWEEN' || filters.bmi_category === 'NOT_BETWEEN') ? 'From' : 'BMI'" />
+		</div>
+	</div>
+	<div v-if="filters.bmi_category && (filters.bmi_category === 'BETWEEN' || filters.bmi_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="bmi_value_2" value="{{ $bmi_value_2 ?? '' }}" type="number" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+
+	<!-- LAST VISIT -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Last Visit:</label>
+			<select name="last_visit_category" class="form-control input-sm" v-model="filters.last_visit_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.last_visit_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_visit_value_1" value="{{ $last_visit_value_1 ?? '' }}" type="date" class="form-control input-sm" :placeholder="(filters.last_visit_category === 'BETWEEN' || filters.last_visit_category === 'NOT_BETWEEN') ? 'From' : 'Last Visit'" />
+		</div>
+	</div>
+	<div v-if="filters.last_visit_category && (filters.last_visit_category === 'BETWEEN' || filters.last_visit_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_visit_value_2" value="{{ $last_visit_value_2 ?? '' }}" type="date" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+
+	<!-- NEXT APPOINTMENT -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Next Appointment:</label>
+			<select name="next_appointment_category" class="form-control input-sm" v-model="filters.next_appointment_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.next_appointment_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="next_appointment_value_1" value="{{ $next_appointment_value_1 ?? '' }}" type="date" class="form-control input-sm" :placeholder="(filters.next_appointment_category === 'BETWEEN' || filters.next_appointment_category === 'NOT_BETWEEN') ? 'From' : 'Next Appointment'" />
+		</div>
+	</div>
+	<div v-if="filters.next_appointment_category && (filters.next_appointment_category === 'BETWEEN' || filters.next_appointment_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="next_appointment_value_2" value="{{ $next_appointment_value_2 ?? '' }}" type="date" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+
+	<!-- STATUS -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Status:</label>
+			<select name="status" class="form-control input-sm" v-model="filters.status">
+				<option value="ALL">All</option>
+				<option value="ACTIVE">Active</option>
+				<option value="AWAITING_VISIT">Awaiting Visit</option>
+				<option value="INACTIVE">Inactive</option>
+			</select>
+		</div>
+	</div>
+
+	<!-- LAST WEIGHED-IN -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Last Weighed-In:</label>
+			<select name="last_weighed_in_category" class="form-control input-sm" v-model="filters.last_weighed_in_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.last_weighed_in_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_weighed_in_value_1" value="{{ $last_weighed_in_value_1 ?? '' }}" type="date" class="form-control input-sm" :placeholder="(filters.last_weighed_in_category === 'BETWEEN' || filters.last_weighed_in_category === 'NOT_BETWEEN') ? 'From' : 'Enter Date'" />
+		</div>
+	</div>
+	<div v-if="filters.last_weighed_in_category && (filters.last_weighed_in_category === 'BETWEEN' || filters.last_weighed_in_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_weighed_in_value_2" value="{{ $last_weighed_in_value_2 ?? '' }}" type="date" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+
+	<!-- LAST BP -->
+	<div class="col-md-2">
+		<div class="form-group">
+			<label>Last BP:</label>
+			<select name="last_bp_category" class="form-control input-sm" v-model="filters.last_bp_category">
+				<option value="">All</option>
+				<option value="EXACTLY">Exactly</option>
+				<option value="LESS_THAN">Less Than</option>
+				<option value="GREATER_THAN">Greater Than</option>
+				<option value="BETWEEN">Between</option>
+				<option value="NOT_BETWEEN">Not Between</option>
+			</select>
+		</div>
+	</div>
+	<div v-if="filters.last_bp_category" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_bp_value_1" value="{{ $last_bp_value_1 ?? '' }}" type="date" class="form-control input-sm" :placeholder="(filters.last_bp_category === 'BETWEEN' || filters.last_bp_category === 'NOT_BETWEEN') ? 'From' : 'Enter Date'" />
+		</div>
+	</div>
+	<div v-if="filters.last_bp_category && (filters.last_bp_category === 'BETWEEN' || filters.last_bp_category === 'NOT_BETWEEN')" class="col-md-2">
+		<div class="form-group">
+			<label>&nbsp;</label>
+			<input name="last_bp_value_2" value="{{ $last_bp_value_2 ?? '' }}" type="date" class="form-control input-sm" placeholder="To" />
+		</div>
+	</div>
+
+	<div class="col-md-2">
+		<div class="form-group d-flex">
+			<label>&nbsp;</label>
+			<button type="submit" class="btn btn-primary btn-sm mr-2 mw-100px">Apply Filters</button>
+			<a href="{{ route('mcp.patients') }}" class="btn btn-danger btn-sm text-white mw-100px">Clear Filters</a>
+		</div>
+	</div>
+</form>
+
+<script>
+	(function() {
+		function init() {
+			window.apapp = new Vue({
+				el: '#mcp-patients-filters',
+				delimiters: ['@{{', '}}'],
+				data: {
+					filters: {
+						age_category: "<?= $age_category ?? '' ?>",
+						bmi_category: "<?= $bmi_category ?? '' ?>",
+						last_visit_category: "<?= $last_visit_category ?? '' ?>",
+						next_appointment_category: "<?= $next_appointment_category ?? '' ?>",
+						last_weighed_in_category: "<?= $last_weighed_in_category ?? '' ?>",
+						last_bp_category: "<?= $last_bp_category ?? '' ?>",
+						sex: "<?= $sex ?? '' ?>",
+						status: "<?= $status ?? '' ?>"
+					}
+				},
+				methods: {
+					init: function() {
+						
+					}
+				},
+				mounted: function() {
+					this.init();
+				},
+			});
+
+
+		}
+		addMCInitializer('mcp-patients-filters', init, '#mcp-patients-filters');
+	})();
+</script>