From e1771dccdca74565358bcf1e73dd1219d63f32e6 Mon Sep 17 00:00:00 2001
From: Jun Barroga <jun.barroga@obanana.com>
Date: Tue, 30 Apr 2024 08:22:40 +0800
Subject: [PATCH] Updates on checkout, product page, user history, vendor
 settings, vendor profile

---
 admin/vendor-profile.php   |  78 +++++++++++-----
 checkouttest.php           |  63 +++++++++++++
 login_action.php           |   2 +
 product-left-sidebar.php   |  34 ++++---
 shop-list-left-sidebar.php |  26 +++++-
 user-history.php           |  23 ++++-
 vendor-settings.php        | 182 ++++++++++++++++++++++++-------------
 7 files changed, 303 insertions(+), 105 deletions(-)

diff --git a/admin/vendor-profile.php b/admin/vendor-profile.php
index 4e39706..af0c162 100644
--- a/admin/vendor-profile.php
+++ b/admin/vendor-profile.php
@@ -65,21 +65,21 @@ foreach ($vendorPayouts as $payout) {
     } 
 }
 
-if (isset($_SESSION["token"])) {
-    $token = $_SESSION["token"];
-    $token_parts = explode(".", $token);
-    $token_payload = base64_decode($token_parts[1]);
-    $token_data = json_decode($token_payload);
+// if (isset($_SESSION["token"])) {
+//     $token = $_SESSION["token"];
+//     $token_parts = explode(".", $token);
+//     $token_payload = base64_decode($token_parts[1]);
+//     $token_data = json_decode($token_payload);
 
-    $issued_at_time = $token_data->iat;
-    $expiration_time = $token_data->exp;
-    $renewal_time = $issued_at_time + 3000;
+//     $issued_at_time = $token_data->iat;
+//     $expiration_time = $token_data->exp;
+//     $renewal_time = $issued_at_time + 200;
 
-    // if (time() >= $renewal_time || time() >= $expiration_time) {
-    //     header("Location: token-renew.php");
-    //     exit; 
-    // }
-}
+//     // if (time() >= $renewal_time || time() >= $expiration_time) {
+//     //     header("Location: token-renew.php");
+//     //     exit; 
+//     // }
+// }
 // $token = loginRenew($_SESSION["email"], $_SESSION["password"], $token);
 // $_SESSION["token"] = $token;
 
@@ -122,26 +122,54 @@ date_default_timezone_set('Asia/Manila');
     }
 
     setInterval(function() {
-        var currentTime = <?php echo time(); ?>;
-        var renewalTime = <?php echo $renewal_time; ?>;
-        var expirationTime = <?php echo $expiration_time; ?>;
+        var currentTime = <?php // echo time(); ?>;
+        var renewalTime = <?php // echo $renewal_time; ?>;
+        var expirationTime = <?php // echo $expiration_time; ?>;
         if (currentTime >= renewalTime || currentTime >= expirationTime) {
             renewToken();
         }
     }, 60000);
 </script> -->
 <script>
