<?php
require_once 'header.php';
require_once 'navbar.php';

$sql = "select count(*) as total_booking,sum(price) as sum  from bookings where status !='pending'";
if ($result = $conn->query($sql)) {
	$one = $result->fetch_assoc();
}

$sql = "select count(*) as total_booking from bookings where status ='booked'";
if ($result = $conn->query($sql)) {
	$pending = $result->fetch_assoc();
}

$sql = "select count(*) as total_booking from bookings where status='vendor_pass' and bid_by='admin'";
if ($result = $conn->query($sql)) {
    $bid_admin = $result->fetch_assoc();
}
$sql = "select count(*) as total_booking from bookings where status='vendor_pass' and bid_by='vendor'";
if ($result = $conn->query($sql)) {
    $bid_vendor = $result->fetch_assoc();
}

$sql = "select count(*) as total_booking from bookings where status ='completed'";
if ($result = $conn->query($sql)) {
	$done = $result->fetch_assoc();
}
$sql = "select count(*) as total_booking from bookings where status ='cancelled'";
if ($result = $conn->query($sql)) {
    $cancel = $result->fetch_assoc();
}

$sql = "select count(*) as total_booking from bookings where status ='confirmed'";
if ($result = $conn->query($sql)) {
    $processing = $result->fetch_assoc();
}
$sql = "select count(*) as vendors,sum(w_amount) as amounts from vendor_profile";
if ($result = $conn->query($sql)) {
	$vendor = $result->fetch_assoc();
}

$sql = "select count(*) as cabs from cabs";
if ($result = $conn->query($sql)) {
	$cabs = $result->fetch_assoc();
}

$sql = "select count(*) as drivers from drivers";
if ($result = $conn->query($sql)) {
	$drivers = $result->fetch_assoc();
}

$sql = "select count(*) as users from users";
if ($result = $conn->query($sql)) {
	$users = $result->fetch_assoc();
}
?>
<style>
	.raju {
		margin-left: 120px;
		font-size: 40px !important;

	}
    /*.text-xxl {
        display: flex;
    }*/

	.card-body small {
		font-size: 18px;
		font-weight: 600;
		/* color: black; */
	}
	.ttl_b{
		color: #00b3ff;
	    border-color: #00b3ff;
	    background-color: transparent;
	    background-image: none;
	    pointer-events: none;
	}
	.card{
		border: 0!important;
	}
	.text-info{
		background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
	}
	.text-primary{
		background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
	}
	.btn-outline-info{
		color: #FF4500!important;
        border-color: #FF4500!important;
	}
	.btn-outline-primary{
		color: #FF4500!important;
        border-color: #FF4500!important;
	}
	#map { 
            height: 500px; 
            width: 100%; 
        }
</style>

<div class="container-fluid pt-8">



</div>

<div class="row pl-4 pt-4">
	<div class="col-sm-6 col-lg-3 col-xl-3 box">
		<div class="socailicons">
			<div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;;
">
				<small class="social-title">Total Vendors</small>
				<h3 class="text-xxl text-white  mb-0"><?= $vendor['vendors']; ?><i class="fas fa-users raju" style="margin-left:95px!important"></i></h3>

			</div>
		</div>
	</div>
	<div class="col-sm-6 col-lg-3 col-xl-3 box">
		<div class="socailicons">
			<div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;;
">
				<small class="social-title">Total Cabs</small>
				<h3 class="text-xxl text-white  mb-0"><?= $cabs['cabs']; ?><i class="fas fa-taxi raju"></i></h3>
			</div>
		</div>
	</div>
	<div class="col-sm-6 col-lg-3 col-xl-3 box">
		<div class="socailicons">
			<div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;">
				<small class="social-title">Total Drivers</small>
				<h3 class="text-xxl text-white mb-0"><?= $drivers['drivers']; ?><i class="fas fa-id-card raju"></i></h3>
			</div>
		</div>
	</div>
	<div class="col-sm-6 col-lg-3 col-xl-3 box">
		<div class="socailicons">
			<div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;">
				<small class="social-title">Total Customers</small>
				<h3 class="text-xxl text-white  mb-0"><?= $users['users']; ?><i class="fas fa-users raju"></i></h3>

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

