<?php
include("../db/cn.php");
include("common/tx.php");
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
ob_start();

// Add batch_no column if not exists in products table
$check_column3 = $connection->query("SHOW COLUMNS FROM products LIKE 'batch_no'");
if ($check_column3->num_rows == 0) {
    $connection->query("ALTER TABLE products ADD batch_no VARCHAR(100) DEFAULT ''");
}
$check_column4 = $connection->query("SHOW COLUMNS FROM add_qot LIKE 'batch_no'");
if ($check_column4->num_rows == 0) {
    $connection->query("ALTER TABLE add_qot ADD batch_no VARCHAR(100) DEFAULT ''");
}

// Add p_type column if not exists in add_qot table
$check_column5 = $connection->query("SHOW COLUMNS FROM add_qot LIKE 'p_type'");
if ($check_column5->num_rows == 0) {
    $connection->query("ALTER TABLE add_qot ADD p_type VARCHAR(100) DEFAULT ''");
}

if (isset($_SESSION['user_name']) && isset($_SESSION['user_role']) && isset($_SESSION['outlet_name']) && isset($_SESSION['outlet_address'])) {
    $userName = $_SESSION['user_name'];
    $userRole = $_SESSION['user_role'];
    $outlet_address = $_SESSION['outlet_address'];
    $outlet_name = $_SESSION['outlet_name'];
} else {
    echo "<script>window.location.href = 'logout.php';</script>";
    exit;
}

function generateOrderId(mysqli $connection): string {
    $connection->query("INSERT INTO order_sequence () VALUES ()");
    return str_pad($connection->insert_id, 5, "0", STR_PAD_LEFT);
}

if ($connection->connect_error) {
    die("Connection failed: " . $connection->connect_error);
}

// ========== FIXED: Product search returns product names only ==========
if (isset($_GET['query'])) {
    $query = $connection->real_escape_string($_GET['query']);
    $sql = "SELECT DISTINCT product_name FROM products WHERE product_name LIKE '%$query%' ORDER BY product_name LIMIT 20";
    $result = $connection->query($sql);
    $suggestions = "";
    if ($result && $result->num_rows > 0) {
        while ($row = $result->fetch_assoc()) {
            $productName = $row['product_name'];
            $suggestions .= "<div class='dropdown-item product-name-item' data-product-name='" . htmlspecialchars($productName) . "'>" . htmlspecialchars($productName) . "</div>";
        }
    } else {
        $suggestions .= "<div class='dropdown-item text-danger'>No products found</div>";
    }
    echo $suggestions;
    exit;
}

// ========== Get batches for a selected product ==========
if (isset($_GET['get_batches'])) {
    $productName = $connection->real_escape_string($_GET['get_batches']);
    $sql = "SELECT product_id, product_name, retail_price, trade_price, p_type, supplier, company, product_unit, quantity, inches, batch_no 
            FROM products 
            WHERE product_name = '$productName' AND quantity > 0
            ORDER BY batch_no";
    $result = $connection->query($sql);
    $batches = "";
    if ($result && $result->num_rows > 0) {
        while ($row = $result->fetch_assoc()) {
            $batchNo = $row['batch_no'] ?: 'No Batch';
            $quantity = $row['quantity'];
            $batches .= "<div class='batch-item' 
                data-product-id='" . $row['product_id'] . "' 
                data-product-quantity='" . $row['quantity'] . "' 
                data-retail-price='" . $row['retail_price'] . "' 
                data-trade-price='" . $row['trade_price'] . "' 
                data-p-type='" . ($row['p_type'] ?? '') . "'
                data-supplier='" . $row['supplier'] . "' 
                data-company='" . $row['company'] . "' 
                data-product-unit='" . $row['product_unit'] . "' 
                data-batch-no='" . $row['batch_no'] . "' 
                data-inches='" . ($row['inches'] ?? 1) . "'
                data-product-name='" . $row['product_name'] . "'>" 
                . "<div class='batch-info'><strong>Batch: " . htmlspecialchars($batchNo) . "</strong></div>"
                . "<div class='batch-qty'>Available: " . $quantity . " units</div></div>";
        }
    } else {
        $batches .= "<div class='no-batches'>No batches available for this product</div>";
    }
    echo $batches;
    exit;
}

if (isset($_GET['customer_name'])) {
    $customerName = $connection->real_escape_string($_GET['customer_name']);
    $sql = "SELECT cr_name, cr_id, phone_number FROM credit_note WHERE cr_name LIKE '%$customerName%' LIMIT 5";
    $result = $connection->query($sql);
    $suggestions = "";

    while ($row = $result->fetch_assoc()) {
        $crName = $row['cr_name'];
        $crId = $row['cr_id'];
        $phone = $row['phone_number'];

        $remainSql = "SELECT remain_balance FROM creditor_closing WHERE creditor_name = '$crName' ORDER BY id DESC LIMIT 1";
        $remainResult = $connection->query($remainSql);
        $remainBalance = "0";
        if ($remainResult && $remainResult->num_rows > 0) {
            $remainRow = $remainResult->fetch_assoc();
            $remainBalance = $remainRow['remain_balance'];
        }

        $suggestions .= "<div class='dropdown-item' data-customer-name='$crName' data-customer-id='$crId' data-customer-phone='$phone' data-remain-balance='$remainBalance'>$crName</div>";
    }

    echo $suggestions;
    exit;
}

