@extends('admin.layouts.app')

@section('title', 'Kurumlar')
@section('styles')
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.24/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">

@endsection

@section('content')
<div class="container-fluid">
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h3 class="card-title">Kurumlar</h3>
            <div class="card-tools ml-auto">
                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#kurumModal">
                    Yeni Kurum Ekle
                </button>
            </div>
        </div>
        <div class="card-body">
            <table class="table table-bordered table-striped" id="kurumlarTable">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Adı</th>
                        <th>Adres</th>
                        <th>Telefon</th>
                        <th>E-posta</th>
                        <th>Durum</th>
                        <th>İşlemler</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($institutions as $institution)
                    <tr>
                        <td>{{ $institution->id }}</td>
                        <td>{{ $institution->name }}</td>
                        <td>{{ $institution->address }}</td>
                        <td>{{ $institution->phone }}</td>
                        <td>{{ $institution->email }}</td>
                        <td>{{ $institution->status == 'active' ? 'Aktif' : 'Pasif' }}</td>
                        <td>
                            <button class="btn btn-sm btn-dark duzenle-btn" 
                                data-id="{{ $institution->id }}"
                                data-name="{{ $institution->name }}"
                                data-address="{{ $institution->address }}"
                                data-phone="{{ $institution->phone }}"
                                data-email="{{ $institution->email }}"
                                data-status="{{ $institution->status }}">
                                <i class="bi bi-pencil-square"></i>
                            </button>
                            <button class="btn btn-sm btn-danger sil-btn" data-id="{{ $institution->id }}">
                                <i class="bi bi-trash"></i>
                            </button>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- Kurum Ekleme/Düzenleme Modalı -->
<div class="modal fade" id="kurumModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalBaslik">Yeni Kurum Ekle</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form id="kurumForm" method="POST">
                @csrf

                <input type="hidden" id="method" name="_method">
                <input type="hidden" id="kurum_id" name="kurum_id">
                <div class="modal-body">
                    <div class="form-group">
                        <label>Kurum Adı</label>
                        <input type="text" class="form-control" id="name" name="name" required>
                        <small class="form-text text-muted">En az 5 karakter giriniz.</small>
                    </div>
                    <div class="form-group">
                        <label>Adres</label>
                        <textarea class="form-control" id="address" name="address" required></textarea>
                    </div>
                    <div class="form-group">
                        <label>Telefon</label>
                        <div class="input-group">
                            <div class="input-group-prepend">
                                <select class="form-control" id="ulke_kodu" name="ulke_kodu" style="width: auto;">
                                    <option value="+90" selected>+90 (TR)</option>
                                    <option value="+1">+1 (US/CA)</option>
                                    <option value="+44">+44 (UK)</option>
                                    <option value="+49">+49 (DE)</option>
                                    <option value="+33">+33 (FR)</option>
                                    <option value="+39">+39 (IT)</option>
                                    <!-- Diğer ülke kodları buraya eklenebilir -->
                                </select>
                            </div>
                            <input type="text" class="form-control" id="phone" name="phone" placeholder="5XX XXX XX XX" required>
                        </div>
                        <small class="form-text text-muted">Örnek format: 555 123 45 67 (Başında 0 olmadan)</small>
                    </div>
                    <div class="form-group">
                        <label>E-posta</label>
                        <input type="email" class="form-control" id="email" name="email" placeholder="ornek@domain.com" required>
                        <small class="form-text text-muted">Geçerli bir e-posta adresi giriniz.</small>
                    </div>
                    <div class="form-group">
                        <label>Durum</label>
                        <select class="form-control" id="status" name="status">
                            <option value="active">Aktif</option>
                            <option value="passive">Pasif</option>
                        </select>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">İptal</button>
                    <button type="submit" class="btn btn-primary" id="kaydetBtn">Kaydet</button>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection
@section('scripts')

