@extends('admin.layout.app')

@section('content')
    <div class="container-fluid">
        <div class="d-sm-flex align-items-center justify-content-between mb-4">
            <h1 class="h3 mb-0 text-gray-800"></h1>
            <div>
                <a href="{{ route('alert_recipients.edit', $alertRecipient) }}" class="btn btn-warning">
                    <i class="fas fa-edit"></i> Sửa
                </a>
                <a href="{{ route('alert_recipients.index') }}" class="btn btn-secondary">
                    <i class="fas fa-arrow-left"></i> Quay lại
                </a>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-8">
                <div class="card shadow mb-4">
                    <div class="card-header py-3">
                        <h6 class="m-0 font-weight-bold text-primary">Thông tin bot</h6>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <h6 class="text-primary">Thông tin cơ bản</h6>
                                <table class="table table-borderless">
                                    <tr>
                                        <td><strong>Tài khoản:</strong></td>
                                        <td>{{ $alertRecipient->user->name }}</td>
                                    </tr>
                                    <tr>
                                        <td><strong>Tên:</strong></td>
                                        <td>{{ $alertRecipient->name }}</td>
                                    </tr>
                                    <tr>
                                        <td><strong>Tên người dùng Telegram:</strong></td>
                                        <td><span class="badge badge-info">{{ $alertRecipient->tele_name }}</span></td>
                                    </tr>
                                    <tr>
                                        <td><strong>Trạng thái nhận cuộc gọi:</strong></td>
                                        <td>
                                            <span
                                                class="badge {{ $alertRecipient->alert_status ? 'badge-success' : 'badge-secondary' }}">
                                                {{ $alertRecipient->alert_status ? 'ENABLED' : 'DISABLED' }}
                                            </span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td><strong>Trạng thái nhận tin nhắn :</strong></td>
                                        <td>
                                            <span
                                                class="badge {{ $alertRecipient->message_alert_status ? 'badge-success' : 'badge-secondary' }}">
                                                {{ $alertRecipient->message_alert_status ? 'ENABLED' : 'DISABLED' }}
                                            </span>
                                        </td>
                                    </tr>
                                    {{-- <tr>
                                    <td><strong>Trạng thái phụ trách:</strong></td>
                                    <td>
                                        <span class="badge {{ $alertRecipient->in_charge_all_status ? 'badge-warning' : 'badge-secondary' }}">
                                            {{ $alertRecipient->in_charge_all_status ? 'ON DUTY' : 'OFF DUTY' }}
                                        </span>
                                    </td>
                                </tr> --}}
                                </table>
                            </div>

                            <div class="col-md-6">
                                <h6 class="text-primary">Lịch trình</h6>
                                <table class="table table-borderless">
                                    <tr>
                                        <td><strong>Thời gian nhận cuộc gọi:</strong></td>
                                        <td>{{ $alertRecipient->in_charge_start->format('H:i') }} -
                                            {{ $alertRecipient->in_charge_end->format('H:i') }}</td>
                                    </tr>
                                    <tr>
                                        <td><strong>Nhận toàn bộ cuộc gọi:</strong></td>
                                        <td>
                                            @if ($alertRecipient->isOnDuty())
                                                <span class="badge badge-success">YES</span>
                                            @else
                                                <span class="badge badge-secondary">NO</span>
                                            @endif
                                        </td>
                                    </tr>
                                    {{-- <tr>
                                    <td><strong>Can Receive Alert:</strong></td>
                                    <td>
                                        @if ($alertRecipient->canReceiveAlert())
                                            <span class="badge badge-success">YES</span>
                                        @else
                                            <span class="badge badge-secondary">NO</span>
                                        @endif
                                    </td>
                                </tr> --}}
                                    {{-- <tr>
                                    <td><strong>Cảnh báo cuối cùng:</strong></td>
                                    <td>
                                        @if ($alertRecipient->last_alert_time)
                                            <small class="text-muted">{{ $alertRecipient->last_alert_time->format('d/m/Y H:i:s') }}</small>
                                        @else
                                            <span class="text-muted">Never</span>
                                        @endif
                                    </td>
                                </tr> --}}
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="card shadow mb-4">
                    <div class="card-header py-3">
                        <h6 class="m-0 font-weight-bold text-primary">Cấu hình Telegram</h6>
                    </div>
                    <div class="card-body">
                        <div class="form-group">
                            <label><strong>Bot Token:</strong></label>
                            <div class="input-group">
                                <input type="text" class="form-control"
                                    value="{{ $alertRecipient->tele_chat_bot_token }}" readonly>
                                <div class="input-group-append">
                                    <button class="btn btn-outline-secondary" type="button"
                                        onclick="copyToClipboard('{{ $alertRecipient->tele_chat_bot_token }}')">
                                        <i class="fas fa-copy"></i>
                                    </button>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label><strong>Chat ID:</strong></label>
                            <div class="input-group">
                                <input type="text" class="form-control" value="{{ $alertRecipient->tele_chat_id }}"
                                    readonly>
                                <div class="input-group-append">
                                    <button class="btn btn-outline-secondary" type="button"
                                        onclick="copyToClipboard('{{ $alertRecipient->tele_chat_id }}')">
                                        <i class="fas fa-copy"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card shadow mb-4">
                    <div class="card-header py-3">
                        <h6 class="m-0 font-weight-bold text-primary">Hành động nhanh</h6>
                    </div>
                    <div class="card-body">
                        <div class="d-grid gap-2">
                            <button class="btn btn-success test-alert" data-id="{{ $alertRecipient->id }}">
                                <i class="fas fa-phone"></i> Gửi tin nhắn và gọi điện thử nghiệm
                            </button>

                            <button
                                class="btn  toggle-alert {{ $alertRecipient->alert_status ? 'btn-success' : 'btn-secondary' }}"
                                data-id="{{ $alertRecipient->id }}" data-status="{{ $alertRecipient->alert_status }}">
                                <i class="fas fa-bell"></i> {{ $alertRecipient->alert_status ? 'Tắt' : 'Bật' }} Trạng thái
                                nhận cuộc gọi
                            </button>
                            <button
                                class="btn  toggle-alert-msg {{ $alertRecipient->message_alert_status ? 'btn-success' : 'btn-secondary' }}"
                                data-id="{{ $alertRecipient->id }}"
                                data-status="{{ $alertRecipient->message_alert_status }}">
                                <i class="fas fa-bell"></i> {{ $alertRecipient->message_alert_status ? 'Tắt' : 'Bật' }}
                                Trạng thái nhận tin nhắn
                            </button>
                            <button
                                class="btn btn-info toggle-incharge {{ $alertRecipient->in_charge_all_status ? 'btn-warning' : 'btn-secondary' }}"
                                data-id="{{ $alertRecipient->id }}"
                                data-status="{{ $alertRecipient->in_charge_all_status }}">
                                <i class="fas fa-clock"></i>
                                {{ $alertRecipient->in_charge_all_status ? 'Tắt nhận toàn bộ cuộc gọi' : 'Bật nhận toàn bộ cuộc gọi' }}
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        function copyToClipboard(text) {
            navigator.clipboard.writeText(text).then(function() {
                alert('Copied to clipboard!');
            });
        }

        $(document).ready(function() {
            // Toggle Alert Status
            $('.toggle-alert').click(function() {
                const id = $(this).data('id');

                $.ajax({
                    url: `/admin/alert-recipients/${id}/toggle-alert`,
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.success) {
                            location.reload();
                        }
                    }
                });
            });
            $('.toggle-alert-msg').click(function() {
                const id = $(this).data('id');

                $.ajax({
                    url: `/admin/alert-recipients/${id}/toggle-message-alert`,
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.success) {
                            location.reload();
                        }
                    }
                });
            });
            // Toggle In Charge Status
            $('.toggle-incharge').click(function() {
                const id = $(this).data('id');

                $.ajax({
                    url: `/admin/alert-recipients/${id}/toggle-incharge`,
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.success) {
                            location.reload();
                        }
                    }
                });
            });

            // Test Alert
            $('.test-alert').click(function() {
                const id = $(this).data('id');

                if (confirm('Gửi cảnh báo thử nghiệm tới người nhận này?')) {
                    $.ajax({
                        url: `/admin/alert-recipients/${id}/test`,
                        method: 'POST',
                        data: {
                            _token: '{{ csrf_token() }}'
                        },
                        success: function(response) {
                            if (response.success) {
                                alert('Đã gửi cảnh báo thử nghiệm thành công!');
                            } else {
                                alert('Error: ' + response.message);
                            }
                        }
                    });
                }
            });
        });
    </script>
@endpush