if (isset($_GET['order_id'])) {
    $order_id = $_GET['order_id'];
    if (!empty($order_id)) {
        $stmt = $connection->prepare("SELECT order_id FROM add_qot WHERE order_id LIKE ? GROUP BY order_id");
        $like_order_id = "%" . $order_id . "%";
        $stmt->bind_param("s", $like_order_id);
        $stmt->execute();
        $result = $stmt->get_result();
        if ($result->num_rows > 0) {
            while ($row = $result->fetch_assoc()) {
                echo '<div class="dropdown-item" data-order-id="' . $row['order_id'] . '">Order #' . $row['order_id'] . '</div>';
            }
        } else {
            echo '<div class="dropdown-item">No orders found</div>';
        }
        $stmt->close();
    }
    $connection->close();
    exit;
}

$user = $userName;
$role = $userRole;
$outlet = $outlet_name;
$address = $outlet_address;

if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST["bill"])) {
    if ($connection->connect_error) {
        die("Connection failed: " . $connection->connect_error);
    }

    $productData = json_decode($_POST['productData'], true);
    $orderId = generateOrderId($connection);
    $paidBy = $_POST['method'];
    @$bill_amount = $_POST["BillAmount"];
    $discount_amount = $_POST["bill_amount"];
    $discounted = $_POST["discount_amount"];
    $discount_per = $_POST["discount_percent"];
    $cash_amount = $_POST["cash_received"];
    $change_amount = $_POST["cash_return"];
    $customerName = $_POST["customer_name"];
    $customerPhone = $_POST["customer_phone"];
    $customer_type = $_POST["customer_type"];
    $customer_id = $_POST["customer_id"];
    $r_order_id = $_POST["r_order_id"];
    $pre_amount = $_POST["pre_amount"];
    $grand_amount = $_POST["grand_amount"];
    $installation = $_POST["installation"];
    $manualDate = $_POST["manual_date"];
    $date_time = date("Y-m-d");

    foreach ($productData as $product) {
        $productId = $product['productId'];
        $productName = $product['description'];
        $productPrice = $product['pricePerUnit'];
        $tradePrice = $product['tradePrice'];
        $productQuantity = $product['quantity'];
        $inches = $product['inches'];
        $batch_no = $product['batch_no'] ?? '';
        $p_type = $product['Ptype'] ?? '';
        $productTotal = $product['totalPrice'];
        $discount = $product['discountPercentage'];
        $discAmount = $product['discAmount'];
        $tax = $product['tax'];
        $netAmount = $product['netAmount'];
        $supplierName = $product['supplier'];
        $company = $product['company'];
        $sale_cost = $tradePrice * $productQuantity * $inches;
        $tp = $sale_cost;
        
        $sql = "INSERT INTO add_qot (
                product_id,
                supplier_name,
                company,
                product_name,
                product_price,
                trade_price,
                product_quantity,
                product_total,
                discount,
                disc_amount,
                tax,
                net_amount,
                BillAmount,
                total_amount,
                pre_amount,
                grand_amount,
                paid_by,
                sale_cost,
                customer_id,
                customer_type,
                customer_name,
                customer_phone,
                discount_amount,
                discounted,
                discount_per,
                cash_amount,
                change_amount,
                order_id,
                r_order_id,
                outlet_name,
                login_user,
                user_role,
                outlet_address,
                date_time,
                installation,
                manual_date,
                inches,
                batch_no,
                p_type
            ) VALUES (
                '$productId',
                '$supplierName',
                '$company',
                '$productName',
                '$productPrice',
                '$tradePrice',
                '$productQuantity',
                '$productTotal',
                '$discount',
                '$discAmount',
                '$tax',
                '$netAmount',
                '$bill_amount',
                '$productTotal',
                '$pre_amount',
                '$grand_amount',
                '$paidBy',
                '$sale_cost',
                '$customer_id',
                '$customer_type',
                '$customerName',
                '$customerPhone',
                '$discount_amount',
                '$discounted',
                '$discount_per',
                '$cash_amount',
                '$change_amount',
                '$orderId',
                '$r_order_id',
                '$outlet',
                '$user',
                '$role',
                '$address',
                '$date_time',
                '$installation',
                '$manualDate',
                 '$inches',
                '$batch_no',
                '$p_type'
            )";

        if ($connection->query($sql) !== TRUE) {
            echo "Error: " . $sql . "<br>" . $connection->error;
            ob_end_flush();
            exit;
        }
    }

    ob_end_clean();
    echo "<script type='text/javascript'>window.location.href = 'printq.php?order_id=$orderId';</script>";
}

