<?php include "../../root.class.php";
$html = new html();
$html->add_styles_page();
$html->prevent_enter_script();
$call = new call_functions;

// $html->check_user_type("ADMIN");

$db = new db_safeguard();
$results = $db->query("stock", "SELECT * FROM stock WHERE 1");
$orders_res = $db->query("orders", "SELECT * FROM orders WHERE record_id  = {$_GET['record_id']}");
$orders = $orders_res->fetch_assoc();

if ($orders['jc_number'] != "") {
    $jobcard_res_1 = $db->query("job_cards", "SELECT * FROM job_cards WHERE jc_number = '{$orders['jc_number']}'");

    if ($jobcard_res_1->num_rows == 0) {

        $jobcard_res_2 = $db->query("job_cards_tech", "SELECT * FROM job_cards_tech WHERE jc_number = '{$orders['jc_number']}'");
        if ($jobcard_res_2->num_rows == 0) {

            $jobcard_res_2 = $db->query("job_card_accounts", "SELECT * FROM job_card_accounts WHERE `name` = '{$orders['jc_number']}'");
            $accounts = $jobcard_res_2->fetch_assoc();
            $job_card_name = $accounts['name'];
        } else {

            $tech = $jobcard_res_2->fetch_assoc();
            $job_card_name = $tech['company_name'];

        }
    } else {
        $project = $jobcard_res_1->fetch_assoc();
        $job_card_name = $project['project_name'];

    }
} else {
    $job_card_name = $project['N/A'];

}

$record_id = new input();
$record_id->name("record_id");
$record_id->id("record_id");
$record_id->type("hidden");
$record_id->readonly();
$record_id->required();
$record_id->value($_GET['record_id']);


$jobcard_numbers_res = $db->query("job_cards", "SELECT * FROM job_cards WHERE 1");
echo "<datalist id='job_cards_list'>";
while ($jobcard = $jobcard_numbers_res->fetch_assoc()) {
    echo "<option value='" . $jobcard['jc_number'] . "-" . $jobcard['project_name'] . "'>" . $jobcard['jc_number'] . "-" . $jobcard['project_name'] . "</option>";
}

$jobcard_numbers_res = $db->query("job_cards_tech", "SELECT * FROM job_cards_tech WHERE 1");
while ($jobcard = $jobcard_numbers_res->fetch_assoc()) {
    echo "<option value='" . $jobcard['jc_number'] . "-" . $jobcard['company_name'] . "'>" . $jobcard['jc_number'] . "-" . $jobcard['company_name'] . "</option>";
}
echo "</datalist>";

$jobcard_account = new select();
$jobcard_account->name("job_card_account_id");
$jobcard_account->id("job_card_account_id");
$jobcard_account->class("search_inputs");
$jobcard_account->add_option("", "JOB CARD ACCOUNT");
$job_card_account_res = $db->query("job_card_accounts", "SELECT * FROM job_card_accounts WHERE `status` = 1");
while ($job_card_account = $job_card_account_res->fetch_assoc()) {
    $jobcard_account->add_option($job_card_account['record_id'], $job_card_account['name'] . " : " . $job_card_account['description']);
}
$jobcard_account->style("width: 80%;");
$jobcard_account->value_from_db("orders", "job_card_account_id", "record_id = {$_GET['record_id']}");

$po_number = new input();
$po_number->name("po_number");
$po_number->id("po_number");
$po_number->class("search_inputs");
$po_number->placeholder("PO Number");
$po_number->type("text");
$po_number->style("width: 80%;");
$po_number->value_from_db("orders", "po_number", "record_id = {$_GET['record_id']}");

$jc_number = new input();
$jc_number->name("jc_number");
$jc_number->id("jc_number");
$jc_number->class("search_inputs");
$jc_number->placeholder("JC Number");
$jc_number->type("text");
$jc_number->datalist("job_cards_list");
$jc_number->onchange("split_jc_and_name(this)");
$jc_number->value_from_db("orders", "jc_number", "record_id = {$_GET['record_id']}");
$jc_number->style("width: 80%;");

$jc_name = new input();
$jc_name->name("");
$jc_name->id("");
$jc_name->class("search_inputs job_card_name");
$jc_name->placeholder("");
$jc_name->type("text");
$jc_name->value($job_card_name);
$jc_name->style("width: 80%;");
$jc_name->readonly();

