
@if(($dnsSource ?? null) && $dnsSource !== 'registrar')
    <div class="alert alert-success py-2 px-3 d-flex align-items-center gap-2 mb-3">
        <i class="fas fa-check-circle"></i>
        <span>
            <strong>{{ __('store.clientarea_dns_managed_by') }}:</strong>
            @if($dnsSource === 'cloudflare') Cloudflare
            @elseif($dnsSource === 'powerdns') PowerDNS
            @else {{ ucfirst($dnsSource) }}
            @endif
            @if(isset($dnsZone) && $dnsZone?->last_synced_at)
                <span class="text-muted small ms-2">
                    ({{ __('store.clientarea_dns_last_synced') }}: {{ $dnsZone->last_synced_at->diffForHumans() }})
                </span>
            @endif
        </span>
    </div>
@elseif(($dnsSource ?? null) === 'registrar')
    <div class="alert alert-info py-2 px-3 d-flex align-items-center gap-2 mb-3">
        <i class="fas fa-info-circle"></i>
        <span>{{ __('store.clientarea_dns_managed_by_registrar') }}</span>
    </div>
@endif

<div class="d-flex justify-content-between align-items-center mb-3">
    <div>
        <h5 class="mb-1">{{ __('store.clientarea_domains_management_dns_title') }}</h5>
        <p class="text-muted mb-0">{{ __('store.clientarea_domains_management_dns_description') }}</p>
    </div>
    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#dnsRecordModal">
        <i class="fas fa-plus me-2"></i>{{ __('store.clientarea_domains_management_dns_add_record') }}
    </button>
</div>

@if($data)
    @php
        $records = $data['records'] ?? [];
    @endphp
    <div class="table-responsive">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th>{{ __('store.domain_manage.dns_type') }}</th>
                    <th>{{ __('store.domain_manage.dns_name') }}</th>
                    <th>{{ __('store.domain_manage.dns_value') }}</th>
                    <th>{{ __('store.domain_manage.dns_ttl') }}</th>
                    <th>{{ __('store.domain_manage.dns_priority') }}</th>
                    <th>{{ __('store.domain_manage.dns_actions') }}</th>
                </tr>
            </thead>
            <tbody>
                @forelse($records as $record)
                    <tr>
                        <td><span class="badge bg-primary">{{ $record['type'] }}</span></td>
                        <td>{{ $record['name'] ?? '@' }}</td>
                        <td class="text-break" style="max-width: 300px;">{{ $record['value'] }}</td>
                        <td>{{ $record['ttl'] ?? 3600 }}</td>
                        <td>{{ $record['priority'] ?? '-' }}</td>
                        <td>
                            <button type="button" class="btn btn-sm btn-outline-primary edit-dns"
                                    data-record='@json($record)'>
                                <i class="fas fa-edit"></i>
                            </button>
                            <form action="{{ route('store.auth.domains.manage.dns.delete', $domain->id) }}" method="POST" class="d-inline">
                                @csrf
                                @method('DELETE')
                                <input type="hidden" name="record_id" value="{{ $record['id'] }}">
                                <button type="submit" class="btn btn-sm btn-outline-danger" onclick="return confirm('{{ __('store.domain_manage.confirm_delete_dns') }}')">
                                    <i class="fas fa-trash"></i>
                                </button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="6" class="text-center text-muted">{{ __('store.domain_manage.no_dns_records') }}</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
@else
    <div class="alert alert-info">
        <i class="fas fa-info-circle me-2"></i>DNS kayıtları yüklenemedi.
    </div>
@endif

