@extends(backpack_view('blank'))

@section('after_styles')
    <style media="screen">
        .backpack-profile-form .required::after {
            content: ' *';
            color: red;
        }
    </style>
@endsection

@php
  $breadcrumbs = [
      trans('backpack::crud.admin') => url(config('backpack.base.route_prefix'), 'dashboard'),
      trans('backpack::base.my_account') => false,
  ];
@endphp

@section('header')
    <section class="content-header">
        <div class="container-fluid mb-3">
            <h1>{{ trans('backpack::base.my_account') }}</h1>
        </div>
    </section>
@endsection

@section('content')
    <div class="row">

        @if (session('success'))
        <div class="col-lg-8">
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        </div>
        @endif

        @if ($errors->count())
        <div class="col-lg-8">
            <div class="alert alert-danger">
                <ul class="mb-1">
                    @foreach ($errors->all() as $e)
                    <li>{{ $e }}</li>
                    @endforeach
                </ul>
            </div>
        </div>
        @endif

        {{-- UPDATE INFO FORM --}}
        <div class="col-lg-8 mb-4">
            <form class="form" action="{{ route('backpack.account.info.store') }}" method="post">

                {!! csrf_field() !!}

                <div class="card">

                    <div class="card-header">
                        <h3 class="card-title">{{ trans('backpack::base.update_account_info') }}</h3>
                    </div>

                    <div class="card-body backpack-profile-form bold-labels">
                        <div class="row">
                            <div class="col-md-6 form-group">
                                @php
                                    $label = trans('backpack::base.name');
                                    $field = 'name';
                                @endphp
                                <label class="required">{{ $label }}</label>
                                <input required class="form-control" type="text" name="{{ $field }}" value="{{ old($field) ? old($field) : $user->$field }}">
                            </div>

                            <div class="col-md-6 form-group">
                                @php
                                    $label = trans('backpack::base.'.strtolower(config('backpack.base.authentication_column_name')));
                                    $field = backpack_authentication_column();
                                @endphp
                                <label class="required">{{ $label }}</label>
                                <input required class="form-control" type="{{ backpack_authentication_column()==backpack_email_column()?'email':'text' }}" name="{{ $field }}" value="{{ old($field) ? old($field) : $user->$field }}">
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group">
                                <label for="pharmacy_id">Pharmacy</label>
                                @if(backpack_user() && backpack_user()->hasRole('superadmin'))
                                    <select name="pharmacy_id" id="pharmacy_id" class="form-control">
                                        <option value="">-- Select Pharmacy --</option>
                                        @foreach($pharmacies as $pharmacy)
                                            <option value="{{ $pharmacy->id }}" {{ $user->pharmacy_id == $pharmacy->id ? 'selected' : '' }}>
                                                {{ $pharmacy->name }}
                                            </option>
                                        @endforeach
                                    </select>

                                @else
                                    <div>{{ $user->pharmacy->name }}</div>                                
                                @endif
                                
                            </div>
                        </div>
                    </div>

                    <div class="card-footer">
                        <button type="submit" class="btn btn-success"><i class="la la-save"></i> {{ trans('backpack::base.save') }}</button>
                        <a href="{{ backpack_url() }}" class="btn">{{ trans('backpack::base.cancel') }}</a>
                    </div>
                </div>

            </form>
        </div>

        {{-- CHANGE PASSWORD FORM --}}
        <div class="col-lg-8 mb-4">
            <form class="form" action="{{ route('backpack.account.password') }}" method="post">

                {!! csrf_field() !!}

                <div class="card padding-10">

                    <div class="card-header">
                        <h3 class="card-title">{{ trans('backpack::base.change_password') }}</h3>
                    </div>

                    <div class="card-body backpack-profile-form bold-labels">
                        <div class="row">
                            <div class="col-md-4 form-group">
                                @php
                                    $label = trans('backpack::base.old_password');
                                    $field = 'old_password';
                                @endphp
                                <label class="required">{{ $label }}</label>
                                <input autocomplete="new-password" required class="form-control" type="password" name="{{ $field }}" id="{{ $field }}" value="">
                            </div>

                            <div class="col-md-4 form-group">
                                @php
                                    $label = trans('backpack::base.new_password');
                                    $field = 'new_password';
                                @endphp
                                <label class="required">{{ $label }}</label>
                                <input autocomplete="new-password" required class="form-control" type="password" name="{{ $field }}" id="{{ $field }}" value="">
                            </div>

                            <div class="col-md-4 form-group">
                                @php
                                    $label = trans('backpack::base.confirm_password');
                                    $field = 'confirm_password';
                                @endphp
                                <label class="required">{{ $label }}</label>
                                <input autocomplete="new-password" required class="form-control" type="password" name="{{ $field }}" id="{{ $field }}" value="">
                            </div>
                        </div>
                    </div>

                    <div class="card-footer">
                            <button type="submit" class="btn btn-success"><i class="la la-save"></i> {{ trans('backpack::base.change_password') }}</button>
                            <a href="{{ backpack_url() }}" class="btn">{{ trans('backpack::base.cancel') }}</a>
                    </div>

                </div>

            </form>
        </div>

        {{-- Billing Details  --}}
        {{-- <div class="col-lg-8 mb-4">
            <div class="card padding-10">
                <div class="card-header">
                    <h3 class="card-title">Billing Details</h3>
                </div>
                <div class="card-body bold-labels">
                    <select name="plan" id="plan" disabled>
                        @foreach ($plans as $p) 
                            <option value="{{ $p->id }}" {{ $p->id == $plan->id ? 'selected' : '' }}>
                                {{ $p->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div> --}}


        {{-- 2FA Settings --}}
        <div class="col-lg-8 mb-4">
            <div class="card padding-10">
                <div class="card-header">
                    <h3 class="card-title">Two Factor Authentication</h3>
                </div>

                @if ( !$user->google2fa_enabled )
                    <div class="card-body 2fa-disabled-div bold-labels">
                        <div class="row">
                            <div class="d-flex mb-2 ">
                                <input type="checkbox" class="me-2" id="chk-enable-2fa" name="chk-enable-2fa" value="enable"></input> <label for="chk-enable-2fa">Enable Google 2FA</label>
                            </div>
                        </div>
                        <div class="row mb-2 d-none enable-2fa-row">
                            {{-- <p>Click <a href="">here</a> to reset Two Factor Authentication Device</p> --}}
                            <a onclick="reset2fa('This will require the user to enter a verification code when logging in. Are you sure you want to proceed?')" class="btn btn-primary" href="#">Setup 2FA</a>
                        </div>
                    </div>
                @else 
                    <div class="2fa-enabled-div card-body bold-labels">
                        <div class="row mb-2">
                            {{-- <p>Click <a href="">here</a> to reset Two Factor Authentication Device</p> --}}
                            <a onclick="reset2fa('If you have previously setup Google 2FA, reseting  will remove the link to your current authenticator app. You must set it up again if the link is remove.  Click Continue if you want to proceed')" class="btn btn-primary" href="#">Reset 2FA</a>
                        </div>

                        <div class="row mb-2">
                            {{-- <p>Click <a href="">here</a> to reset Two Factor Authentication Device</p> --}}
                            <a onclick="resetBackupCode()" class="btn btn-primary" href="#">Reset Backup Code</a>
                        </div>

                        <div class="row">
                            <a onclick="disable2fa()" class="btn btn-secondary" href="#">Disable 2FA</a>
                        </div>


                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection
{{-- Resetting MFA will remove the link to your current authenticator app.  --}}
<script>

    // On page load, check for the flag
    document.addEventListener('DOMContentLoaded', function () {
        if (localStorage.getItem('2fa_disabled_success')) {
            new Noty({
                type: 'success',
                text: '2FA disabled successfully.',
                timeout: 5000
            }).show();

            // Remove the flag so it only shows once
        
            localStorage.removeItem('2fa_disabled_success');
        }
    });

    function disable2fa() {
        swal({
		  title: "{!! trans('backpack::base.warning') !!}",
		  text: "Are you sure you want to disable Two Factor Authentication?",
		  icon: "warning",
		  buttons: {
		  	cancel: {
				text: "{!! trans('backpack::crud.cancel') !!}",
				value: null,
				visible: true,
				className: "bg-secondary",
				closeModal: true,
			},
			confirm: {
				text: "Confirm",
				value: true,
				visible: true,
				className: "bg-danger",
				},
			},
		  dangerMode: true,
        }).then((value) => {
            if ( value ) {
                let route = '{{ route("backpack.2fa.disable_2fa") }}';
                $.ajax({
                    url: route,
                    type: 'POST',
                    success: function(result) {
                        // new Noty({
                        //     type: 'success',
                        //     text: '2FA disabled successfully.',
                        //     timeout: 3000
                        // }).show();

                        localStorage.setItem('2fa_disabled_success', '1');
                        location.reload();
                    },
                    error: function(result) {
                        new Noty({
                            type: '2FA disabled fail.  Please try again later',
                            timeout: 5000
                        }).show();
                    }
                });
            }
        });
    }

    function reset2fa(text) {
        swal({
		  title: "{!! trans('backpack::base.warning') !!}",
		  text: text,
		  icon: "warning",
		  buttons: {
		  	cancel: {
				text: "{!! trans('backpack::crud.cancel') !!}",
				value: null,
				visible: true,
				className: "bg-secondary",
				closeModal: true,
			},
			confirm: {
				text: "Confirm",
				value: true,
				visible: true,
				className: "bg-danger",
				},
			},
		  dangerMode: true,
        }).then((value) => {
            if ( value ) {
                window.location.href = "{{ route('backpack.2fa.reset_2fa') }}";
            }
        });

    }

    function resetBackupCode() 
    {

        let html = "<h2>Resetting Backup Code</h3> <p><strong>{{ $backup_code }}</strong></p>.  <p>Please keep the bakcup code in a safe place as you won't be getting it again. <br />Click Confirm to  reset the backup clode </p>";
        let div = document.createElement('div');
        div.className = "swal-prescriptions-list";
        div.innerHTML = html;

        swal({
		  title: "{!! trans('backpack::base.warning') !!}",
		  content: div,
		  icon: "info",
		  buttons: {
		  	cancel: {
				text: "{!! trans('backpack::crud.cancel') !!}",
				value: null,
				visible: true,
				className: "bg-secondary",
				closeModal: true,
			},
			confirm: {
				text: "Confirm",
				value: true,
				visible: true,
				className: "bg-danger",
				},
			},
		  dangerMode: true,
        }).then((value) => {
            if ( value ) {
                let route = '{{ route("backpack.2fa.reset_backupcode") }}';
                $.ajax({
                    url: route,
                    type: 'POST',
                    success: function(result) {
                        new Noty({
                            type: 'success',
                            text: 'Backup code has been reset successfully.',
                            timeout: 3000
                        }).show();
                    },
                    error: function(result) {
                        new Noty({
                            type: 'success',
                            text: 'Backup code reset fail.  Please try again later',
                            timeout: 3000
                        }).show();
                    }
                });
            }


        });

    }

    document.addEventListener('DOMContentLoaded', function () {
        const checkbox = document.getElementById('chk-enable-2fa');
        const rows = document.querySelectorAll('.enable-2fa-row');

        checkbox.addEventListener('change', function () {
            const val = this.value;
            console.log('chk-enable-2fa: ' + val);

            rows.forEach(function (row) {
                if (checkbox.checked) {
                    row.classList.remove('d-none');
                } else {
                    row.classList.add('d-none');
                }
            });
        });
    });
</script>


@if(request()->get('reset2fa') === 'success')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        new Noty({
            type: 'success',
            text: '2FA has been reset successfully.',
            timeout: 3000
        }).show();
    });
</script>
@endif