$supplier = new select();
$supplier->name("supplier_id");
$supplier->id("supplier_id");
$supplier->class("search_inputs");
$supplier->add_option("", "Supplier");
$supplier->fill_from_db("suppliers", "record_id", "name");
$supplier->style("width: 80%;");
$supplier->value_from_db("orders", "supplier_id", "record_id = {$_GET['record_id']}");

$order_date = new input();
$order_date->name("order_date");
$order_date->id("order_date");
$order_date->class("search_inputs");
$order_date->type("datetime-local");
$order_date->value(date("Y-m-d H:i", strtotime("+2 hours")));
$order_date->style("width: 80%;");
$order_date->value_from_db("orders", "date_time_created", "record_id = {$_GET['record_id']}");

$ordered_for = new select();
$ordered_for->name("user_id");
$ordered_for->id("user_id");
$ordered_for->class("search_inputs");
$ordered_for->required();
$ordered_for->add_option("", "Order For");
$ordered_for->fill_from_db("users", "record_id", "username");
$ordered_for->style("width: 80%;");
$ordered_for->value_from_db("orders", "user_id", "record_id = {$_GET['record_id']}");

$ordered_by = new select();
$ordered_by->name("user_created");
$ordered_by->id("user_created");
$ordered_by->class("search_inputs");
$ordered_by->required();
$ordered_by->add_option("", "Order By");
// $ordered_by->fill_from_db("users", "record_id", "username");
$ordered_by->add_option("3", "Kaylynn");
$ordered_by->add_option("12", "Chanay");
$ordered_by->add_option("19", "Claurika");
$ordered_by->style("width: 80%;");
$ordered_by->value_from_db("orders", "user_created", "record_id = {$_GET['record_id']}");


$datalist = "";
while ($result = $results->fetch_assoc()) {
    $datalist .= "<option value='" . $result['record_id'] . " | " . $result['description'] . " | " . $result['cost_price'] . "'></option>";
}
$results = $db->query("stock", "SELECT * FROM stock WHERE stock_type = 1");

$datalist_non_stock = "";
while ($result = $results->fetch_assoc()) {
    $datalist_non_stock .= "<option value='" . $result['record_id'] . " | " . $result['description'] . " | " . $result['cost_price'] . "'></option>";
}
$results = $db->query("stock", "SELECT * FROM stock WHERE stock_type = 2");

$datalist_units = "";
while ($result = $results->fetch_assoc()) {
    $datalist_units .= "<option value='" . $result['record_id'] . " | " . $result['description'] . " | " . $result['cost_price'] . "'></option>";
}

$warrenty = new select();
$warrenty->id('warrenty');
$warrenty->name('warrenty');
$warrenty->required();
$warrenty->class();
$warrenty->add_option('0', 'No Warrenty');
$warrenty->add_option('1', 'Has Warrenty');
$warrenty->value_from_db("orders", "warrenty", "record_id = {$_GET['record_id']}");
?>


