@include('header')
@php
$UserId = Session::get('UserId');
@endphp
<div class="container-fluid flex-grow-1 container-p-y">
    <h4 class="font-weight-bold py-3 mb-0">Update Patient Details</h4>
    <p class="text-muted small mb-3">
        Enter MRD number, fetch patient details, edit and save. Updates apply to the master patient record and all linked records:
        queue, visits, optometrist, consultant, OPD/IPD receipts, IPD bill, discharge card, OT scheduled, OT notes,
        OPD investigation, appointments, optical sale/receipt, and other linked tables for this MRD.
    </p>
    <div class="card mb-4">
        <div class="card-body">
            <div id="alert_message"></div>
            <form id="patient-update-form" method="post" autocomplete="off">
                @csrf
                <div class="form-row align-items-end">
                    <div class="form-group col-md-2">
                        <label class="form-label">MRD No <span class="text-danger">*</span></label>
                        <input type="text" name="MrdNo" id="MrdNo" class="form-control" value="" required>
                    </div>
                    <div class="form-group col-md-2">
                        <button type="button" class="btn btn-secondary btn-block" id="btnFetch">Fetch</button>
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-2">
                        <label class="form-label">Suffix</label>
                        <select class="form-control" id="Suffix" name="Suffix">
                            <option value="">Select Suffix</option>
                            <option value="Mr.">Mr.</option>
                            <option value="Mrs.">Mrs.</option>
                            <option value="Miss.">Miss.</option>
                            <option value="Master">Master</option>
                            <option value="Dr.">Dr.</option>
                            <option value="Adv.">Adv.</option>
                        </select>
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">First name</label>
                        <input type="text" class="form-control" id="Fname" name="Fname">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">Middle name</label>
                        <input type="text" class="form-control" id="Mname" name="Mname">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">Last name</label>
                        <input type="text" class="form-control" id="Lname" name="Lname">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-4">
                        <label class="form-label">Patient name (auto from suffix + names)</label>
                        <input type="text" class="form-control bg-light" id="PatientNamePreview" readonly>
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">Age</label>
                        <input type="text" class="form-control" id="Age" name="Age">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">Gender</label>
                        <select class="form-control" id="Gender" name="Gender">
                            <option value="Male">Male</option>
                            <option value="Female">Female</option>
                            <option value="Other">Other</option>
                        </select>
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">Mobile</label>
                        <input type="text" class="form-control" id="Phone" name="Phone">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-5">
                        <label class="form-label">Address</label>
                        <input type="text" class="form-control" id="Address" name="Address">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">City</label>
                        <input type="text" class="form-control" id="City" name="City">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">State</label>
                        <input type="text" class="form-control" id="State" name="State">
                    </div>
                    <div class="form-group col-md-2">
                        <label class="form-label">DOB</label>
                        <input type="date" class="form-control" id="Dob" name="Dob">
                    </div>
                    <div class="form-group col-md-1">
                        <label class="form-label">Phone 2</label>
                        <input type="text" class="form-control" id="Phone2" name="Phone2">
                    </div>
                </div>
                <button type="button" class="btn btn-primary" id="btnSave">Save &amp; update all records</button>
            </form>
        </div>
    </div>
</div>
@include('footerscript')
<script type="text/javascript">
    function recomputeName() {
        var s = ($('#Suffix').val() || '').trim();
        var a = ($('#Fname').val() || '').trim();
        var b = ($('#Mname').val() || '').trim();
        var c = ($('#Lname').val() || '').trim();
        var full = (s + ' ' + a + ' ' + b + ' ' + c).replace(/\s+/g, ' ').trim();
        $('#PatientNamePreview').val(full);
    }

    function fillPatientForm(data) {
        if (!data || !data.MrdNo) {
            swal('Not found', 'No patient for this MRD number.', 'warning');
            return;
        }
        $('#MrdNo').val(data.MrdNo);
        $('#Suffix').val(data.Suffix || '');
        $('#Fname').val(data.Fname || '');
        $('#Mname').val(data.Mname || '');
        $('#Lname').val(data.Lname || '');
        $('#Age').val(data.Age != null ? data.Age : '');
        $('#Gender').val(data.Gender || 'Male');
        $('#Dob').val((data.Dob && String(data.Dob).substr(0, 10)) || '');
        $('#Phone').val(data.Phone || '');
        $('#Phone2').val(data.Phone2 || '');
        $('#Address').val(data.Address || '');
        $('#City').val(data.City || '');
        $('#State').val(data.State || '');
        recomputeName();
    }

    function fetchPatientDetails() {
        var val = ($('#MrdNo').val() || '').trim();
        if (val === '') {
            swal('MRD required', 'Enter MRD number first.', 'warning');
            return;
        }
        $.ajax({
            url: "{{ url('getPatientDetails') }}",
            method: "POST",
            data: {
                _token: '{{ csrf_token() }}',
                id: val
            },
            dataType: "json",
            success: function(data) {
                fillPatientForm(data);
            },
            error: function() {
                swal('Error', 'Could not load patient.', 'error');
            }
        });
    }

    $(document).on('input change', '#Suffix, #Fname, #Mname, #Lname', recomputeName);
    $(document).on('blur', '#MrdNo', fetchPatientDetails);
    $('#btnFetch').on('click', fetchPatientDetails);
    $('#MrdNo').on('keypress', function(e) {
        if (e.which === 13) {
            e.preventDefault();
            fetchPatientDetails();
        }
    });

    $('#btnSave').click(function() {
        recomputeName();
        var mrd = ($('#MrdNo').val() || '').trim();
        if (mrd === '') {
            swal('MRD required', 'Enter MRD and fetch patient details first.', 'warning');
            return;
        }
        var form = $('#patient-update-form').serialize();
        $(this).prop('disabled', true);
        $.ajax({
            url: "{{ url('saveUpdatePatientDetails') }}",
            method: 'POST',
            data: form,
            dataType: 'json',
            success: function(res) {
                $('#btnSave').prop('disabled', false);
                if (res.status == 1) {
                    swal('Done', res.message || 'Updated.', 'success');
                } else {
                    swal('Error', res.message || 'Save failed.', 'error');
                }
            },
            error: function(xhr) {
                $('#btnSave').prop('disabled', false);
                var msg = (xhr.responseJSON && xhr.responseJSON.message) ? xhr.responseJSON.message : 'Request failed';
                swal('Error', msg, 'error');
            }
        });
    });
</script>