ob_end_flush();
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title><?php echo $tx; ?></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@200;300;400;500;600;700&display=swap" rel="stylesheet">
    <style>
    body {
        font-family: 'Quicksand', sans-serif;
    }
    
    #table-container-wrapper {
        max-height: 390px; 
        overflow-y: auto; 
    }
    .bg {
        background: linear-gradient(270deg, #060606, #0A4657);
    }
    .input-group-text {
        font-weight: 600;
        font-size: 11px;
    }
    .in_form {
        height: 30px;
        font-size: 13px;
        border-color: #0A5064;
    }
    label {
        font-size: 13.5px;
        font-weight: 700;
    }
    .input-group-text {
        font-weight: 600;
        font-size: 11px;
        width: 73px;
    }
    .dropdown-menu {
        max-height: 250px;
        overflow-y: auto;
        position: absolute;
        z-index: 1000;
        width: 100%;
    }
    .input-group {
        position: relative;
    }
    .dropdown-item.active, .dropdown-item:active {
        color: #fff;
        text-decoration: none;
        background-color: #0A5064;
    }
    tr {
        font-weight: 700;
        background: #fff;
    }
    .form-control {
        font-weight: 700;
        height: 32px;
    }
    .btn-group .btn {
        margin-right: 5px;
    }
    .btn-group .btn:last-child {
        margin-right: 0;
    }
    .btn-primary {
        background: #0A4657;
        color: #fff;
        border: 1px solid #0A4657;
    }
    .btn-primary:hover {
        background: #fff;
        color: #0A4657;
        border: 1px solid #0A4657;
    }
    .form-control {
        font-size: 15px;
    }

    /* Batch List Styles - inside col-sm-3 */
    .batch-list-container {
        margin-top: 15px;
        border: 1px solid #dee2e6;
        border-radius: 10px;
        background: white;
        overflow: hidden;
        box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        display: none;
    }
    .batch-list-header {
        background: #0A4657;
        color: white;
        padding: 10px 12px;
        font-weight: bold;
        font-size: 14px;
    }
    .batch-list-body {
        max-height: 280px;
        overflow-y: auto;
    }
    .batch-item {
        padding: 12px 15px;
        border-bottom: 1px solid #f0f0f0;
        cursor: pointer;
        transition: all 0.2s ease;
        animation: fadeInUp 0.3s ease;
    }
    .batch-item:hover {
        background-color: #e8f4f8;
        transform: translateX(5px);
    }
    .batch-info {
        font-weight: 600;
        color: #0A4657;
        font-size: 14px;
    }
    .batch-qty {
        font-size: 12px;
        color: #28a745;
        margin-top: 4px;
    }
    .no-batches {
        padding: 20px;
        text-align: center;
        color: #dc3545;
        font-weight: 500;
    }
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(10px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    .product-name-item {
        padding: 8px 10px;
        font-weight: 600;
        border-bottom: 1px solid #dee2e6;
        cursor: pointer;
    }
    .product-name-item:hover {
        background-color: #e9ecef;
    }
    </style>
</head>
<body>
<div class="container-fluid">
    <div class="row bg">
        <div class="col-sm-3" style="width:100%; height:69px;">
            <img src="../img/logo231.png" style="margin-top:5px;" width="76" height="69">
        </div>
        <div class="col-sm-6">
            <h3 class="mb-4" style="color:#fff; font-weight:700; text-align:center; text-transform:uppercase;line-height:60px;"><?php echo $tx; ?></h3>
        </div>
        <div class="col-sm-3">
            <a href="addproduct.php" class="btn btn-light" style="margin-top:20px; float:right;">Back</a>
        </div>
    </div>
</div>

<div class="container-fluid">
    <form action="add_qot.php" method="post" enctype="multipart/form-data">
        <div class="row">
            <div class="col-sm-3" style="background:#F0F0F0; padding:10px; border:1px solid #CCC;">
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Product</span>
                    </div>
                    <input type="text" class="form-control" id="productInput" placeholder="Start typing a product name..." autocomplete="off">
                    <div class="dropdown-menu" id="suggestions"></div>
                </div>
                
                <!-- Batch List Container - shows inside col-sm-3 after product selection -->
                <div id="batchListContainer" class="batch-list-container">
                    <div class="batch-list-header">
                        <i class="fas fa-boxes"></i> Select Batch Number
                    </div>
                    <div id="batchListBody" class="batch-list-body">
                        <!-- Batches will be loaded here dynamically -->
                    </div>
                </div>
                
                <div class=" ">
                    <input type="hidden" id="p_price" name="p_price" class="form-control" placeholder="" readonly>
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">R.Qty</span>
                    </div>
                    <input type="text" id="remain_quantity" name="remain_quantity" class="form-control" placeholder="" readonly>
                </div>
                <hr>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Quantity</span>
                    </div>
                    <input type="text" id="quantity" name="quantity" class="form-control" placeholder="">
                </div>
                
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Inches</span>
                    </div>
                    <input type="text" id="inches" name="inches" class="form-control" placeholder="Inches" value="1">
                </div>
                
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Price / Unit</span>
                    </div>
                    <input type="text" id="retail_price" name="retail_price" class="form-control" placeholder="">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Total Price</span>
                    </div>
                    <input type="text" id="total_amount" name="total_amount" class="form-control" placeholder="" readonly>
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">-/ PKR</span>
                    </div>
                </div>
                <div class="row">
                    <div class="input-group mb-3 col-6">
                        <div class="input-group-prepend">
                            <span class="input-group-text bg-dark text-white">Dis %</span>
                        </div>
                        <input type="text" id="percentage" name="percentage" class="form-control" placeholder="">
                    </div>
                    <div class="input-group mb-3 col-6">
                        <input type="text" id="disc_amount" name="disc_amount" class="form-control" placeholder="">
                        <div class="input-group-prepend">
                            <span class="input-group-text bg-dark text-white">Dis PKR</span>
                        </div>
                    </div>
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-dark text-white">Net Amount</span>
                    </div>
                    <input type="text" id="trade_price" name="trade_price" class="form-control" placeholder="" readonly>
                </div>
                <br>
                <button type="button" class="form-control btn btn-dark" id="makeEntry">Make Entry</button>
                <hr>
                <div class="row">
                    <div class="col-6">
                        <button type="button" class="form-control btn btn-dark" onclick="location.reload();">Refresh</button>
                    </div>
                    <div class="col-6">
                        <a href="order_detail_q.php" class="btn btn-primary form-control">View Quotation</a>
                    </div>
                </div>
            </div>
            <div class="col-sm-9">
                <div class="row" style="background:#F0F0F0; padding:10px; border:1px solid #CCC;">
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label>Date</label>
                            <input type="date" id="refund_date" name="manual_date" class="form-control in_form" value="<?php echo date('Y-m-d'); ?>"> 
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label>Customer Type</label>
                            <select id="customer_select" name="customer_type" class="form-control">
                                <option value="walkin" selected>Walk-in Customer</option>
                                <option value="credit">Paid by Credit</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label>Customer Name</label>
                            <input type="text" id="customer_name" name="customer_name" class="form-control in_form" autocomplete="off">
                            <div class="dropdown-menu" id="customer_suggestions"></div>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label>Customer Phone</label>
                            <input type="text" id="customer_phone" name="customer_phone" class="form-control in_form">
                        </div>
                    </div>
                    <div class="">
                        <input type="hidden" id="customer_id" name="customer_id" class="form-control in_form">
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <label>Refund ID</label>
                            <input type="text" id="r_order_id" name="r_order_id" class="form-control in_form">
                            <div id="order_suggestions" class="dropdown-menu" style="display: none;"></div>
                        </div>
                    </div>
                </div>
                <div class="row" style="background:#F0F0F0; padding:10px; border:1px solid #CCC;">
                    <div class="col-sm-12" style="height:400px;" id="table-container-wrapper">
                        <table class="table table-borderless table-sm text-center" id="productsTable">
                            <tr class="text-white text-center" style="background:#0A4657;">
                                <th>Item Code</th>
                                <th>Description</th>
                                <th>Batch No</th>
                                <th>Qty</th>
                                <th>Inches</th>
                                <th>Unit Price</th>
                                <th>Amount</th>
                                <th>Dis%</th>
                                <th>Dis PKR</th>
                                <th>Tax</th>
                                <th>Net Amount</th>
                                <th>Action</th>
                                <th>Edit</th>
                            </tr>
                         </table>
                    </div>
                </div>
                <div class="row" style="margin-top: -10px;">
                    <div class="col-sm-12" style="background:#F0F0F0; padding:10px; border:1px solid #CCC;">
                        <br>
                        <div class="row">
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Total</label>
                                    <input type="text" id="total-input" name="total_input" class="form-control in_form input-height" readonly>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Bill Amount</label>
                                    <input type="text" id="bill-amount" name="bill_amount" class="form-control in_form input-height" required>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Installation</label>
                                    <input type="text" id="installation" name="installation" class="form-control in_form input-height" required>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Previous</label>
                                    <input type="text" id="pre_amount" name="pre_amount" class="form-control in_form input-height" readonly>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Grand Total</label>
                                    <input type="text" id="grand_amount" name="grand_amount" class="form-control in_form input-height" readonly>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Discount Amount</label>
                                    <input type="number" id="discount_amount" name="discount_amount" class="form-control in_form input-height">
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Discount %</label>
                                    <input type="number" id="discount_percent" name="discount_percent" class="form-control in_form input-height" readonly>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Cash Received</label>
                                    <input type="number" id="cash_received" name="cash_received" class="form-control in_form input-height">
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label>Cash Remaining</label>
                                    <input type="number" id="cash_return" name="cash_return" class="form-control in_form input-height">
                                </div>
                            </div>
                            <div class="">
                                <input type="hidden" id="tax" name="tax" class="form-control in_form input-height" readonly>
                            </div>
                            <div class="">
                                <input type="hidden" value="others" name="method" id="method" class="form-control in_form">
                            </div>
                            <input type="hidden" id="productData" name="productData">
                            <div class="col-sm-4">
                                <hr>
                                <div class="btn-group w-30" role="group">
                                    <button type="submit" name="bill" class="btn btn-dark btn-sm font-weight-bold">Generate Quotation</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<script>
document.addEventListener("DOMContentLoaded", function() {
    let currentFocus = -1;
    let selectedProductName = '';

    // Function to load and display batches in the col-sm-3 container
    function loadBatchesForProduct(productName) {
        const batchContainer = document.getElementById('batchListContainer');
        const batchBody = document.getElementById('batchListBody');
        
        if (!productName) {
            batchContainer.style.display = 'none';
            return;
        }
        
        batchContainer.style.display = 'block';
        batchBody.innerHTML = '<div class="no-batches"><i class="fas fa-spinner fa-spin"></i> Loading batches...</div>';
        
        var xhr = new XMLHttpRequest();
        xhr.open("GET", "?get_batches=" + encodeURIComponent(productName), true);
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) {
                batchBody.innerHTML = xhr.responseText;
                // Add click listeners to batch items
                document.querySelectorAll('.batch-item').forEach(function(item) {
                    item.addEventListener('click', function() {
                        selectBatch(this);
                    });
                });
            }
        };
        xhr.send();
    }

    function selectBatch(batchElement) {
        const productId = batchElement.getAttribute('data-product-id');
        const retailPrice = batchElement.getAttribute('data-retail-price');
        const productQuantity = batchElement.getAttribute('data-product-quantity');
        const tradePrice = batchElement.getAttribute('data-trade-price');
        const p_type = batchElement.getAttribute('data-p-type') || '';
        const supplier = batchElement.getAttribute('data-supplier');
        const company = batchElement.getAttribute('data-company');
        const productUnit = batchElement.getAttribute('data-product-unit');
        const inches = batchElement.getAttribute('data-inches') || 1;
        const batchNo = batchElement.getAttribute('data-batch-no');
        const productName = batchElement.getAttribute('data-product-name');
        
        const input = document.getElementById("productInput");
        input.value = productName + " (Batch: " + (batchNo || 'No Batch') + ")";
        input.setAttribute('data-product-id', productId);
        input.setAttribute('data-product-quantity', productQuantity);
        input.setAttribute('data-supplier', supplier);
        input.setAttribute('data-company', company);
        input.setAttribute('data-trade-price', tradePrice);
        input.setAttribute('data-p-type', p_type);
        input.setAttribute('data-product-unit', productUnit);
        input.setAttribute('data-inches', inches);
        input.setAttribute('data-batch-no', batchNo);
        input.setAttribute('data-product-name', productName);
        
        document.getElementById("remain_quantity").value = productQuantity;
        document.getElementById("p_price").value = tradePrice;
        document.getElementById("retail_price").value = retailPrice;
        document.getElementById("inches").value = inches;
        document.getElementById("suggestions").style.display = 'none';
        
        // Hide batch list after selection
        document.getElementById('batchListContainer').style.display = 'none';
        
        calculateTotalPrice();
        document.getElementById("quantity").focus();
    }

    // Refund Order ID Search
    document.getElementById("r_order_id").addEventListener("input", function() {
        var orderIdInput = this.value;
        if (orderIdInput.length > 0) {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "?order_id=" + encodeURIComponent(orderIdInput), true); 
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var suggestions = document.getElementById("order_suggestions");
                    suggestions.innerHTML = xhr.responseText;
                    suggestions.style.display = 'block';
                }
            };
            xhr.send();
        } else {
            document.getElementById("order_suggestions").style.display = 'none';
        }
    });

    document.getElementById("order_suggestions").addEventListener("click", function(e) {
        if (e.target && e.target.classList.contains("dropdown-item")) {
            selectOrder(e.target);
        }
    });

    document.getElementById("r_order_id").addEventListener("keydown", function(e) {
        var suggestions = document.getElementById("order_suggestions");
        if (suggestions.style.display === 'block') {
            var items = suggestions.getElementsByClassName("dropdown-item");
            if (e.key === "ArrowDown") {
                currentFocus++;
                addActive(items);
            } else if (e.key === "ArrowUp") {
                currentFocus--;
                addActive(items);
            } else if (e.key === "Enter") {
                e.preventDefault();
                if (currentFocus > -1) {
                    if (items[currentFocus]) {
                        selectOrder(items[currentFocus]);
                    }
                }
            }
        }
    });

    function addActive(items) {
        if (!items) return false;
        removeActive(items);
        if (currentFocus >= items.length) currentFocus = 0;
        if (currentFocus < 0) currentFocus = items.length - 1;
        if (items[currentFocus]) {
            items[currentFocus].classList.add("active");
            items[currentFocus].scrollIntoView({ block: "nearest" });
        }
    }

    function removeActive(items) {
        for (var i = 0; i < items.length; i++) {
            if (items[i]) items[i].classList.remove("active");
        }
    }

    function selectOrder(item) {
        var orderId = item.getAttribute('data-order-id');
        document.getElementById("r_order_id").value = orderId;
        document.getElementById("order_suggestions").style.display = 'none';
    }

    // Customer Search
    document.getElementById("customer_name").addEventListener("input", function() {
        var customerName = this.value;
        if (customerName.length > 0) {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "?customer_name=" + customerName, true);
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var suggestions = document.getElementById("customer_suggestions");
                    suggestions.innerHTML = xhr.responseText;
                    suggestions.style.display = 'block';
                }
            };
            xhr.send();
        } else {
            document.getElementById("customer_suggestions").style.display = 'none';
        }
    });

    document.getElementById("customer_suggestions").addEventListener("click", function(e) {
        if (e.target && e.target.classList.contains("dropdown-item")) {
            selectCustomer(e.target);
        }
    });

    document.getElementById("customer_name").addEventListener("keydown", function(e) {
        var suggestions = document.getElementById("customer_suggestions");
        if (suggestions.style.display === 'block') {
            var items = suggestions.getElementsByClassName("dropdown-item");
            if (e.key === "ArrowDown") {
                currentFocus++;
                addActive(items);
            } else if (e.key === "ArrowUp") {
                currentFocus--;
                addActive(items);
            } else if (e.key === "Enter") {
                e.preventDefault();
                if (currentFocus > -1) {
                    if (items[currentFocus]) {
                        selectCustomer(items[currentFocus]);
                    }
                }
            }
        }
    });

    function selectCustomer(item) {
        var customerName = item.getAttribute('data-customer-name');
        var customerId = item.getAttribute('data-customer-id');
        var customerPhone = item.getAttribute('data-customer-phone');
        var remainBalance = item.getAttribute('data-remain-balance');

        document.getElementById("customer_name").value = customerName;
        document.getElementById("customer_phone").value = customerPhone;
        document.getElementById("customer_id").value = customerId;
        document.getElementById("pre_amount").value = remainBalance; 

        document.getElementById("customer_suggestions").style.display = 'none';
    }

    // Calculate Total Price Function
    function calculateTotalPrice(triggeredBy = null) {
        let quantity = parseFloat(document.getElementById("quantity").value) || 0;
        let pricePerUnit = parseFloat(document.getElementById("retail_price").value) || 0;
        let inches = parseFloat(document.getElementById("inches").value) || 1;

        let totalPrice = quantity * pricePerUnit * inches;

        let discountPercent = parseFloat(document.getElementById("percentage").value) || 0;
        let discountAmount = parseFloat(document.getElementById("disc_amount").value) || 0;

        if (triggeredBy === "percentage") {
            discountAmount = (totalPrice * discountPercent) / 100;
            document.getElementById("disc_amount").value = discountAmount.toFixed(0);
        }

        if (triggeredBy === "disc_amount") {
            if (totalPrice > 0) {
                discountPercent = (discountAmount * 100) / totalPrice;
                if (!isFinite(discountPercent)) discountPercent = 0; 
                document.getElementById("percentage").value = discountPercent.toFixed(2);
            }
        }

        let finalPrice = totalPrice - discountAmount;
        if (finalPrice < 0) finalPrice = 0;

        document.getElementById("total_amount").value = totalPrice.toFixed(2);
        document.getElementById("trade_price").value = finalPrice.toFixed(2);  
    }

    document.getElementById("quantity").addEventListener("input", () => calculateTotalPrice());
    document.getElementById("retail_price").addEventListener("input", () => calculateTotalPrice());
    document.getElementById("inches").addEventListener("input", () => calculateTotalPrice());
    document.getElementById("percentage").addEventListener("input", () => calculateTotalPrice("percentage"));
    document.getElementById("disc_amount").addEventListener("input", () => calculateTotalPrice("disc_amount"));

    // ========== FIXED: Product Search ==========
    document.getElementById("suggestions").addEventListener("click", function(e) {
        if (e.target && e.target.classList.contains("product-name-item")) {
            const productName = e.target.getAttribute('data-product-name');
            selectedProductName = productName;
            document.getElementById("productInput").value = productName;
            document.getElementById("suggestions").style.display = 'none';
            loadBatchesForProduct(productName);
        }
    });

    document.getElementById("productInput").addEventListener("input", function() {
        var query = this.value.trim();
        if (query.length > 0) {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "?query=" + encodeURIComponent(query), true);
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    var suggestions = document.getElementById("suggestions");
                    var response = xhr.responseText;
                    if (response.trim() === "") {
                        suggestions.innerHTML = '<div class="dropdown-item text-danger">No products found</div>';
                    } else {
                        suggestions.innerHTML = response;
                    }
                    suggestions.style.display = 'block';
                }
            };
            xhr.send();
        } else {
            document.getElementById("suggestions").style.display = 'none';
            document.getElementById('batchListContainer').style.display = 'none';
        }
    });

    document.getElementById("productInput").addEventListener("keydown", function(e) {
        var suggestions = document.getElementById("suggestions");
        if (suggestions.style.display === 'block') {
            var items = suggestions.querySelectorAll(".product-name-item");
            if (e.key === "ArrowDown") {
                currentFocus++;
                addActive(items);
            } else if (e.key === "ArrowUp") {
                currentFocus--;
                addActive(items);
            } else if (e.key === "Enter") {
                e.preventDefault();
                if (currentFocus > -1 && items[currentFocus]) {
                    const productName = items[currentFocus].getAttribute('data-product-name');
                    selectedProductName = productName;
                    document.getElementById("productInput").value = productName;
                    document.getElementById("suggestions").style.display = 'none';
                    loadBatchesForProduct(productName);
                }
            }
        }
    });

    const productInput = document.getElementById("productInput");
    productInput.addEventListener("keypress", function (e) {
        if (e.key === "Enter") {
            e.preventDefault(); 
            if (selectedProductName) {
                loadBatchesForProduct(selectedProductName);
            }
        }
    });

    // Make Entry Button
    document.getElementById("makeEntry").addEventListener("click", function () {
        const productInput = document.getElementById("productInput");
        let productId = productInput.getAttribute('data-product-id');
        const batchNo = productInput.getAttribute('data-batch-no') || '';
        const p_type = productInput.getAttribute('data-p-type') || '';

        if (!productId) {
            productId = 'manual_' + Date.now();
        }

        const supplier = productInput.getAttribute('data-supplier') || '';
        const company = productInput.getAttribute('data-company') || '';
        const tradePrice = productInput.getAttribute('data-trade-price') || 0;
        const inches = document.getElementById("inches").value || 1;
        
        let description = productInput.getAttribute('data-product-name') || productInput.value;
        description = description.replace(/\s*\(Batch:.*?\)\s*$/, '');

        const quantity = parseFloat(document.getElementById("quantity").value) || 0;
        const pricePerUnit = parseFloat(document.getElementById("retail_price").value) || 0;
        const totalPrice = parseFloat(document.getElementById("total_amount").value) || 0;
        const discountPercentage = parseFloat(document.getElementById("percentage").value) || 0;
        const discAmount = parseFloat(document.getElementById("disc_amount").value) || 0;
        const netAmount = parseFloat(document.getElementById("trade_price").value) || 0;

        if (!batchNo) {
            alert("Please select a batch number first.");
            return;
        }

        if (quantity <= 0) {
            alert("Please enter a valid quantity.");
            return;
        }

        const remainQty = parseFloat(document.getElementById("remain_quantity").value) || 0;
        if (quantity > remainQty) {
            alert("Insufficient stock! Available quantity: " + remainQty);
            return;
        }

        if (description && quantity && pricePerUnit && totalPrice && netAmount) {
            const table = document.getElementById("productsTable");
            const row = table.insertRow();
            row.innerHTML = `
                <td style="display:none;">${quantity}</td>
                <td>${productId}</td>
                <td style="color:#0A5064;font-weight:700px;">${escapeHtml(description)}</td>
                <td>${escapeHtml(batchNo) || '-'}</td>
                <td>${quantity}</td>
                <td>${inches}</td>
                <td>${pricePerUnit}</td>
                <td>${totalPrice}</td>
                <td>${discountPercentage.toFixed(2)}</td>
                <td>${discAmount.toFixed(2)}</td>
                <td>0</td>
                <td>${netAmount}</td>
                <td style="display:none;">${supplier}</td>
                <td style="display:none;">${company}</td>
                <td style="display:none;">${tradePrice}</td>
                <td style="display:none;">${p_type}</td>
                <td><button class="btn btn-danger btn-sm delete-row">X</button></td>
                <td><button class="btn btn-danger btn-sm edit-row">+</button></td>
            `;

            row.querySelector(".delete-row").addEventListener("click", function () {
                row.remove();
                calculateTotalAmount();
            });

            row.querySelector(".edit-row").addEventListener("click", function () {
                const cells = row.querySelectorAll("td");
                productInput.value = cells[2].innerText;
                productInput.setAttribute('data-product-id', cells[1].innerText);
                productInput.setAttribute('data-supplier', cells[12].innerText);
                productInput.setAttribute('data-company', cells[13].innerText);
                productInput.setAttribute('data-trade-price', cells[14].innerText);
                productInput.setAttribute('data-p-type', cells[15].innerText);
                productInput.setAttribute('data-inches', cells[5].innerText);
                productInput.setAttribute('data-batch-no', cells[3].innerText);
                productInput.setAttribute('data-product-name', cells[2].innerText);

                document.getElementById("quantity").value = cells[4].innerText;
                document.getElementById("inches").value = cells[5].innerText;
                document.getElementById("retail_price").value = cells[6].innerText;
                document.getElementById("total_amount").value = cells[7].innerText;
                document.getElementById("percentage").value = cells[8].innerText;
                document.getElementById("disc_amount").value = cells[9].innerText;
                document.getElementById("trade_price").value = cells[11].innerText;

                row.remove();
                calculateTotalAmount();
                productInput.focus();
            });

            calculateTotalAmount();
            updateProductData();
            resetProductFields();
            productInput.focus();
        }
    });

    function updateProductData() {
        const rows = document.querySelectorAll("#productsTable tr:not(:first-child)");
        const productData = [];
        rows.forEach(function (row) {
            const cells = row.querySelectorAll("td");
            const product = {
                productId: cells[1].innerText,
                description: cells[2].innerText,
                batch_no: cells[3].innerText,
                quantity: cells[4].innerText,
                inches: cells[5].innerText,
                pricePerUnit: cells[6].innerText,
                totalPrice: cells[7].innerText,
                discountPercentage: cells[8].innerText,
                discAmount: cells[9].innerText,
                tax: cells[10].innerText,
                netAmount: cells[11].innerText,
                supplier: cells[12].innerText,
                company: cells[13].innerText,
                tradePrice: cells[14].innerText,
                Ptype: cells[15].innerText
            };
            productData.push(product);
        });
        document.getElementById("productData").value = JSON.stringify(productData);
    }

    document.querySelector("form").addEventListener("keydown", function(e) {
        if (e.key === "Enter" && e.target.type !== "submit") {
            e.preventDefault();
        }
    });

    function resetProductFields() {
        document.getElementById("productInput").value = '';
        document.getElementById("remain_quantity").value = '';
        document.getElementById("quantity").value = '';
        document.getElementById("inches").value = '1';
        document.getElementById("retail_price").value = '';
        document.getElementById("total_amount").value = '';
        document.getElementById("percentage").value = '';
        document.getElementById("disc_amount").value = '';
        document.getElementById("trade_price").value = '';
        document.getElementById("p_price").value = '';
        document.getElementById("productInput").removeAttribute('data-product-id');
        document.getElementById("productInput").removeAttribute('data-product-quantity');
        document.getElementById("productInput").removeAttribute('data-supplier');
        document.getElementById("productInput").removeAttribute('data-company');
        document.getElementById("productInput").removeAttribute('data-trade-price');
        document.getElementById("productInput").removeAttribute('data-p-type');
        document.getElementById("productInput").removeAttribute('data-product-unit');
        document.getElementById("productInput").removeAttribute('data-inches');
        document.getElementById("productInput").removeAttribute('data-batch-no');
        document.getElementById("productInput").removeAttribute('data-product-name');
        document.getElementById('batchListContainer').style.display = 'none';
        selectedProductName = '';
    }

    function calculateTotalAmount() {
        var table = document.getElementById("productsTable");
        var rows = table.getElementsByTagName("tr");
        var total = 0;

        for (var i = 1; i < rows.length; i++) {
            var netAmountCell = rows[i].cells[11];
            var netAmount = parseFloat(netAmountCell.textContent.trim());
            if (!isNaN(netAmount)) {
                total += netAmount;
            }
        }

        var totalInput = document.getElementById("total-input");
        var billAmountInput = document.getElementById("bill-amount");

        totalInput.value = total.toFixed(2);
        billAmountInput.value = total.toFixed(2);

        updateDiscountAmount();
        updateGrandAmount();
        updateProductData();
    }

    function updateDiscountAmount() {
        var total = parseFloat(document.getElementById("total-input").value) || 0;
        var billAmount = parseFloat(document.getElementById("bill-amount").value) || 0;

        var discountAmountInput = document.getElementById("discount_amount");
        var discountPercentInput = document.getElementById("discount_percent");

        var discountAmount = total - billAmount;
        discountAmountInput.value = Math.round(discountAmount);

        if (total > 0) {
            var discountPercent = (discountAmount / total) * 100;
            discountPercentInput.value = discountPercent.toFixed(2);
        } else {
            discountPercentInput.value = "0.00";
        }
    }

    function updateGrandAmount() {
        let billAmount = Number(document.getElementById("bill-amount").value) || 0;
        let preAmount = Number(document.getElementById("pre_amount").value) || 0;
        let installation = Number(document.getElementById("installation").value) || 0;

        let grandAmount = billAmount + preAmount + installation;
        document.getElementById("grand_amount").value = grandAmount.toFixed(2);
        calculateCashReturn();
    }

    function calculateCashReturn() {
        var grandAmount = parseFloat(document.getElementById("grand_amount").value) || 0;
        var cashReceived = parseFloat(document.getElementById("cash_received").value) || 0;
        var cashReturn = grandAmount - cashReceived;
        document.getElementById("cash_return").value = cashReturn.toFixed(2);
    }

    function attachInputListener(id, callback) {
        var el = document.getElementById(id);
        if (el) {
            el.addEventListener("input", callback);
        }
    }

    function escapeHtml(text) {
        if (!text) return '';
        const div = document.createElement('div');
        div.textContent = text;
        return div.innerHTML;
    }

    attachInputListener("bill-amount", function () {
        updateDiscountAmount();
        updateGrandAmount();
    });
    attachInputListener("pre_amount", updateGrandAmount);
    attachInputListener("installation", updateGrandAmount);
    attachInputListener("cash_received", calculateCashReturn);

    (function watchPreAmount() {
        var preAmountEl = document.getElementById("pre_amount");
        var lastValue = preAmountEl ? preAmountEl.value : null;
        setInterval(function () {
            if (!preAmountEl) return;
            if (preAmountEl.value !== lastValue) {
                lastValue = preAmountEl.value;
                updateGrandAmount();
            }
        }, 300);
    })();

    window.addEventListener("DOMContentLoaded", function () {
        calculateTotalAmount();
        updateGrandAmount();
    });
});
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</body>
</html>