<form action="update_order.php" method="POST">
    <datalist id="stock">
        <?php echo $datalist; ?>
    </datalist>
    <datalist id="non_stock">
        <?php echo $datalist_non_stock; ?>
    </datalist>
    <datalist id="units">
        <?php echo $datalist_units; ?>
    </datalist>
    <div>
        <div class="form_down">
            <h1>EDIT ORDER</h1>
            <div class="row">
                <select name="status" id="status" class="inputs">
                    <option value="0">OPEN</option>
                    <option value="1">CLOSED</option>
                </select>
                <?php
                echo $html->select_from_db_add_current_selected_column('orders', "status", "record_id = {$_GET['record_id']}", 'status');
                ?>
            </div>
            <div class="row">
                <div class="row" style="flex-direction: column;width:50%;">
                    <?php
                    $record_id->add();
                    $po_number->add();
                    $jobcard_account->add();
                    $jc_number->add();
                    $jc_name->add();
                    $supplier->add();
                    ?>
                </div>
                <div class="row" style="flex-direction: column;width:50%;">
                    <?php
                    $order_date->add();
                    $ordered_for->add();
                    $ordered_by->add();
                    $warrenty->add();
                    ?>
                    <input type="number" value="<?php echo $orders['include_vat']; ?>" id="include_vat" hidden
                        name="include_vat">

                </div>
            </div>

            <table id="order_table" style="font-size:2vw">
                <tr>
                    <th>Not Stock</th>
                    <th>Item Description (double click to clear)</th>
                    <th>Quantity</th>
                    <th>Cost Price Ex.</th>
                    <th>Action</th>
                </tr>

                <?php
                $index = 0;
                $order_items_res = $db->query("order_items", "SELECT * FROM order_items WHERE order_id = {$_GET['record_id']} ORDER BY record_id ASC");
                while ($order_item = $order_items_res->fetch_assoc()) {
                    echo "<tr>";

                    echo "<td><select id='stock_type_$index' class='inputs' name='stock_type_$index' onchange='toggleStockList($index)'>
                        <option></option>
                        <option value=0>STOCK</option>
                        <option value=1>NON STOCK</option>
                        <option value=2>UNITS</option>
                        <option value=3>NOT COUNTABLE</option>
                        </select></td>";
                    echo "<script>document.getElementById('stock_type_$index').value = {$order_item['stock_type']};</script>";
                    echo "<td><input type='text' class='inputs'  autocomplete='off' ondblclick='this.value=\"\";'  style='width: 35vw;overflow-wrap: break-word; font-size:0.5em;' name='item_description$index' onchange='extract_price($index)' id='item_description$index' value='" . $order_item['stock_id'] . " | " . $order_item['name'] . "'></td>";
                    echo "<td><input type='number' onchange='calculate_total()' step='0.001' style='width: 10vw;' class='inputs' name='quantity$index' id='quantity$index' value='" . $order_item['quantity'] . "'></td>";
                    echo "<td><input type='number' onchange='calculate_total()' step='0.001' style='width: 15vw;' class='inputs' name='cost_price$index' id='cost_price$index' value='" . $order_item['purchase_price_ex'] . "'></td>";
                    echo "<td><button class='select_button' id='delete_row$index' onclick='delete_row($index)'>Delete</button></td>";
                    echo "</tr>";
                    $index++;
                }


                ?>
                <tbody id="order_table_body">
                </tbody>
            </table>
            <button type="submit" class="select_button" style="height:2vw;font-size:1.5vw" id="add_row" s>Add
                Row</button>
            <input type="text" id="counter" value="<?php echo $index; ?>" hidden name="counter">
            <script>
                document.getElementById("add_row").addEventListener("click", function () {
                    event.preventDefault();
                    counter = document.getElementById('counter').value;
                    var row = document.createElement('tr');
                    row.innerHTML = `
            <td>
             <select id='stock_type_`+ counter + `' class='inputs' name='stock_type_` + counter + `' onchange="toggleStockList(` + counter + `)">\
            <option></option>
            <option value=0>STOCK</option>
            <option value=1>NON STOCK</option>
            <option value=2>UNITS</option>
            <option value=3>NOT COUNTABLE</option>
            </select>

            </td>
            <td>
            <input type="text" class="inputs" style='width: 35vw;' name="item_description`+ counter + `" onchange="extract_price(` + counter + `)" id="item_description` + counter + `" autocomplete="off"  ondblclick="this.value='';">
            </td>
          
            <td>
                <input type="number" step="0.01" onchange="calculate_total()" style='width: 10vw;' class="inputs" name="quantity`+ counter + `"
                    id="quantity` + counter + `" value="">
            </td>
        <td>
            <input type="number" step="0.01" onchange="calculate_total()" class="inputs" style='width: 15vw;' name="cost_price`+ counter + `"
                id="cost_price` + counter + `" value="">
        </td>
        <td>
            <button class="select_button" id="delete_row`+ counter + `"
                onclick="delete_row(` + counter + `)">Delete</button>
        </td>
        `;
                    document.getElementById('counter').value = parseInt(document.getElementById('counter').value) + 1;
                    document.getElementById('order_table_body').appendChild(row);
                    counter++;
                });

                function delete_row(counter) {
                    event.preventDefault();

                    document.getElementById("stock_type_" + counter).hidden = true;
                    document.getElementById("stock_type_" + counter).checked = false;
                    document.getElementById("item_description" + counter).hidden = true;
                    document.getElementById("item_description" + counter).value = "";
                    document.getElementById("cost_price" + counter).hidden = true;
                    document.getElementById("cost_price" + counter).value = "0";
                    document.getElementById("quantity" + counter).hidden = true;
                    document.getElementById("quantity" + counter).value = "0";
                    document.getElementById("delete_row" + counter).hidden = true;
                    calculate_total();

                }

                function extract_price(counter) {
                    if (document.getElementById('item_description' + counter).value.includes("|")) {
                        var input = document.getElementById('item_description' + counter);
                        var parts = input.value.split(' | ');
                        document.getElementById('cost_price' + counter).value = parts[2];
                        input.value = parts[0] + " | " + parts[1];
                    }
                }
            </script>

            <script>
                function toggleStockList(counter) {
                    var select = document.getElementById('stock_type_' + counter);
                    var input = document.getElementById('item_description' + counter);
                    // input.value = "";
                    if (select.value == 0) {
                        input.removeAttribute('list');
                        input.setAttribute('list', 'stock');

                    } else if (select.value == 1) {
                        input.removeAttribute('list');
                        input.setAttribute('list', 'non_stock');
                    } else {
                        input.removeAttribute('list');
                        input.setAttribute('list', 'units');

                    }
                }
            </script>
        </div>
        <div style="width: 100%; margin-top: 5vh;">

            <div class="row" style="width=100%;text-align: center;">
                <div class="column">
                    <span style="font-weight:bold;">INCLUDE VAT CALCULATIONS</span>
                    <input type="checkbox" name="vat_calculation" checked id="vat_calculation"
                        onclick="calculate_vat(this)">
                </div>
            </div>
            <div class="row">
                <div class="column">
                    <span style="font-weight:bold;">Total Ex Vat: </span>
                    <input type="number" id="total_ex_vat" step="0.001" class="inputs" value="0.00">
                </div>
                <div class="column">
                    <span style="font-weight:bold;">Total Inc Vat: </span>

                    <input type="number" id="total_inc_vat" step="0.001" value="0.00" class="inputs">
                </div>
                <div class="column">
                    <input type="submit" class="select_button" id="submit" value="save">
                </div>
            </div>
        </div>
        <script>
            var vat_amount = 1.15;

            if (document.getElementById('include_vat').value == 1) {
                var vat_amount = 1.15;
                document.getElementById("vat_calculation").checked = true;
            } else {
                var vat_amount = 1;
                document.getElementById("vat_calculation").checked = false;

            }
            function calculate_vat(input) {
                if (vat_amount == 1.15) {
                    vat_amount = 1;
                    document.getElementById("include_vat").value = 0;
                } else {
                    vat_amount = 1.15;
                    document.getElementById("include_vat").value = 1;


                }
                calculate_total();
            }
            function calculate_total() {
                var total_ex_vat = 0;
                var total_inc_vat = 0;
                for (var i = 0; i < document.getElementById('counter').value; i++) {
                    var cost_price = document.getElementById("cost_price" + i).value;
                    var quantity = document.getElementById("quantity" + i).value;
                    total_ex_vat += cost_price * quantity;
                    total_inc_vat += cost_price * quantity * vat_amount;
                    console.log(total_ex_vat);
                }
                document.getElementById("total_ex_vat").value = Number(total_ex_vat).toFixed(3);
                document.getElementById("total_inc_vat").value = Number(total_inc_vat).toFixed(3);
            }

            calculate_total();


            function split_jc_and_name(input) {
                if (input.value.includes("-")) {
                    var parts = input.value.split('-');
                    document.getElementById('jc_number').value = parts[0];
                    document.getElementsByClassName('job_card_name')[0].value = parts[1];
                } else {
                    document.getElementById('jc_number').value = "";
                    document.getElementsByClassName('job_card_name')[0].value = "";
                }

            }
        </script>
    </div>
