<?php
include 'includes/config.php';
session_start();

if (!$_SESSION['email']) {
  header('location:login.php');
}
?><!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>View Purchase/Sell Report</title>
    <!-- Favicon -->
    <link rel="shortcut icon" href="images/favicon.ico" />
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <!-- Typography CSS -->
    <link rel="stylesheet" href="css/typography.css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="css/responsive.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <style>
        ion-icon {
            font-size: 20px;
            margin-bottom: -5px;
        }
    </style>
</head>

<body>
    <!-- loader Start -->
    <div id="loading">
        <div id="loading-center">
        </div>
    </div>
    <!-- loader END -->
    <!-- Wrapper Start -->
    <div class="wrapper">
        <!-- Sidebar  -->
        <?php
        include 'includes/sidebar.php';
        ?>
        <!-- TOP Nav Bar -->
        <?php include 'includes/header.php'; ?>
        <!-- TOP Nav Bar END -->
        <!-- Page Content  -->
        <div id="content-page" class="content-page">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <h3 class="card-title">Purchase / Sell Report</h3>
                </div>
                <div class="col-md-12">
                    <div class="row">
                   
                        <div class="col-lg-5">
                            <div class="form-group">
                            <input type="date" id="filterDate" class="form-control">
                            </div>
                        </div>
                        <div class="col-lg-2">
                            <button id="searchButton" style="width:100%;" class="btn btn-primary p-2">Search</button>
                        </div>
                    </div>
                </div>
                <!-- Purchase Section -->
                <div class="col-sm-6">
                    <div class="iq-card p-5">
                        <table class="table table-striped">
                            <tbody>
                                <tr>
                                    <td><strong>Total Purchase:</strong></td>
                                    <td id="totalPurchase">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Purchase Including Tax:</strong></td>
                                    <td id="purchaseWithTax">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Total Purchase Return Including Tax:</strong></td>
                                    <td id="purchaseReturn">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Purchase Due:</strong></td>
                                    <td id="purchaseDue">0.00 ₨</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <!-- Sale Section -->
                <div class="col-sm-6">
                    <div class="iq-card p-5">
                        <table class="table table-striped">
                            <tbody>
                                <tr>
                                    <td><strong>Total Sale:</strong></td>
                                    <td id="totalSale">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Sale Including Tax:</strong></td>
                                    <td id="saleWithTax">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Total Sell Return Including Tax:</strong></td>
                                    <td id="saleReturn">0.00 ₨</td>
                                </tr>
                                <tr>
                                    <td><strong>Sale Due:</strong></td>
                                    <td id="saleDue">0.00 ₨</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <!-- Overall Summary Section -->
                <div class="col-sm-12">
                    <div class="iq-card p-5">
                        <!--<h3 class="card-title">Overall (Sale - Sale Return - Purchase - Purchase Return)</h3>-->
                        <!--<h2 class="card-title mt-4"><strong>Sale - Purchase:</strong> <span id="salePurchaseDiff">0.00 ₨</span></h2>-->
                        <!--<h2 class="card-title"><strong>Due amount:</strong> <span id="dueAmount">0.00 ₨</span></h2>-->
                        <!--<button class="btn btn-primary" style="float: inline-end;"><ion-icon name="print-outline"></ion-icon> Print</button>-->
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
  $(document).ready(function() {
    function fetchReport(date) {
        $.ajax({
            url: 'fetch_report_sale_purchase.php',
            type: 'GET',
            dataType: 'json',
            data: { date: date },
            success: function(data) {
                if (data.error) {
                    console.error('Error from server: ', data.error);
                    return;
                }

                $('#totalSale').text(data.total_sale);
                $('#saleWithTax').text(data.sale_with_tax);
                $('#saleReturn').text(data.sale_return);
                $('#saleDue').text(data.sale_due);

                $('#totalPurchase').text(data.total_purchase);
                $('#purchaseWithTax').text(data.purchase_with_tax);
                $('#purchaseReturn').text(data.purchase_return);
                $('#purchaseDue').text(data.purchase_due);

                $('#salePurchaseDiff').text(data.sale_purchase_diff);
                $('#dueAmount').text(data.due_amount);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error('Error fetching data: ', textStatus, errorThrown);
            }
        });
    }

    // Fetch report data when the page loads with no date filter
    fetchReport('');

    $('#searchButton').on('click', function() {
        const selectedDate = $('#filterDate').val();
        fetchReport(selectedDate);
    });
});

    </script>
    <!-- Wrapper END -->
    <!-- Footer -->
    <?php include 'includes/footer.php'; ?>
    <nav class="iq-float-menu">
        <input type="checkbox" href="#" class="iq-float-menu-open" name="menu-open" id="menu-open" />
        <label class="iq-float-menu-open-button" for="menu-open">
            <span class="lines line-1"></span>
            <span class="lines line-2"></span>
            <span class="lines line-3"></span>
        </label>
        <button class="iq-float-menu-item bg-info" data-toggle="tooltip" data-placement="top" title="Direction Mode"
            data-mode="rtl"><i class="ri-text-direction-r"></i></button>
        <button class="iq-float-menu-item bg-danger" data-toggle="tooltip" data-placement="top" title="Color Mode"
            id="dark-mode" data-active="true"><i class="ri-sun-line"></i></button>
        <button class="iq-float-menu-item bg-warning" data-toggle="tooltip" data-placement="top" title="Comming Soon"><i
                class="ri-palette-line"></i></button>
    </nav>
    <!-- Footer END -->
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="js/jquery.min.js"></script>
    <!-- Rtl and Darkmode -->
    <script src="js/rtl.js"></script>
    <script src="js/customizer.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <!-- Appear JavaScript -->
    <script src="js/jquery.appear.js"></script>
    <!-- Countdown JavaScript -->
    <script src="js/countdown.min.js"></script>
    <!-- Counterup JavaScript -->
    <script src="js/waypoints.min.js"></script>
    <script src="js/jquery.counterup.min.js"></script>
    <!-- Wow JavaScript -->
    <script src="js/wow.min.js"></script>
    <!-- Apexcharts JavaScript -->
    <script src="js/apexcharts.js"></script>
    <!-- Slick JavaScript -->
    <script src="js/slick.min.js"></script>
    <!-- Select2 JavaScript -->
    <script src="js/select2.min.js"></script>
    <!-- Owl Carousel JavaScript -->
    <script src="js/owl.carousel.min.js"></script>
    <!-- Magnific Popup JavaScript -->
    <script src="js/jquery.magnific-popup.min.js"></script>
    <!-- Smooth Scrollbar JavaScript -->
    <script src="js/smooth-scrollbar.js"></script>
    <!-- lottie JavaScript -->
    <script src="js/lottie.js"></script>
    <!-- Chart Custom JavaScript -->
    <script src="js/chart-custom.js"></script>
    <!-- Custom JavaScript -->
    <script src="js/custom.js"></script>
</body>

<!-- Mirrored from templates.iqonic.design/vito/html/main/data-table.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 21 Aug 2024 10:45:18 GMT -->

</html>