<?php
	include "db_connection/db_connection.php";
	include "config/config.php";

	if($_SESSION['admin_login_id'] == '')
	{
		echo "<script>window.location='index.php';</script>";
	}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title><?php echo $PROJECT_TITLE ?></title>

<script type="text/javascript" src="js/master_cour_JS.js"></script>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
<link href="css/general.css" rel="stylesheet" type="text/css" />

<!--[if IE]> <link href="css/ie.css" rel="stylesheet" type="text/css"> <![endif]-->

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<script type="text/javascript" src="js/plugins/forms/ui.spinner.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.mousewheel.js"></script>
 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

<script type="text/javascript" src="js/plugins/charts/excanvas.min.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.orderBars.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.pie.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.flot.resize.js"></script>
<script type="text/javascript" src="js/plugins/charts/jquery.sparkline.min.js"></script>

<script type="text/javascript" src="js/plugins/tables/jquery.dataTables.js"></script>
<script type="text/javascript" src="js/plugins/tables/jquery.sortable.js"></script>
<script type="text/javascript" src="js/plugins/tables/jquery.resizable.js"></script>

<script type="text/javascript" src="js/plugins/forms/autogrowtextarea.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.uniform.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.inputlimiter.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.autotab.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.chosen.min.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.dualListBox.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.cleditor.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.ibutton.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.validationEngine-en.js"></script>
<script type="text/javascript" src="js/plugins/forms/jquery.validationEngine.js"></script>

<script type="text/javascript" src="js/plugins/uploader/plupload.js"></script>
<script type="text/javascript" src="js/plugins/uploader/plupload.html4.js"></script>
<script type="text/javascript" src="js/plugins/uploader/plupload.html5.js"></script>
<script type="text/javascript" src="js/plugins/uploader/jquery.plupload.queue.js"></script>

<script type="text/javascript" src="js/plugins/wizards/jquery.form.wizard.js"></script>
<script type="text/javascript" src="js/plugins/wizards/jquery.validate.js"></script>
<script type="text/javascript" src="js/plugins/wizards/jquery.form.js"></script>

<script type="text/javascript" src="js/plugins/ui/jquery.collapsible.min.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.breadcrumbs.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.tipsy.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.progress.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.timeentry.min.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.colorpicker.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.jgrowl.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.fancybox.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.fileTree.js"></script>
<script type="text/javascript" src="js/plugins/ui/jquery.sourcerer.js"></script>

<script type="text/javascript" src="js/plugins/others/jquery.fullcalendar.js"></script>
<script type="text/javascript" src="js/plugins/others/jquery.elfinder.js"></script>

<script type="text/javascript" src="js/plugins/ui/jquery.easytabs.min.js"></script>
<script type="text/javascript" src="js/files/bootstrap.js"></script>
<script type="text/javascript" src="js/files/functions.js"></script>

<script type="text/javascript" src="js/charts/chart.js"></script>
<script type="text/javascript" src="js/charts/hBar_side.js"></script>
<!-- Shared on MafiaShare.net  --><!-- Shared on MafiaShare.net  --></head>

<body onload="document.getElementById('addpage').focus();">

<!-- Top line begins -->
<?php include "header_footer/header.php"; ?>
<!-- Top line ends -->


<!-- Sidebar begins -->
<?php include "menus/left_menu.php"; ?>
<!-- Sidebar ends -->

<!-- Content begins -->
<div id="content">

