{{-- Extends layout --}}
@extends('layout.default')

{{-- Content --}}
@section('content')
    @if(Session::has('error'))
        <p class="alert alert-danger">{{ Session::get('error') }}</p>
    @endif
    <div class="card card-custom">            
        <div class="card-header flex-wrap border-0 pt-6 pb-0">
            <div class="card-title">
                <h3 class="card-label">{{ Str::singular($page->title) }} Management</h3>
            </div>
            <div class="card-toolbar">
                <a href="{{ url('letters') }}" class="btn btn-success mr-2">Letter Management</a>
            </div>
        </div>

        <div class="card-body data-table-container">
            <table class="table table-hover table-bordered data-tables"
                   data-url="{{ $page->link.'/lists' }}" data-form="page"
                   data-length="20">
                <thead>
                <tr>
                    <th data-orderable="false">Name</th>
                    <th data-orderable="false">Send date</th>
                    <th data-orderable="false">Status</th>
                    <th data-orderable="false">Options</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>


    <div class="modal fade" id="editCampaignModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Edit Campaign</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <input type="hidden" name="ecmToken" id="ecmToken" value="{{ csrf_token() }}">
                    <div class="form-group">
                        <label>Name <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" placeholder="Enter campaign name" id="ecmName"/>
                        <div class="invalid-feedback" id="ecmNameError"></div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-primary font-weight-bold" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary font-weight-bold" id="ecmSubmit">Update</button>
                </div>
            </div>
        </div>
    </div>
@endsection

{{-- Styles --}}
@section('styles')
    <link href="{{ asset('plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="{{asset('css/pages/style.css')}}">
@endsection

{{-- Scripts --}}
@section('scripts')
    <script>
        var link = '{{ $page->link }}';
    </script>
    <script src="{{ asset('plugins/custom/datatables/datatables.bundle.js') }}" type="text/javascript"></script>
    <script type="text/javascript" src="{{ asset('js/developer/ajax-crud.js') }}"></script>

    <script>
        $(document).ready(function () {
            $(document).on("click", ".editCampaign", function (e) {
                $('#ecmName').val($(this).data('name')).data('value', $(this).data('name')).data('id', $(this).data('id'));
                $('#editCampaignModal').modal('show');
            });
            $(document).on("keypress", "#ecmName", function (e) {
                $('#ecmName').removeClass('is-invalid');
                $("#ecmNameError").html("");
            });
        });
    </script>
@endsection