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

@extends ('layouts.template')

@section('content')

    <?php $patients = [1,2,3,4]; ?>

    <div class="p-3 mcp-theme-1" id="newPatientContainer" v-cloak>
        <div class="col-12 col-lg-6 px-0">
            <div class="card d-block mb-3" moe="">

                <div class="card-header">
                    <strong>
                        <i class="fas fa-user-plus"></i>
                        New Patient
                    </strong>
                </div>
                <div class="card-body">
                    <form show url="/api/client/create" class="px-2 pb-1 primary-form" redir="patients/view/[data]">
                        @if (session('message'))
                            <div class="alert alert-danger">{{ session('message') }}</div>
                        @endif
                        <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 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 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 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 type="text" name="patientNamePrefix" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Suffix</label>
                						<input type="text" name="patientNameSuffix" value="" class="form-control input-sm">
                					</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>
                					<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="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>
                				</div>
                        @if($pro->pro_type === 'ADMIN')
                            <div class='form-group mb-3'>
                                <label class='control-label'>Pro Uid</label>
                                <select name="mcpProUid" class="form-control" provider-search provider-type="hcp">
                                    <option value="">--select--</option>
                                </select>
                            </div>
                            <div class='form-group mb-3'>
                                <label class='control-label'>Default NA Pro</label>
                                <select name="naProUid" class="form-control" provider-search provider-type="default-na">
                                    <option value="">--select--</option>
                                </select>
                            </div>
                        @elseif($pro->is_hcp === true)
                            <div class='form-group mb-3'>
                                <label class='control-label'>Pro Uid</label>
                                <input type="text" class="form-control" readonly value="{{$pro->displayName()}}">
                                <input type="hidden" name="mcpProUid" value="{{$pro->uid}}">
                            </div>
                        @elseif($pro->isDefaultNA())
                            <div class='form-group mb-3'>
                                <label class='control-label'>Pro Uid</label>
                                <?php $teams = $pro->teamsWhereAssistant; ?>
                                <select name="mcpProUid" class="form-control">
                                    <option value="">--select--</option>
                                    @foreach($teams as $team)
                                        <option value="{{$team->mcp->uid}}">{{$team->mcp->displayName()}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class='form-group mb-3'>
                                <label class='control-label'>Default NA Pro</label>
                                <input type="text" class="form-control" readonly value="{{$pro->displayName()}}">
                                <input type="hidden" name="naProUid" value="{{$pro->uid}}">
                            </div>
                        @endif

                        <div class='form-group mb-3'>
                            <label class='control-label d-flex align-items-center'>
                                <span>Home Phone Number</span>
                                <a href="#"
                                   class="ml-2 px-1 on-hover-opaque hpn-to-cpn">
                                    <i class="fa fa-arrow-down"></i>
                                </a>
                                <a href="#"
                                   class="ml-2 px-1 on-hover-opaque swap-pns">
                                    <i class="fa fa-retweet"></i>
                                </a>
                            </label>
                            <input class='form-control' stag-input-phone type='tel' name='homeNumber'>
                        </div>
                        <div class='form-group mb-3'>
                            <label class='control-label d-flex align-items-center'>
                                <span>Cell Phone Number</span>
                                <a href="#"
                                   class="ml-2 px-1 on-hover-opaque cpn-to-hpn">
                                    <i class="fa fa-arrow-up"></i>
                                </a>
                            </label>
                            <input class='form-control' stag-input-phone type='tel' name='cellNumber'>
                        </div>
                        <div class='form-group mb-3'>
                            <label class='control-label'>Email Address </label>
                            <input class='form-control' type='email' name='emailAddress'>
                        </div>
                        <hr class="m-neg-4">
                        <div class="row">
                					<div class="form-group col-md-12">
                						<p class="mb-1 font-weight-bold">Type of insurance card:</p>
                						<div class="form-check form-check-inline">
                							<label class="form-check-label"><input class="form-check-input" type="radio" v-model="planType" name="planType" value="MEDICARE">Medicare Part B (Primary)</label>
                						</div>
                						<div class="form-check form-check-inline">
                							<label class="form-check-label"><input class="form-check-input" type="radio" v-model="planType" name="planType" value="MEDICAID">Medicaid (Primary)</label>
                						</div>
                						<div class="form-check form-check-inline">
                							<label class="form-check-label"><input class="form-check-input" type="radio" v-model="planType" name="planType" value="COMMERCIAL">Commercial / Third Party (Primary)</label>
                						</div>
                					</div>
                				</div>
                        <div class="row" v-show="planType == 'COMMERCIAL'">
                					<div class="form-group col-md-12">
                						<label for="" class="control-label">Commercial Payer</label>
                						<input name="commercialPayerUidSuggest" class="form-control input-sm" value="" stag-suggest stag-suggest-ep="/search-payer/json" />
                						<input type="hidden" name="commercialPayerUid" />
                					</div>
                					<div class="form-group col-md-6">
                						<label class="control-label">Patient Member Identifier</label>
                						<input type="text" name="commercialMemberIdentifier"  class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-6">
                						<label class="control-label">Patient Group Number</label>
                						<input type="text" name="commercialGroupNumber"  class="form-control input-sm">
                					</div>
                				</div>

                        <div class="row">
                					<div class="form-group col-md-12" v-if="planType == 'MEDICAID' || planType == 'COMMERCIAL'">
                						<div class="form-check form-check-inline">
                							<label class="form-check-label"><input class="form-check-input" type="checkbox" name="isPatientSubscriber" v-model="isPatientSubscriber">Is Patient The Subscriber?</label>
                						</div>
                					</div>
                				</div>

                				<div v-if="!isPatientSubscriber && (planType == 'MEDICAID' || planType == 'COMMERCIAL')" class="row">
                					<div class="col-md-12 bg-light p-3 mb-2">
                						<h5 class="m-0 font-weight-bold">Subscriber Details:</h5>
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber First Name</label>
                						<input type="text" name="subscriberNameFirst" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber Middle Name / MI</label>
                						<input type="text" name="subscriberNameMiddle" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber Last Name</label>
                						<input type="text" name="subscriberNameLast" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber Suffix</label>
                						<input type="text" name="subscriberNameSuffix" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber Sex</label>
                						<select class="form-control input-sm" name="subscriberSex">
                							<option value="">--</option>
                							<option value="M">Male</option>
                							<option value="F">Female</option>
                							<option value="UNKNOWN">Unknown</option>
                						</select>
                					</div>
                					<div class="form-group col-md-4">
                						<label class="control-label">Subscriber Dob</label>
                						<input type="date" name="subscriberDob" value="" class="form-control input-sm">
                					</div>
                					<div class="form-group col-md-12">
                						<label class="control-label">What is the patient's relationship to the subscriber?</label>
                						<select name="patientRelationshipToSubscriber" class="form-control input-sm">
                							<option value="">--</option>
                							<option value="SPOUSE">Spouse</option>
                							<option value="CHILD">Child</option>
                							<option value="EMPLOYEE">Employee</option>
                							<option value="ORGAN_DONOR">Organ Donor</option>
                							<option value="CADAVER_DONOR">Cadaver Donor</option>
                							<option value="LIFE_PARTNER">Life Partner</option>
                							<option value="OTHER_RELATIONSHIP">Other Relationship</option>
                							<option value="UNKNOWN">Unknown</option>
                						</select>
                					</div>
                				</div>
                        <div class="mb-1" v-if="planType == 'COMMERCIAL'">
                					<p>Does the patient also have either a Medicare or Medicaid #? (optional)</p>
                				</div>
                        <div class="row" v-if="planType == 'MEDICAID' || planType == 'COMMERCIAL'">
                					<div class="col-md-12 bg-light p-3 mb-2">
                						<h5 class="m-0 font-weight-bold">Medicaid Information:</h5>
                					</div>
                					<div class="form-group col-md-6">
                						<label for="" class="control-label">Medicaid State</label>
                						<input class="form-control input-sm" list="mcdPayer" name="mcdPayerName" id="mcdPayerName">
                						<datalist id="mcdPayer">
                							<option value="">--</option>
                							<option>MEDICAID ALABAMA</option>
                							<option>MEDICAID ALASKA</option>
                							<option>MEDICAID ARIZONA</option>
                							<option>MEDICAID ARKANSAS</option>
                							<option>MEDICAID CALIFORNIA MEDI-CAL</option>
                							<option>MEDICAID COLORADO</option>
                							<option>MEDICAID CONNECTICUT</option>
                							<option>MEDICAID DELAWARE</option>
                							<option>MEDICAID DISTRICT OF COLUMBIA</option>
                							<option>MEDICAID FLORIDA</option>
                							<option>MEDICAID GEORGIA</option>
                							<option>MEDICAID HAWAII</option>
                							<option>MEDICAID IDAHO</option>
                							<option>MEDICAID ILLINOIS</option>
                							<option>MEDICAID INDIANA</option>
                							<option>MEDICAID IOWA</option>
                							<option>MEDICAID KANSAS</option>
                							<option>MEDICAID KENTUCKY</option>
                							<option>MEDICAID LOUISIANA</option>
                							<option>MEDICAID MAINE</option>
                							<option>MEDICAID MARYLAND</option>
                							<option>MEDICAID MARYLAND DHMH</option>
                							<option>MEDICAID MASSACHUSETTS</option>
                							<option>MEDICAID MICHIGAN</option>
                							<option>MEDICAID MINNESOTA</option>
                							<option>MEDICAID MISSISSIPPI</option>
                							<option>MEDICAID MISSISSIPPI</option>
                							<option>MEDICAID MISSOURI</option>
                							<option>MEDICAID MONTANA</option>
                							<option>MEDICAID NEBRASKA</option>
                							<option>MEDICAID NEVADA</option>
                							<option>MEDICAID NEW HAMPSHIRE</option>
                							<option>MEDICAID NEW JERSEY</option>
                							<option>MEDICAID NEW MEXICO</option>
                							<option>MEDICAID NEW YORK</option>
                							<option>MEDICAID NEW YORK</option>
                							<option>MEDICAID NORTH CAROLINA</option>
                							<option>MEDICAID NORTH DAKOTA</option>
                							<option>MEDICAID OHIO</option>
                							<option>MEDICAID OKLAHOMA</option>
                							<option>MEDICAID OREGON</option>
                							<option>MEDICAID OREGON (DHS OMAP)</option>
                							<option>MEDICAID PENNSYLVANIA</option>
                							<option>MEDICAID RHODE ISLAND</option>
                							<option>MEDICAID SOUTH CAROLINA</option>
                							<option>MEDICAID SOUTH DAKOTA</option>
                							<option>MEDICAID TENNESSEE</option>
                							<option>MEDICAID TEXAS</option>
                							<option>MEDICAID TEXAS AND TEXAS HEALTH STEPS</option>
                							<option>MEDICAID UTAH</option>
                							<option>MEDICAID VERMONT</option>
                							<option>MEDICAID VIRGINIA</option>
                							<option>MEDICAID WASHINGTON (PROVIDER ONE)</option>
                							<option>MEDICAID WEST VIRGINIA</option>
                							<option>MEDICAID WISCONSIN</option>
                							<option>MEDICAID WYOMING</option>
                						</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">
                					</div>
                				</div>

                				<div class="row" v-if="planType == 'MEDICARE' || planType == 'COMMERCIAL'">
                					<div class="col-md-12 bg-light p-3 mb-2">
                						<h5 class="m-0 font-weight-bold">Medicare Information:</h5>
                					</div>
                					<div class="form-group col-md-6">
                						<label class="control-label">Medicare Number</label>
                						<input type="text" name="mcrNumber" class="form-control input-sm">
                					</div>

                				</div>

                        <hr class="m-neg-4">
			                     <div class='form-group mb-3'>
                            <label class='control-label'>How did you hear about us?</label>
                            <textarea class='form-control' type='text' required="" name='initiative'></textarea>
                          </div>
                    </form>
                </div>
                <div class="card-footer">
                    <button class="btn btn-primary" submit>Create New Patient</button>
                </div>
            </div>
        </div>
    </div>

    <link href="/select2/select2.min.css" rel="stylesheet" />
    <script src="/select2/select2.min.js"></script>
    <script src="/inputmask-5.x/dist/inputmask.js"></script>
    <script>
        (function() {
            function init() {
                let im = new Inputmask("(999) 999-9999").mask('[stag-input-phone]');
                $(document)
                    .off('click.hpn-to-cpn', '.hpn-to-cpn')
                    .on('click.hpn-to-cpn', '.hpn-to-cpn', function() {
                        $('[name="cellNumber"]').val($('[name="homeNumber"]').val());
                        $('[name="homeNumber"]').val('');
                        return false;
                    });
                $(document)
                    .off('click.cpn-to-hpn', '.cpn-to-hpn')
                    .on('click.cpn-to-hpn', '.cpn-to-hpn', function() {
                        $('[name="homeNumber"]').val($('[name="cellNumber"]').val());
                        $('[name="cellNumber"]').val('');
                        return false;
                    });
                $(document)
                    .off('click.swap-pns', '.swap-pns')
                    .on('click.swap-pns', '.swap-pns', function() {
                        let hpn = $('[name="homeNumber"]').val();
                        $('[name="homeNumber"]').val($('[name="cellNumber"]').val());
                        $('[name="cellNumber"]').val(hpn);
                        return false;
                    });
                $(document)
                    .off('change.insurance', '.insurance')
                    .on('change.insurance', '.insurance', function() {
                        $('[data-insurance]').addClass('d-none');
                        $('[data-insurance="' + $(this).val() + '"]').removeClass('d-none');
                        $(this).closest('form').attr('url', '/api/client/' + ($(this).val() === 'medicare' ? 'create' : 'createNonMcn'))
                        $(this).closest('[moe]').removeAttr('initialized');
                        initMoes();
                        return false;
                    });
                $('.select2').select2({
                    width: '100%'
                });
            }
            addMCInitializer('new-patient', init, '#newPatientContainer');
        }).call(window);

        var newPatientContainer = new Vue({
          el: '#newPatientContainer',
          data: {
            planType: 'MEDICARE',
            isPatientSubscriber: true
          },
          methods: {
            onCommercialPayerChange: function() {
							var input = $('input[name=commercialPayerUidSuggest]');
							var hiddenInput = $('input[name=commercialPayerUid]');
							input
								.off('stag-suggest-selected')
								.on('stag-suggest-selected', (e, input, _data) => {
									hiddenInput.val(_data.uid);
								});
						},
            init: function() {
							this.onCommercialPayerChange();
						}
          },
          mounted: function() {
						this.init();
					}
        });
    </script>

@endsection