new patient

resources/views/app/new-patient.blade.php

@@ -6,6 +6,11 @@
 $patients = [1, 2, 3, 4];
 $medicaidStates = Config::get('constants.medicaid_states');
 ?>
+<style media="screen">
+	.form-control {
+		border-radius: 0;
+	}
+</style>
 
 <div class="p-3 mcp-theme-1" id="newPatientContainer" v-cloak>
 	<div class="col-12">
@@ -23,63 +28,71 @@ $medicaidStates = Config::get('constants.medicaid_states');
 					<div class="alert alert-danger">{{ session('message') }}</div>
 					@endif
 					<div class="row">
-						<div class="border-lighter col-md-5">
+						<div class="border-lighter col-md-6">
 							<div class="row">
 								<div class="col-md-12 bg-light p-3 mb-2">
 									<h5 class="m-0 font-weight-bold">Patient Name / Demographics:</h5>
 								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">First Name <span class="text-danger">*</span> </label>
-									<input autocomplete="_blank" type="text" required name="patientNameFirst" value="" class="form-control input-sm">
-								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">Middle Name / MI</label>
-									<input autocomplete="_blank" type="text" name="patientNameMiddle" value="" class="form-control input-sm">
-								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">Last Name <span class="text-danger">*</span></label>
-									<input autocomplete="_blank" type="text" required name="patientNameLast" value="" class="form-control input-sm">
-								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">Prefix</label>
-									<input autocomplete="_blank" type="text" name="patientNamePrefix" value="" class="form-control input-sm">
+								<div class="col-md-12 form-group mt-2">
+									<div class="d-flex align-items-center">
+										<label class="m-0 w-25">Name:</label>
+										<input autocomplete="_blank" type="text" name="patientNamePrefix" placeholder="Prefix" class="ml-2 form-control input-sm w-50">
+										<input autocomplete="_blank" type="text" required name="patientNameFirst" placeholder="First" class="ml-2 form-control input-sm">
+										<input autocomplete="_blank" type="text" name="patientNameMiddle" placeholder="Middle" class="ml-2 form-control input-sm">
+										<input autocomplete="_blank" type="text" name="patientNameLast" placeholder="Last" class="ml-2 form-control input-sm">
+										<input autocomplete="_blank" type="text" name="patientNameSuffix" placeholder="Suffix" class="ml-2 form-control input-sm w-50">
+									</div>
 								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">Suffix</label>
-									<input autocomplete="_blank" type="text" name="patientNameSuffix" value="" class="form-control input-sm">
+								<div class="col-md-12 p-0">
+									<div class="col-md-6 form-group">
+										<div class="d-flex align-items-center">
+											<label class="m-0">Email:</label>
+											<input class='form-control ml-2' type='email' placeholder="Email Address" name='emailAddress'>
+										</div>
+									</div>
 								</div>
-								<div class="form-group col-md-4">
-									<label class="control-label">Sex</label>
-									<select class="form-control input-sm" name="patientSex" select2>
-										<option value="">--</option>
-										<option value="M">Male</option>
-										<option value="F">Female</option>
-										<option value="UNKNOWN">Unknown</option>
-									</select>
+								<div class="col-md-12 p-0">
+									<div class="col-md-4 form-group">
+										<div class="d-flex align-items-center">
+											<label class="m-0 w-25">Gender:</label>
+											<select class="form-control input-sm ml-2" name="patientSex" select2>
+												<option value="">--</option>
+												<option value="M">Male</option>
+												<option value="F">Female</option>
+												<option value="UNKNOWN">Unknown</option>
+											</select>
+										</div>
+									</div>
 								</div>
-								<div class="form-group col-md-6">
-									<label class="control-label">Date of Birth <span class="text-danger">*</span></label>
-									<input type="date" required name="patientDob" value="" class="form-control input-sm">
+							</div>
+							<div class="row">
+								<div class="col-md-5 form-group">
+									<div class="d-flex align-items-center">
+										<label class="m-0 w-25">DOB: <span class="text-danger">*</span></label>
+										<input type="date" required name="patientDob" value="" class="form-control input-sm">
+									</div>
 								</div>