<?php include "menus/top_menu.php"; ?>    
    <!-- Breadcrumbs line -->
    <div class="breadLine">
        <div class="bc">
            <ul id="breadcrumbs" class="breadcrumbs">
                <li><a href="home.php">Dashboard</a></li>
				<li><a href="master_category_list.php">Master</a></li>
                <li><a href="javascript:">Master Courier Details</a></li>
            </ul>
        </div>
	<?php include "menus/top_left_menu.php"; ?>            

    </div>

    <!-- Main content -->
    <div class="wrapper">

        <ul class="middleNavR">
            <!--<li><a href="#" title="Add an article" class="tipN"><img src="images/icons/middlenav/create.png" alt="" /></a></li>
            <li><a href="#" title="Upload files" class="tipN"><img src="images/icons/middlenav/upload.png" alt="" /></a></li>-->  
			<?php $st_list2 = check_rights('17','add');
				if($st_list2==1){ ?>
          <li><a href="master_cour_add.php" title="Add Courier Details" id="addpage" class="tipN"><img src="images/icons/middlenav/add.png" alt="" /></a></li>
			<?php } ?>
            <!--<li><a href="#" title="Messages" class="tipN"><img src="images/icons/middlenav/dialogs.png" alt="" /></a><strong>8</strong></li>
            <li><a href="#" title="Check statistics" class="tipN"><img src="images/icons/middlenav/stats.png" alt="" /></a></li>-->
    	</ul>
    	<!-- Chart --><!-- 6 + 6 -->

    	<div class="widget">
		   <div class="whead"><h6>Courier List</h6><span style="float:right; margin:10px;"><a href="javascript:0" onclick="$('#searchbar').slideToggle();"><img src="images/icons/options.png" alt=""></a></span><div class="clear"></div></div>
		<!-- Top Controls -->
		<div id="searchbar" style="display:none;">
		<div style="float:left; margin-left:10px;">
		<div class="dataTables_filter" id="dynamic_filter"><label>Search:<input type="text" placeholder="Type to filter..." id="search" aria-controls="dynamic" onkeyup="loadData(1)"><div class="srch"></div></label></div>
		</div>
		<div style="float:right;margin:10px;">
		Show: 
		<select id="limit" onchange="loadData(1)">
			<option value="10">10</option>
			<option value="25">25</option>
			<option value="50">50</option>
			<option value="100" selected>100</option>
			<option value="500">500</option>
		</select> records
		</div>
		</div>

<table border="1" width="100%" cellspacing="0" cellpadding="5">
    <thead>
        <tr>
			<th data-col="id" onclick="setSort('id')" style="text-align:center;">S.No</th>
			<th data-col="master_cad_type_id" onclick="setSort('master_cad_type_id')">Courier Name</th>
			<th data-col="category" onclick="setSort('category')">URL</th>
			<th data-col="cat_name" onclick="setSort('cat_name')">Phone No</th>
			<th data-col="master_cat_name" onclick="setSort('master_cat_name')">Status</th>
        </tr>
 </thead>
    <tbody id="dataArea"></tbody>
</table>
<div id="tableInfo" style="margin-top:10px; font-size:14px; color:#555;"></div>

<div id="pagination"></div>


<script>
let sortBy = "id";
let sortDir = "DESC";

function setSort(col){
    if(sortBy == col){
        sortDir = (sortDir === "DESC") ? "ASC" : "DESC";
    } else {
        sortBy = col;
        sortDir = "DESC";
    }
    updateSortIcons();
    loadData(1);
}

function updateSortIcons() {
    document.querySelectorAll("th").forEach(th => th.classList.remove("asc","desc"));
    const th = document.querySelector(`th[data-col='${sortBy}']`);
    if(th){
        th.classList.add(sortDir.toLowerCase());
    }
}

function loadData(page){
    let search = document.getElementById("search").value;
    let limit  = document.getElementById("limit").value;
limit = parseInt(limit);

    let xhr = new XMLHttpRequest();
    xhr.open("GET", `courier_data.php?page=${page}&limit=${limit}&search=${search}&sortBy=${sortBy}&sortDir=${sortDir}`, true);

xhr.onload = function(){
    let res = JSON.parse(this.responseText);
    document.getElementById("dataArea").innerHTML = res.rows;

    // Build info text like DataTables
    let start = (page - 1) * limit + 1;
    let end = start + limit - 1;
    if(end > res.total) end = res.total;

    if(res.total == 0){
        document.getElementById("tableInfo").innerHTML = "Showing 0 to 0 of 0 entries";
    } else {
        document.getElementById("tableInfo").innerHTML =
            `Showing ${start} to ${end} of ${res.total} entries`;
    }

    buildPagination(res.pages, page);
};

    xhr.send();
}

function buildPagination(totalPages, current){
    let html = "";

    if(current > 1)
        html += `<button onclick="loadData(${current-1})">Prev</button>`;

    for(let i=1; i<=totalPages; i++){
        if(i == current)
            html += `<button style="background:#6f6f6f;color:#fff">${i}</button>`;
        else
            html += `<button onclick="loadData(${i})">${i}</button>`;
    }

    if(current < totalPages)
        html += `<button onclick="loadData(${current+1})">Next</button>`;

    document.getElementById("pagination").innerHTML = html;
}

loadData(1); // Initial load
</script>
       
        </div>
        <div class="fluid"><!-- Media table --></div>

    </div>
    <!-- Main content ends -->

</div>
<!-- Content ends -->
<?php /*?><?php include "header_footer/footer.php"; ?><?php */?>
</body>
</html>
