<?php
include "classes/html.class.php";

$html = new html("REPORTS MANUAL");
$db = new db();

?>

<div>
    <br>
    <h1 style="font-size: 2vw;text-align: center;">Step 1:Click REPORTS on the Homepage</h1>

    <div id="list1" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">HOMEPAGE</h2>
            <hr><br>
            <img src="images/home.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">The Home Page is the central navigation hub of the LOWVELD NUTS application.<br>
                From here, users can access all core functions involved in nut processing and operations management.
            </p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>RECEIVE</b> - Recording all the batch data received into the system</li>
                <li><b>DEHUSK</b> - Opens the dehusking section to track which batches have to dehusked</li>
                <li><b>BINS</b> - Manage and monitor the drying bins and store nuts into the silos</li>
                <li><b>SILO</b> - Opens the silo management section with the current data in all silos</li>
                <li><b>MANUAL</b> - Opens documentation, system instructions and guide for the system</li>
                <li><b>ADD</b> - Opens a submenu where users can add new silos, varieties, clients, etc.</li>
                <li><b>*REPORTS</b> - Access system generated reports and analytics on clients, nuts received etc. </li>
                <li><b>DASHBOARDS</b> - Dashboard overview of current system data</li>
            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 2:Choose which report you want to access</h1>

    <div id="list2" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">REPORTS HOME</h2>
            <hr><br>
            <img src="images/reports.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">Users can access different reports from important sections like Batches, Clients,
                Bins etc<br>
            </p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>RECEIVED NUTS</b> - Recording all the batch data received into the system</li>
                <li><b>DEHUSK</b> - Opens the dehusking section to track which batches have to dehusked</li>
                <li><b>BINS</b> - Manage and monitor the drying bins and store nuts into the silos</li>
                <li><b>CLIENTS</b> - Opens the silo management section with the current data in all silos</li>
                <li><b>BATCHES</b> - Opens documentation, system instructions and guide for the system</li>
            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 3:Filter according to what report you specifically want to
        access</h1>

    <div id="list3" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">REPORT FORM</h2>
            <hr><br>
            <img src="images/report_form.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">This page allows users to refine and search through received nut reports using
                multiple filters.<br> It helps in quickly locating either individual entries or a total summary based on
                specific criteria.<br>
            </p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>DATE FROM</b> - Start date range to filter</li>
                <li><b>DATE TO</b> - custom date end range to filter </li>
                <li><b>VARIETY</b> - Filter accourding to the nut variety</li>
                <li><b>SHELL</b> - Filters results based on if the nuts have shells or not</li>
                <li><b>WEIGHT</b> - Enter a specific weight value to view matching records containing that value</li>

            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 4:Choose between a single or total report</h1>

    <div id="list4" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">REPORTS - RECEIVED NUTS</h2>
            <hr><br>
            <img src="images/received.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">It allows generating PDF reports for individual entries or the full log.<br>
            </p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>PDF REPORT</b> - Recording all the batch data received into the system</li>
                <li><b>PDF</b> - opens the specific report of that batch</li>
                <li><b>LIST</b> - Reports according to what was filered or not filtered</li>
            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 5:Single Report</h1>

    <div id="list4" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">SINGLE REPORT</h2>
            <hr><br>
            <img src="images/batch_received.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">PDF report for individual batches<br>
            </p>
            <br><br>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 5: Total Report</h1>

    <div id="list4" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">TOTAL REPORT</h2>
            <hr><br>
            <img src="images/total_received_report.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">Total report for all batches<br>
            </p>
            <br>
            </p>
            <br>
        </div>
    </div>
    <br><br>
    <br><br>

</div>