-								<div class="form-group col-md-6">
-									<label class="control-label">Date Of Service</label>
-									<input type="date" name="dateOfService" value="{{date('Y-m-d')}}" class="form-control input-sm">
+								<div class="col-md-5 form-group">
+									<div class="d-flex align-items-center">
+										<label class="m-0 w-25">Service:</label>
+										<input type="date" name="dateOfService" value="{{date('Y-m-d')}}" class="form-control input-sm">
+									</div>
 								</div>
 							</div>
 							@if($pro->pro_type === 'ADMIN')
 							<div class="row">
-								<div class="col-md-6">
-									<div class='form-group mb-3'>
-										<label class='control-label'>HCP Pro</label>
-										<select name="hcpProUid" class="form-control" provider-search provider-type="hcp">
+								<div class="col-md-5 form-group">
+									<div class="d-flex align-items-center">
+										<label class="m-0 w-25">HCP Pro:</label>
+										<select name="hcpProUid" class="form-control input-sm" provider-search provider-type="hcp">
 											<option value="">--select--</option>
 										</select>
 									</div>
 								</div>
-								<div class="col-md-6">
-									<div class='form-group mb-3'>
-										<label class='control-label'>Care Coordinator</label>
-										<select name="assistantProUid" class="form-control" provider-search provider-type="default-na">
+								<div class="col-md-7 form-group">
+									<div class="d-flex align-items-center">
+										<label class='m-0 w-25'>Coordinator:</label>
+										<select name="assistantProUid" class="form-control input-sm ml-2" provider-search provider-type="default-na">
 											<option value="">--select--</option>
 										</select>
 									</div>
@@ -88,18 +101,20 @@ $medicaidStates = Config::get('constants.medicaid_states');
 							@elseif($pro->is_hcp === true)
 							<div class="row">
 								<div class="col-md-12">
-									<div class='form-group mb-3'>
-										<label class='control-label'>HCP Pro</label>
-										<input type="text" class="form-control" readonly value="{{$pro->displayName()}}">
-										<input type="hidden" name="hcpProUid" value="{{$pro->uid}}">
+									<div class='form-group'>
+										<div class="d-flex align-items-center">
+											<label class="m-0 w-25">HCP Pro:</label>
+											<input type="text" class="form-control" readonly value="{{$pro->displayName()}}">
+											<input type="hidden" name="hcpProUid" value="{{$pro->uid}}">
+										</div>
 									</div>
 								</div>
 							</div>
 							@elseif($pro->isDefaultNA())
 							<div class="row">
-								<div class="col-md-6">
-									<div class='form-group mb-3'>
-										<label class='control-label'>HCP Pro</label>
+								<div class="col-md-5 form-group">
+									<div class="d-flex align-items-center">
+										<label class="m-0 w-25">HCP Pro:</label>
 										<?php $teams = $pro->teamsWhereAssistant; ?>
 										<select name="hcpProUid" class="form-control">
 											@if(count($teams) > 1)
@@ -110,23 +125,21 @@ $medicaidStates = Config::get('constants.medicaid_states');
 											@endforeach
 										</select>
 									</div>
-
 								</div>
-								<div class="col-md-6">
-									<div class='form-group mb-3'>
-										<label class='control-label'>Care Coordinator</label>
+								<div class="col-md-7 form-group">
+									<div class="d-flex align-items-center">
+										<label class='m-0 w-25'>Coordinator:</label>
 										<input type="text" class="form-control" readonly value="{{$pro->displayName()}}">
 										<input type="hidden" name="assistantProUid" value="{{$pro->uid}}">
 									</div>
 								</div>
 							</div>
 							@endif
-
 							<div class="row">
-								<div class="col-md-4">
-									<div class='form-group mb-3'>
-										<label class='control-label d-flex align-items-center'>
-											<span>Home Phone Number</span>
+								<div class="col-md-6 form-group">
+									<div class="d-flex align-items-center">
+										<label class='control-label m-0 d-flex align-items-center'>
+											<span>Phone:</span>
 											<a v-if="form.homeNumber" @click="hpnToCpn" class="ml-1 px-1 on-hover-opaque hpn-to-cpn c-pointer">
 												<i class="fa fa-arrow-right"></i>
 											</a>
@@ -134,24 +147,20 @@ $medicaidStates = Config::get('constants.medicaid_states');
 												<i class="fa fa-retweet"></i>
 											</a>
 										</label>
-										<input class='form-control' autocomplete="_blank" stag-input-phone type='tel' name='homeNumber' v-model="form.homeNumber">
+										<input class='form-control ml-2' placeholder="Home Phone" autocomplete="_blank" stag-input-phone type='tel' name='homeNumber' v-model="form.homeNumber">
+										</select>
 									</div>
 								</div>