</div>
<div class="row pl-4">
	<div class="col-xl-3 col-lg-6 col-sm-6 box">
		<div class="card">
			<div class="card-body">
				<div class="text-center">
					<p class="mb-1" style="font-size:18px;font-weight:800;
 background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;">
						<i class="fas fa-chart-bar mr-2"></i>
						Total Booking
					</p>
					<h2 class="text-primary text-xxl"><?= $one['total_booking']; ?></h2>
					<div  class="ttl_b btn btn-outline-primary btn-pill btn-sm"><i class="fas fa-arrow-down"></i> 30% decrease</div>
				</div>
			</div>
		</div>
	</div>
	<div class="col-xl-3 col-lg-6 col-sm-6 box">
		<div class="card">
			<div class="card-body">
				<div class="text-center">
					<p class="mb-1" style="font-size:18px;font-weight:800;
  background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;">
						<i class="fas fa-stopwatch mr-2"></i>
						Pending Booking
					</p>
					<h2 class="text-info text-center text-xxl"><?= $pending['total_booking']; ?></h2>
					<a href="list_booking?type=pending" class="btn btn-outline-info btn-pill btn-sm"><i class="fas fa-arrow-up"></i> 10% increase</a>
				</div>
			</div>
		</div>
	</div>
	<div class="col-xl-3 col-lg-6 col-sm-6 box">
		<div class="card">
			<div class="card-body">
				<div class="text-center">
					<p class="mb-1" style="font-size:18px;font-weight:800;
  background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;">
						<i class="fas fa-users mr-2"></i>
						Processing Booking
					</p>
					<h2 class="text-info text-xxl"><?= $processing['total_booking']; ?></h2>
					<a href="list_booking?type=processing" class="btn btn-outline-info btn-pill btn-sm"><i class="fas fa-arrow-up"></i> 10% increase</a>
				</div>
			</div>
		</div>
	</div>

	<div class="col-xl-3 col-lg-6 col-sm-6 box">
		<div class="card">
			<div class="card-body">
				<div class="text-center">
					<p class="mb-1" style="font-size:18px;font-weight:800;
  background: -webkit-linear-gradient(top, #FF4500, #FF4500);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;">
						<i class="fas fa-check-square mr-2"></i>
						Complete Booking
					</p>
					<h2 class="text-info text-xxl"><?= $done['total_booking']; ?></h2>
					<a href="list_booking?type=completed" class="btn btn-outline-info btn-pill btn-sm"><i class="fas fa-arrow-up"></i> 10% increase</a>
				</div>
			</div>
		</div>
	</div>
</div>

<style>
    #total_count small{
        font-size: 17px!important;
    }
    #total_count .raju{
        margin-left: 110px!important;
    }
    #total_count .text-xxl{
        padding-top: 10px!important;
    }
</style>





<div class="row pl-4 pt-4" id="total_count">
    <div class="col-sm-6 col-lg-3 col-xl-3 box">
        <div class="socailicons">
            <div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;;
">
                <small class="social-title">Total Bidding List</small>
                <h3 class="text-xxl text-white  mb-0"><?= $bid_admin['total_booking']; ?><i class="fas fa-users raju" style="margin-left:95px!important"></i></h3>

            </div>
        </div>
    </div>
    <div class="col-sm-6 col-lg-3 col-xl-3 box">
        <div class="socailicons">
            <div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;;
">
                <small class="social-title">Pending Vendors Booking</small>
                <h3 class="text-xxl text-white  mb-0"><?= $bid_vendor['total_booking']; ?><i class="fas fa-taxi raju"></i></h3>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-lg-3 col-xl-3 box">
        <div class="socailicons">
            <div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;">
                <small class="social-title">Total Vendor Bidding</small>
                <h3 class="text-xxl text-white mb-0"><?= $bid_vendor['total_booking']; ?><i class="fas fa-id-card raju"></i></h3>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-lg-3 col-xl-3 box">
        <div class="socailicons">
            <div class="card-body  mb-3" style="background: -webkit-linear-gradient(top, #FF4500, #FF4500)!important;">
                <small class="social-title">Total Cancelled Booking</small>
                <h3 class="text-xxl text-white  mb-0"><?= $cancel['total_booking']; ?><i class="fas fa-users raju"></i></h3>

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

</div>

<!-- <div class="m-t-0 my-3 mx-3">
                
                        <h3>Live Tracking</h3> 
                        <div id="map" class="mt-3"></div> 
                        
                        <script async defer 
                            src="https://maps.googleapis.com/maps/api/js?key=<?=$google_key?>&callback=initMap"> 
                        </script> 

                    </div> -->
                
