<?php require view('theme/header'); ?>

<div class="app-container">


    <div class="app-content">
        <div class="container-fluid">

            <div class="d-card dc-dash">
                <div class="row">
                    <div class="col-lg-6 col-md-8 col-12">
                        <div class="py-3 px-5">
                            <div class="dch-title">
                                Oto Siparişlerim
                            </div>
                            <div class="dch-text">
                                Otomatik sipariş işlemlerinizi buradan yapabilirsiniz.
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <section class="neworder">

                <div class="row">
                    <div class="col-lg-12 col-12 mb-5 mb-lg-0">
                        <div class="orders-btn py-3">
                            <ul class="nav nav-pills app-ord-nav">
                                <li class="pull-right search mr-2">
                                        <div class="app-ord-search">
                                            <input type="text" name="search" id="searchService" value="" placeholder="Sipariş Ara"
                                                   class="app-ord-input">
                                            <button type="submit" class="app-ord-submit">
                                                <i class="fas fa-search"></i>
                                            </button>
                                        </div>
                                </li>
                            </ul>
                        </div>

                        <div class="d-card" style="word-break: break-all;">
                            <div class="d-card-body">
                                <table id="datable" class="table app-mtable flexs">

                                    <thead class="thead-tr">
                                    <tr>
                                        <th>#</th>
                                        <th>{AUTOS_SERVICE}</th>
                                        <th>{AUTOS_LINK}</th>
                                        <th>{AUTOS_QUANTITY}</th>
                                        <th>{AUTOS_DATE}</th>
                                        <th>Limit</th>
                                        <th>{AUTOS_STATUS}</th>
                                        <th>{AUTOS_EDIT}</th>
                                    </tr>
                                    </thead>
                                    <tbody class="servicestableclass"> {AUTOS_LIST}</tbody>


                                </table>

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

            </section>

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

<?php require view('theme/footer'); ?>
<script src="//cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>
	<script>
		$(document).ready( function () {
		    $('table tbody td').addClass('app-col');

    $('table tbody tr').addClass('app-block');
         ul = document.getElementsByClassName("app-block");
    for (e = 0; e < ul.length; e++) {
        li = ul[e].getElementsByTagName("td");
        for (i = 0; i < li.length; i++) {
            a = li[i];
             txtValue = a.innerHTML;
             if(i == 0){
             li[i].setAttribute('data-title', 'ID');
             }else if(i == 1){
             li[i].setAttribute('data-title', 'Servis');
             }else if (i == 2){
             li[i].setAttribute('data-title', 'Bağlantı');
             }else if (i == 3){
             li[i].setAttribute('data-title', 'Miktar');
             }else if (i == 4){
             li[i].setAttribute('data-title', 'Tarih');
             }else if (i == 5){
             li[i].setAttribute('data-title', 'Limit');
             }else if (i == 6){
             li[i].setAttribute('data-title', 'Durum');
             }else if (i == 7){
             li[i].setAttribute('data-title', 'İşlem');
             }else if (i == 8){
             li[i].setAttribute('data-title', 'Durum');
             }else if (i == 9){
             li[i].setAttribute('data-title', 'Telafi');
             }
    }
    }
    var table = $('#datable').DataTable({
          "lengthChange": false,
          "lengthMenu": [[-1], [25]],
          "bPaginate": false,
          "order": [[ 0, "desc" ]],
          "bInfo": false,
              createdRow: function (row, data, index) {

        if (data[1] == "") {
            console.dir(row);
            $(row).addClass('app-block');
        }
    }
    });
    $('#datatable_search').on( 'keyup', function () {
    table
        .search( this.value )
        .draw();
} );
    document.getElementById("datable_filter").style.display = "none";
    $('.dataTables_filter input').addClass('app-ord-input');



})
	</script>
	
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
	$(document).ready(function() {
		$("#searchService").on("keyup", function() {
			var value = $(this).val().toLowerCase();
			$(".servicestableclass tr").filter(function() {
				$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
			});
		});
	});
</script>