@extends('layouts.master')

@section('content')
    <div class="main-content app-content mt-0">
        <div class="side-app">
            
            <!-- CONTAINER -->
            <div class="main-container container-fluid">
                <!-- PAGE-HEADER -->
                <div class="page-header">
                    <h1 class="page-title">{{ __('locale.API_Documentation') }}</h1>
                    <div>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item">
                                <a href="javascript:void(0)">{{ __('locale.API_Documentation') }}</a>
                            </li>
                            <li class="breadcrumb-item active" aria-current="page">{{ __('common.home') }}</li>
                        </ol>
                    </div>
                </div>

                <div class="row">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-body">
                                <!-- API Test Section -->
                                <div class="alert alert-info">
                                    <h5>
                                        <i class="fe fe-shield"></i>
                                        {{ __('locale.API_Test_Console') }}
                                    </h5>
                                    <p>{{ __('locale.Test_API_Endpoints_Directly') }}</p>
                                </div>

                                <form id="apiTestForm" class="mb-5">
                                    @csrf
                                    <div class="row">
                                        <div class="col-md-4 mb-3">
                                            <label for="test_partner_id">{{ __('locale.Partner') }}</label>
                                            <select id="test_partner_id" name="partner_id" class="form-control" required>
                                                <option value="">{{ __('locale.Select_Partner') }}</option>
                                                @foreach($partners as $partner)
                                                    <option value="{{ $partner->partner_id }}">
                                                        {{ $partner->company->name ?? __('locale.Unknown_Partner') }}
                                                        ({{ $partner->partner_id }})
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-4 mb-3">
                                            <label for="test_api_key">{{ __('locale.API_Key') }}</label>
                                            <input type="password" id="test_api_key" name="api_key" class="form-control"
                                                placeholder="{{ __('locale.Enter_API_Key') }}" required>
                                        </div>

                                        <div class="col-md-4 mb-3">
                                            <label for="test_uid">{{ __('locale.UID_14_Hex_Chars') }}</label>
                                            <input type="text" id="test_uid" name="uid" class="form-control"
                                                placeholder="04A1B2C3D4E5F6" pattern="[A-F0-9]{14}" required>
                                        </div>

                                        <div class="col-md-12 mb-3">
                                            <label for="test_signature">{{ __('locale.Signature_64_Hex_Chars') }}</label>
                                            <textarea id="test_signature" name="signature" class="form-control" rows="2"
                                                placeholder="AABBCCDD..." pattern="[A-F0-9]{64}" required></textarea>
                                        </div>

                                        <div class="col-12">
                                            <button type="submit" class="btn btn-primary">
                                                {{ __('locale.Test_API_Call') }}
                                            </button>
                                        </div>
                                    </div>
                                </form>

                                <div id="apiTestResult" style="display:none;" class="mb-5">
                                    <h5>{{ __('locale.Response') }}:</h5>
                                    <pre id="testResponse"
                                        style="background:#f8f9fa; padding:15px; border-radius:5px;"></pre>
                                </div>

                                <hr>
                            @include('admin.api-docs.document')
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('bottom_script')
    <script>
        function copyEndpoint(endpoint) {
            const baseUrl = '{{ $URL_BASE }}';
            let url = '';
            if (endpoint === 'verify') url = baseUrl + '/verify';
            else if (endpoint === 'batch') url = baseUrl + '/verify/batch';
            else if (endpoint === 'health') url = baseUrl + '/health';

            navigator.clipboard.writeText(url);
            alert('{{ __("locale.Endpoint_Copied") }}');
        }

        function copyCode(elementId) {
            const code = document.getElementById(elementId).innerText;
            navigator.clipboard.writeText(code);
            alert('{{ __("locale.Code_Copied") }}');
        }

        $('#apiTestForm').on('submit', function (e) {
            e.preventDefault();
            const partnerId = $('#test_partner_id').val();
            const apiKey = $('#test_api_key').val();
            const uid = $('#test_uid').val();
            const signature = $('#test_signature').val();

            if (!partnerId || !apiKey || !uid || !signature) {
                alert('{{ __("locale.Please_Fill_All_Required_Fields") }}');
                return;
            }

            $.ajax({
                url: '{{ route("admin.api.test") }}',
                method: 'POST',
                data: {
                    _token: '{{ csrf_token() }}',
                    partner_id: partnerId,
                    api_key: apiKey,
                    uid: uid,
                    signature: signature
                },
                success: function (response) {
                    $('#testResponse').text(JSON.stringify(response, null, 2));
                    $('#apiTestResult').show();
                },
                error: function (xhr) {
                    $('#testResponse').text(JSON.stringify(xhr.responseJSON, null, 2));
                    $('#apiTestResult').show();
                }
            });
        });
    </script>
@endsection