</form>
<?php
$stock_received_log_res = $db->query("order_trans", "SELECT * FROM `order_trans` WHERE order_id = {$_GET['record_id']} AND stock_id != 0 ORDER BY record_id DESC");
?>
<div style="overflow-x: auto; white-space: nowrap;">
    <table class="table_1">
        <thead>
            <tr>
                <th>
                    DESCRIPTION
                </th>
                <th>
                    AMOUNT
                </th>
                <th>
                    DATE
                </th>
                <th>
                    BARCODE
                </th>
                <th>
                    SERAIL NUMBER
                </th>
                <th>
                    USER
                </th>
            </tr>
        </thead>
        <tbody id="tbody">
            <h1>STOCK RECEIVED</h1>
            <?php
            $index = 0;
            while ($stock_received_log = $stock_received_log_res->fetch_assoc()) {
                $stock_res = $db->query("stock", "SELECT * FROM stock WHERE record_id = {$stock_received_log['stock_id']}");
                $stock = $stock_res->fetch_assoc();

                if ($stock['stock_type'] == 2) {
                    $unit_stock_res = $db->query("units_stock", "SELECT * FROM units_stock WHERE record_id = {$stock_received_log['units_stock_id']}");
                    $unit_stock = $unit_stock_res->fetch_assoc();
                    $barcode = $unit_stock['barcode'];
                    $serail_number = $unit_stock['serial_number'];
                    $type = $stock['stock_type'];
                    $id = $unit_stock['record_id'];

                } else if ($stock['stock_type'] == 1) {
                    $non_stock_res = $db->query("non_stock", "SELECT * FROM non_stock WHERE record_id = {$stock_received_log['non_stock_id']}");
                    $non_stock = $non_stock_res->fetch_assoc();
                    $barcode = $non_stock['barcode'];
                    $serail_number = '';
                    $type = $stock['stock_type'];
                    $id = $non_stock['record_id'];
                } else {
                    $barcode = '';
                    $serail_number = '';
                    $type = $stock['stock_type'];
                    $id = $stock['record_id'];
                }
                ?>
                <tr>
                    <td>
                        <?php echo $stock['description']; ?>
                        <input type="text" hidden id="type_<?php echo $index; ?>" value="<?php echo $type; ?>" />
                        <input type="text" hidden id="trans_id_<?php echo $index; ?>"
                            value="<?php echo $stock_received_log['record_id']; ?>" />
                        <input type="text" hidden id="stock_id_<?php echo $index; ?>"
                            value="<?php echo $stock_received_log['stock_id']; ?>" />
                        <input type="text" hidden id="stock_non_stock_units_id_<?php echo $index; ?>"
                            value="<?php echo $id; ?>" />
                    </td>
                    <td> <input type="text" class="inputs" id="amount_<?php echo $index; ?>"
                            onchange='update_amount(this,<?php echo $index; ?>)'
                            value="<?php echo $stock_received_log['amount']; ?>" /></td>
                    <td><?php echo $stock_received_log['date_time']; ?></td>
                    <td><?php

                    if ($type == 2) {
                        ?>
                            <input type="text" class="inputs" onchange='update_barcode(this,<?php echo $index; ?>)'
                                id="barcode_<?php echo $index; ?>" value="<?php echo $barcode; ?>" />
                            <?php
                    } else if ($type == 1) {
                        ?>
                                <input type="text" class="inputs" onchange='update_barcode(this,<?php echo $index; ?>)'
                                    id="barcode_<?php echo $index; ?>" value="<?php echo $barcode; ?>" />
                            <?php
                    } else {
                        echo $barcode;
                    }
                    ?>
                    </td>
                    <td><?php

                    if ($type == 2) {
                        ?>
                            <input type="text" class="inputs" onchange="update_serial_number(this,<?php echo $index; ?>)"
                                id="serial_number_<?php echo $index; ?>" value="<?php echo $serail_number; ?>" />
                            <?php
                    } else {
                        echo $serail_number;
                    }


                    ?>
                    </td>
                    <td><?php echo $call->get_username($stock_received_log['user_id']); ?></td>
                </tr>
                <?php

                $index++;
            } ?>

        </tbody>
    </table>
