@extends('layouts.app')
@section('title', isset($method) ? 'Edit Payment Method' : 'Add Payment Method')

@section('content')
    <div class="mb-4">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                <li class="breadcrumb-item"><a href="{{ route('payment-methods.index') }}">Payment Methods</a></li>
                <li class="breadcrumb-item active">{{ isset($method) ? 'Edit' : 'Add' }}</li>
            </ol>
        </nav>
    </div>

    <div class="row justify-content-center">
        <div class="col-xl-7">
            <div class="card">
                <div class="card-header"><i
                        class="bi bi-credit-card me-2"></i>{{ isset($method) ? 'Edit Payment Method' : 'New Payment Method' }}
                </div>
                <div class="card-body">
                    <form
                        action="{{ isset($method) ? route('payment-methods.update', $method) : route('payment-methods.store') }}"
                        method="POST">
                        @csrf
                        @if(isset($method)) @method('PUT') @endif

                        <div class="row g-3">
                            <div class="col-md-8">
                                <label class="form-label">Method Name <span class="text-danger">*</span></label>
                                <input type="text" name="method_name" class="form-control"
                                    value="{{ old('method_name', $method->method_name ?? '') }}" required
                                    placeholder="e.g. Cash, DBBL Bank, bKash">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">Type <span class="text-danger">*</span></label>
                                <select name="type" id="pm_type" class="form-select" required>
                                    <option value="cash" {{ old('type', $method->type ?? '') === 'cash' ? 'selected' : '' }}>
                                        Cash</option>
                                    <option value="bank" {{ old('type', $method->type ?? '') === 'bank' ? 'selected' : '' }}>
                                        Bank</option>
                                    <option value="mfs" {{ old('type', $method->type ?? '') === 'mfs' ? 'selected' : '' }}>
                                        Mobile Banking (MFS)</option>
                                </select>
                            </div>

                            <div class="col-12 bank-fields"
                                style="{{ old('type', $method->type ?? 'cash') !== 'cash' ? '' : 'display:none' }}">
                                <hr>
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <label class="form-label">Bank Name</label>
                                        <input type="text" name="bank_name" class="form-control"
                                            value="{{ old('bank_name', $method->bank_name ?? '') }}">
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Account Number</label>
                                        <input type="text" name="account_number" class="form-control"
                                            value="{{ old('account_number', $method->account_number ?? '') }}">
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Branch</label>
                                        <input type="text" name="branch" class="form-control"
                                            value="{{ old('branch', $method->branch ?? '') }}">
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Routing Number</label>
                                        <input type="text" name="routing_number" class="form-control"
                                            value="{{ old('routing_number', $method->routing_number ?? '') }}">
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-check">
                                    <input type="checkbox" name="cheque_enabled" class="form-check-input"
                                        id="cheque_enabled" value="1" {{ old('cheque_enabled', $method->cheque_enabled ?? false) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="cheque_enabled">Accept Cheque Payments</label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-check">
                                    <input type="checkbox" name="is_active" class="form-check-input" id="is_active"
                                        value="1" {{ old('is_active', $method->is_active ?? true) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="is_active">Active</label>
                                </div>
                            </div>
                        </div>

                        <div class="d-flex justify-content-end gap-2 mt-4">
                            <a href="{{ route('payment-methods.index') }}" class="btn btn-outline-secondary">Cancel</a>
                            <button type="submit" class="btn btn-primary">
                                <i class="bi bi-check-lg me-1"></i>{{ isset($method) ? 'Update' : 'Create' }}
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $('#pm_type').on('change', function () {
            if ($(this).val() !== 'cash') {
                $('.bank-fields').slideDown(200);
            } else {
                $('.bank-fields').slideUp(200);
            }
        });
    </script>
@endpush