@extends('layouts.app')
@section('title', 'FBR Settings')

@section('content')

<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>FBR Settings
        <small>Configure FBR API credentials and location settings</small>
    </h1>
</section>

<!-- Main content -->
<section class="content">
    
    {!! Form::open(['url' => action('FbrInvoiceController@saveSettings'), 'method' => 'post', 'id' => 'fbr_settings_form', 'files' => true]) !!}
    
    @component('components.widget', ['class' => 'box-primary', 'title' => 'FBR API Credentials'])
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('client_id', 'Client ID:' ) !!}
                    {!! Form::text('client_id', $fbrSetting->client_id ?? null, ['class' => 'form-control', 'placeholder' => 'Enter FBR Client ID', 'required' => true]); !!}
                    <span class="help-block">Enter the Client ID provided by FBR</span>
                </div>
            </div>

            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('client_secret', 'Client Secret:' ) !!}
                    {!! Form::text('client_secret', $fbrSetting->client_secret ?? null, ['class' => 'form-control', 'placeholder' => 'Enter FBR Client Secret', 'required' => true]); !!}
                    <span class="help-block">Enter the Client Secret provided by FBR</span>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('username', 'Username:' ) !!}
                    {!! Form::text('username', $fbrSetting->username ?? null, ['class' => 'form-control', 'placeholder' => 'Enter FBR Username', 'required' => true]); !!}
                    <span class="help-block">Enter your FBR portal username</span>
                </div>
            </div>

            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('password', 'Password:' ) !!}
                    {!! Form::password('password', ['class' => 'form-control', 'placeholder' => 'Enter FBR Password', 'required' => empty($fbrSetting)]); !!}
                    <span class="help-block">Enter your FBR portal password</span>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('environment', 'Environment:' ) !!}
                    {!! Form::select('environment', ['sandbox' => 'Sandbox (Testing)', 'production' => 'Production'], $fbrSetting->environment ?? 'sandbox', ['class' => 'form-control select2', 'required' => true]); !!}
                    <span class="help-block">Select Sandbox for testing or Production for live transactions</span>
                </div>
            </div>
        </div>
    @endcomponent

    @component('components.widget', ['class' => 'box-info', 'title' => 'Digital Certificate (Optional)'])
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('certificate', 'Certificate File (.pfx / .p12):' ) !!}
                    <input type="file" name="certificate" id="certificate" class="form-control" accept=".pfx,.p12">
                    <span class="help-block">Upload your .pfx or .p12 digital certificate file</span>
                    @if(!empty($fbrSetting->certificate_path))
                        <p class="text-success"><i class="fa fa-check"></i> Certificate uploaded: {{ basename($fbrSetting->certificate_path) }}</p>
                    @endif
                </div>
            </div>

            <div class="col-md-6">
                <div class="form-group">
                    {!! Form::label('certificate_password', 'Certificate Password:' ) !!}
                    {!! Form::password('certificate_password', ['class' => 'form-control', 'placeholder' => 'Enter Certificate Password']); !!}
                    <span class="help-block">Enter the password for your certificate file</span>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <button type="button" class="btn btn-info" id="upload_certificate_btn">
                    <i class="fa fa-upload"></i> Upload Certificate Separately
                </button>
            </div>
        </div>
    @endcomponent

    <div class="row">
        <div class="col-md-12">
            <button type="submit" class="btn btn-primary btn-flat pull-right">
                <i class="fa fa-save"></i> Save Settings
            </button>
        </div>
    </div>

    {!! Form::close() !!}

    @component('components.widget', ['class' => 'box-success', 'title' => 'Location-wise FBR Settings'])
        <div class="table-responsive">
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>Location Name</th>
                        <th>FBR Enabled</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($locations as $location)
                    <tr>
                        <td>{{ $location->name }}</td>
                        <td>
                            @if($location->fbr_enabled)
                                <span class="label label-success"><i class="fa fa-check"></i> Enabled</span>
                            @else
                                <span class="label label-default"><i class="fa fa-times"></i> Disabled</span>
                            @endif
                        </td>
                        <td>
                            <button type="button" 
                                    class="btn btn-sm btn-{{ $location->fbr_enabled ? 'warning' : 'success' }} toggle-fbr-location"
                                    data-location-id="{{ $location->id }}"
                                    data-current-status="{{ $location->fbr_enabled ? '1' : '0' }}">
                                <i class="fa fa-{{ $location->fbr_enabled ? 'times' : 'check' }}"></i>
                                {{ $location->fbr_enabled ? 'Disable' : 'Enable' }} FBR
                            </button>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="3" class="text-center">No locations found</td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    @endcomponent