<!-- DNS Record Modal -->
<div class="modal fade" id="dnsRecordModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="dnsRecordModalLabel">{{ __('store.clientarea_domains_management_dns_add_record') }}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="dnsRecordForm" action="{{ route('store.auth.domains.manage.dns.add', $domain->id) }}" method="POST">
                @csrf
                <input type="hidden" name="_method" value="POST" id="dns-form-method">
                <input type="hidden" name="record_id" id="dns-record-id">
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="dns-record-type" class="form-label">{{ __('store.clientarea_domains_management_dns_record_type') }} <span class="text-danger">*</span></label>
                        <select class="form-select" id="dns-record-type" name="type" required>
                            <option value="">{{ __('common.please_select') }}</option>
                            <option value="A">A</option>
                            <option value="AAAA">AAAA</option>
                            <option value="CNAME">CNAME</option>
                            <option value="MX">MX</option>
                            <option value="TXT">TXT</option>
                            <option value="NS">NS</option>
                            <option value="SRV">SRV</option>
                        </select>
                        @error('type') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>
                    <div class="mb-3">
                        <label for="dns-record-name" class="form-label">{{ __('store.clientarea_domains_management_dns_record_name') }} <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="dns-record-name" name="name" required>
                        @error('name') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>
                    <div class="mb-3">
                        <label for="dns-record-value" class="form-label">{{ __('store.clientarea_domains_management_dns_record_value') }} <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" id="dns-record-value" name="value" required>
                        @error('value') <div class="invalid-feedback">{{ $message }}</div> @enderror
                    </div>
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="dns-record-ttl" class="form-label">{{ __('store.clientarea_domains_management_dns_ttl') }}</label>
                            <input type="number" class="form-control" id="dns-record-ttl" name="ttl" value="3600">
                        </div>
                        <div class="col-md-6 mb-3" id="dns-priority-group" style="display: none;">
                            <label for="dns-record-priority" class="form-label">{{ __('store.clientarea_domains_management_dns_priority') }}</label>
                            <input type="number" class="form-control" id="dns-record-priority" name="priority">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ __('store.common_cancel') }}</button>
                    <button type="submit" class="btn btn-primary">{{ __('store.common_save') }}</button>
                </div>
            </form>
        </div>
    </div>
</div>

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    const modal = document.getElementById('dnsRecordModal');
    const form = document.getElementById('dnsRecordForm');
    const typeSelect = document.getElementById('dns-record-type');
    const priorityGroup = document.getElementById('dns-priority-group');

    // Show/hide priority field based on record type
    typeSelect.addEventListener('change', function() {
        if (this.value === 'MX' || this.value === 'SRV') {
            priorityGroup.style.display = 'block';
        } else {
            priorityGroup.style.display = 'none';
        }
    });

    // Edit DNS record buttons
    document.querySelectorAll('.edit-dns').forEach(btn => {
        btn.addEventListener('click', function() {
            const record = JSON.parse(this.getAttribute('data-record'));

            document.getElementById('dnsRecordModalLabel').textContent = 'DNS Kaydını Düzenle';
            document.getElementById('dns-form-method').value = 'POST';
            form.action = '{{ route("store.auth.domains.manage.dns.update", $domain->id) }}';

            document.getElementById('dns-record-id').value = record.id || '';
            document.getElementById('dns-record-type').value = record.type || 'A';
            document.getElementById('dns-record-name').value = record.name || '';
            document.getElementById('dns-record-value').value = record.value || '';
            document.getElementById('dns-record-ttl').value = record.ttl || 3600;
            document.getElementById('dns-record-priority').value = record.priority || '';

            if (record.type === 'MX' || record.type === 'SRV') {
                priorityGroup.style.display = 'block';
            }

            new bootstrap.Modal(modal).show();
        });
    });

    // Reset form on modal close
    modal.addEventListener('hidden.bs.modal', function() {
        form.reset();
        document.getElementById('dnsRecordModalLabel').textContent = '{{ __("store.clientarea_domains_management_dns_add_record") }}';
        document.getElementById('dns-form-method').value = 'POST';
        form.action = '{{ route("store.auth.domains.manage.dns.add", $domain->id) }}';
        document.getElementById('dns-record-id').value = '';
        priorityGroup.style.display = 'none';
    });
});
</script>
@endpush