<script src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.24/js/dataTables.bootstrap4.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script type="text/javascript">
$(document).ready(function() {
    // DataTable başlatma
    $('#kurumlarTable').DataTable({
        "language": {
            "url": "//cdn.datatables.net/plug-ins/1.10.24/i18n/Turkish.json"
        }
    });

    // Telefon formatı için input mask
    $('#phone').on('input', function() {
        var number = $(this).val().replace(/[^\d]/g, '');
        
        // Eğer numara 0 ile başlıyorsa kaldır
        if (number.startsWith('0')) {
            number = number.substring(1);
        }
        
        if (number.length > 10) number = number.substr(0, 10);
        var formatted = '';
        
        if (number.length > 0) formatted += number.substr(0, 3);
        if (number.length > 3) formatted += ' ' + number.substr(3, 3);
        if (number.length > 6) formatted += ' ' + number.substr(6, 2);
        if (number.length > 8) formatted += ' ' + number.substr(8);
        
        $(this).val(formatted);
    });

    // Form gönderimi
    $('#kurumForm').on('submit', function(e) {
        e.preventDefault();
        
        // Form verilerini temizle
        $('.is-invalid').removeClass('is-invalid');
        $('.invalid-feedback').remove();
        
        var kurum_id = $('#kurum_id').val();
        var formData = $(this).serializeArray();
        
        // Validasyon kuralları
        var name = $('#name').val().trim();
        var address = $('#address').val().trim();
        var email = $('#email').val().trim();
        
        var hatalar = [];
        
        // Kurum Adı validasyonu
        if (name === '') {
            hatalar.push({field: 'name', message: 'Kurum adı zorunludur'});
        } else if (name.length < 5) {
            hatalar.push({field: 'name', message: 'Kurum adı en az 5 karakter olmalıdır'});
        }
        
        // Adres validasyonu
        if (address === '') {
            hatalar.push({field: 'address', message: 'Adres zorunludur'});
        } else if (address.length < 10) {
            hatalar.push({field: 'address', message: 'Adres en az 10 karakter olmalıdır'});
        }
        
        // Email validasyonu
        var emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
        if (email === '') {
            hatalar.push({field: 'email', message: 'E-posta adresi zorunludur'});
        } else if (!emailRegex.test(email)) {
            hatalar.push({field: 'email', message: 'Geçerli bir e-posta adresi giriniz (örn: ornek@domain.com)'});
        }
        
        // Telefon validasyonu
        var ulkeKodu = $('#ulke_kodu').val();
        var phone = $('#phone').val().replace(/[^\d]/g, '');
        
        if (phone === '') {
            hatalar.push({field: 'phone', message: 'Telefon numarası zorunludur'});
        } else {
            // Türkiye numarası kontrolü
            if (ulkeKodu === '+90') {
                if (phone.length !== 10) {
                    hatalar.push({field: 'phone', message: 'Türkiye telefon numarası 10 haneli olmalıdır'});
                } else if (!phone.startsWith('5')) {
                    hatalar.push({field: 'phone', message: 'Türkiye telefon numarası 5 ile başlamalıdır'});
                }
            } else {
                // Diğer ülkeler için minimum 8, maksimum 15 hane kontrolü
                if (phone.length < 8 || phone.length > 15) {
                    hatalar.push({field: 'phone', message: 'Geçerli bir telefon numarası giriniz (8-15 hane)'});
                }
            }
        }
        
        // Telefon numarasını ülke koduyla birleştir
        var fullPhone = ulkeKodu + phone;
        
        // formData içindeki telefon değerini güncelle
        formData = formData.filter(function(item) {
            return item.name !== 'phone';
        });
        formData.push({name: 'phone', value: fullPhone});
        
        // Hata varsa göster
        if (hatalar.length > 0) {
            hatalar.forEach(function(hata) {
                var input = $('#' + hata.field);
                input.addClass('is-invalid');
                input.after('<div class="invalid-feedback">' + hata.message + '</div>');
            });
            return false;
        }

        // Validasyon başarılı ise AJAX isteği gönder
        $.ajax({
            url: kurum_id ? "{{ URL::to('/admin/institutions') }}/" + kurum_id : "{{ route('admin.institutions.store') }}",
            type: 'POST',
            data: $.param(formData),
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            success: function(response) {
                $('#kurumModal').modal('hide');
                Swal.fire({
                    title: 'Başarılı!',
                    text: 'İşlem başarıyla tamamlandı.',
                    icon: 'success'
                }).then(() => {
                    window.location.reload();
                });
            },
            error: function(xhr) {
                if (xhr.status === 422) {
                    var errors = xhr.responseJSON.errors;
                    Object.keys(errors).forEach(function(field) {
                        $('#' + field).addClass('is-invalid');
                        $('#' + field).after('<div class="invalid-feedback">' + errors[field][0] + '</div>');
                    });
                } else {
                    Swal.fire({
                        title: 'Hata!',
                        text: 'Bir hata oluştu.',
                        icon: 'error'
                    });
                }
            }
        });
    });

    // Düzenleme modalını aç
    $('.duzenle-btn').click(function() {
        var kurum = $(this).data();
        $('#modalBaslik').text('Kurum Düzenle');
        $('#kurum_id').val(kurum.id);
        $('#kurumForm').attr('method', 'PUT');
        $('#method').val('PUT');
        $('#name').val(kurum.name);
        $('#address').val(kurum.address);
        $('#status').val(kurum.status);
        
        // Telefon numarasını parçala ve uygun şekilde yerleştir
        var phone = kurum.phone;
        if (phone) {
            var ulkeKoduMatch = phone.match(/^\+\d+/);
            if (ulkeKoduMatch) {
                var ulkeKodu = ulkeKoduMatch[0];
                var numara = phone.substring(ulkeKodu.length).replace(/[^\d]/g, '');
                
                $('#ulke_kodu').val(ulkeKodu);
                $('#phone').val(numara.replace(/(\d{3})(\d{3})(\d{2})(\d{2})/, '$1 $2 $3 $4'));
            }
        }
        
        $('#email').val(kurum.email);
        $('#kurumModal').modal('show');
    });

    // Modal kapandığında formu sıfırla
    $('#kurumModal').on('hidden.bs.modal', function() {
        $('#kurumForm')[0].reset();
        $('#kurum_id').val('');
        $('#method').val('POST');
        $('#kurumForm').attr('method', 'POST');
        $('#modalBaslik').text('Yeni Kurum Ekle');
    });

    // Silme işlemi
    $('.sil-btn').click(function() {
        var kurum_id = $(this).data('id');
        
        Swal.fire({
            title: 'Emin misiniz?',
            text: "Bu kurum silinecek!",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Evet, sil!',
            cancelButtonText: 'İptal'
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: '/admin/institutions/' + kurum_id,
                    type: 'DELETE',
                    data: {
                        "_token": "{{ csrf_token() }}"
                    },
                    success: function(response) {
                        Swal.fire(
                            'Silindi!',
                            'Kurum başarıyla silindi.',
                            'success'
                        ).then(() => {
                            window.location.reload();
                        });
                    }
                });
            }
        });
    });
});
</script>
@endsection