@extends('crudbooster::admin_template')

@push("head")
    <!-- Dependencies -->
    <link rel="stylesheet" href="{{ asset('/vendor/libs/datatables/datatables.css') }}">
    <style>
        .panel-heading{
            padding: 8px 15px;
        }
        div.dataTables_wrapper div.dataTables_processing {
            color: #ffcb00 !important;
        }
    </style>
    <link rel="stylesheet" href="{{ asset('/css/application.css') }}">


@endpush
@push('bottom')
    <script src="{{ asset('/vendor/libs/datatables/datatables.js') }}"></script>
    <script src="{{ asset('/js/tables_datatables.js') }}"></script>
    <script type="text/javascript">
        $(document).ready( function () {
            $('#todaycron_table').DataTable({
                ajax: {
                    url: "{{ route('mailrecord.all_cron') }}"
                },
                "autoWidth": true,
                "serverSide": true,
                "pageLength": 25,
                "ordering": true,
                // "bSort": false,
                "searching": true,
                // "order": [[1, "desc"]],
                "processing": true,
                "paging": true,
                "pagingType": 'full_numbers',

                columns:[
                    {
                        "data": "id",
                        searchable: false,
                        render: function (data, type, row, meta) {
                            return meta.row + meta.settings._iDisplayStart + 1;
                        }
                    },
                    {data:'therapistName','name':'users.first_name',className:"text-center", orderable: true,searchable: true},
                    {data:'therapistEmail','name':'users.email',className:"text-center", orderable: false,searchable: true},
                    {data:"userName",'name':'subuser.first_name',className:"text-center", orderable: false,searchable: true},
                    {
                        data: "user_email",
                        name:'user_email',
                        searchable: true,
                        sortable: false,
                        className: "text-center",
                        render: function ( data, type, row ) {
                            if (row.user_email != '') return row.user_email +  "<br> <b>via setup email</b>";
                            else if (row.userCronEmail != '') return row.userCronEmail + "<br> <b>via user cron email</b>";
                            else return row.userEmail + "<br> <b>via user email</b>";
                        }
                    },
                    {
                        data: "status",
                        name:"cronmail_record.status",
                        searchable: false,
                        orderable: false,
                        sortable: false,
                        className: "text-center",
                        render: function ( data, type, row ) {
                            if (row.status === 1) {
                                return "<span class='btn bg-success text-white'>Success</span>";
                            }else return "<span class='btn bg-danger text-warning'>Failed</span>";
                            return data;
                        }
                    },
                    {
                        data: "mail_response",
                        name:"cronmail_record.mail_response",
                        searchable: false,
                        orderable: false,
                        sortable: false,
                        className: "text-center",
                        render: function ( data, type, row ) {
                            return "<span class='btn bg-warning text-primary' style='text-transform: capitalize;'>"+row.mail_response+"</span>";
                        }
                    },
                    {data:"execution_time",name:"cronmail_record.execution_time",className:"execution_time", orderable: false, searchable: false},
                    {
                        data:"mail_type",
                        name:'cronmail_record.mail_type',
                        className:"text-center",
                        orderable: false,
                        searchable: false,
                        render: function (data, type, row ) {
                            if (row.mail_type === 0) {
                                return "<span class='btn bg-success text-white'>Start Mail</span>";
                            }else return "<span class='btn bg-warning text-white'>End Mail</span>";
                            return data;
                        }
                    },
                    {data:"created_at",name:"cronmail_record.created_at",className:"created_at", orderable: false,searchable: false}
                ],
            });
        });
    </script>

@endpush


@section('content')
<!-- Your html goes here -->
<div class='panel panel-default'>
    <div class='panel-heading eap-box'>
        <div class="dark-color">
            <h4 style="display: inline-block;"><b>Remote Treatment Records</b></h4>
            <div class="pull-right" style="top: 5px; position: relative">
                <a href="{{route('mailrecord.todays_cron')}}"><button class="btn btn-primary"><b>Todays Records</b></button></a>
                <a href="{{route('mailrecord.upcoming_cron')}}"><button class="btn btn-info"><b>Cron Queue</b></button></a>
            </div>
        </div>
    </div>

    <div class='panel-body'>
        <div class="card-datatable table-responsive">
            <table class="table table-striped table-bordered" id="todaycron_table">
                <thead>
                    <tr>
                        <th>SNo</th>
                        <th>Therapist</th>
                        <th>Therapist Email</th>
                        <th>User</th>
                        <th>User Email</th>
                        <th>Status</th>
                        <th>Mail Send Response</th>
                        <th>Execution Time</th>
                        <th>Mail Type</th>
                        <th>Delivered Time</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>


@endsection