</div>
<script>
    function update_amount(input, index) {
        let value = input.value;
        let trans_id = document.getElementById('trans_id_' + index).value;
        let type = document.getElementById('type_' + index).value;
        let stock_non_stock_units_id = document.getElementById('stock_non_stock_units_id_' + index).value;

        xhr = new XMLHttpRequest();
        xhr.open("POST", "update_stock_received_amount.php");
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                console.log(xhr.responseText);
                if (xhr.responseText == 1) {
                    input.style.transition = 'background 0.3s ease';
                    input.style.background = '#c6efce';
                    setTimeout(function () {
                        input.style.background = '#fff';
                    }, 800);
                } else {
                    console.log(xhr.responseText);
                    input.style.transition = 'background 0.3s ease, color 0.3s ease';
                    input.style.background = '#ffcccc';
                    input.style.color = '#fff';
                    setTimeout(function () {
                        input.style.background = '#fff';
                        input.style.color = '#333';
                    }, 800);
                }
            }
        }
        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhr.send("trans_id_=" + trans_id + "&amount=" + value);
    }
    function update_barcode(input, index) {
        let value = input.value;
        let stock_id = document.getElementById('stock_id_' + index).value;
        let type = document.getElementById('type_' + index).value;
        let stock_non_stock_units_id = document.getElementById('stock_non_stock_units_id_' + index).value;

        xhr = new XMLHttpRequest();
        xhr.open("POST", "update_stock_received_barcode.php");
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                console.log(xhr.responseText);
                if (xhr.responseText == 1) {
                    input.style.transition = 'background 0.3s ease';
                    input.style.background = '#c6efce';
                    setTimeout(function () {
                        input.style.background = '#fff';
                    }, 800);
                } else {
                    console.log(xhr.responseText);
                    input.style.transition = 'background 0.3s ease, color 0.3s ease';
                    input.style.background = '#ffcccc';
                    input.style.color = '#fff';
                    setTimeout(function () {
                        input.style.background = '#fff';
                        input.style.color = '#333';
                    }, 800);
                }
            }
        }
        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhr.send("stock_id=" + stock_id + "&value=" + value + "&type=" + type + "&stock_non_stock_units_id=" + stock_non_stock_units_id);
    }

    function update_serial_number(input, index) {
        let value = input.value;
        let stock_id = document.getElementById('stock_id_' + index).value;
        let type = document.getElementById('type_' + index).value;
        let stock_non_stock_units_id = document.getElementById('stock_non_stock_units_id_' + index).value;

        xhr = new XMLHttpRequest();
        xhr.open("POST", "update_stock_received_serial_number.php");
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                console.log(xhr.responseText);
                if (xhr.responseText == 1) {
                    input.style.transition = 'background 0.3s ease';
                    input.style.background = '#c6efce';
                    setTimeout(function () {
                        input.style.background = '#fff';
                    }, 800);
                } else {
                    console.log(xhr.responseText);
                    input.style.transition = 'background 0.3s ease, color 0.3s ease';
                    input.style.background = '#ffcccc';
                    input.style.color = '#fff';
                    setTimeout(function () {
                        input.style.background = '#fff';
                        input.style.color = '#333';
                    }, 800);
                }
            }
        }
        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhr.send("stock_id=" + stock_id + "&value=" + value + "&type=" + type + "&stock_non_stock_units_id=" + stock_non_stock_units_id);
    }
