@extends('admin.master_layout')
@section('title')
<title>{{__('admin.Send Email')}}</title>
@endsection

@section('styles')
<!-- Include Summernote CSS -->
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
<style>
    .template-preview {
        padding: 15px;
        border: 1px solid #ddd;
        border-radius: 4px;
        margin-bottom: 20px;
    }
    .variable-list {
        background: #f8f9fa;
        padding: 10px;
        border-radius: 4px;
        margin-bottom: 15px;
    }
    .variable-list code {
        margin: 0 5px;
        padding: 2px 5px;
        background: #e9ecef;
        border-radius: 3px;
    }
</style>
@endsection

@section('admin-content')
<div class="main-content">
    <section class="section">
        <div class="section-header">
            <h1>{{__('admin.Send Email')}}</h1>
            <div class="section-header-breadcrumb">
                <div class="breadcrumb-item active">
                    <a href="{{ route('admin.dashboard') }}">{{__('admin.Dashboard')}}</a>
                </div>
                <div class="breadcrumb-item">{{__('admin.Send Email')}}</div>
            </div>
        </div>

        <div class="section-body">
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-header">
                            <h4>{{__('admin.Send Email to All Contacts')}}</h4>
                        </div>
                        <div class="card-body">
                            <form action="{{ route('admin.each-subscriber-email') }}" method="POST">
                                @csrf
                                
                                <!-- Available Variables -->
                                <div class="variable-list">
                                    <h6>{{__('admin.Available Variables:')}}</h6>
                                    <p>
                                        <code>{name}</code> - {{__('admin.Contact Name')}}
                                        <code>{email}</code> - {{__('admin.Contact Email')}}
                                        <code>{phone}</code> - {{__('admin.Contact Phone')}}
                                    </p>
                                </div>

                                <!-- Template Selection -->
                                <div class="form-group">
                                    <label>{{__('admin.Email Template')}}</label>
                                    <select name="template_id" class="form-control" id="template_select">
                                        <option value="">{{__('admin.Custom Email')}}</option>
                                        @foreach($emailTemplates as $template)
                                            <option value="{{ $template->id }}">{{ $template->name }}</option>
                                        @endforeach
                                    </select>
                                </div>

                                <!-- Template Preview -->
                                <div id="template_preview" style="display: none;" class="template-preview">
                                    <h6>{{__('admin.Template Preview:')}}</h6>
                                    <div class="mb-3">
                                        <strong>{{__('admin.Subject:')}}</strong>
                                        <p id="preview_subject" class="mb-2"></p>
                                        <strong>{{__('admin.Message:')}}</strong>
                                        <div id="preview_message"></div>
                                    </div>
                                    <div class="custom-control custom-checkbox">
                                        <input type="checkbox" class="custom-control-input" id="customize_template" name="customize_template">
                                        <label class="custom-control-label" for="customize_template">
                                            {{__('admin.Customize this template')}}
                                        </label>
                                    </div>
                                </div>

                                <!-- Custom Email Section -->
                                <div id="custom_email_section">
                                    <div class="form-group">
                                        <label>{{__('admin.Subject')}} <span class="text-danger">*</span></label>
                                        <input type="text" class="form-control" name="subject" id="subject_input">
                                        @error('subject')
                                            <p class="text-danger">{{ $message }}</p>
                                        @enderror
                                    </div>

                                    <div class="form-group">
                                        <label>{{__('admin.Message')}} <span class="text-danger">*</span></label>
                                        <textarea name="message" id="message_input" class="summernote"></textarea>
                                        @error('message')
                                            <p class="text-danger">{{ $message }}</p>
                                        @enderror
                                    </div>
                                </div>

                                <div class="form-group">
                                    <button class="btn btn-primary" type="submit">
                                        <i class="fas fa-paper-plane"></i> {{__('admin.Send Email')}}
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Subscribers List -->
            <div class="row mt-4">
                <div class="col-12">
                    <div class="card">
                        <div class="card-header">
                            <h4>{{__('admin.Subscriber List')}}</h4>
                        </div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th>{{__('admin.SN')}}</th>
                                            <th>{{__('admin.Email')}}</th>
                                            <th>{{__('admin.Status')}}</th>
                                            <th>{{__('admin.Action')}}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($subscribers as $index => $subscriber)
                                            <tr>
                                                <td>{{ ++$index }}</td>
                                                <td>{{ $subscriber->email }}</td>
                                                <td>
                                                    @if($subscriber->status == 1)
                                                        <span class="badge badge-success">{{__('admin.Active')}}</span>
                                                    @else
                                                        <span class="badge badge-danger">{{__('admin.Inactive')}}</span>
                                                    @endif
                                                </td>
                                                <td>
                                                    <button class="btn btn-primary btn-sm" data-toggle="modal" 
                                                            data-target="#sendEmailModal-{{ $subscriber->id }}">
                                                        <i class="fas fa-envelope"></i>
                                                    </button>
                                                    <a href="javascript:;" data-toggle="modal" 
                                                       data-target="#deleteModal" 
                                                       class="btn btn-danger btn-sm" 
                                                       onclick="deleteData({{ $subscriber->id }})">
                                                        <i class="fas fa-trash"></i>
                                                    </a>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

<!-- Send Email Modal -->
@foreach($subscribers as $subscriber)
    <div class="modal fade" id="sendEmailModal-{{ $subscriber->id }}" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{__('admin.Send To')}} : {{ $subscriber->email }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('admin.specification-subscriber-email', $subscriber->id) }}" method="POST">
                        @csrf
                        <div class="form-group">
                            <label>{{__('admin.Subject')}} <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" name="subject">
                        </div>
                        <div class="form-group">
                            <label>{{__('admin.Message')}} <span class="text-danger">*</span></label>
                            <textarea name="message" class="summernote"></textarea>
                        </div>
                        <button class="btn btn-primary" type="submit">{{__('admin.Send')}}</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endforeach

<!-- Delete Modal -->
<!--div class="modal fade" id="deleteModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">{{__('admin.Delete')}}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>{{__('admin.Are you sure you want to delete?')}}</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">{{__('admin.Close')}}</button>
                <form id="deleteForm" action="" method="POST">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">{{__('admin.Delete')}}</button>
                </form>
            </div>
        </div>
    </div>
</div-->
@endsection

@section('scripts')
<!-- Include jQuery first (if not already included) -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<!-- Include Summernote JS -->



<script>
    alert('hh');
$(document).ready(function() {
    // Initialize Summernote
    alert('ready');
    $('.summernote').summernote({
        height: 200,
        toolbar: [
            ['style', ['style']],
            ['font', ['bold', 'italic', 'underline', 'clear']],
            ['fontname', ['fontname']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['table', ['table']],
            ['insert', ['link']],
            ['view', ['fullscreen', 'codeview']]
        ]
    });

    // Store templates data
  
});
function deleteData(id) {
    $("#deleteForm").attr('action', 'http://localhost/realtors/admin/delete-contact/' + id);
}
</script>
@endsection