<?php
require_once 'footer.php';
require_once 'jslinks.php';
?>
<!-- <script>
        initMap();
        var gmarkers = [];
        var map;
        function initMap(){
            $.ajax({
                url: "query/ajax/getAllVehicle.php",
                type: "POST",
                data: {"id":"ok"},
                success: function (data) {
                    var data_parse = JSON.parse(data);
                    if(data_parse.length != 0){
                        for(var i=0; i<data_parse.length; i++){
                            var lat = data_parse[i].latitude;
                            var lng = data_parse[i].longitude;
                            var prenom = data_parse[i].prenom;
                            var phone = data_parse[i].phone;
                            var nom = data_parse[i].nom;
                            var online = data_parse[i].online;
                            var nom_prenom = prenom+" "+nom;
                            var uluru = {lat: parseFloat(lat), lng: parseFloat(lng)}; 
                            if(i==0){
                                map = new google.maps.Map(document.getElementById('map'), { 
                                zoom: 15,
                                center: uluru 
                                }); 
                            }
                            if(online == "yes")
                                var image = 'http://projets.hevenbf.com/on_demand_taxi/assets/images/marker.png';
                            else
                                var image = 'http://projets.hevenbf.com/on_demand_taxi/assets/images/marker_red.png';
                            var marker = new google.maps.Marker({ 
                                position: uluru, 
                                map: map, 
                                icon: image, 
                                title: nom_prenom 
                            }); 
                            showInfo(map,marker,phone);
                            // Push your newly created marker into the array:
                            gmarkers.push(marker);
                        }
                    }else{
                       
                        map = new google.maps.Map(document.getElementById('map'), { 
                        zoom: 15,
                        center: uluru 
                        }); 
                    }
                    addYourLocationButton(map, marker);
                }
            });
        }
        //var defaultLocation = new window.google.maps.LatLng(lat, lng);
        function showInfo(map,marker,phone){
            var infoWindow = new google.maps.InfoWindow();
            google.maps.event.addListener(marker, 'click', function () {
                var markerContent = "<h4>Name : "+marker.getTitle()+"</h4> <h6>Phone : "+phone+"</h6>";
                infoWindow.setContent(markerContent);
                infoWindow.open(map, this);
            });
            new google.maps.event.trigger( marker, 'click' );
        }
        function addYourLocationButton(map, marker) {
            var controlDiv = document.createElement('div');

            var firstChild = document.createElement('button');
            firstChild.style.backgroundColor = '#fff';
            firstChild.style.border = 'none';
            firstChild.style.outline = 'none';
            firstChild.style.width = '40px';
            firstChild.style.height = '40px';
            firstChild.style.borderRadius = '2px';
            firstChild.style.boxShadow = '0 1px 4px rgba(0,0,0,0.3)';
            firstChild.style.cursor = 'pointer';
            firstChild.style.marginRight = '10px';
            firstChild.style.padding = '0px';
            firstChild.title = 'Your Location';
            controlDiv.appendChild(firstChild);

            var secondChild = document.createElement('div');
            secondChild.style.margin = '10px';
            secondChild.style.width = '18px';
            secondChild.style.height = '18px';
            secondChild.style.backgroundImage = 'url(https://maps.gstatic.com/tactile/mylocation/mylocation-sprite-1x.png)';
            secondChild.style.backgroundSize = '180px 18px';
            secondChild.style.backgroundPosition = '0px 0px';
            secondChild.style.backgroundRepeat = 'no-repeat';
            secondChild.id = 'you_location_img';
            firstChild.appendChild(secondChild);

            google.maps.event.addListener(map, 'dragend', function() {
                $('#you_location_img').css('background-position', '0px 0px');
            });

            firstChild.addEventListener('click', function() {
                var imgX = '0';
                var animationInterval = setInterval(function(){
                    if(imgX == '-18') imgX = '0';
                    else imgX = '-18';
                    $('#you_location_img').css('background-position', imgX+'px 0px');
                }, 500);
                if(navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(function(position) {
                        var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
                        marker.setPosition(latlng);
                        map.setCenter(latlng);
                        clearInterval(animationInterval);
                        $('#you_location_img').css('background-position', '-144px 0px');
                    });
                }
                else{
                    clearInterval(animationInterval);
                    $('#you_location_img').css('background-position', '0px 0px');
                }
            });

            controlDiv.index = 1;
            map.controls[google.maps.ControlPosition.RIGHT_BOTTOM].push(controlDiv);
        }
        
        function removeMarkers(){
            for (i = 0; i < gmarkers.length; i++) {
                gmarkers[i].setMap(null);
            }
        }
        function getVehicleAll2(){
            $.ajax({
                url: "query/ajax/getAllVehicle.php",
                type: "POST",
                data: {"id":"ok"},
                success: function (data) {
                    var data_parse = JSON.parse(data);
                    removeMarkers();
                    for(var i=0; i<data_parse.length; i++){
                        var lat = data_parse[i].latitude;
                        var lng = data_parse[i].longitude;
                        var prenom = data_parse[i].prenom;
                        var phone = data_parse[i].phone;
                        var nom = data_parse[i].nom;
                        var online = data_parse[i].online;
                        var nom_prenom = prenom+" "+nom;
                        var uluru = {lat: parseFloat(lat), lng: parseFloat(lng)}; 
                        if(online == "yes")
                            var image = 'http://projets.hevenbf.com/on_demand_taxi/assets/images/marker.png';
                        else
                            var image = 'http://projets.hevenbf.com/on_demand_taxi/assets/images/marker_red.png';
                        var marker = new google.maps.Marker({ 
                            position: uluru, 
                            map: map, 
                            icon: image, 
                            title: nom_prenom 
                        }); 
                        showInfo(map,marker,phone);
                        // Push your newly created marker into the array:
                        gmarkers.push(marker);
                    }
                }
            });
        }
        function foo() {
            var day = new Date().getDay();
            var hours = new Date().getHours();

            // alert('day: ' + day + '  Hours : ' + hours );
            getVehicleAll2();

            if (day === 0 && hours > 12 && hours < 13){}
            // Do what you want here:
        }

        setInterval(foo, 7000);

        apply(new Date().getFullYear());
        function apply(year){
            $("#loader").css("display", "block");
            $.ajax({
                url: "query/ajax/getEarningStatsDashboard.php",
                type: "POST",
                data: {"year":year},
                success: function (data) {
                    $("#chart2").remove();
                    $("#chart").append('<canvas id="chart2" height="50"></canvas>');

                    var data_parse = JSON.parse(data);

                    var ctx2 = document.getElementById("chart2").getContext("2d");
                    var v01 = 0;var v02 = 0;var v03 = 0;var v04 = 0;var v05 = 0;var v06 = 0;var v07 = 0;var v08 = 0;var v09 = 0;var v10 = 0;var v11 = 0;var v12 = 0;
                    for (let i = 0; i < data_parse.length; i++) {
                        date = data_parse[i].creer;
                        tab_tab = date.split('-');
                        var expr = tab_tab[1];
                        var nb = expr;
                        switch(nb){
                            case '01': v01 = parseInt(v01)+parseInt(data_parse[i].montant); break;
                            case '02': v02 = parseInt(v02)+parseInt(data_parse[i].montant); break;
                            case '03': v03 = parseInt(v03)+parseInt(data_parse[i].montant); break;
                            case '04': v04 = parseInt(v04)+parseInt(data_parse[i].montant); break;
                            case '05': v05 = parseInt(v05)+parseInt(data_parse[i].montant); break;
                            case '06': v06 = parseInt(v06)+parseInt(data_parse[i].montant); break;
                            case '07': v07 = parseInt(v07)+parseInt(data_parse[i].montant); break;
                            case '08': v08 = parseInt(v08)+parseInt(data_parse[i].montant); break;
                            case '09': v09 = parseInt(v09)+parseInt(data_parse[i].montant); break;
                            case '10': v10 = parseInt(v10)+parseInt(data_parse[i].montant); break;
                            case '11': v11 = parseInt(v11)+parseInt(data_parse[i].montant); break;
                            default: v12 = parseInt(v12)+parseInt(data_parse[i].montant); break;
                        }
                    }

                    var data_tab = [];
                    for (let i = 0; i < 12; i++) {
                        switch(i){
                            case 0: data_tab[i] = v01; break;
                            case 1: data_tab[i] = v02; break;
                            case 2: data_tab[i] = v03; break;
                            case 3: data_tab[i] = v04; break;
                            case 4: data_tab[i] = v05; break;
                            case 5: data_tab[i] = v06; break;
                            case 6: data_tab[i] = v07; break;
                            case 7: data_tab[i] = v08; break;
                            case 8: data_tab[i] = v09; break;
                            case 9: data_tab[i] = v10; break;
                            case 10: data_tab[i] = v11; break;
                            case 11: data_tab[i] = v12; break;
                            case 12: data_tab[i] = v13; break;
                            default: data_tab[i] = '0'; break;
                        }
                    }
                    var data2 = {
                        labels: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
                        datasets: [
                            {
                                label: "Earning stats",
                                fillColor: "#ffb22b",
                                strokeColor: "#ffb22b",
                                highlightFill: "#eba327",
                                highlightStroke: "#eba327",
                                data: data_tab
                            }
                        ]
                    };
                    
                    var chart2 = new Chart(ctx2).Bar(data2, {
                        scaleBeginAtZero : true,
                        scaleShowGridLines : true,
                        scaleGridLineColor : "rgba(0,0,0,.005)",
                        scaleGridLineWidth : 0,
                        scaleShowHorizontalLines: true,
                        scaleShowVerticalLines: true,
                        barShowStroke : true,
                        barStrokeWidth : 0,
                        tooltipCornerRadius: 2,
                        barDatasetSpacing : 3,
                        legendTemplate : "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].fillColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>",
                        responsive: true
                    });
                }
            });
        }
    </script> -->