@extends('admin.admin_app')

@section('content')
<div class="content-wrapper">

    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="card">
        <h5 class="card-header">CMS </h5>
        <div  class="card-body">
            <div class="table-responsive text-nowrap">
                <table class="table table-bordered data-table">
                <thead>
                    <tr>
                        <th>Sr No.</th>
                        <th>Page Title</th>
                        <th>Page Key</th>
                        <th>Page Content</th>
                        <th>Create At</th>
                        <th>Update At</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>

                </tbody>
                </table>
            </div>
        </div>
    </div>
    </div>
</div>


<div class="modal fade" id="view_detail" tabindex="-1" 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="modalCenterTitle">Meta Description</h5>
                <button
                type="button"
                class="btn-close"
                data-bs-dismiss="modal"
                aria-label="Close"
                ></button>
            </div>
            <div class="modal-body" id="fetch_content">

            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>

@endsection

@section('script')
<script type="text/javascript">
  $(function () {

    var table = $('.data-table').DataTable({
        processing: true,
        serverSide: true,
        stateSave: true,
        ajax: "{{ route('cms.index') }}",
        columns: [
            {data: 'id', name: 'id'},
            {data: 'page_title', name: 'page_title'},
            {data: 'page_key', name: 'page_key'},
            {data: 'content', name: 'content'},
            {data: 'created_at', name: 'created_at'},
            {data: 'updated_at', name: 'updated_at'},
            {data: 'action', name: 'action', orderable: false, searchable: false},
        ]
    });
  });

  $(document).on('click', '#show_detail', function(event) {
    var cmsid = $(this).attr('data-id');
    $.ajax({
        url : "{{ route('cms.post') }}",
        type: "POST",
        data : {cmsid:cmsid,"_token": "{{ csrf_token() }}"},
        dataType : 'JSON',
        success: function(result) {
            $('#view_detail').modal("show");
            $('#fetch_content').html(result.page_content.page_content).show();
        }
    });
  });
</script>
@endsection