במ12[cvbnvbnvcvbcvbcvbvvvccccccccccccccvbcvbcvbnmnmqewv;'

]]jkjjgdjffksdkdxmnvbcbcvbvcbbbbbbbbbvcbcbvcbmnmbnwqeqwewqskfgj במ12[cvbnvbnvcvbcvbcvbvvvccccccccccccccvbcvbcvbnmnmqewv;'

<?php
require('inc/header.php');
$sku = rand(01,999999);
$get_cat = "SELECT * FROM category";
$get_cat_run = mysqli_query($conn,$get_cat);
?>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"/>
<section>
<style>
.btn{
    outline:none !important;
}
.btn:hover{
    color:#FFF;
}
.mdc-drawer-link{
font-size:14px !important;
}
.cat{
    border: 1px solid #d9d6d6;
    padding: 20px 20px;
    margin-top: 83px;
    border-radius: 5px;
}
.cat_field{
    height: 35px;
    padding-left: 10px;
    width: 220px;
    border-radius: 3px;
    border: 1px solid #d1cece;
}
.cat-btn{
    font-size:14px !important;
    height:35px;
}
.import{
    color:#00b67a;
    border:1px solid #00b67a;
    padding: 6px 20px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 3px;
}
.import:hover{
    color:#00b67a;
    text-decoration:none;
    border:1px solid #00b67a;
}
.prd_data{
    display:flex;
    gap:1rem;
    width:500px;
    align-items:center;
    justify-content:center;
}
.product-type{
    border:1px solid #cbcbcb;
    padding:10px 10px;
}
.tabs-left, .tabs-right {
  border-bottom: none;
  padding-top: 2px;
}
.tabs-left {
  border-right: 1px solid #ddd;
}
.tabs-right {
  border-left: 1px solid #ddd;
}
.tabs-left>li, .tabs-right>li {
  float: none;
  margin-bottom: 2px;
}
.tabs-left>li {
  margin-right: -1px;
}
.tabs-right>li {
  margin-left: -1px;
}
.tabs-left>li.active>a,
.tabs-left>li.active>a:hover,
.tabs-left>li.active>a:focus {
  border-bottom-color: #ddd;
  border-right-color: transparent;
}

.tabs-right>li.active>a,
.tabs-right>li.active>a:hover,
.tabs-right>li.active>a:focus {
  border-bottom: 1px solid #ddd;
  border-left-color: transparent;
}
.tabs-left>li>a {
  border-radius: 4px 0 0 4px;
  margin-right: 0;
  display:block;
  font-size:13px !important;
}
.tabs-right>li>a {
  border-radius: 0 4px 4px 0;
  margin-right: 0;
}
.sideways {
  margin-top:50px;
  border: none;
  position: relative;
}
.sideways>li {
  height: 20px;
  width: 120px;
  margin-bottom: 100px;
}
.sideways>li>a {
  border-bottom: 1px solid #ddd;
  border-right-color: transparent;
  text-align: center;
  border-radius: 4px 4px 0px 0px;
}
.sideways>li.active>a,
.sideways>li.active>a:hover,
.sideways>li.active>a:focus {
  border-bottom-color: transparent;
  border-right-color: #ddd;
  border-left-color: #ddd;
}
.sideways.tabs-left {
  left: -50px;
}
.sideways.tabs-right {
  right: -50px;
}
.sideways.tabs-right>li {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.sideways.tabs-left>li {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#create_product{
    color:#FFF !important;
}
.dimension{
    display: flex;
    gap: 1.5rem;
    width: 350px;
}
#art-fea{
display:none;
}
</style>
<div class="container">
   <div class="row">
        <div class="col-sm-8">
            <h4 class="text-left mt-5 mb-5"><strong>Add new product</strong> &nbsp;&nbsp;<a class="import" href="import.php">Bulk Import</a></h4>
            <div style="display:flex;gap:0.5rem" id="err-sec"><i style="display:none;color:red" class="fa-solid fa-triangle-exclamation"></i><p id="error-msg" style="color:red;font-size:14px"></p></div>
            <form method="POST" enctype="multipart/form-data" id="myForm" action="insert_product.php">
                <div class="row">
                    <div class="form-group col-sm-12">
                        <label class="mb-4">Product name:</label>
                        <input type="text" class="form-control" id="prdct_nm" name="prdct_nm" placeholder="Enter product name..">
                        <input type="hidden" name="sku" value="PRD<?php echo $sku?>">
                    </div>
                  
                    <div class="form-group col-sm-12">
                        <label class="mb-4">Upload product image:</label>
                        <input type="file" class="form-control" id="prdct_img" name="prdct_img">
                    </div>
                    <div class="form-group col-sm-12">
                    <label class="mb-4">Enter product category:</label><br>
                      
                        <?php
                        if(mysqli_num_rows($get_cat_run) > 0){
                        while($cat_row = mysqli_fetch_assoc($get_cat_run)){
                        ?>

<?php } } else{echo $msg = '<span>No category &nbsp;<a style="color:green;font-size:15px !important" href="add_category.php">Create category</a></span>';}?>
                    </div>
                    
                    <div class="form-group col-sm-12">
                        <label class="mb-4">Tag</label>
                        <input type="text" class="form-control" id="tag" name="tag" placeholder="Enter tag of product (example: New or Best seller)">
                    </div>
                   
                    
                    <div class="form-group col-sm-12">
                        <label class="mb-4">Short description:</label>
                        <textarea class="form-control" id="short_desc" name="short_desc" name="short_desc" cols="5" rows="6" placeholder="Product short description.."></textarea>
                    </div>
                    <div class="form-group col-sm-12">
                        <label class="mb-4">Enter product description:</label>
                        <textarea class="form-control" id="pwd" name="desc" cols="5" rows="15" placeholder="Enter product description.."></textarea>
                    </div>
                    
                    <div class="form-group col-sm-12">
                         <section class="product-type">
                            
                           <div class="prd_data mb-5">
                               <h4 style="width:50%">Product Data --</h4>
                               <select class="form-control" id="categorySelect" name="pr_type">
                                  <option value="simple" selected>Simple Product</option>
                                  <option value="affiliate">External / Affiliate Product</option>
                                  
                               </select>
                           </div>
                           <div id="contentDiv">
                                <div id="option1Content">
                                        <div class="container">
                                            <div class="row">
                                                <div class="col-sm-3">
                                                <ul class="nav nav-tabs tabs-left" role="tablist">
                                                <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">General setting</a></li>
                                                <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Inventory setting</a></li>
                                                <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Shipping setting</a></li>
                                                <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Advanced setting</a></li>
                                                </ul>
                                                </div>
                                                <div class="col-sm-5">
                                                <div class="tab-content">
                                                <div role="tabpanel" class="tab-pane active" id="home">
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Enter product price:</label>
                                                            <input type="number" class="form-control" id="prdct_price" name="prdct_price" min="0" max="1000" step="0.01" placeholder="Enter product price.."/><br> 
                                                        </div>
                                                        <div class="form-group col-sm-8">
                                                            <label class="mb-3">Enter product sale price:</label>
                                                            <input type="number" class="form-control" id="prdct_sale_price" name="prdct_sale_price" min="0" max="1000" step="0.01" placeholder="Enter product sale price.."/> 
                                                            <i>(Leave blank if your product doesn't have sale price)</i>
                                                        </div>
                                                </div>
                                                <div role="tabpanel" class="tab-pane" id="profile">
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Stock status:</label><br>
                                                            <input type="radio" id="html" name="stock" value="1">&nbsp;
                                                            <label style="font-weight:500 !important;font-size:14px !important" for="In stock">In stock</label><br>

<input type="radio" id="html" name="stock" value="0">&nbsp;
                                                            <label style="font-weight:500 !important;font-size:14px !important" for="In stock">Out of stock</label><br><br>
                                                        </div>
                                                        <div class="form-group col-sm-8">
                                                            <label class="mb-3">Sold individually:</label><br>
                                                            <input type="checkbox" id="vehicle1" name="sold_individually" value="1">&nbsp;
                                                            <label for="vehicle1" style="font-weight:500 !important;font-size:14px !important"> Limit purchases to 1 item per order</label><br>
                                                        </div>
                                                </div>
                                                <div role="tabpanel" class="tab-pane" id="messages">
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Enter product weight (kg):</label>
                                                            <input type="number" class="form-control" id="weight" name="prdct_weight" min="0" max="1000" step="0.01" placeholder="0"/><br> 
                                                        </div>
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Dimension (cm):</label>
                                                            <div class="dimension">
                                                               <input type="number" class="form-control" id="length" name="length" min="0" max="1000" step="0.01" placeholder="Length"/>
                                                               <input type="number" class="form-control" id="width" name="width" min="0" max="1000" step="0.01" placeholder="Width"/>
                                                               <input type="number" class="form-control" id="height" name="height" min="0" max="1000" step="0.01" placeholder="Height"/>
                                                            </div>
                                                        </div>
                                                </div>
                                                <div role="tabpanel" class="tab-pane" id="settings">
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Purchase note:</label>
                                                            <textarea class="form-control" id="note" name="purchase_note"></textarea><br>
                                                        </div>
                                                        <div class="form-group col-sm-8 mb-0">
                                                            <label class="mb-3">Enable reviews:</label>&nbsp;
                                                            <input type="checkbox" id="review" name="review" value="1">&nbsp;
                                                        </div>
                                                </div>
                                                </div>
                                                </div>
                                            </div>
                                        </div>
                                </div>
                                <div id="option2Content" style="display: none;">
                                           
                                <div class="container">
                                            <div class="row">
                                                <div class="col-sm-3">
                                                <ul class="nav nav-tabs tabs-left" role="tablist">
                                                <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">General setting</a></li>
                                            
                                                </ul>
                                                </div>
                                                <div class="col-sm-5">
                                                <div class="tab-content">
                                                <div role="tabpanel" class="tab-pane active" id="home">
                                                        <div class="form-group col-sm-8">
                                                            <label class="mb-3">Product URL:</label><br>
                                                            <input type="url" class="form-control" id="price" id="prdct_link" name="affiliate_link" placeholder="https://"/>
                                                            <i>Enter the external URL to the product.</i><br> 
                                                        </div> 
                                                        <div class="form-group col-sm-8">
                                                            <label class="mb-3">Product price:</label><br>
                                                            <input type="number" class="form-control" id="prdct_pricee" name="prdct_price" min="0" max="1000" step="0.01" placeholder="Enter product price.."/>
                                                        </div>
                                                        <div class="form-group col-sm-8">
                                                            <label class="mb-3">Sale price:</label><br>
                                                            <input type="number" class="form-control" id="prdct_sale_pricee" name="prdct_sale_price" min="0" max="1000" step="0.01" placeholder="Enter product sale price.."/> 
                                                            <i>(Leave blank if your product doesn't have sale price)</i>
                                                        </div>
                                                </div>
                                                <div role="tabpanel" class="tab-pane" id="profile">Not available.</div>
                                                <div role="tabpanel" class="tab-pane" id="messages">Not available.</div>
                                                <div role="tabpanel" class="tab-pane" id="settings">Not available.</div>
                                                </div>
                                                </div>
                                            </div>
                                        </div>
                                            
                                </div>
                                <div id="option3Content" style="display: none;">
                                 Variable mode is currently not available.
                                </div>
                            </div>

</section>
                    </div>
                    <div class="form-group col-sm-12">
                        <input type="submit" id="create_product" class="mdc-button mdc-button--raised mdc-ripple-upgraded btn btn-md" name="create" value="Publish">
                    </div>
                </div>
                </form>
        </div>
        
   </div>
</div>
</section>
<script src="ckeditor/ckeditor.js"></script>
<script>   
CKEDITOR.replace('desc');
CKEDITOR.replace('short_desc');
</script>
<script>

$("#myForm").submit(function (event) {
            var prnm = $('input[name="prdct_nm"]').val();
            
            var prdct_price = $('#prdct_price').val();
            var prdct_sale_price = $('#prdct_sale_price').val();
            var prdct_pricee = $('#prdct_pricee')[0].value;
            var prdct_sale_pricee = $('#prdct_sale_pricee')[0].value;
            var prdct_img = $('input[name="prdct_img"]').val();
            var prdct_link = $('input[name="affiliate_link"]').val();
            var selectedValue = $('#categorySelect').val();
            
            
            if(selectedValue == 'simple'){
                $("#prdct_pricee").prop("disabled", true);
                $("#prdct_sale_pricee").prop("disabled", true);
            if(prnm === ''){
                
                $("#error-msg").text("Product name is required.").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);
                return false;
                
            }
            if(prdct_price === ''){
                $("#error-msg").text("Product price cannot be blank.").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);

return false;
            }
            
            if(prdct_price <= prdct_sale_price){
                
                $("#error-msg").text("Product sale price cannot be greater or equal than actual price").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);

return false;
            }

if(prdct_img === ""){
                $("#error-msg").text("Product image cannot be blank.").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);

return false;
            }
            else{
               return true;
            }

} 
        else if(selectedValue == 'affiliate'){

$("#prdct_price").prop("disabled", false);
               $("#prdct_sale_price").prop("disabled", false);

if(prdct_link === ''){
                
                $("#error-msg").text("Product link is required.").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);
                return false;
                
            }
            else{
               return true;
            }

if(prdct_pricee === ''){
                $("#error-msg").text("Product price cannot be blank.").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);
                event.preventDefault();
                return false;
            }
            
            
            if(prdct_pricee <= prdct_sale_pricee){
                $("#error-msg").text("Product sale price cannot be greater or equal than actual price").show();
                $('.fa-triangle-exclamation').css('display', 'block');
                event.preventDefault();
                setTimeout(function() {
                          $('#error-msg').fadeOut();
                          $('.fa-triangle-exclamation').fadeOut();
                         }, 3000);

$('html, body').animate({
                            scrollTop: $('#error-msg').offset().top
                        }, 1000);

return false;
            }
           
        } 
            
        }); 
    });

document.getElementById("categorySelect").addEventListener("change", function() {
            var selectedOption = this.value;

// Hide all content divs
            document.getElementById("option1Content").style.display = "block";
            document.getElementById("option2Content").style.display = "none";
            document.getElementById("option3Content").style.display = "none";

// Show the selected content div
            if (selectedOption === "simple") {
                document.getElementById("option1Content").style.display = "block";
                document.getElementById("option2Content").style.display = "none";
                document.getElementById("option3Content").style.display = "none";
            } else if (selectedOption === "affiliate") {
                document.getElementById("option2Content").style.display = "block";
                document.getElementById("option1Content").style.display = "none";
                document.getElementById("option3Content").style.display = "none";
            } else if (selectedOption === "variable") {
                document.getElementById("option3Content").style.display = "block";
                document.getElementById("option1Content").style.display = "none";
                document.getElementById("option2Content").style.display = "none";
            }

});

$(document).ready(function() {
            $('input[name="cat"]').change(function() {
        
        var selectedValue = $('input[name="cat"]:checked').val();
        
         if(selectedValue == 'Art') {
               $("#art-fea").show();
         }
         else{
            $("#art-fea").hide();
         }
        });

});

</script>
<?php
require('inc/footer.php');
?>