-								<div class="col-md-4">
-									<div class='form-group mb-3'>
-										<label class='control-label d-flex align-items-center'>
-											<span>Cell Phone Number</span>
+								<div class="col-md-6 form-group">
+									<div class="d-flex align-items-center">
+										<label class='control-label m-0 d-flex align-items-center'>
+											<span>Phone:</span>
 											<a v-if="form.cellNumber" @click="cpnToHpn" class="ml-1 px-1 on-hover-opaque cpn-to-hpn c-pointer">
 												<i class="fa fa-arrow-left"></i>
 											</a>
 										</label>
-										<input class='form-control' autocomplete="_blank" stag-input-phone type='tel' name='cellNumber' v-model="form.cellNumber">
-									</div>
-								</div>
-								<div class="col-md-4">
-									<div class='form-group mb-3'>
-										<label class='control-label'>Email Address </label>
-										<input class='form-control' type='email' name='emailAddress'>
+										<input class='form-control ml-2' placeholder="Cell Phone" autocomplete="_blank" stag-input-phone type='tel' name='cellNumber' v-model="form.cellNumber">
+										</select>
 									</div>
 								</div>
 							</div>
@@ -170,7 +179,7 @@ $medicaidStates = Config::get('constants.medicaid_states');
 							</div>
 
 						</div>
-						<div class="col-md-7">
+						<div class="col-md-6">
 							<div class="border-lighter">
 								<div class="col-md-12 bg-light py-3 px-3 mb-2 ">
 									<h5 class="m-0 font-weight-bold">Insurance Coverage:</h5>
@@ -271,23 +280,25 @@ $medicaidStates = Config::get('constants.medicaid_states');
 													<h5 class="m-0 font-weight-bold">Medicaid Information:</h5>
 												</div>
 											</div>
-											<div class="col-12 px-0">
-												<div class="px-2">
-													<div class="form-group col-md-6">
-														<label for="" class="control-label">Medicaid State</label>
-														<input class="form-control input-sm" list="mcdPayerOptions" name="mcdPayerName" id="mcdPayerName">
-														<datalist id="mcdPayerOptions">
-															<option value="">--</option>
-															@foreach($medicaidStates as $state)
-															<option>{{ $state }}</option>
-															@endforeach
-														</datalist>
-													</div>
+											<div class="col-12">
+												<div class="row">
 
-													<div class="form-group col-md-6">
-														<label class="control-label">Medicaid Number</label>
-														<input type="text" name="mcdNumber" class="form-control input-sm" oninput="this.value = this.value.toUpperCase()">
-													</div>
+												
+												<div class="form-group col-md-6">
+													<label for="" class="control-label">Medicaid State</label>
+													<input class="form-control input-sm" list="mcdPayerOptions" name="mcdPayerName" id="mcdPayerName">
+													<datalist id="mcdPayerOptions">
+														<option value="">--</option>
+														@foreach($medicaidStates as $state)
+														<option>{{ $state }}</option>
+														@endforeach
+													</datalist>
+												</div>
+
+												<div class="form-group col-md-6">
+													<label class="control-label">Medicaid Number</label>
+													<input type="text" name="mcdNumber" class="form-control input-sm" oninput="this.value = this.value.toUpperCase()">
+												</div>
 												</div>
 											</div>
 										</div>
@@ -298,12 +309,10 @@ $medicaidStates = Config::get('constants.medicaid_states');
 													<h5 class="m-0 font-weight-bold">Medicare Information:</h5>
 												</div>
 											</div>
-											<div class="col-12 px-0">
-												<div class="px-2">
-													<div class="form-group col-md-6">
-														<label class="control-label">Medicare Number</label>
-														<input type="text" name="mcrNumber" class="form-control input-sm" oninput="this.value = this.value.toUpperCase()">
-													</div>
+											<div class="col-12">
+												<div class="form-group col-md-6">
+													<label class="control-label">Medicare Number</label>
+													<input type="text" name="mcrNumber" class="form-control input-sm" oninput="this.value = this.value.toUpperCase()">
 												</div>
 											</div>
 
@@ -395,4 +404,4 @@ $medicaidStates = Config::get('constants.medicaid_states');
 	});
 </script>
 
-@endsection
+@endsection