@extends('layouts.app')

<style>

    .clearfix:after {
        content: "";
        display: table;
        clear: both;
    }

    a {
        color: #0087C3;
        text-decoration: none;
    }

    body {
        position: relative;
        margin: 0 auto;
        width: 32cm;
        color: #555555;
        background: #FFFFFF;
        font-family: Arial, sans-serif;
        font-size: 12px;
        font-family: SourceSansPro;
    }

    header {
        padding: 10px 0;
        margin-bottom: 15px;
        border-bottom: 1px solid #AAAAAA;
    }

    #logo {
        float: left;
        margin-top: 6px;
    }

    #logo img {
        height: 100px;
    }

    #company {
        float: right;
        text-align: right;
    }

    #details {
        margin-bottom: 50px;
    }

    #client {
        padding-left: 6px;
        border-left: 6px solid #0087C3;
        float: left;
    }
</style>

@section('content')
    <div class="card card-info" id="printcontent">
        <div class="card-header">
            {{-- <h3 class="card-title">Manage SMS</h3> --}}
            <div class="row">
                <div class="col-md-9">
                    <h3 class="card-title">Manage SMS</h3>
                </div>
                <div class="col-md-3 justify-content-end">
                    <a href="{{ route('send_member') }}" class="btn float-right btn-dark">
                      Send SMS
                    </a>
                </div>

            </div>
        </div>

        <header class="clearfix" id="company_details" style="display:none"><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <table cellpadding="0" cellspacing="0" >
                <tr class="top">
                    <td colspan="2">
                        <table>
                            <tr>
                            <td>
                                <img src="{{ asset('/storage/app/public/'.$company->logo) }}"  style="width: 180px; height:120px">
                                </td>
                                <td style="padding-left: 130px">
                                 <h2 style="padding-left:40px;color:#297f39">{{$company->name}} </h2>
                                 <p style="text-align:center;padding-left:10px; line-height:20px;"><b>{{ $company->address }}<br>
                                    {{ $company->mobile }}</b><br>
                                    <b>{{ $company->email }}</b>
                                    </p>
                                </td>

                                  <td>

                                  </td>

                            </tr>
                        </table>
                    </td>
                </tr>

            </table> </header>

        <div class="card-body">
            <div class="row mb-4 ">
                <div class="col-12">
                    <form class="form-inline float-right ml-3" action="{{ route('sms_list') }}" method="get">
                        @csrf
                        <div class="input-group input-group-sm">
                            <input class="form-control form-control-navbar" name="query"  type="search" placeholder="Search" aria-label="Search">
                            <div class="input-group-append">
                                <button class="btn border-secondary btn-navbar" type="submit">
                                    <i class="fas fa-search"></i>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <table id="example1" class="table table-bordered table-striped">
                <thead>
                <tr>
                    <th>SL</th>
                      <th>Member name</th>
                    <th>Mobile Number</th>
                    <th>Message</th>
                    <th  class="hide_content">Action</th>
                </tr>
                </thead>
                <tbody>
                @if ($sms)
                    @foreach($sms as $sms)

                        <tr>
                             <td>{{$loop->index+1}}</td>
                             <td>{{ $sms->name }}</td>
                            <td>{{ $sms->number }}</td>
                            <td>{{ $sms->sms }}</td>
                            <td  class="hide_content">
                                <a href="{{ route('edit_single_msg', $sms->id) }}" class="btn btn-sm btn-primary"><i class="fa fa-edit"></i></a>
                             <a onclick="return confirm('Are you sure,You want to delete this item ?');" href="{{ route('delete_single_msg', $sms->id) }}" class="btn btn-sm btn-danger"><i class="fa fa-trash"></i></a>
                           <a href="{{ route('resend_single_msg', $sms->id) }}" class="btn btn-sm btn-info">Resend</a>
                        </td>
                        </tr>
                    @endforeach
                @endif
                </tbody>
            </table>
        </div>
        <button type="button" class="btn btn-sm btn-block btn-primary mt-3 hide_content" onclick="printDiv('printcontent')">Print</button>

    </div>

@endsection
<script>
    function deleteHead(route) {
        $('#deleteForm').attr("action", route);
    }
function printDiv(divName) {

$('#company_details').css('display', 'block');
$('.hide_content').css('display', 'none');

var printContents = document.getElementById(divName).innerHTML;
var originalContents = document.body.innerHTML;

document.body.innerHTML = printContents;

window.print();

document.body.innerHTML = originalContents;

window.location.href = "{{ url()->current() }}";

$('#company_details').css('display', 'none');
$('.hide_content').css('display', 'block');
}
</script>