</section>
<!-- /.content -->

<!-- Certificate Upload Modal -->
<div class="modal fade" id="certificate_upload_modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Upload Certificate</h4>
            </div>
            {!! Form::open(['url' => action('FbrInvoiceController@uploadCertificate'), 'method' => 'post', 'id' => 'certificate_upload_form', 'files' => true]) !!}
            <div class="modal-body">
                <div class="form-group">
                    {!! Form::label('certificate', 'Certificate File:' ) !!}
                    <input type="file" name="certificate" class="form-control" accept=".pfx,.p12" required>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary">Upload</button>
            </div>
            {!! Form::close() !!}
        </div>
    </div>
</div>

@stop

@section('javascript')
<script type="text/javascript">
    $(document).ready(function(){
        // Save settings form
        $('form#fbr_settings_form').validate({
            rules: {
                client_id: 'required',
                client_secret: 'required',
                username: 'required',
                environment: 'required'
            }
        });

        $('form#fbr_settings_form').submit(function(e){
            e.preventDefault();
            
            var form = $(this);
            var formData = new FormData(form[0]);

            $.ajax({
                method: "POST",
                url: form.attr('action'),
                dataType: "json",
                data: formData,
                processData: false,
                contentType: false,
                success: function(result){
                    if(result.success == true){
                        toastr.success(result.msg);
                        setTimeout(function(){
                            location.reload();
                        }, 1500);
                    } else {
                        toastr.error(result.msg);
                    }
                }
            });
        });

        // Toggle FBR for location
        $(document).on('click', '.toggle-fbr-location', function(){
            var btn = $(this);
            var locationId = btn.data('location-id');
            var currentStatus = btn.data('current-status');
            var newStatus = currentStatus == '1' ? 0 : 1;

            @if(empty($fbrSetting) || empty($fbrSetting->id))
                toastr.error('Please save FBR settings first before enabling locations');
                return;
            @endif

            $.ajax({
                method: "POST",
                url: '/fbr/location/' + locationId + '/settings',
                dataType: "json",
                data: {
                    _token: $('meta[name="csrf-token"]').attr('content'),
                    fbr_enabled: newStatus,
                    fbr_setting_id: {{ $fbrSetting->id ?? 'null' }}
                },
                success: function(result){
                    if(result.success == true){
                        toastr.success(result.msg);
                        setTimeout(function(){
                            location.reload();
                        }, 1000);
                    } else {
                        toastr.error(result.msg);
                    }
                }
            });
        });

        // Upload certificate modal
        $('#upload_certificate_btn').click(function(){
            $('#certificate_upload_modal').modal('show');
        });

        $('form#certificate_upload_form').submit(function(e){
            e.preventDefault();
            
            var form = $(this);
            var formData = new FormData(form[0]);

            $.ajax({
                method: "POST",
                url: form.attr('action'),
                dataType: "json",
                data: formData,
                processData: false,
                contentType: false,
                success: function(result){
                    if(result.success == true){
                        toastr.success(result.msg);
                        $('#certificate_upload_modal').modal('hide');
                        
                        // Update hidden field with certificate path
                        if(result.path) {
                            $('input[name="certificate_path"]').val(result.path);
                        }
                        
                        setTimeout(function(){
                            location.reload();
                        }, 1500);
                    } else {
                        toastr.error(result.msg);
                    }
                }
            });
        });
    });
</script>
@endsection