@extends('layouts.default')
@section('content')

<style>
svg {
    vertical-align: middle;
    width: 28px;
}

.pagination {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.pagination .page-item .page-link {
    color: #333;
    font-size: 1px;
    padding: 1px 1px;
}

.pagination .page-item.disabled .page-link {
    color: #888;
}

.pagination .page-item.active .page-link {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
}

table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td,
th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) {
    background-color: #dddddd;
}

table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td,
th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
}

tr:nth-child(even) {
    background-color: #dddddd;
}
</style>


<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Error Files List</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="#">Home</a></li>
                        <li class="breadcrumb-item active">Dashboard</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->
    <!-- Main content -->

    <a href="/file_sync_status"> <i class="bi bi-arrow-left-square-fill" style="font-size: larger;float: left;"></i></a>
    <a href="/DmsDataMaster"> <i class="bi bi-arrow-right-square-fill" style="font-size: larger;float: right;"></i></a>


    <br>

    <section class="content">
        <div class="container-fluid">
            <div style="display: flex;">
                <!-- <a href="{{url('delete_dmsmaster_data')}}"<button  class="btn btn-primary btn-sm mb-2 "  style="margin-right:11px"  onclick="return confirm('Realy want to delete all data ?')">Delete All</button> </a> -->
                <!-- <a href="{{url('/file_sync_status/list')}}" <button type="button" class="btn btn-primary btn-sm mb-2" style="margin: 0% 1%;">Files List</button></a> -->
                <!-- <a href="{{url('file_sync_status')}}"<button type="button" class="btn btn-primary btn-sm mb-2"  id="process_dms" style="margin-right:11px">File Sync Status</button></a> -->
                <!-- <a href="{{url('DmsDataMaster')}}"<button type="button" class="btn btn-primary btn-sm mb-2" style="margin-right:11px">Move to Master</button></a> -->
                <!-- <a href="{{url('/split_files')}}" <button type="button" class="btn btn-primary btn-sm mb-2" style="margin: 0% 1%;">Split File</button></a> -->
                <!--  -->
                <!-- <a href="{{url('error_file_status')}}"<button type="button" class="btn btn-primary btn-sm mb-2" style="margin-right:11px">Error Files</button></a> -->

                <!-- <a href="{{url('get_data')}}"<button type="button" class="btn btn-primary btn-sm mb-2"  id="get_data" style="margin-right:11px">Get Data</button> </a> -->

            </div>



            <br>
            <!-- <a href= "{{ asset('assets/sample/dms_data_new.csv') }}" class="btn btn-primary btn-sm mb-2" style="margin: 0% 1%;">Download Sample</a> -->
            <br>
            @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <p>{{ $message }}</p>
            </div>
            @endif
            @if ($message = Session::get('error'))
            <div class="alert alert-danger">
                <p>{{ $message }}</p>
            </div>
            @endif


            <table class="table table-striped table-hover  table-list stateChange" id="myTable">
                <thead>
                    <tr class="bg-dark">
                        <th scope="col">ID</th>
                        <th scope="col">Created at</th>
                        <th scope="col">File Name</th>
                        <th scope="col">Download</th>
                        <th scope="col">Action</th>

                    </tr>
                </thead>
                <tbody>
                    @foreach( $data as $value )
                    <tr>
                        <td>{{$value->id}}</td>
                        <td>{{$value->created_at}}</td>
                        <td>{{$value->fname}}</td>
                        <td>
                            <a href="{{ route('downloadfilenonverify', ['id' => $value->id]) }}" class='btn btn-sm btn-primary'>
                                <i class="fa fa-download"></i>
                            </a>
                        </td>
                        <td>
                            <a href="{{ route('deletefilenonverify', ['id' => $value->id]) }}" class='btn btn-sm btn-danger'>
                                <i class="fa fa-times"></i>
                            </a>

                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
            <div class="col-md-12">
                <ul class="pagination justify-content-center">
                    {{ $data->links() }}
                </ul>
            </div>
        </div>
        <!--/. container-fluid -->
    </section>
    <!-- /.content -->
</div>
<!-- /.content-wrapper -->

<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
    <!-- Control sidebar content goes here -->
</aside>
<!-- /.control-sidebar -->

<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
<script src="https://cdn.datatables.net/1.13.5/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.5/css/jquery.dataTables.min.css">

<script>
$(document).ready(function() {
    $('#myTable').DataTable({
        "paging": true,
        "searching": false, // Remove search box
        "info": false, // Remove info block
        "lengthChange": false, // Remove page length options
    });
});
let table = new DataTable('#myTable');

$(document).ready(function() {
    $('#myTable').DataTable();
});

setTimeout(function() {
    $(".alert").hide();
}, 5000);
</script>

@stop