@extends('admin.main')
@section('title', 'Conversations')
@section('breadcrumb')
    {{-- <li class="breadcrumb-item"><a href="#">Home</a></li> --}}
    <li class="breadcrumb-item active">Conversations</li>
@endsection
@section('content')
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">Data Conversation</h3>
            </div>
            <!-- /.card-header -->
            <div class="card-body">
                <table id="data-conversation" class="table table-bordered table-hover">
                    <thead>
                        <tr>
                            <th>NO</th>
                            <th>Nama</th>
                            <th>Title</th>
                            <th>Created at</th>
                            <th>Action</th>
                        </tr>
                    </thead> 
                </table>
            </div>
            <!-- /.card-body -->
        </div>
        <!-- /.card -->
    </div>
    <!-- /.col -->

    <script>
        $(document).ready(function () {

            loadData();

        })

        function loadData() {
            showData(
                '#data-conversation',
                '/admin/conversations/get-data',
                [
                    { data: 'no' },
                    { data: 'user.name' },
                    { data: 'title' },
                    { data: 'created_at_format' },
                    { data: 'id' },
                    
                ],
                [
                    {
                        targets: 4,
                        data: 'id',
                        render: function(data, type, row) {
                            var button = '<a href="/admin/conversations/message/'+ row.id +'" id="btnDetail" class="btn btn-info btn-sm"><i class="fas fa-info-circle"></i>&nbsp;Detail</a>';
                            return button;
                        }
                    },
                ],
            );
        }
      
    </script>
@endsection