@extends('layouts.admin')

@section('title', 'Edit Carrier')

@section('content')
@php
    $processType = old('process_type', $carrier->process_type ?? 'automatic');
@endphp

<x-admin.form-page
    title="Edit Carrier"
    :crumbs="[['label' => 'Carriers', 'url' => route('admin.carriers.index')], 'Edit']"
    :back-url="route('admin.carriers.index')"
    :action="route('admin.carriers.update', $carrier->id)"
    method="PUT"
    form-id="carrierForm"
    submit-label="Update Carrier"
>
    <section class="pp-card">
        <div class="pp-card__head">
            <span class="pp-card__icon"><i class="bi bi-box-seam"></i></span>
            <div>
                <h2 class="pp-card__title">Carrier Details</h2>
                <p class="pp-card__sub">Name, slug and process type</p>
            </div>
        </div>
        <div class="pp-card__body">
            <div class="pp-grid pp-grid--2">
                <div class="pp-field">
                    <label for="name">Name <span class="pp-req">*</span></label>
                    <input type="text" name="name" id="name" class="form-control @error('name') is-invalid @enderror"
                           value="{{ old('name', $carrier->name) }}" required>
                    @error('name')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                </div>

                <div class="pp-field">
                    <label for="slug">Slug <span class="pp-req">*</span></label>
                    <input type="text" name="slug" id="slug" class="form-control @error('slug') is-invalid @enderror"
                           value="{{ old('slug', $carrier->slug) }}" required>
                    @error('slug')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                </div>
            </div>

            <div class="pp-toggles mt-3">
                <label class="pp-toggle" for="enabled">
                    <input type="checkbox" name="enabled" class="form-check-input" role="switch" id="enabled"
                           value="1" {{ old('enabled', $carrier->enabled) ? 'checked' : '' }}>
                    Enabled
                </label>
            </div>

            <div class="pp-field mt-3">
                <label>Process Type <span class="pp-req">*</span></label>
                <div class="pp-toggles">
                    <label class="pp-toggle" for="process_type_automatic">
                        <input class="form-check-input" type="radio" name="process_type" id="process_type_automatic" value="automatic" {{ $processType === 'automatic' ? 'checked' : '' }}>
                        Automatic
                    </label>
                    <label class="pp-toggle" for="process_type_manual">
                        <input class="form-check-input" type="radio" name="process_type" id="process_type_manual" value="manual" {{ $processType === 'manual' ? 'checked' : '' }}>
                        Manual
                    </label>
                </div>
                <span class="pp-hint">Automatic: API creates shipment. Manual: staff enters tracking on the order.</span>
            </div>
        </div>
    </section>

    <section class="pp-card mt-3" id="carrier-config-fields" style="{{ $processType === 'manual' ? 'display:none;' : '' }}">
        <div class="pp-card__head">
            <span class="pp-card__icon"><i class="bi bi-key"></i></span>
            <div>
                <h2 class="pp-card__title">API Configuration</h2>
                <p class="pp-card__sub">Credentials and shipment form schema</p>
            </div>
        </div>
        <div class="pp-card__body">
            <div class="pp-field">
                <label for="api_keys">API Keys (JSON) <span class="pp-req">*</span></label>
                <textarea name="api_keys" id="api_keys" class="form-control @error('api_keys') is-invalid @enderror"
                          rows="8">{{ old('api_keys', json_encode($apiKeys, JSON_PRETTY_PRINT)) }}</textarea>
                @error('api_keys')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                <span class="pp-hint">JSON object containing API credentials. Will be encrypted.</span>
            </div>

            <div class="pp-field mt-3">
                <label for="config_schema">Config Schema (JSON)</label>
                <textarea name="config_schema" id="config_schema" class="form-control @error('config_schema') is-invalid @enderror"
                          rows="10">{{ old('config_schema', $carrier->config_schema ? json_encode($carrier->config_schema, JSON_PRETTY_PRINT) : '') }}</textarea>
                @error('config_schema')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                <span class="pp-hint">JSON array defining form fields for shipment creation.</span>
            </div>
        </div>
    </section>
</x-admin.form-page>

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    var automatic = document.getElementById('process_type_automatic');
    var manual = document.getElementById('process_type_manual');
    var configFields = document.getElementById('carrier-config-fields');
    function toggle() {
        configFields.style.display = (automatic && automatic.checked) ? '' : 'none';
    }
    if (automatic) automatic.addEventListener('change', toggle);
    if (manual) manual.addEventListener('change', toggle);
});
</script>
@endpush
@endsection