-   function renewToken() {
-        var xhr = new XMLHttpRequest();
-        xhr.open("GET", "token-renew.php", true);
-        xhr.send();
-        console.log("Token renewed at: " + new Date().toLocaleString());
-    }
+
+	var token_parts = "<?php echo $_SESSION["token"]; ?>".split(".");
+	console.log("Token Payload: " + token_parts[1]);
+var token_payload = atob(token_parts[1]);
+var token_data = JSON.parse(token_payload);
+
+
+var issued_at_time = token_data.iat;
+var expiration_time = token_data.exp;
+var renewal_time = issued_at_time + 200;
+console.log("Issued At Time: " + new Date(issued_at_time * 1000).toLocaleString());
+console.log("Expiration Time: " + new Date(expiration_time * 1000).toLocaleString());
+console.log("Renewal Time: " + new Date(renewal_time * 1000).toLocaleString());
+function renewToken() {
+    var xhr = new XMLHttpRequest();
+    xhr.open("GET", "token-renew.php", true);
+    xhr.onreadystatechange = function () {
+        if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
+            var newToken = xhr.responseText;
+            token_parts = newToken.split(".");
+            token_payload = atob(token_parts[1]);
+            token_data = JSON.parse(token_payload);
+			issued_at_time = token_data.iat
+			renewal_time = issued_at_time + 200
+            expiration_time = token_data.exp;
+            
+			console.log("New Token: " + token_parts)
+            console.log("Token renewed at: " + new Date().toLocaleString());
+            console.log("New expiration time: " + new Date(expiration_time * 1000).toLocaleString());
+        }
+    };
+    xhr.send();
+}
+
 
     setInterval(function() {
-        var currentTime = <?php echo time(); ?>;
-        var renewalTime = <?php echo $renewal_time; ?>;
-        var expirationTime = <?php echo $expiration_time; ?>;
+		var currentTime = Date.now() / 1000;
+        var renewalTime = renewal_time;
+        var expirationTime = expiration_time;
         console.log("Current Time: " + new Date(currentTime * 1000).toLocaleString());
         console.log("Renewal Time: " + new Date(renewalTime * 1000).toLocaleString());
         console.log("Expiration Time: " + new Date(expirationTime * 1000).toLocaleString());
diff --git a/checkouttest.php b/checkouttest.php
index e17111f..7e02241 100644
--- a/checkouttest.php
+++ b/checkouttest.php
@@ -1455,6 +1455,21 @@ if (isset($customer_data[0]["address"]) && is_array($customer_data[0]["address"]
                                                             const randomIndex = Math.floor(Math.random() * refchar.length);
                                                             uniqueRef += refchar.charAt(randomIndex);
                                                         }
+                                                        let paymentDeetsId = 'obn_cod_id_';
+                                                        for (let i = 0; i < 16; i++) {
+                                                            const randomIndex = Math.floor(Math.random() * refchar.length);
+                                                            paymentDeetsId += refchar.charAt(randomIndex);
+                                                        }
+                                                        let paymentUniqueId = '';
+                                                        for (let i = 0; i < 24; i++) {
+                                                            const randomIndex = Math.floor(Math.random() * refchar.length);
+                                                            paymentUniqueId += refchar.charAt(randomIndex);
+                                                        }
+                                                        let dataPaymentUniqueId = '';
+                                                        for (let i = 0; i < 24; i++) {
+                                                            const randomIndex = Math.floor(Math.random() * refchar.length);
+                                                            dataPaymentUniqueId += refchar.charAt(randomIndex);
+                                                        }
 
                                                         const selectedFName = document.getElementById('selectedFName').innerText;
                                                         const selectedLName = document.getElementById('selectedLName').innerText;
@@ -1521,6 +1536,54 @@ if (isset($customer_data[0]["address"]) && is_array($customer_data[0]["address"]
                                                                     payment: {
                                                                         status: "UNPAID",
                                                                         reference_number: uniqueRef,
+                                                                        details: [
+                                                                            {
+                                                                                id: paymentDeetsId,
+                                                                                attributes:{
+                                                                                    data:{
+                                                                                        attributes:{
+                                                                                            amount: parseFloat(orderId.total_amount) * 100 ,
+                                                                                            description: orderId.items[0].product.name + " (" + orderId.items[0].quantity + ")" ,
+                                                                                            status: "unpaid",
+                                                                                            fee:shippingFees * 100,
+                                                                                            tax_amount:"null",
+                                                                                            taxes:[],
+                                                                                            reference_number: uniqueRef,
+                                                                                            payments:[
+                                                                                                {
+                                                                                                    attributes:{
+                                                                                                        billing:{
+                                                                                                            phone: billingNumber
+                                                                                                        },
+                                                                                                        source: {
+                                                                                                            type: "Cash On Delivery"
+                                                                                                        },
+                                                                                                        amount:parseFloat(orderId.total_amount) * 100,
+                                                                                                        currency: "PHP",
+                                                                                                        description: orderId.items[0].product.name + " (" + orderId.items[0].quantity + ")" ,
+                                                                                                        fee:shippingFees,
+                                                                                                        net_amount: parseFloat(orderId.total_amount) * 100,
+                                                                                                        statement_descriptor: "Obanana E-commerce Checkout",
+                                                                                                        status: "unpaid",
+                                                                                                        tax_amount:0,
+                                                                                                        refunds: [],
+                                                                                                    },
+                                                                                                    _id: paymentUniqueId,
+                                                                                                    createdAt: iso8601String,
+                                                                                                    updatedAt: iso8601String
+                                                                                                }
+                                                                                            ],
+                                                                                            currency:"PHP",
+                                                                                        },
+                                                                                        _id:dataPaymentUniqueId,
+                                                                                        createdAt: iso8601String,
+                                                                                        updatedAt: iso8601String
+                                                                                    },
+                                                                                    created_at: iso8601String,
+                                                                                    updated_at: iso8601String
+                                                                                }
+                                                                            }
+                                                                        ]
                                                                     },
                                                                     total_amount: parseFloat(orderId.total_amount) + shippingFees,
                                                                     status: "TO PAY",
diff --git a/login_action.php b/login_action.php
index 46ae719..891c851 100644
--- a/login_action.php
+++ b/login_action.php
@@ -1,5 +1,7 @@
 <?php
     include "functions.php";
+    include "../";
+
     
     $url = $_SESSION["url"];
     $_SESSION["email"] = $_POST["name"];
diff --git a/product-left-sidebar.php b/product-left-sidebar.php
index b33608d..5dd6cb3 100644
--- a/product-left-sidebar.php
+++ b/product-left-sidebar.php
@@ -318,14 +318,14 @@ if (isset($_GET['id'])) {
                                             ?>
                                                 <div class="single-slide zoom-image-hover" style="width: 100%; height: 500px; border: 1px solid #ddd; text-align: center; overflow: hidden;">
                                                     <?php
-                                                    $placeholderImage = 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
+                                                    $placeholderImage = 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
                                                     if (!isset($product_details["images"]) or $product_details["images"] == "") {
                                                         $productImage = $placeholderImage;
                                                     } else {
                                                         $productImage = $i;
                                                     }
                                                     ?>
-                                                    <img loading="lazy" id="mainProductImage" class="img-responsive" src="<?php echo $productImage; ?>" alt="" style="width: 100%; height: 100%; object-fit: cover; object-position: center center;">
+                                                    <img id="mainProductImage" class="img-responsive" src="<?php echo $productImage; ?>" alt="" style="width: 100%; height: 100%; object-fit: cover; object-position: center center;">
                                                 </div>
                                             <?php
                                             }
@@ -337,7 +337,7 @@ if (isset($_GET['id'])) {
                                             ?>
                                                 <div class="single-slides">
                                                     <?php
-                                                    $placeholderImage = 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
+                                                    $placeholderImage = 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
                                                     if (!isset($product_details["images"]) or $product_details["images"] == "") {
                                                         $productImage = $placeholderImage;
                                                     } else {
@@ -347,7 +347,7 @@ if (isset($_GET['id'])) {
                                                     <!-- <img loading="lazy" class="img-responsive" src="<?php #echo $productImage; 
                                                                                             ?>" alt="" style="width: 100%; height: 100%; object-fit: cover; object-position: center center;"> -->
                                                     <!-- 02-26-2024 Stacy updated img width & height -->
-                                                    <img loading="lazy" class="img-responsive" src="<?php echo $productImage; ?>" alt="" style="max/width: 90px; height: 120px; object-fit: cover; object-position: center center;">
+                                                    <img class="img-responsive" src="<?php echo $productImage; ?>" alt="" style="max/width: 90px; height: 120px; object-fit: cover; object-position: center center;">
                                                 </div>
                                             <?php
                                             }
@@ -420,7 +420,7 @@ if (isset($_GET['id'])) {
                                                 <span class="ec-single-ps-title seller-header">Seller information</span>
                                                 <div class="vendor_wrap">
 
-                                                    <img loading="lazy" class="vendor_img img-responsive" src="<?php echo isset( $vendor_details['vendor_image']) ?$vendor_details['vendor_image'] :'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg'; ?>" alt="">
+                                                    <img loading="lazy" class="vendor_img img-responsive" src="<?php echo isset( $vendor_details['vendor_image']) ?$vendor_details['vendor_image'] :'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png'; ?>" alt="">
                                                     <div class="vendor_details">
                                                         <h6>
                                                             <?php echo $vendor_details['user_login']; ?>
@@ -446,12 +446,23 @@ if (isset($_GET['id'])) {
                                                     <span>VARIATION</span>
                                                     <div class="ec-pro-variation-content">
                                                         <ul class="eccart-pro-items">
+                                                            <!-- <?php
+                                                            $main_product_image = isset($product_details["images"]) ? $product_details["images"] : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
+                                                            ?>
+                                                            <a href="javascript:void(0);" onclick="selectVariation(<?php // echo htmlspecialchars(json_encode($product_details), ENT_QUOTES, 'UTF-8'); ?>)">
+                                                                <li style="width: 100px; height: 100px">
+                                                                    <img src="<?php // echo $main_product_image; ?>" alt="product">
+                                                                    <?php // foreach ($product_details['variables'] as $variable) { ?>
+                                                                        <p><?php // echo $variable['name'] . ': ' . $variable['value']; ?></p>
+                                                                    <?php // } ?>
+                                                                </li>
+                                                            </a> -->
                                                             <?php
-                                                            $main_product_image = isset($product_details["images"]) ? $product_details["images"] : 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
+                                                            $main_product_image = isset($product_details["images"]) ? strtok($product_details["images"], ',') : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
                                                             ?>
                                                             <a href="javascript:void(0);" onclick="selectVariation(<?php echo htmlspecialchars(json_encode($product_details), ENT_QUOTES, 'UTF-8'); ?>)">
                                                                 <li style="width: 100px; height: 100px">
-                                                                    <img loading="lazy" src="<?php echo $main_product_image; ?>" alt="product">
+                                                                    <img src="<?php echo $main_product_image; ?>" alt="product">
                                                                     <?php foreach ($product_details['variables'] as $variable) { ?>
                                                                         <p><?php echo $variable['name'] . ': ' . $variable['value']; ?></p>
                                                                     <?php } ?>
@@ -460,11 +471,11 @@ if (isset($_GET['id'])) {
 
                                                             <?php
                                                             foreach ($variation_details as $index => $variation) {
-                                                                $variationImage = isset($variation["images"]) ? $variation["images"] : 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
+                                                                $variationImage = isset($variation["images"]) ? $variation["images"] : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
                                                             ?>
                                                                 <a href="javascript:void(0);" onclick="selectVariation(<?php echo htmlspecialchars(json_encode($variation), ENT_QUOTES, 'UTF-8'); ?>)">
                                                                     <li style="width: 100px; height: 100px">
-                                                                        <img loading="lazy" src="<?php echo $variationImage; ?>" alt="product">
+                                                                        <img src="<?php echo $variationImage; ?>" alt="product">
                                                                         <?php foreach ($variation['variables'] as $variable) { ?>
                                                                             <p><?php echo $variable['name'] . ': ' . $variable['value']; ?></p>
                                                                         <?php } ?>
@@ -486,10 +497,9 @@ if (isset($_GET['id'])) {
                                                     document.getElementById("shortDescription").innerHTML = variation.product_description;
                                                     document.getElementById("productTitle").innerText = variation.product_name;
                                                     document.getElementById("product_Id").value = variation._id;
-                                                    var productImage = variation.images || 'https://upload.wikimedia.org/wikipedia/commons/6/65/No-Image-Placeholder.svg';
-
+                                                    var productImage = variation.images ? variation.images.split(',')[0] : 'https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png';
+                                                    $('.zoom-image-hover').trigger('zoom.destroy');
                                                     document.getElementById('mainProductImage').src = productImage;
-                                                    document.getElementById('mainProductImage').classList.remove('zoom-image-hover');
                                                     $('.zoom-image-hover').zoom();
                                                     document.getElementById("productTitlemodal").innerText = variation.product_name;
                                                     document.getElementById('mainProductImagemodal').src = productImage;
diff --git a/shop-list-left-sidebar.php b/shop-list-left-sidebar.php
index 7bef4e4..0e426fe 100644
--- a/shop-list-left-sidebar.php
+++ b/shop-list-left-sidebar.php
@@ -609,9 +609,20 @@ function updatePaginationUI(page, totalProducts) {
 
     // Display ellipsis at the beginning if necessary
     if (startPage > 1) {
-        let li = document.createElement("li");
-        li.textContent = "...";
-        paginationInner.appendChild(li);
+        let firstPageLi = document.createElement("li");
+        let firstPageLink = document.createElement("a");
+        firstPageLink.setAttribute("href", "#");
+        firstPageLink.setAttribute("data-page", 1);
+        firstPageLink.textContent = 1;
+        firstPageLi.appendChild(firstPageLink);
+        paginationInner.appendChild(firstPageLi);
+
+        // Display ellipsis after the first page link if necessary
+        if (startPage > 2) {
+            let ellipsisLi = document.createElement("li");
+            ellipsisLi.textContent = "...";
+            paginationInner.appendChild(ellipsisLi);
+        }
     }
 
     for (let i = startPage; i <= endPage; i++) {
@@ -627,11 +638,20 @@ function updatePaginationUI(page, totalProducts) {
         paginationInner.appendChild(li);
     }
 
+
     // Display ellipsis at the end if necessary
     if (endPage < totalPages) {
         let li = document.createElement("li");
         li.textContent = "...";
         paginationInner.appendChild(li);
+
+        let lastPageLi = document.createElement("li");
+        let lastPageLink = document.createElement("a");
+        lastPageLink.setAttribute("href", "#");
+        lastPageLink.setAttribute("data-page", totalPages);
+        lastPageLink.textContent = totalPages;
+        lastPageLi.appendChild(lastPageLink);
+        paginationInner.appendChild(lastPageLi);
     }
 
     // Update pagination indicator
diff --git a/user-history.php b/user-history.php
index 2cd539b..fef88a8 100644
--- a/user-history.php
+++ b/user-history.php
@@ -983,8 +983,24 @@ if ($_SESSION["isVendor"] == true) {
                                     }
 
                                     function updateCompletedStatus(orderId, referenceNumber) {
-                                        login(email, password, function(token) {
+                                        login(email, password, async function(token) {
                                             // const token = '<?php echo $_SESSION["token"] ?>';
+                                            const orderResponse = await fetch(`https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/${orderId}`);
+                                            const orderData = await orderResponse.json();
+                                            const updatedDetails = orderData.payment.details.map(detail => ({
+                                                ...detail,
+                                                attributes: {
+                                                    ...detail.attributes,
+                                                    data: {
+                                                        ...detail.attributes.data,
+                                                        attributes: {
+                                                            ...detail.attributes.data.attributes,
+                                                            status: 'paid' 
+                                                        }
+                                                    }
+                                                },
+                                                status: 'paid' 
+                                            }));
                                             fetch(`https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/orders/${orderId}`, {
                                                     method: 'PATCH',
                                                     headers: {
@@ -995,7 +1011,8 @@ if ($_SESSION["isVendor"] == true) {
                                                         status: 'COMPLETED',
                                                         payment: {
                                                         status: 'PAID',
-                                                        reference_number: referenceNumber
+                                                        reference_number: orderData.payment.reference_number,
+                                                        details: updatedDetails,
                                                     }
                                                     }),
                                                 })
@@ -1005,7 +1022,7 @@ if ($_SESSION["isVendor"] == true) {
                                                     if (data && data !== "") {
                                                         // Update the status in the table without reloading the page
                                                         // document.querySelector(`[data-order-id="${orderId}"] .order-status`).innerText = 'COMPLETED';
-                                                        location.reload();
+                                                        // location.reload();
 
                                                     } else {
                                                         alert('Failed to update order status');
diff --git a/vendor-settings.php b/vendor-settings.php
index 39c350f..9e1800c 100644
--- a/vendor-settings.php
+++ b/vendor-settings.php
@@ -239,6 +239,9 @@ if ($_SESSION["isCustomer"] == true) {
                                                     <div class="shipping">
                                                         <?php foreach ($vendorData['address'] as $address) : ?>
                                                             <?php if ($address['shipping']) : ?>
+                                                                <div>
+                                                                    <span style="font-size:16px;font-weight:800;">Shipping Address:</span>
+                                                                </div>
                                                                 <div class="sName">
                                                                     <span>Name:
                                                                         <span id="selectedFName"><?php echo $address['first_name']; ?></span>
@@ -261,6 +264,34 @@ if ($_SESSION["isCustomer"] == true) {
                                                             <?php endif; ?>
                                                         <?php endforeach; ?>
                                                     </div>
+                                                    <div class="billing">
+                                                        <?php foreach ($vendorData['address'] as $address) : ?>
+                                                            <?php if ($address['billing']) : ?>
+                                                                <div>
+                                                                    <span style="font-size:16px;font-weight:800;">Billing Address:</span>
+                                                                </div>
+                                                                <div class="sName">
+                                                                    <span>Name:
+                                                                        <span id="selectedBillingFName"><?php echo $address['first_name']; ?></span>
+                                                                        <span id="selectedBillingLName"> <?php echo $address['last_name']; ?></span>
+                                                                    </span>
+                                                                </div>
+                                                                <div class="sContact">
+                                                                    <span id="selectedBillingContact">Contact #: <?php echo $address['phone']; ?></span>
+                                                                </div>
+                                                                <div class="sAddress">
+                                                                    <span>Address:
+                                                                        <span id="sBillingBuilding"><?php echo $address['address_1']; ?></span>
+                                                                        <span id="sBillingStreet"><?php echo $address['address_2']; ?></span>
+                                                                        <span id="sBillingBarangay"><?php echo $address['barangay']; ?></span>
+                                                                        <span id="sBillingCity"><?php echo $address['city']; ?></span>
+                                                                        <span id="sBillingProvince"><?php echo $address['province']; ?></span>
+                                                                        <span id="sBillingCountry"><?php echo $address['country']; ?></span>
+                                                                    </span>
+                                                                </div>
+                                                            <?php endif; ?>
+                                                        <?php endforeach; ?>
+                                                    </div>
                                                 </div>
                                             </div>
                                         </div>
@@ -530,17 +561,19 @@ if ($_SESSION["isCustomer"] == true) {
                                         <div class="card-body">
                                             <div class="container">
                                                 <div class="row">
-                                                    <div class="col-md-12 mx-auto">
-                                                        <label class="form-check-label" for="address_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>">
-                                                           <strong style="font-weight: bold;">Bank Name: </strong><?php echo $bank['bank_name']; ?> <br>
-                                                           <strong style="font-weight: bold;">Bank Account Number: </strong><?php echo $bank['bank_account_number']; ?> <br>
-                                                           <strong style="font-weight: bold;">Bank Account Name: </strong><?php echo $bank['bank_account_name']; ?>
-                                                           <div class="selectWrap" style="display: flex; justify-content: center; align-items: center; width: 50%;">
-                                                           <input type="radio" name="payout_bank" id="payout_bank_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>" value="<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>" onchange="setPayoutBank('<?php echo $vendor['_id']; ?>', <?php echo $bank_index; ?>, true)" <?php echo $bank['bank_payout'] ? 'checked' : ''; ?>>
-                                                            <label for="payout_bank_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>">Set as Payout Bank</label>
-                                                            </div>
-                                                        </label>
-                                                    </div>
+                                                <div class="col-md-12 mx-auto">
+    <div class="form-check" style="display: flex; align-items: center;">
+        <label class="form-check-label" for="address_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>">
+            <strong style="font-weight: bold;">Bank Name: </strong><?php echo $bank['bank_name']; ?> <br>
+            <strong style="font-weight: bold;">Bank Account Number: </strong><?php echo $bank['bank_account_number']; ?> <br>
+            <strong style="font-weight: bold;">Bank Account Name: </strong><?php echo $bank['bank_account_name']; ?>                              
+        </label>
+        <div class="selectWrap" style="margin-left: auto; display: flex; align-items: center;">
+    <input type="radio" style="height:15px !important; width: 15px !important;" name="payout_bank" id="payout_bank_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>" value="<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>" onchange="setPayoutBank('<?php echo $vendor['_id']; ?>', <?php echo $bank_index; ?>, true)" <?php echo $bank['bank_payout'] ? 'checked' : ''; ?>>
+    <label for="payout_bank_<?php echo $vendor_index; ?>_<?php echo $bank_index; ?>" style="margin-bottom: 0; margin-left: 5px;">Set as Payout Bank</label>
+</div>
+    </div>
+</div>
                                                 </div>
                                             </div>
 
@@ -654,7 +687,7 @@ if ($_SESSION["isCustomer"] == true) {
                         })
                         .then(response => {
                             if (response.ok) {
-                                // location.reload();
+                                location.reload();
                                 // filter the delete action
                                 document.getElementById('form-check-' + addressIndex).remove();
                             } else {
@@ -942,62 +975,66 @@ if ($_SESSION["isCustomer"] == true) {
                 });
 
 
-
                 $('#submitBtn').on('click', function() {
-                    console.log('clickkkkkkkk')
-                    fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorid)
-                        .then(response => response.json())
-                        .then(data => {
-                            const existingAddresses = data.address || [];
+    console.log('clickkkkkkkk')
+    fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorid)
+        .then(response => response.json())
+        .then(data => {
+            const existingAddresses = data.address || [];
 
-                            const firstName = $('#addressFirstName').val();
-                            const lastName = $('#addressLastName').val();
-                            const contact = $('#addressContact').val();
-                            const buildingNumber = $('#addressBuilding').val();
-                            const street = $('#addressStreet').val();
-                            const province = $('#provinceSelect :selected').text();
-                            const city = $('#citySelect :selected').text();
-                            const barangay = $('#barangaySelect :selected').text();
-                            const country = $('#addressCountry').val();
+            const firstName = $('#addressFirstName').val();
+            const lastName = $('#addressLastName').val();
+            const contact = $('#addressContact').val();
+            const buildingNumber = $('#addressBuilding').val();
+            const street = $('#addressStreet').val();
+            const province = $('#provinceSelect :selected').text();
+            const city = $('#citySelect :selected').text();
+            const barangay = $('#barangaySelect :selected').text();
+            const country = $('#addressCountry').val();
 
+            const newAddress = {
+                first_name: firstName,
+                last_name: lastName,
+                phone: contact,
+                address_1: buildingNumber,
+                address_2: street,
+                city: city,
+                province: province,
+                barangay: barangay,
+                country: country,
+            };
 
-                            const newAddress = {
-                                first_name: firstName,
-                                last_name: lastName,
-                                phone: contact,
-                                address_1: buildingNumber,
-                                address_2: street,
-                                city: city,
-                                province: province,
-                                barangay: barangay,
-                                country: country,
-                            };
+            // Check if it's the first address
+            if (existingAddresses.length === 0) {
+                newAddress.shipping = true; // Set shipping to true
+            }
 
-                            existingAddresses.push(newAddress);
+            existingAddresses.push(newAddress);
+
+            return fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorid, {
+                method: 'PATCH',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({
+                    address: existingAddresses
+                }),
+            });
+        })
+        .then(response => {
+            if (response.ok) {
+                location.reload();
+            } else {
+                console.error('Failed to submit data');
+                alert('Failed to submit data');
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            alert('Error submitting data');
+        });
+});
 
-                            return fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorid, {
-                                method: 'PATCH',
-                                headers: {
-                                    'Content-Type': 'application/json'
-                                },
-                                body: JSON.stringify({
-                                    address: existingAddresses
-                                }),
-                            });
-                        })
-                        .then(response => {
-                            if (response.ok) {
-                                location.reload();
-                            } else {
-                                console.error('Failed to submit data');
-                                alert('Failed to submit data');
-                            }
-                        })
-                        .catch(error => {
-                            console.error('Error:', error);
-                            alert('Error submitting data');
-                        });
-                });
 
 
             });
@@ -1180,6 +1217,27 @@ if ($_SESSION["isCustomer"] == true) {
                     if (!updateResponse.ok) {
                         throw new Error(`Failed to update address: ${updateResponse.status}`);
                     }
+                    // console.log(`Address updated successfully for vendor ${vendorid}`);
+                    const selectedBillingElement = document.getElementById('selectedBillingFName');
+                    const selectedBillingLNameElement = document.getElementById('selectedBillingLName');
+                    const selectedBillingContactElement = document.getElementById('selectedBillingContact');
+                    const sBillingBuildingElement = document.getElementById('sBillingBuilding');
+                    const sBillingStreetElement = document.getElementById('sBillingStreet');
+                    const sBillingBarangayElement = document.getElementById('sBillingBarangay');
+                    const sBillingCityElement = document.getElementById('sBillingCity');
+                    const sBillingProvinceElement = document.getElementById('sBillingProvince');
+                    const sBillingCountryElement = document.getElementById('sBillingCountry');
+                    if (selectedBillingElement) {
+                        selectedBillingElement.textContent = vendorsData.address[addressIndex].first_name;
+                        selectedBillingLNameElement.textContent = vendorsData.address[addressIndex].last_name;
+                        selectedBillingContactElement.textContent = 'Contact #: ' + vendorsData.address[addressIndex].phone;
+                        sBillingBuildingElement.textContent = vendorsData.address[addressIndex].address_1;
+                        sBillingStreetElement.textContent = vendorsData.address[addressIndex].address_2;
+                        sBillingBarangayElement.textContent = vendorsData.address[addressIndex].barangay;
+                        sBillingCityElement.textContent = vendorsData.address[addressIndex].city;
+                        sBillingProvinceElement.textContent = vendorsData.address[addressIndex].province;
+                        sBillingCountryElement.textContent = vendorsData.address[addressIndex].country;
+                    }
                     console.log(`Address updated successfully for vendor ${vendorid}`);
                 } catch (error) {
                     console.error('Error updating address:', error.message);