</script>
<style>
    /* Wrap your table in a container */
    .table-responsive {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        /* smooth scrolling on iOS */
    }

    /* Basic styling for the table (same as before) */
    .table_1 {
        width: 100%;
        border-collapse: collapse;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 14px;
        color: #333;
        background: #fff;
        box-shadow: 0 2px 8px rgb(0 0 0 / 0.1);
        border-radius: 8px;
        overflow: hidden;
        min-width: 700px;
        /* Ensure min width so horizontal scroll triggers */
    }

    .table_1 th {
        background: #1e90ff;
        color: white;
        text-align: left;
        padding: 12px 15px;
        font-weight: 600;
        letter-spacing: 0.03em;
        user-select: none;
    }

    .table_1 td {
        padding: 12px 15px;
        border-bottom: 1px solid #eaeaea;
    }

    .table_1 tr:nth-child(even) {
        background: #f9f9f9;
    }

    .table_1 tbody tr:hover {
        background-color: #d0e7ff;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }
</style>
<br><br>


<script>

    function update_data(column_name, input, record_id) {

        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                if (xhr.responseText == '1' || xhr.responseText == 1) {
                    input.style.transition = 'background 0.3s ease';
                    input.style.background = '#c6efce';
                    setTimeout(function () {
                        input.style.background = '#fff';
                    }, 800);
                } else {
                    console.log(xhr.responseText);
                    input.style.transition = 'background 0.3s ease, color 0.3s ease';
                    input.style.background = '#ffcccc';
                    input.style.color = '#fff';
                    setTimeout(function () {
                        input.style.background = '#fff';
                        input.style.color = '#333';
                    }, 800);
                }
            }
        };
        xhr.open('POST', 'edit_disp_rec_admin.ajax.php', true);
        xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
        xhr.send('column=' + encodeURIComponent(column_name) + '&value=' + encodeURIComponent(input.value) + '&record_id=' + encodeURIComponent(record_id));
    }
</script>
<script>
    function change_amount(amount, trans_id) {
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200) {
                if (this.responseText == 1) {
                    document.getElementById("amount_" + trans_id).style.color = "white";
                    document.getElementById("amount_" + trans_id).style.backgroundColor = "green";
                } else {
                    document.getElementById("amount_" + trans_id).style.color = "white";
                    document.getElementById("amount_" + trans_id).style.backgroundColor = "red";
                }
            }
        };
        xhttp.open("POST", "update_stock_received_amount.php", true);
        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttp.send("trans_id=" + trans_id + "&amount=" + amount);
    }
</script>