obanana_b2b_test/vendor-uploads.php

1138 lines
72 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?php
include "functions.php";
$_SESSION["url"] = $_SERVER['REQUEST_URI'];
if ($_SESSION["userId"] <> "") {
$_SESSION["isLoggedIn"] = true;
$vendorLoginId = searchVendorbyLoginId($_SESSION["userId"]);
$vendorLoginIdjson = json_decode($vendorLoginId, true);
if (isset($vendorLoginIdjson['results'][0])) {
$vendorData = $vendorLoginIdjson['results'][0];
$vendorId = $vendorData['_id'];
$_SESSION["LoggedInVendorId"] = $vendorId;
}
} else {
$_SESSION["isLoggedIn"] = false;
header("location: login.php");
}
if (isset($_GET['id'])) {
$_SESSION['newProductId'] = $_GET['id'];
}
$result = getProduct($_SESSION['newProductId']);
$array = json_decode($result, true);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<title>oBanana B2B - Elevate Your Business</title>
<meta name="keywords" content="apparel, catalog, clean, ecommerce, ecommerce HTML, electronics, fashion, html eCommerce, html store, minimal, multipurpose, multipurpose ecommerce, online store, responsive ecommerce template, shops" />
<meta name="description" content="Best ecommerce html template for single and multi vendor store.">
<meta name="author" content="ashishmaraviya">
<!-- site Favicon -->
<link rel="icon" href="assets/images/favicon/favicon.png" sizes="32x32" />
<link rel="apple-touch-icon" href="assets/images/favicon/favicon.png" />
<meta name="msapplication-TileImage" content="assets/images/favicon/favicon.png" />
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
<!-- css Icon Font -->
<link rel="stylesheet" href="assets/css/vendor/ecicons.min.css" />
<!-- css All Plugins Files -->
<link rel="stylesheet" href="assets/css/plugins/animate.css" />
<link rel="stylesheet" href="assets/css/plugins/swiper-bundle.min.css" />
<link rel="stylesheet" href="assets/css/plugins/jquery-ui.min.css" />
<link rel="stylesheet" href="assets/css/plugins/countdownTimer.css" />
<link rel="stylesheet" href="assets/css/plugins/slick.min.css" />
<link rel="stylesheet" href="assets/css/plugins/bootstrap.css" />
<!-- Main Style -->
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="stylesheet" href="assets/css/responsive.css" />
<!-- Background css -->
<link rel="stylesheet" id="bg-switcher-css" href="assets/css/backgrounds/bg-4.css">
</head>
<body class="shop_page">
<div id="ec-overlay">
<div class="ec-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- Header start -->
<?php include "header.php" ?>
<!-- Header End -->
<!-- ekka Cart Start -->
<!-- ekka Cart End -->
<!-- Category Sidebar start -->
<?php include "category-slider.php" ?>
<!-- Ec breadcrumb start -->
<div class="sticky-header-next-sec ec-breadcrumb section-space-mb">
<div class="container">
<div class="row">
<div class="col-12">
<div class="row ec_breadcrumb_inner">
<div class="col-md-6 col-sm-12">
<h2 class="ec-breadcrumb-title">Vendor Uploads</h2>
</div>
<div class="col-md-6 col-sm-12">
<!-- ec-breadcrumb-list start -->
<ul class="ec-breadcrumb-list">
<li class="ec-breadcrumb-item"><a href="index.php">Home</a></li>
<li class="ec-breadcrumb-item active">Uploads</li>
</ul>
<!-- ec-breadcrumb-list end -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Ec breadcrumb end -->
<!-- Vendor upload section -->
<section class="ec-page-content ec-vendor-uploads section-space-p">
<div class="container">
<div class="row">
<!-- Sidebar Area Start -->
<div class="ec-shop-leftside ec-vendor-sidebar col-lg-3 col-md-12">
<div class="ec-sidebar-wrap ec-border-box">
<!-- Sidebar Category Block -->
<div class="ec-sidebar-block">
<div class="ec-vendor-block">
<!-- 03-12-2024 Stacy added placeholder for vendor banner -->
<?php
if (!empty($vendorData['vendor_banner'])) { ?>
<div class="ec-vendor-block-bg" style="background-image: url(<?php echo $vendorData['vendor_banner'] ?>) !important;"></div>
<?php } else { ?>
<div class="ec-vendor-block-bg" style="background-color: orange; background-image: url(<?php echo $vendorData['vendor_banner'] ?>) !important;"></div>
<?php } ?>
<!-- <div class="ec-vendor-block-bg" style="background-image: url(<?php #echo $vendorData['vendor_banner']
?>) !important;"></div> -->
<div class="ec-vendor-block-detail">
<!-- <img class="v-img" src=<?php #echo $vendorData['vendor_image']
?> alt="vendor image"> -->
<!-- 03-12-2024 Stacy added placeholder for vendor profile -->
<?php
if (!empty($vendorData['vendor_image'])) { ?>
<img class="v-img" src=<?php echo $vendorData['vendor_image'] ?> alt="vendor image">
<?php } else { ?>
<img class="v-img" src="https://yourteachingmentor.com/wp-content/uploads/2020/12/istockphoto-1223671392-612x612-1.jpg" alt="vendor image">
<?php } ?>
<h5 class="name"><?php echo $vendorData['user_login'] ?></h5>
</div>
<!-- 2024-02-12 Stacy deleted div with class "ec-vendor-block-items", and inserted vendor-profile-tabs.php -->
<!-- <div class="ec-vendor-block-items">
<ul>
<li><a href="vendor-dashboard.php">Dashboard</a></li>
<li><a href="vendor-uploads-add-product-action.php">Upload Product</a></li>
<li><a href="vendor-settings.php">Settings (Edit)</a></li>
</ul>
</div> -->
<?php include "vendor-user-tabs.php" ?>
<!-- 2024-02-12 Stacy deleted div with class "ec-vendor-block-items", and inserted vendor-profile-tabs.php -->
</div>
</div>
</div>
</div>
<!-- 02-15-2024 Jun Jihad Vendor Product Add and Edit page Multiple Image -->
<div class="ec-shop-rightside col-lg-9 col-md-12">
<div class="ec-vendor-dashboard-card">
<div class="ec-vendor-card-body">
<div class="row">
<div class="col-lg-4">
<div class="ec-vendor-img-upload">
<div class="ec-vendor-main-img">
<div class="avatar-upload">
<div class="avatar-edit">
<input type='file' id="imageUpload" class="ec-image-upload" accept=".png, .jpg, .jpeg" multiple onchange="uploadProductImage()" />
<label for="imageUpload"><i class="fi-rr-edit" style="margin-top:5px;"></i></label>
</div>
<div class="avatar-preview ec-preview">
<div class="imagePreview ec-div-preview">
<?php
if (isset($array['images'])) {
$image_urls = explode(',', $array['images']);
if (!empty($image_urls)) {
$first_image_url = trim($image_urls[0]);
?>
<img class="ec-image-preview" src="<?php echo $first_image_url; ?>" alt="edit" />
<?php
}
} else {
?>
<img class="ec-image-preview" src="assets/images/product-image/vender-upload-preview.jpg" alt="edit" />
<?php
}
?>
</div>
</div>
</div>
<div class="thumb-upload-set colo-md-12">
<?php
if (isset($array['images'])) {
$image_urls = explode(',', $array['images']);
foreach ($image_urls as $index => $image_url) {
$image_url = trim($image_url);
?>
<div class="thumb-upload">
<div class="thumb-edit">
<input type='file' id="thumbUpload<?php echo $index + 1; ?>" class="ec-image-upload" accept=".png, .jpg, .jpeg" />
<!-- <label for="thumbUpload<?php echo $index + 1; ?>"><i class="fi-rr-edit"></i></label> -->
</div>
<div class="thumb-preview ec-preview">
<div class="image-thumb-preview">
<img class="image-thumb-preview ec-image-preview" src="<?php echo $image_url; ?>" alt="edit" />
<button class="delete-image-button" onclick="deleteImage('<?php echo $array['_id']; ?>', <?php echo $index; ?>)">Delete</button>
</div>
</div>
</div>
<?php
}
} else {
?>
<div class="thumb-upload">
<div class="thumb-edit">
<input type='file' id="thumbUpload" class="ec-image-upload" accept=".png, .jpg, .jpeg" />
<label for="thumbUpload"><i class="fi-rr-edit"></i></label>
</div>
<div class="thumb-preview ec-preview">
<div class="image-thumb-preview">
<img class="image-thumb-preview ec-image-preview" src="assets/images/product-image/vender-upload-thumb-preview.jpg" alt="edit" />
</div>
</div>
</div>
<?php
}
?>
<script>
function deleteImage(productId, indexToDelete) {
fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/products/' + productId)
.then(response => response.json())
.then(product => {
let imagesArray = product.images.split(',');
if (indexToDelete >= 0 && indexToDelete < imagesArray.length) {
imagesArray.splice(indexToDelete, 1);
}
const updatedImages = imagesArray.join(',');
const payload = {
images: updatedImages,
};
const token = '<?php echo $_SESSION["token"] ?>';
return fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/products/' + productId, {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + token,
},
body: JSON.stringify(payload),
});
})
.then(response => {
if (response.ok) {
console.log('Image deleted successfully');
location.reload();
} else {
console.error('Image deletion failed');
}
})
.catch(error => {
console.error('Error during image deletion:', error);
});
}
</script>
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="ec-vendor-upload-detail">
<form action="vendor-uploads-edit-product-action.php" method="post">
<div class="row g-3">
<div class="col-md-6">
<label for="inputEmail4" class="form-label">Product name</label>
<input type="text" class="form-control slug-title" id="inputEmail4" name="product_name" value="<?php echo $array['product_name']; ?>">
</div>
<div class="col-md-6">
<label class="form-label">Product Type</label>
<select id="Categories" class="form-select" name="product_type" onchange="variables()">
<option value="simple" <?php if ($array['product_type'] == 'simple') {
echo 'selected';
} ?>>Simple</option>
<option value="variable" <?php if ($array['product_type'] == 'variable') {
echo 'selected';
} ?>>Variable</option>
<option value="variation" <?php if ($array['product_type'] == 'variation') {
echo 'selected';
} ?>>Variation</option>
</select>
</div>
</div>
<div class="row collapse" id="variation">
<div class="col-md-6">
<label class="form-label">Parent Id</label>
<select class="form-select" name="parent_id" id="variation-type-select">
<option value="" disabled selected>Select Product</option>
<?php
$products = productListVendor($vendorId);
foreach ($products as $product) {
// Check if the product type matches the selected product type
if ($product['product_type'] == "variable") {
if ($product['_id'] == $array['parent_id']) {
echo '<option value="' . $product['_id'] . '" selected >' . $product['product_name'] . '</option>';
} else {
echo '<option value="' . $product['_id'] . '">' . $product['product_name'] . '</option>';
}
}
}
?>
</select>
</div>
<div class="col-md-6">
<label class="form-label">Size</label>
<select class="form-select" name="size" id="size">
<!-- Your variation options go here -->
<option value="">Select Size</option>
<option value="XS" <?php echo ($array['variants'][0]['size'] === 'XS') ? 'selected' : ''; ?>>XS</option>
<option value="S" <?php echo ($array['variants'][0]['size'] === 'S') ? 'selected' : ''; ?>>S</option>
<option value="M" <?php echo ($array['variants'][0]['size'] === 'M') ? 'selected' : ''; ?>>M</option>
<option value="L" <?php echo ($array['variants'][0]['size'] === 'L') ? 'selected' : ''; ?>>L</option>
<option value="XL" <?php echo ($array['variants'][0]['size'] === 'XL') ? 'selected' : ''; ?>>XL</option>
<option value="XXL" <?php echo ($array['variants'][0]['size'] === 'XXL') ? 'selected' : ''; ?>>XXL</option>
<option value="XXXL" <?php echo ($array['variants'][0]['size'] === 'XXXL') ? 'selected' : ''; ?>>XXXL</option>
</select>
</div>
<div class="col-md-6">
<label for="Color" class="form-label">Color</label>
<input type="text" class="form-control slug-title" id="color" name="color" value="<?php echo $array['variants'][0]['color']; ?>">
</div>
<div class="col-md-6">
<label for="Material" class="form-label">Material</label>
<input type="text" class="form-control slug-title" id="material" name="material" value="<?php echo $array['variants'][0]['material']; ?>">
</div>
</div>
<div class="row">
<div class="col-md-12">
<label for="slug" class="col-12 col-form-label">Slug</label>
<div class="col-12">
<input id="slug" name="slug" class="form-control here set-slug" type="text">
</div>
</div>
<div class="col-md-6">
<!-- <label for="weight" class="form-label">Weight</label> -->
<!-- raymart edit weight -->
<label for="weight" class="form-label">Weight(grams)</label>
<input type="number" class="form-control slug-title" id="width" name="weight" value="<?php echo $array['weight']; ?>">
</div>
<div class="col-md-6">
<!-- <label for="length" class="form-label">Length</label> -->
<!-- raymart edit length -->
<label for="length" class="form-label">Length(cm)</label>
<input type="number" class="form-control slug-title" id="width" name="length" value="<?php echo $array['length']; ?>">
</div>
<div class="col-md-6">
<!-- <label for="width" class="form-label">Width</label> -->
<!-- raymart edit width -->
<label for="width" class="form-label">Width(cm)</label>
<input type="number" class="form-control slug-title" id="width" name="width" value="<?php echo $array['width']; ?>">
</div>
<div class="col-md-6">
<!-- <label for="height" class="form-label">Height</label> -->
<!-- raymart edit height -->
<label for="height" class="form-label">Height(cm)</label>
<input type="number" class="form-control slug-title" id="height" name="height" value="<?php echo $array['height']; ?>">
</div>
<!-- raymart added short des feb 21 2024 -->
<div class="col-md-12">
<label class="form-label">Short Description</label>
<textarea class="form-control" name="product_description" id="short-hidden-editor" style="display: none;" rows="2"><?php echo $array['product_description'] ?></textarea>
<div id="short-editor-container" style="height: 200px;"><?php echo $array['product_description'] ?></div>
</div>
<!-- <div class="col-md-12">
<label class="form-label">Short Description</label>
<textarea class="form-control" name="product_description" rows="2"><?php echo $array['product_description'] ?></textarea>
</div> -->
<div class="col-md-6">
<label class="form-label">Regular Price <span>( In PHP
)</span></label>
<input type="number" class="form-control" id="price1" name="regular_price" value="<?php echo $array['regular_price'] ?>">
</div>
<div class="col-md-6">
<label class="form-label">Sale Price <span>( In PHP
)</span></label>
<input type="number" class="form-control" id="price2" name="sale_price" value="<?php echo $array['sale_price'] ?>">
</div>
<!-- 03-15-2024 Jun Jihad price_matrix field Product Upload Vendor Page -->
<div class="col-md-12">
<label class="form-label">Price Matrix</label>
<table class="table">
<thead>
<tr>
<th scope="col">Quantity</th>
<th scope="col">Price (PHP)</th>
<th scope="col"></th>
</tr>
</thead>
<tbody id="price-matrix-body">
<?php if (empty($array['price_matrix'][0])) : ?>
<tr data-row-index="0">
<td><input type="number" class="form-control" name="quantity[]"></td>
<td><input type="number" class="form-control" name="price[]"></td>
<td><button type="button" class="btn btn-danger delete-row">Delete</button></td>
</tr>
<?php else : ?>
<?php foreach ($array['price_matrix'][0] as $index => $pair) : ?>
<tr data-row-index="<?php echo $index; ?>">
<td><input type="number" class="form-control" name="quantity[]" value="<?php echo $pair['quantity']; ?>"></td>
<td><input type="number" class="form-control" name="price[]" value="<?php echo $pair['price']; ?>"></td>
<td><button type="button" class="btn btn-danger delete-row">Delete</button></td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
<button type="button" class="btn btn-secondary" id="add-row">Add Row</button>
</div>
<!-- 03-15-2024 Jun Jihad price_matrix field Product Upload Vendor Page -->
<!-- 02-19-2024 Jun Jihad Promo Field Product Upload Vendor Page -->
<div class="col-md-12" style="margin: 0 0 20px 0;">
<label class="form-label">Promo</label>
<div class="row" justify-content-between>
<div class="col-md-6">
<div class="form-check">
<input type="checkbox" id="nextDayDeliveryCheckbox" name="promo[next-day-delivery]" value="Yes" <?php if ($array['promo'][0]['next-day-delivery'] === "Yes") echo "checked"; ?> style="background-color: blue;">
<label class="form-check-label" for="nextDayDeliveryCheckbox">Next Day Delivery</label>
</div>
</div>
<!-- <div class="col-md-4">
<div class="form-check">
<input type="checkbox" id="sameDayDeliveryCheckbox" name="promo[same-day-delivery]" value="Yes" <?php if ($array['promo'][0]['same-day-delivery'] === "Yes") echo "checked"; ?> style="background-color: blue;">
<label class="form-check-label" for="sameDayDeliveryCheckbox">Same Day Delivery</label>
</div>
</div> -->
<div class="col-md-6">
<div class="form-check">
<input type="checkbox" id="freeShippingCheckbox" name="promo[free-shipping]" value="Yes" <?php if ($array['promo'][0]['free-shipping'] === "Yes") echo "checked"; ?> style="background-color: blue;">
<label class="form-check-label" for="freeShippingCheckbox">Free Shipping</label>
</div>
</div>
</div>
</div>
<!-- 02-19-2024 Jun Jihad Promo Field Product Upload Vendor Page -->
<div class="col-md-6">
<label class="form-label">Stock</label>
<input type="number" class="form-control" id="quantity1" name="stock" value="<?php echo $array['stock'] ?>">
</div>
<div class="col-md-6">
<label class="form-label">Minimum Order</label>
<input type="number" class="form-control" id="minOrder" name="minimum_order" value="<?php echo $array['minimum_order'] ?>">
</div>
<div class="col-md-12">
<label class="form-label">Full Detail</label>
<textarea class="form-control" rows="4" name="specifications" id="hidden-editor" style="display: none;"><?php echo $array['specifications'] ?></textarea>
<div id="editor-container" style="height: 200px;"><?php echo $array['specifications'] ?></div>
</div>
<!-- <div class="col-md-12">
<label class="form-label">Full Detail</label>
<textarea class="form-control" rows="4" name="specifications"><?php echo $array['specifications'] ?></textarea>
</div> -->
<div class="col-md-6">
<label class="form-label">Product Category</label>
<select class="form-select" name="product_category" id="product_category">
<option value="">Select Category</option>
<option value="Electronics" <?php echo ($array['product_category'] === 'Electronics') ? 'selected' : ''; ?>>Electronics</option>
<option value="Solar" <?php echo ($array['product_category'] === 'Solar') ? 'selected' : ''; ?>>Solar</option>
<option value="E-bike" <?php echo ($array['product_category'] === 'E-bike') ? 'selected' : ''; ?>>E-bike</option>
<option value="E-vehicle" <?php echo ($array['product_category'] === 'E-vehicle') ? 'selected' : ''; ?>>E-Vehicle</option>
<option value="Appliance" <?php echo ($array['product_category'] === 'Appliance') ? 'selected' : ''; ?>>Appliance</option>
<option value="Smart Home" <?php echo ($array['product_category'] === 'Smart Home') ? 'selected' : ''; ?>>Smart Home</option>
<option value="Home" <?php echo ($array['product_category'] === 'Home') ? 'selected' : ''; ?>>Home</option>
<option value="Apparel" <?php echo ($array['product_category'] === 'Apparel') ? 'selected' : ''; ?>>Apparel</option>
<option value="Heavy Equipment" <?php echo ($array['product_category'] === 'Heavy Equipment') ? 'selected' : ''; ?>>Heavy Equipment</option>
</select>
</div>
<div class="col-md-6">
<label class="form-label">Shipping Fee</label>
<input type="number" class="form-control" id="sfee" name="shipping_fee" value="<?php echo $array['shipping_fee'] ?>">
</div>
<div class="col-md-6">
<label class="form-label">Product Status</label>
<select class="form-select" name="status" id="status">
<option value="">Select Product Status</option>
<option value="Active" <?php echo ($array['status'] === 'Active') ? 'selected' : ''; ?>>Active</option>
<option value="Inactive" <?php echo ($array['status'] === 'Inactive') ? 'selected' : ''; ?>>Inactive</option>
</select>
</div>
<div class="col-md-6">
<label class="form-label">Product Tags <span>( Type and
make comma to separate tags )</span></label>
<input type="text" class="form-control" id="group_tag" name="group_tag" value="" placeholder="" data-role="tagsinput" />
</div>
<div class="col-md-12">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- raymart added js link feb 21 2024 -->
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
<script>
var quill = new Quill('#editor-container', {
theme: 'snow'
});
quill.clipboard.dangerouslyPasteHTML(document.getElementById('hidden-editor').value);
quill.on('text-change', function() {
document.getElementById('hidden-editor').value = quill.root.innerHTML;
});
var newquill = new Quill('#short-editor-container', {
theme: 'snow'
});
newquill.clipboard.dangerouslyPasteHTML(document.getElementById('short-hidden-editor').value);
newquill.on('text-change', function() {
document.getElementById('short-hidden-editor').value = newquill.root.innerHTML;
});
// 03-15-2024 Jun Jihad price_matrix field delete/add row function
document.getElementById("add-row").addEventListener("click", function() {
var newRow = '<tr>' +
'<td><input type="number" class="form-control quantity-input" name="quantity[]"></td>' +
'<td><input type="number" class="form-control" name="price[]"></td>' +
'<td><button type="button" class="btn btn-danger delete-row">Delete</button></td>' +
'</tr>';
document.getElementById("price-matrix-body").insertAdjacentHTML('beforeend', newRow);
var quantityInputs = document.querySelectorAll('.quantity-input');
var lastIndex = quantityInputs.length - 1;
quantityInputs[lastIndex].addEventListener('blur', function(event) {
checkQuantity(event, lastIndex);
});
});
document.getElementById("price-matrix-body").addEventListener("click", function(event) {
if (event.target.classList.contains("delete-row")) {
event.preventDefault();
var rows = document.querySelectorAll("#price-matrix-body tr");
if (rows.length > 1) {
event.target.closest("tr").remove();
} else {
alert("At least one row is required.");
}
}
});
function checkQuantity(event, index) {
var currentInput = event.target;
var previousRow = currentInput.parentNode.parentNode.previousElementSibling;
var nextRow = currentInput.parentNode.parentNode.nextElementSibling;
if (previousRow !== null) {
var previousQuantityInput = previousRow.querySelector('input[name="quantity[]"]');
var currentQuantity = parseInt(currentInput.value);
var previousQuantity = parseInt(previousQuantityInput.value);
if (currentQuantity <= previousQuantity) {
alert("Quantity must be greater than the previous row's quantity.");
currentInput.value = previousQuantity + 1;
}
}
if (nextRow !== null) {
var nextQuantityInput = nextRow.querySelector('input[name="quantity[]"]');
var nextQuantity = parseInt(nextQuantityInput.value);
if (currentQuantity >= nextQuantity) {
alert("Quantity must be less than the next row's quantity.");
currentInput.value = nextQuantity - 1;
}
}
}
function checkExistingQuantity(row) {
var currentInput = row.querySelector('input[name="quantity[]"]');
var allRows = document.querySelectorAll("#price-matrix-body tr");
var currentIndex = Array.from(allRows).indexOf(row);
for (var i = currentIndex - 1; i >= 0; i--) {
var previousRow = allRows[i];
var previousQuantityInput = previousRow.querySelector('input[name="quantity[]"]');
var currentQuantity = parseInt(currentInput.value);
var previousQuantity = parseInt(previousQuantityInput.value);
if (currentQuantity <= previousQuantity) {
alert("Quantity must be greater than the previous row's quantity.");
currentInput.value = previousQuantity + 1;
return;
}
}
var nextRow = allRows[currentIndex + 1];
if (nextRow !== undefined) {
var nextQuantityInput = nextRow.querySelector('input[name="quantity[]"]');
var nextQuantity = parseInt(nextQuantityInput.value);
if (currentQuantity >= nextQuantity) {
alert("Quantity must be less than the next row's quantity.");
currentInput.value = nextQuantity - 1;
return;
}
}
}
document.getElementById("price-matrix-body").addEventListener("blur", function(event) {
if (event.target.tagName === "INPUT" && event.target.name === "quantity[]") {
checkExistingQuantity(event.target.closest("tr"));
}
}, true);
// 03-15-2024 Jun Jihad price_matrix field delete/add row function
</script>
<script>
function onload() {
variables();
}
function variables() {
var x = document.getElementById('Categories').value;
var y = document.getElementById('variation');
if (x != 'variation') {
y.style.visibility = 'hidden';
y.classList.add('collapse');
} else {
y.style.visibility = 'visible';
y.classList.remove('collapse');
}
}
function uploadProductImage() {
var productId = '<?php echo $_SESSION['newProductId'] ?>';
var fileInput = document.getElementById('imageUpload');
var files = fileInput.files;
if (files.length > 0) {
var promises = [];
var existingImages = [];
fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/products/' + productId)
.then(response => response.json())
.then(product => {
existingImages = product.images || [];
existingImages = Array.isArray(existingImages) ? existingImages : [existingImages];
existingImages = existingImages.filter(image => image);
})
.catch(error => {
console.error('Error fetching existing images:', error);
});
for (let i = 0; i < files.length; i++) {
const file = files[i];
const reader = new FileReader();
const promise = new Promise((resolve, reject) => {
reader.onload = function(e) {
const img = new Image();
img.onload = function() {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const maxWidth = 1200;
const maxHeight = 1000;
const aspectRatio = img.width / img.height;
let newWidth = img.width;
let newHeight = img.height;
if (img.width > maxWidth) {
newWidth = maxWidth;
newHeight = newWidth / aspectRatio;
}
if (newHeight > maxHeight) {
newHeight = maxHeight;
newWidth = newHeight * aspectRatio;
}
canvas.width = newWidth;
canvas.height = newHeight;
ctx.drawImage(img, 0, 0, newWidth, newHeight);
canvas.toBlob((blob) => {
const resizedFile = new File([blob], file.name, {
type: 'image/jpeg'
});
var formData = new FormData();
formData.append('image_id', productId);
formData.append('category', 'product');
formData.append('image', resizedFile);
fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/upload_image', {
method: 'POST',
body: formData
})
.then(response => {
if (response.ok) {
return response.json();
} else {
console.error('File upload failed');
reject(new Error('File upload failed'));
}
})
.then(result => {
const filename = result.filename;
resolve(filename);
})
.catch(error => {
console.error('Error during fetch:', error);
reject(error);
});
}, 'image/jpeg');
};
img.src = e.target.result;
};
reader.readAsDataURL(file);
});
promises.push(promise);
}
Promise.all(promises)
.then(filenames => {
const updatedImages = existingImages.concat(filenames.map(filename => `https://<?php echo $_SESSION["data_endpoint"]; ?>/images/storage/product_uploads/${encodeURIComponent(filename)}`));
if (!Array.isArray(updatedImages)) {
console.error('Updated images is not an array:', updatedImages);
throw new Error('Updated images is not an array');
}
const imagesString = updatedImages.join(',');
const payload = {
images: imagesString,
};
const token = '<?php echo $_SESSION["token"] ?>';
return fetch('https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/products/' + productId, {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + token,
},
body: JSON.stringify(payload)
});
})
.then(response => {
if (response.ok) {
console.log('Images uploaded successfully');
location.reload();
} else {
console.error('Image upload failed');
}
})
.catch(error => {
console.error('Error during image upload:', error);
});
}
}
</script>
<!-- 02-15-2024 Jun Jihad Vendor Product Add and Edit page Multiple Image -->
</section>
<!-- End Vendor upload section -->
<!-- Footer Start -->
<?php include "footer.php" ?>
<!-- Footer Area End -->
<!-- Modal -->
<div class="modal fade" id="ec_quickview_modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<button type="button" class="btn-close qty_close" data-bs-dismiss="modal" aria-label="Close"></button>
<div class="modal-body">
<div class="row">
<div class="col-md-5 col-sm-12 col-xs-12">
<!-- Swiper -->
<div class="qty-product-cover">
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_1.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_2.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_3.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_4.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_5.jpg" alt="">
</div>
</div>
<div class="qty-nav-thumb">
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_1.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_2.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_3.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_4.jpg" alt="">
</div>
<div class="qty-slide">
<img class="img-responsive" src="assets/images/product-image/3_5.jpg" alt="">
</div>
</div>
</div>
<div class="col-md-7 col-sm-12 col-xs-12">
<div class="quickview-pro-content">
<h5 class="ec-quick-title"><a href="shop-left-sidebar-col-4.php">Handbag leather purse for women</a>
</h5>
<div class="ec-quickview-rating">
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star fill"></i>
<i class="ecicon eci-star"></i>
</div>
<div class="ec-quickview-desc">Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever
since the 1500s,</div>
<div class="ec-quickview-price">
<span class="old-price">$100.00</span>
<span class="new-price">$80.00</span>
</div>
<div class="ec-pro-variation">
<div class="ec-pro-variation-inner ec-pro-variation-color">
<span>Color</span>
<div class="ec-pro-color">
<ul class="ec-opt-swatch">
<li><span style="background-color:#696d62;"></span></li>
<li><span style="background-color:#d73808;"></span></li>
<li><span style="background-color:#577023;"></span></li>
<li><span style="background-color:#2ea1cd;"></span></li>
</ul>
</div>
</div>
<div class="ec-pro-variation-inner ec-pro-variation-size ec-pro-size">
<span>Size</span>
<div class="ec-pro-variation-content">
<ul class="ec-opt-size">
<li class="active"><a href="#" class="ec-opt-sz" data-tooltip="Small">S</a></li>
<li><a href="#" class="ec-opt-sz" data-tooltip="Medium">M</a></li>
<li><a href="#" class="ec-opt-sz" data-tooltip="Large">X</a></li>
<li><a href="#" class="ec-opt-sz" data-tooltip="Extra Large">XL</a></li>
</ul>
</div>
</div>
</div>
<div class="ec-quickview-qty">
<div class="qty-plus-minus">
<input class="qty-input" type="text" name="ec_qtybtn" value="1" />
</div>
<div class="ec-quickview-cart ">
<button class="btn btn-primary"><i class="fi-rr-shopping-basket"></i> Add To Cart</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modal end -->
<!-- Footer navigation panel for responsive display -->
<div class="ec-nav-toolbar">
<div class="container">
<div class="ec-nav-panel">
<div class="ec-nav-panel-icons">
<a href="#ec-mobile-menu" class="navbar-toggler-btn ec-header-btn ec-side-toggle"><i class="fi-rr-menu-burger"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="#ec-side-cart" class="toggle-cart ec-header-btn ec-side-toggle"><i class="fi-rr-shopping-bag"></i><span class="ec-cart-noti ec-header-count cart-count-lable">3</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="index.php" class="ec-header-btn"><i class="fi-rr-home"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="wishlist.html" class="ec-header-btn"><i class="fi-rr-heart"></i><span class="ec-cart-noti">4</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="login.php" class="ec-header-btn"><i class="fi-rr-user"></i></a>
</div>
</div>
</div>
</div>
<!-- Footer navigation panel for responsive display end -->
<!-- raymart remove popup feb 20 2024 -->
<!-- Recent Purchase Popup -->
<!-- <div class="recent-purchase">
<img src="assets/images/product-image/1.jpg" alt="payment image">
<div class="detail">
<p>Someone in new just bought</p>
<h6>stylish baby shoes</h6>
<p>10 Minutes ago</p>
</div>
<a href="javascript:void(0)" class="icon-btn recent-close">×</a>
</div> -->
<!-- Recent Purchase Popup end -->
<!-- Cart Floating Button -->
<div class="ec-cart-float">
<a href="#ec-side-cart" class="ec-header-btn ec-side-toggle">
<div class="header-icon"><i class="fi-rr-shopping-basket"></i>
</div>
<span class="ec-cart-count cart-count-lable">3</span>
</a>
</div>
<!-- Cart Floating Button end -->
<!-- Whatsapp -->
<div class="ec-style ec-right-bottom">
<!-- Start Floating Panel Container -->
<div class="ec-panel">
<!-- Panel Header -->
<div class="ec-header">
<strong>Need Help?</strong>
<p>Chat with us on WhatsApp</p>
</div>
<!-- Panel Content -->
<div class="ec-body">
<ul>
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_01.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Sahar Darya</span>
<p>Sahar left 7 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_02.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-online"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Yolduz Rafi</span>
<p>Yolduz is online</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_03.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-offline"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Nargis Hawa</span>
<p>Nargis left 30 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_04.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-offline"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Khadija Mehr</span>
<p>Khadija left 50 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
</ul>
</div>
</div>
<!--/ End Floating Panel Container -->
<!-- Start Right Floating Button-->
<div class="ec-right-bottom">
<div class="ec-box">
<div class="ec-button rotateBackward">
<img class="whatsapp" src="assets/images/common/whatsapp.png" alt="whatsapp icon" />
</div>
</div>
</div>
<!--/ End Right Floating Button-->
</div>
<!-- Whatsapp end -->
<!-- Feature tools -->
<div class="ec-tools-sidebar-overlay"></div>
<div class="ec-tools-sidebar">
<div class="tool-title">
<h3>Features</h3>
</div>
<a href="#" class="ec-tools-sidebar-toggle in-out">
<img alt="icon" src="assets/images/common/settings.png" />
</a>
<div class="ec-tools-detail">
<div class="ec-tools-sidebar-content ec-change-color ec-color-desc">
<h3>Color Scheme</h3>
<ul class="bg-panel">
<li class="active" data-color="01"><a href="#" class="colorcode1"></a></li>
<li data-color="02"><a href="#" class="colorcode2"></a></li>
<li data-color="03"><a href="#" class="colorcode3"></a></li>
<li data-color="04"><a href="#" class="colorcode4"></a></li>
<li data-color="05"><a href="#" class="colorcode5"></a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Backgrounds</h3>
<ul class="bg-panel">
<li class="bg"><a class="back-bg-1" id="bg-1">Background-1</a></li>
<li class="bg"><a class="back-bg-2" id="bg-2">Background-2</a></li>
<li class="bg"><a class="back-bg-3" id="bg-3">Background-3</a></li>
<li class="bg"><a class="back-bg-4" id="bg-4">Default</a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Full Screen mode</h3>
<div class="ec-fullscreen-mode">
<div class="ec-fullscreen-switch">
<div class="ec-fullscreen-btn">Mode</div>
<div class="ec-fullscreen-on">On</div>
<div class="ec-fullscreen-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Dark mode</h3>
<div class="ec-change-mode">
<div class="ec-mode-switch">
<div class="ec-mode-btn">Mode</div>
<div class="ec-mode-on">On</div>
<div class="ec-mode-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>RTL mode</h3>
<div class="ec-change-rtl">
<div class="ec-rtl-switch">
<div class="ec-rtl-btn">Rtl</div>
<div class="ec-rtl-on">On</div>
<div class="ec-rtl-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Clear local storage</h3>
<a class="clear-cach" href="javascript:void(0)">Clear Cache & Default</a>
</div>
</div>
</div>
<!-- Feature tools end -->
<!-- Vendor JS -->
<script src="assets/js/vendor/jquery-3.5.1.min.js"></script>
<script src="assets/js/vendor/popper.min.js"></script>
<script src="assets/js/vendor/bootstrap.min.js"></script>
<script src="assets/js/vendor/jquery-migrate-3.3.0.min.js"></script>
<script src="assets/js/vendor/modernizr-3.11.2.min.js"></script>
<!--Plugins JS-->
<script src="assets/js/plugins/swiper-bundle.min.js"></script>
<script src="assets/js/plugins/countdownTimer.min.js"></script>
<script src="assets/js/plugins/scrollup.js"></script>
<script src="assets/js/plugins/jquery.zoom.min.js"></script>
<script src="assets/js/plugins/slick.min.js"></script>
<script src="assets/js/plugins/infiniteslidev2.js"></script>
<script src="assets/js/vendor/jquery.magnific-popup.min.js"></script>
<script src="assets/js/plugins/jquery.sticky-sidebar.js"></script>
<script src="assets/js/plugins/nouislider.js"></script>
<script src="assets/js/vendor/bootstrap-tagsinput.js"></script>
<!-- Main Js -->
<script src="assets/js/vendor/index.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>