@extends('layouts.vertical')

@section('css')
{{-- <link href="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/datatables/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/select2/select2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ Helper::assets('assets/libs/sweetalert/sweetalert.css') }}" rel="stylesheet" type="text/css" /> --}}
@endsection

@section('breadcrumb')
<div class="row page-title align-items-center">
    <div class="col-sm-6 col-xl-6">
        <h4 class="mb-1 mt-0 font-weight-medium">Message history</h4>
    </div>
    <div class="col-sm-6 col-xl-6">
        <div class="form-inline float-sm-right mt-3 mt-sm-0">
            <div class="btn-group">
                <a href="{{route('message.add')}}" class="btn btn-success btn-min-width">New message</a>
            </div>
        </div>
    </div>
</div>
@endsection

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                <div class="message-item pr-xl-5">
                    <div class="row mb-3">
                        <div class="col">
                            <h3 class="font-size-18">Message to parents and teachers</h3>
                            <p class="mb-0">21/03/20, 12:30 pm</p>
                        </div>
                        <div class="col-sm-auto mt-2 mt-sm-0">
                            <a class="text-success font-weight-semibold view-recipients" href="javascript:;">View recipients</a>
                        </div>
                    </div>
                    <div class="mb-4 mb-4 pr-xl-5">
                        <p class="mb-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
                        <p class="mb-0">Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
                    </div>
                    <div class="mb-2">
                        <h6 class="font-size-16 mb-3">Attachment</h6>
                        <div class="upload-multiple-file">
                            <div class="upload-item">
                                <div class="upload-file show">
                                    <i class="icon-pdf"></i>
                                </div>
                                <span class="file-name">Test.pdf</span>
                            </div>
                        </div>
                    </div>
                    <div class="">
                        <h6 class="font-size-16">Message sent to the <span class="text-success">parents and teachers of room name 1, room name 2, and room name 3.</span></h6>
                    </div>
                </div>
                <div class="row border-bottom my-5 mx-n5"></div>
                <div class="message-item pr-xl-5">
                    <div class="row mb-3">
                        <div class="col">
                            <h3 class="font-size-18">Message to teachers</h3>
                            <p class="mb-0">19/03/20, 10:30 am</p>
                        </div>
                        <div class="col-sm-auto mt-2 mt-sm-0">
                            <a class="text-success font-weight-semibold view-recipients" href="javascript:;">View recipients</a>
                        </div>
                    </div>
                    <div class="mb-4 mb-4 pr-xl-5">
                        <p class="mb-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p>
                        <p class="mb-0">Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
                    </div>
                    <div class="mb-2">
                        <h6 class="font-size-16 mb-3">Attachment</h6>
                        <div class="upload-multiple-file">
                            <div class="upload-item">
                                <div class="upload-file show">
                                    <i class="icon-pdf"></i>
                                </div>
                                <span class="file-name">Test.pdf</span>
                            </div>
                        </div>
                    </div>
                    <div class="">
                        <h6 class="font-size-16">Message sent to the <span class="text-success">teachers of room name 1 and room name 2.</span></h6>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('rightconent')
<div class="right-bar">
    <div class="rightbar-title border-bottom">
        <a href="javascript:void(0);" class="right-bar-toggle float-right"><i class="icon-cross"></i></a>
        <h5 class="m-0 font-size-19 font-weight-semibold">View recipients</h5>
    </div>
    <div class="slimscroll-menu">
        <div class="">
            <h5 class="font-size-19 mb-3">List of teachers</h5>
            <div class="teachers-list">
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/teacher/3.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Kathy Ortiz</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/teacher/2.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Carol Lee</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/teacher/1.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Mike Fox</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
            </div>
            <h5 class="font-size-19 mb-3">List of parents</h5>
            <div class="teachers-list">
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/parents/3.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Jessica Mendez</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/parents/2.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Harry Grand</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/parents/8.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Walter Hughes</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/parents/4.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Marie Cooper</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
                <div class="media border-bottom pb-3 mb-3">
                    <img src="{{ Helper::assets('assets/images/dummy/parents/5.png') }}" class="img-meal small mr-2" alt="child" />
                    <div class="media-body media-left">
                        <div class="name">Joan Hill</div>
                        <div class="date">10/03/2020, 13:00 <i class="icon-double-check"></i></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="rightbar-overlay"></div>
@endsection

@section('script-bottom')
{{-- <script defer src="{{ Helper::assets('assets/libs/datatables/jquery.dataTables.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.responsive.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/datatables/dataTables.bootstrap4.min.js') }}" type="text/javascript"></script>
<script defer src="{{ Helper::assets('assets/libs/sweetalert/sweetalert.min.js') }}" type="text/javascript"></script> --}}
<script type="text/javascript"> var recipientUrl="{{ route('message.recipients') }}"; </script>
<script defer src="{{ Helper::assets('assets/js/pages/message.js') }}" type="text/javascript"></script>
@endsection