<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>List Of Products</title>

    <!-- Bootstrap core CSS -->
    <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css"/>
    <link href="https://fonts.googleapis.com/css2?family=Kufam:wght@400;500;600;700;800;900&display=swap"
          rel="stylesheet">
    <link rel="stylesheet" href="../public/css/dropzone.css">
    <link rel="stylesheet" href="../public/css/jquery.tag.css">
    <link rel="stylesheet" href="../public/css/jquery.tagsinput-revisited.css">
    <!-- Custom styles for this template -->
    <link href="../public/css/main.css" rel="stylesheet">
    <link rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/css/bootstrap-select.min.css"/>

</head>

<body class="shopping_add_products">

<div class="d-flex" id="wrapper">

    <!-- Sidebar -->

    <?php

          include ('../sidebar_brands.php');
    $brand_store_id=$_SESSION['brand_id'];
      ?>

    <!-- /#sidebar-wrapper -->

    <!-- Page Content -->
    <div id="page-content-wrapper">



        <?php

        include ('../navbar_brand_store.php');
        ?>
        <div class="container">
            <!--                ../framework/main_action.php?action_type=create&request_type=products&functionality_type=insert_add_products-->
            <form id="form-main" action="../framework/main_action.php?action_type=create&request_type=store&functionality_type=insert_add_products"
                  enctype="multipart/form-data" method="POST">
                <div class="page_name_candidate">
                    <div class="candidate_div">
                        <h1>Product List</h1>

                    </div>
                    <div class="select_sort_second">
                        <div class="sort_btn">
                            <button id="btn-submit" class="brand_btn_save" type="submit">save</button>
                            <!--                            <a href="#" type="submit" >Save</a>-->
                        </div>
                    </div>
                </div>

                <div class="row pt-4 addpro_main_row ">

                    <input type="hidden" id="random-no" name="random-no" value="<?= rand(); ?>">
                    <input type="hidden" id="cat-id" name="cat-id">
                    <input type="hidden" id="sub-cat-id" name="sub-cat-id">
                    <input type="hidden" id="child-cat-id" name="child-cat-id">
                    <input type="hidden" id="additional-pic" name="additional-pic[]">
                    <input type="hidden" id="brand-id" name="brand_id" value="<?=$brand_store_id;?>">



                    <div class="col-xl-8">
                        <div class="card shopping_add_product_card">
                            <div class="card-body">
                                <div class="row  addpro_main_row ">
                                    <div class="col-xl-12 addpro_main_heading_first">
                                        <h4>Information</h4>
                                    </div>
                                    <div class="col-xl-12">
                                        <label for="pro" class="addpro_main-input-label txt-regular color-sec">Products
                                            Name</label>
                                        <input type="text" id="pro" name="pro" placeholder="Summer T-Shirt"
                                               class="addpro_main-input w-100"/>
                                    </div>

                                    <div class="col-xl-12">
                                        <div class="form-group mt-2">
                                            <label for="" class="addpro_main-input-label txt-regular color-sec">Products
                                                Description</label>
                                            <textarea name="ckeditor" id="editor" class="ckeditor" cols="30" rows="10"
                                                      style="width: 100%;"></textarea>
                                        </div>


                                    </div>
                                    <div class="col-xl-12 addpro_main_hr">
                                        <hr/>
                                    </div>
                                    <!--                                    <div class="col-xl-12">-->
                                    <!--                                        <div class="addpro_main_head_second">-->
                                    <!--                                            <h4>Cover Image</h4>-->
                                    <!--                                        </div>-->
                                    <!--                                        <div class="card text-center uload-card">-->
                                    <!--                                            <div class="file-upload">-->
                                    <!--                                                <div class="image-upload-wrap">-->
                                    <!--                                                    <input class="file-upload-input" type="file"-->
                                    <!--                                                           onchange="readURL(this);" accept="image/*"/>-->
                                    <!--                                                    <input type="hidden" id="cimagecimage" name="cover_image">-->
                                    <!--                                                    <div class="drag-text">-->
                                    <!--                                                        <div class="card-body upload-card-body">-->
                                    <!--                                                            <div class="upload-img">-->
                                    <!--                                                                <img src="../public/image/upload.png" alt=""/>-->
                                    <!--                                                            </div>-->
                                    <!--                                                            <div class="upload-image-format">-->
                                    <!--                                                                <p>-->
                                    <!--                                                                    .PDF .JPG .PNG .DOC-->
                                    <!--                                                                </p>-->
                                    <!--                                                            </div>-->
                                    <!--                                                            <div class="upload-detail">-->
                                    <!--                                                                <h4>You can also upload files by</h4>-->
                                    <!--                                                                <div class="upload-clicking">-->
                                    <!--                                                                    <a href="#" class="">Clicking here</a>-->
                                    <!--                                                                </div>-->
                                    <!--                                                            </div>-->
                                    <!--                                                        </div>-->
                                    <!--                                                    </div>-->
                                    <!--                                                </div>-->
                                    <!--                                                <div class="file-upload-content">-->
                                    <!--                                                    <img class="file-upload-image" src="#" alt="your image"/>-->
                                    <!--                                                    <div class="image-title-wrap">-->
                                    <!--                                                        <button type="button" onclick="removeUpload()"-->
                                    <!--                                                                class="btn remove-image">-->
                                    <!--                                                            Remove-->
                                    <!--                                                            <span class="image-title" style="display: none;">Uploaded-->
                                    <!--                                                                Image</span>-->
                                    <!--                                                        </button>-->
                                    <!--                                                    </div>-->
                                    <!--                                                </div>-->
                                    <!--                                            </div>-->
                                    <!--                                        </div>-->
                                    <!--                                    </div>-->
                                    <div class="col-xl-12  childcatagories_modal_from">
                                        <div class="">
                                            <h4 class="picture_heading">Cover Photo <span class="recmend_size">( Recmended size 600 X 200 )</span> </h4>
                                        </div>
                                        <div class="card text-center uload-card upload_pic_card4">
                                            <div class="file-upload4">
                                                <div class="image-upload-wrap4">
                                                    <input class="file-upload-input4" type="file"
                                                           onchange="readURL4(this);" accept="image/*" />
                                                    <input type="hidden" id="cimagecimage" name="cover_image">
                                                    <div class="drag-text4">
                                                        <div class="card-body upload-card-body4">
                                                            <div class="upload-img4">
                                                                <img src="../public/image/upload.png" alt="" />
                                                            </div>
                                                            <div class="upload-image-format4">
                                                                <p>
                                                                    .PDF .JPG .PNG .DOC
                                                                </p>
                                                            </div>
                                                            <div class="upload-detail4">
                                                                <h4>You can also upload files by</h4>
                                                                <div class="upload-clicking4">
                                                                    <a href="#" class="">Clicking here</a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="file-upload-content4">
                                                    <img class="file-upload-image4" name="brand_cover_photo" src="#" alt="your image" />
                                                    <input type="hidden" name="brand_cover_photo" id="brand-cover-photo">
                                                    <div class="image-title-wrap4">
                                                        <button type="button" onclick="removeUpload4()" class="btn remove-image4">
                                                            Remove
                                                            <span class="image-title4" style="display: none;">Uploaded
                                  Image</span>
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xl-12 addpro_main_hr">
                                        <hr/>
                                    </div>

                                    <div class="col-xl-12">
                                        <div class="addpro_main_head_second">
                                            <h4>Adtional Images</h4>

                                            <div class="uload-card">
                                                <div id="myDropzone" class="dropzone">

                                                    <!--<div class="fallback">
                                                        <input name="file" type="file" multiple/>
                                                    </div>-->

                                                    <div class="dropzone needsclick dz-clickable" id="demo-upload">


                                                        <div class="dz-message needsclick">


                                                            <div class="card-body upload-card-body dz-button">
                                                                <div class="upload-img">
                                                                    <img name="imagess" src="../public/image/upload.png"
                                                                         alt=""/>
                                                                </div>
                                                                <div class="upload-image-format">
                                                                    <p>
                                                                        .PDF .JPG .PNG .DOC
                                                                    </p>
                                                                </div>
                                                                <div class="upload-detail">
                                                                    <h4
                                                                            style=" font-size: 14px; font-weight: 100; margin-top: -5px;">
                                                                        You can also upload files by
                                                                    </h4>
                                                                    <div class="upload-clicking class=" note needsclick
                                                                    "">
                                                                    <a href="#" class="">Clicking here</a>
                                                                </div>
                                                            </div>
                                                        </div>


                                                    </div>

                                                </div>
                                            </div>

                                        </div>


                                    </div>
                                </div>
                                <div class="col-xl-12 addpro_main_hr">
                                    <hr/>
                                </div>
                                <div class="col-xl-12 col-md-8 addpro_main_hr">
                                    <div class="row" id="coba">

                                    </div>
                                </div>

                                <div class="col-xl-12 addpro_main_head_third">
                                    <h2>Price</h2>
                                </div>
                                <div class="col-xl-12">
                                    <label for="propri"
                                           class="addpro_main-input-label txt-regular color-sec">Product
                                        Price</label>
                                    <input type="text" id="propri" name="propri" placeholder="Enter Price"
                                           class="addpro_main-input w-100"/>
                                </div>

                                <div class="col-xl-12" style="display: none;">
                                    <div class="custom-control custom-switch">
                                        <input type="checkbox" class="custom-control-input" id="customSwitch2"
                                               checked/>
                                        <label class="custom-control-label" for="customSwitch2"></label>
                                        Add tax for this product</label>
                                    </div>
                                </div>
                                <div class="col-xl-12 mt-3">
                                    <div class="form-group">
                                        <label for="" class="addpro_main-input-label">Processing Time</label>
                                        <input type="text" name="processing_time" id=""
                                               class="form-control addpro_main-input"
                                               placeholder="Enter Processing time" aria-describedby="helpId">

                                    </div>
                                </div>
                                <div class="col-xl-12 addpro_main_hr">
                                    <hr/>
                                </div>
                                <!--                                    <div class="col-xl-12 addpro_main_head_third">-->
                                <!--                                        <h2>Sale</h2>-->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-6">-->
                                <!--                                        <div class="form-group">-->
                                <!--                                            <label for="propri"-->
                                <!--                                                class="addpro_main-input-label txt-regular color-sec">Start-->
                                <!--                                                Date</label>-->
                                <!--                                            <input type="date" name="sale_start" placeholder="Enter Price"-->
                                <!--                                                class="addpro_main-input w-100" />-->
                                <!--                                        </div>-->
                                <!---->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-6">-->
                                <!--                                        <div class="form-group">-->
                                <!--                                            <label for="propri"-->
                                <!--                                                class="addpro_main-input-label txt-regular color-sec">End-->
                                <!--                                                Date</label>-->
                                <!--                                            <input type="date" name="sale_start" placeholder="Enter Price"-->
                                <!--                                                class="addpro_main-input w-100" />-->
                                <!--                                        </div>-->
                                <!---->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-12">-->
                                <!--                                        <div class="form-group">-->
                                <!--                                            <label for="Count"-->
                                <!--                                                class="addpro_main-input-label txt-regular color-sec">Sale</label>-->
                                <!--                                            <select name="Count" class="addpro_main-input w-100" id="Count">-->
                                <!--                                                <option value="volvo">Volvo</option>-->
                                <!--                                                <option value="saab">Saab</option>-->
                                <!--                                                <option value="opel">Opel</option>-->
                                <!--                                                <option value="audi">Audi</option>-->
                                <!--                                            </select>-->
                                <!--                                        </div>-->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-12 hide_discount">-->
                                <!--                                        <div class="form-group">-->
                                <!--                                            <label for="propri"-->
                                <!--                                                class="addpro_main-input-label txt-regular color-sec">Discount</label>-->
                                <!--                                            <input type="text" name="sale_dis" placeholder="Enter Discount"-->
                                <!--                                                class="addpro_main-input w-100" />-->
                                <!--                                        </div>-->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-12">-->
                                <!--                                        <div class="custom-control custom-switch">-->
                                <!--                                            <input type="checkbox" class="custom-control-input" id="customSwitch6" />-->
                                <!--                                            <label class="custom-control-label" for="customSwitch6"></label>-->
                                <!--                                            This is Discount item</label>-->
                                <!--                                        </div>-->
                                <!--                                    </div>-->
                                <!--                                    <div class="col-xl-12 addpro_main_hr">-->
                                <!--                                        <hr />-->
                                <!--                                    </div>-->
<!--                                <div class="col-xl-12 addpro_main_head_third">-->
<!--                                    <h2>Brand</h2>-->
<!--                                </div>-->
<!--                                <div class="col-xl-12">-->
<!--                                    --><?php
//
//                                    $query = "SELECT * FROM brand";
//                                    $result = queryRunner($query);
//
//
//                                    ?>
<!---->
<!--                                    <label for="Count"-->
<!--                                           class="addpro_main-input-label txt-regular color-sec ">Brand Name</label>-->
<!--                                    <select name="brand_id" class="addpro_main-input w-100" id="Count" value="">-->
<!--                                        <option value="">Select Brand</option>-->
<!---->
<!--                                        --><?php
//                                        while ($row = rowRetriever($result)) {
//                                            ?>
<!--                                            <option value="--><?php //echo $row['id']; ?><!--">--><?php //echo $row['name']; ?><!--</option>-->
<!--                                            --><?php
//                                        }
//
//                                        ?>
<!---->
<!--                                    </select>-->
<!--                                </div>-->
                                <div class="col-xl-12 addpro_main_hr">
                                    <hr/>
                                </div>
                                <div class="col-xl-12 addpro_main_head_third">
                                    <h2>Different Options</h2>
                                </div>
                                <div class="col-xl-12">
                                    <div class="custom-control custom-switch">
                                        <input type="checkbox" class="custom-control-input" id="customSwitch3"/>
                                        <label class="custom-control-label" for="customSwitch3"></label>
                                        Add Multiple Options</label>
                                    </div>
                                </div>
                                <div class="col-xl-12 addpro_main_head_fourth option1" id="optionid"
                                     style="display: none;">
                                    <!-- <div class="row close1">
                                        <div class="col-xl-6 option1">
                                            <div class="addvalue" style="display: flex;">
                                                <div
                                                    style="border:2px solid #e6e9f4;height:40px;width:80%; padding: 5px; border-radius:4px">
                                                    <div>
                                                        <h4 style="font-size: 14px;color: #131523; font-size: 14px;font-weight: 400;line-height: 24px;padding-left: 4px"
                                                            id="opt1">sffs</h4>
                                                    </div>
                                                </div>
                                                <div style="height: 40px; width: 20%;text-align: center; padding: 5px;">
                                                    <img src="img/edit.png" width="9px" height="9px" data-toggle="modal"
                                                        data-target="#addpro_product_input_edit"
                                                        onclick="editoption(1)"><img src="img/close.png" width="7px"
                                                        height="7px" style="margin-left: 5px;"
                                                        onclick="deleteoption(1)"></div>
                                            </div>
                                        </div>
                                        <div class="col-xl-6 option1">
                                            <div class="addvalue" style="display: flex;">
                                                <div class="wrp">
                                                    <div class="item">
                                                        <span>size</span>
                                                        <div>
                                                            <span><i class="fas fa-pencil-alt"
                                                                style="padding-left: 10px;font-size: 8px;color: gray;"></i></span><span
                                                            style="padding-left: 5px"><i
                                                                class="fas fa-times"
                                                                style="font-size: 9px;"></i></span>
                                                        </div>

                                                    </div>
                                                    <div class="item">
                                                        <span>size</span>
                                                        <div>
                                                            <span><i class="fas fa-pencil-alt"
                                                                style="padding-left: 10px;font-size: 8px;color: gray;"></i></span><span
                                                            style="padding-left: 5px"><i
                                                                class="fas fa-times"
                                                                style="font-size: 9px;"></i></span>
                                                        </div>

                                                    </div>

                                                </div>
                                                <div style="height: 40px; width: 20%;text-align: center; padding: 4px;">
                                                    <img src="img/plus (5).png" width="13px" height="13px"
                                                        data-toggle="modal" data-target="#addpro_addfieldtag"></div>
                                            </div>
                                        </div>
                                    </div> -->
                                </div>

                                <div class="col-xl-12 mt-3 option1" style="display: none;">
                                    <a href="#" data-toggle="modal" data-target="#addpro_product_input"
                                       style="font-size: 14px;text-decoration: none;">Add More</a>
                                </div>
                                <div class="col-xl-12 addpro_main_hr">
                                    <hr>
                                </div>
                                <div class="col-xl-12 addpro_main_head_third">
                                    <h2>Shipping</h2>
                                </div>
                                <div class="col-xl-6 option2">
                                    <label for="proWeight"
                                           class="addpro_main-input-label txt-regular color-sec">Weight</label>
                                    <input type="text" id="proWeight" name="proWeight" placeholder="Enter Weight"
                                           class="addpro_main-input w-100"/>
                                </div>
                                <div class="col-xl-6 option2">
                                    <?php

                                    $query = "SELECT * FROM CustomizedShipping";
                                    $result = queryRunner($query);


                                    ?>

                                    <label for="Count"
                                           class="addpro_main-input-label txt-regular color-sec ">Shipping</label>
                                    <select name="shipping[]" class="selectpicker  w-100" id="Count" value=""
                                            multiple="multiple">

                                        <?php
                                        while ($row = rowRetriever($result)) {
                                            ?>
                                            <option value="<?php echo $row['id']; ?>"><?php echo $row['name']; ?></option>
                                            <?php
                                        }

                                        ?>
                                        <!--                                            <option value="volvo">Volvo</option>-->
                                        <!--                                            <option value="saab">Saab</option>-->
                                        <!--                                            <option value="opel">Opel</option>-->
                                        <!--                                            <option value="audi">Audi</option>-->
                                    </select>


                                </div>
                                <div class="col-xl-12">
                                    <div class="custom-control custom-switch">
                                        <input type="checkbox" class="custom-control-input" checked
                                               id="customSwitch1"/>
                                        <label class="custom-control-label" for="customSwitch1"></label>
                                        This is Digital item</label>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>

                <div class="col-xl-4 col-lg-4 col-md-4 padtop">
                    <div class="row">
                        <div class="col-xl-12">
                            <div class="card categories_card  mb-2">
                                <div class="card-body">
                                    <div class="addpro_main_side_bar_heding">
                                        <h4>Categories</h4>
                                        <?php


                                        $query = "SELECT * FROM Categories where enable ='0'";
                                        $result = queryRunner($query);

                                        ?>
                                        <div id="addpro_check" class="category-product-class">
                                            <?php while ($row = rowRetriever($result)) { ?>
                                                <label class="container"><?php echo $row['name']; ?>
                                                    <input type="radio" name="radio" value="<?php echo $row['id']; ?>"
                                                           id="category-checkboxs-<?php echo $row['id']; ?>"
                                                           onclick="retriveSubCategoriesData(<?php echo $row['id']; ?>)">
                                                    <span class="checkmark"></span>
                                                </label>
                                                <?php
                                            }
                                            ?>

                                            <!--                                                <label class="container">Men-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">T-Shirt-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">Hoodies-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                        </div>
                                        <div class="addpro_link_tag">
                                            <a href="#" data-toggle="modal"
                                               data-target="#addproduct_catogories">Create
                                                New</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-12 addpro_subcategory" style="display: none;">
                            <div class="card categories_card mt-2 mb-2">
                                <div class="card-body">
                                    <div class="addpro_main_side_bar_heding">
                                        <h4>Sub Categories</h4>
                                        <div id="addpro_check" class="addpro_subcat-label">
                                            <!--                                                <label class="container addpro_child_cat">Women-->
                                            <!--                                                    <input type="checkbox" checked="checked">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">Men-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">T-Shirt-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">Hoodies-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                        </div>
                                        <div class="addpro_link_tag">
                                            <a href="#" data-toggle="modal" id="sub-cat-link"
                                               data-target="#addpro_subcategories">Create
                                                New</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-12 addpro_childcategory" style="display: none;">
                            <div class="card categories_card mt-2 mb-2">
                                <div class="card-body">
                                    <div class="addpro_main_side_bar_heding">
                                        <h4>Child Categories</h4>
                                        <div id="addpro_check" class="addpro_child_label">
                                            <!--                                                <label class="container addpro_sub_cat">Women-->
                                            <!--                                                    <input type="checkbox" checked="checked">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">Men-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">T-Shirt-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                            <!---->
                                            <!--                                                <label class="container">Hoodies-->
                                            <!--                                                    <input type="checkbox">-->
                                            <!--                                                    <span class="checkmark"></span>-->
                                            <!--                                                </label>-->
                                        </div>
                                        <div class="addpro_link_tag">
                                            <a href="#" data-toggle="modal" id="child-cat-link"
                                               data-target="#addpro_childcatogories">Create
                                                New</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-12">
                            <div class="card tags_card">
                                <div class="card-body">
                                    <div class="customer-tags">
                                        <div class="customer-tags-name">
                                            <h5>
                                                Tags
                                            </h5>
                                        </div>
                                        <div>


                                            <label for="lfname" class="input-label">Add Tags</label>
                                            <br/>

                                            <input id="example" class="tags-input" name="example" type="text"
                                                   value="jQuery,Script,Net">


                                        </div>

                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="col-xl-12" style="display: none;">
                            <div class="addpro_seo_settings">
                                <div class="addpro_seo_head">
                                    <h2>SEO Settings</h2>
                                </div>
                                <div>
                                    <label for="seotitle"
                                           class="addpro_main-input-label txt-regular color-sec">Title</label>
                                    <input type="text" id="seotitle" name="seotitle" placeholder=""
                                           class="addpro_main-input w-100"/>
                                </div>
                                <div>
                                    <label for="seodis"
                                           class="addpro_main-input-label txt-regular color-sec">Description</label>
                                    <input type="text" id="seodis" name="seodis" placeholder=""
                                           style="height: 92px;" class="addpro_main-input w-100"/>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </form>


        </div>
    </div>
    <!-- /#page-content-wrapper -->

</div>
<!-- /#wrapper -->
<!-- modals -->
<!-- catagories modal start -->
<form class="catagories_modal_from" id="modal-form" action="">
    <div class="modal fade" id="addproduct_catogories" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close"
                            onclick="colsemodel()">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fa fa-folder" aria-hidden="true"></i>
                        </div>
                    </div>
                    <label for="cat-name-upload"
                           class="customer-add-input-label txt-regular upload-input-label">Category
                        Name</label>

                    <input type="text" id="addpro_cat" name="addpro_cat" placeholder="Woman Clothes" value=""
                           class="customer-add-input category_name w-100"/>
                    <div>
                        <div>
                            <div class="upload-text-heading">
                                <h5 class="coupon-code-main-heading txt-regular">
                                    Upload your attachments
                                </h5>
                            </div>
                            <div>
                                <p class="upload-main-paragraph txt-label2">
                                    Drag and drop your files here
                                </p>
                            </div>
                        </div>
                        <div class="card text-center uload-card">
                            <div class="file-upload">
                                <div class="image-upload-wrap">
                                    <input class="file-upload-input" type="file" onchange="readURL(this);"
                                           accept="image/*"/>
                                    <div class="drag-text">
                                        <div class="card-body upload-card-body">
                                            <div class="upload-img">
                                                <img src="../public/image/upload.png" alt=""/>
                                            </div>
                                            <div class="upload-image-format">
                                                <p>
                                                    .PDF .JPG .PNG .DOC
                                                </p>
                                            </div>
                                            <div class="upload-detail">
                                                <h4>You can also upload files by</h4>
                                                <div class="upload-clicking">
                                                    <a href="#" class="">Clicking here</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="file-upload-content">
                                    <img class="file-upload-image" src="#" alt="your image"/>
                                    <div class="image-title-wrap">
                                        <button type="button" onclick="removeUpload()" class="btn remove-image">
                                            Remove
                                            <span class="image-title" style="display: none;">Uploaded
                                                        Image</span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="addCategoryiesData()" class="btn btn-primary">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- catagories modal end -->
<!-- subcatgory Modal start -->
<form action="" class="subcatgory_Modal_form">
    <div class="modal fade" id="addpro_subcategories" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fa fa-folder" aria-hidden="true"></i>
                        </div>
                    </div>
                    <label for="addpro_subcatagory-add"
                           class="customer-add-input-label txt-regular upload-input-label">SubCategory
                        Name</label>

                    <input type="text" id="addpro_subcatagory-add" name="addpro_subcatagory-add"
                           placeholder="Woman Clothes" value=""
                           class="customer-add-input w-100 subcategory_name_class"/>

                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="addSubcategory()" class="btn btn-primary">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- subcatgory Modal End -->

<!-- child catagories modal start -->
<form action="" id="child_catagories_modal_form">
    <div class="modal fade" id="addpro_childcatogories" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close"
                            onclick="colsemodel()">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fa fa-folder" aria-hidden="true"></i>
                        </div>
                    </div>
                    <label for="addpro_child_cat_input"
                           class="customer-add-input-label txt-regular upload-input-label">Category
                        Name</label>

                    <input type="text" id="addpro_child_cat_input" name="addpro_child_cat_input"
                           placeholder="Woman Clothes" value="" class="customer-add-input child_name_class w-100"/>
                    <div>
                        <div>
                            <div class="upload-text-heading">
                                <h5 class="coupon-code-main-heading txt-regular">
                                    Upload your attachments
                                </h5>
                            </div>
                            <div>
                                <p class="upload-main-paragraph txt-label2">
                                    Drag and drop your files here
                                </p>
                            </div>
                        </div>
                        <div class="card text-center uload-card">
                            <div class="file-upload">
                                <div class="image-upload-wrap">
                                    <input class="file-upload-input" type="file" onchange="readURL(this);"
                                           accept="image/*"/>
                                    <div class="drag-text">
                                        <div class="card-body upload-card-body">
                                            <div class="upload-img">
                                                <img src="../public/image/upload.png" alt=""/>
                                            </div>
                                            <div class="upload-image-format">
                                                <p>
                                                    .PDF .JPG .PNG .DOC
                                                </p>
                                            </div>
                                            <div class="upload-detail">
                                                <h4>You can also upload files by</h4>
                                                <div class="upload-clicking">
                                                    <a href="#" class="">Clicking here</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="file-upload-content">
                                    <img class="file-upload-image" src="#" alt="your image"/>
                                    <div class="image-title-wrap">
                                        <button type="button" onclick="removeUpload()" class="btn remove-image">
                                            Remove
                                            <span class="image-title" style="display: none;">Uploaded
                                                        Image</span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="addChildData()" class="btn btn-primary">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- child catagories modal end -->
<!-- add text for product modal start -->
<form class="add_text_for_product_modal_form">
    <div class="modal fade" id="addpro_product_input" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fas fa-shopping-bag fsb"></i>
                        </div>
                    </div>
                    <label for="addpro_productfieldadd"
                           class="customer-add-input-label txt-regular upload-input-label">Add Product</label>

                    <input type="text" id="addpro_productfieldadd" name="addpro_subcatagory-add"
                           placeholder="Product Name" value="" class="customer-add-input w-100"/>

                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="productfieldadd()" class="btn btn-primary">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- add text for product modal end -->

<!-- add text for edit modal start -->
<form action="" class="add_text_for_edit_modal_form">
    <div class="modal fade" id="addpro_product_input_edit" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fas fa-shopping-bag fsb"></i>
                        </div>
                    </div>
                    <label for="addpro_productfilededit"
                           class="customer-add-input-label txt-regular upload-input-label">Add Product</label>

                    <input type="text" id="addpro_productfilededit" name="addpro_productfilededit"
                           placeholder="Product Name" value="" class="customer-add-input w-100"/>
                    <input type="hidden" id="addpro_productfilededit2" name="addpro_productfilededit2"
                           placeholder="Product Name" value="" class="customer-add-input w-100"/>

                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="" class="btn btn-primary updatefun">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- add text for edit modal end -->
<!-- add text for add modal start -->
<form action="" id="addpro_addfieldtag_id" class="add_text_for_add_modal_form">
    <div class="modal fade" id="addpro_addfieldtag" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close"
                            onclick="colsemodel()">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fas fa-shopping-bag fsb"></i>
                        </div>
                    </div>
                    <label for="addpro_addtag_input_name"
                           class="customer-add-input-label txt-regular addpro-input-label">Name</label>

                    <input type="text" id="addpro_addtag_input_name" name="addpro_addtag_input_name"
                           placeholder="Woman Clothes" value="" class="customer-add-input w-100"/>
                    <div style="margin-top: 11px;">
                        <p class="upload-main-paragraph txt-label2">
                            Upto 10 Character Allow
                        </p>
                    </div>
                    <label for="addpro_addtag_input_price" style="margin-top: 14px;"
                           class="customer-add-input-label txt-regular addpro-input-label">Price</label>

                    <input type="text" id="addpro_addtag_input_price" name="addpro_addtag_input_price"
                           placeholder="Woman Clothes" value="" class="customer-add-input w-100"/>
                    <div id="hideimage">
                        <div>
                            <div class="upload-text-heading">
                                <h5 class="coupon-code-main-heading txt-regular">
                                    Upload your attachments
                                </h5>
                            </div>
                            <div>
                                <p class="upload-main-paragraph" style="font-size:10px;">
                                    Drag and drop your files here
                                </p>
                            </div>
                        </div>
                        <div class="card text-center uload-card">
                            <div class="file-upload">
                                <div class="image-upload-wrap">
                                    <input class="file-upload-input" type="file" onchange="readURL(this);"
                                           accept="image/*"/>
                                    <div class="drag-text">
                                        <div class="card-body upload-card-body">
                                            <div class="upload-img">
                                                <img src="../public/image/upload.png" alt=""/>
                                            </div>
                                            <div class="upload-image-format">
                                                <p>
                                                    .PDF .JPG .PNG .DOC
                                                </p>
                                            </div>
                                            <div class="upload-detail">
                                                <h4>You can also upload files by</h4>
                                                <div class="upload-clicking">
                                                    <a href="#" class="">Clicking here</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="file-upload-content">
                                    <img class="file-upload-image addpro_addimage_tag" src="#"
                                         alt="your image"/>
                                    <div class="image-title-wrap">
                                        <button type="button" onclick="removeUpload()" class="btn remove-image">
                                            Remove
                                            <span class="image-title" style="display: none;">Uploaded
                                                        Image</span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="custom-controlm custom-switchm">
                        <input type="checkbox" class="custom-control-input" id="customSwitch4" checked>
                        <label class="custom-control-label" for="customSwitch4"></label>Required image
                    </div>
                </div>
                <div class="modal-footer mf">
                    <button type="button" onclick="addprotag()" class="btn btn-primary">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- add text for add modal start -->
<!-- add tagupdate for modal start -->
<form action="" class="add_tagupdate_for_modal_form">
    <div class="modal fade" id="addpro_addfieldtag_update" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    <button type="button" class="close closmodel" data-dismiss="modal" aria-label="Close"
                            onclick="colsemodel()">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body mb">
                    <div>
                        <div class="cat-folder-img">
                            <i class="fas fa-shopping-bag fsb"></i>
                        </div>
                    </div>
                    <label for="addpro_addtag_input_name_update"
                           class="customer-add-input-label txt-regular addpro-input-label">Name</label>

                    <input type="text" id="addpro_addtag_input_name_update"
                           name="addpro_addtag_input_name_update" placeholder="Woman Clothes" value=""
                           class="customer-add-input w-100"/>
                    <div style="margin-top: 11px;">
                        <p class="upload-main-paragraph" style="font-size:10px;">
                            Upto 10 Character Allow
                        </p>
                    </div>
                    <input type="hidden" id="addpro_addtag_input_name_update2"
                           name="addpro_addtag_input_name_update2" placeholder="Woman Clothes" value=""
                           class="customer-add-input w-100"/>
                    <label for="addpro_addtag_input_price_update" style="margin-top: 14px;"
                           class="customer-add-input-label txt-regular addpro-input-label">Price</label>

                    <input type="text" id="addpro_addtag_input_price_update"
                           name="addpro_addtag_input_price_update" placeholder="Woman Clothes" value=""
                           class="customer-add-input w-100"/>

                    <div id="hideimage2">
                        <div>
                            <div class="upload-text-heading">
                                <h5 class="coupon-code-main-heading txt-regular">
                                    Upload your attachments
                                </h5>
                            </div>
                            <div>
                                <p class="upload-main-paragraph txt-label2">
                                    Drag and drop your files here
                                </p>
                            </div>
                        </div>
                        <div class="card text-center uload-card">
                            <div class="file-upload">
                                <div class="image-upload-wrap">
                                    <input class="file-upload-input" type="file" onchange="readURL(this);"
                                           accept="image/*"/>
                                    <div class="drag-text">
                                        <div class="card-body upload-card-body">
                                            <div class="upload-img">
                                                <img src="../public/image/upload.png" alt=""/>
                                            </div>
                                            <div class="upload-image-format">
                                                <p>
                                                    .PDF .JPG .PNG .DOC
                                                </p>
                                            </div>
                                            <div class="upload-detail">
                                                <h4>You can also upload files by</h4>
                                                <div class="upload-clicking">
                                                    <a href="#" class="">Clicking here</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="file-upload-content">
                                    <img class="file-upload-image" src="#" alt="your image"/>
                                    <div class="image-title-wrap">
                                        <button type="button" onclick="removeUpload()" class="btn remove-image">
                                            Remove
                                            <span class="image-title" style="display: none;">Uploaded
                                                        Image</span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="custom-controlm custom-switchm">
                        <input type="checkbox" class="custom-control-input" id="customSwitch5" checked>
                        <label class="custom-control-label" for="customSwitch5"></label>Required image
                    </div>
                </div>
                <div class="modal-footer mf">
                    <button type="button" class="btn btn-primary updtag">
                        <img src="../public/image/tick (1).png" alt=""/>
                    </button>
                </div>
            </div>
        </div>
    </div>
</form>
<!-- add tagupdate for modal start -->


<!-- Bootstrap core JavaScript -->
<script src="../vendor/jquery/jquery.min.js"></script>
<script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<script src="//cdn.ckeditor.com/4.14.1/standard/ckeditor.js"></script>
<script src="../public/js/jquery.tag.js"></script>
<script src="../public/js/jquery.tagsinput-revisited.js"></script>
<script src="../public/js/dropzone.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/bootstrap-select.min.js"></script>
<!-- Menu Toggle Script -->

<script>

    var dresult;
    Dropzone.options.myDropzone = {
        url: '../framework/main_action.php?action_type=create&request_type=store&functionality_type=insert_picture&id='+$("#random-no").val(),
        autoProcessQueue: true,
        uploadMultiple: true,
        parallelUploads: 5,
        maxFiles: 5,
        maxFilesize: 1,
        addRemoveLinks: true,
        acceptedFiles: 'image/*',
        previewTemplate: `<div class="dz-preview dz-file-preview">

                      <div class="dz-image"><img data-dz-thumbnail /></div>
                      <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>

                      <div class="dz-error-message"><span data-dz-errormessage></span></div>
                      <div class="dz-error-message"><i class="fa fa-warning">&nbsp;</i><span data-dz-errormessage></span></div>
                      <div class="dz-filename"><span data-dz-name></span></div>
                      <div class="dz-progress">
                        <span class="dz-upload" data-dz-uploadprogress></span>
                      </div>
                      <div class="dz-remove">
                    <div>
                        <a href="javascript:undefined;" data-dz-remove=""style="color:red;" >Delete</a>
                        </div>
                       </div>
                    </div>
                        `,
        addRemoveLinks: true,
        init: function () {

            dzClosure = this; // Makes sure that 'this' is understood inside the functions below.

            // for Dropzone to process the queue (instead of default form behavior):
            /*document.getElementById("btn-submit").addEventListener("click", function(e) {
                // Make sure that the form isn't actually being sent.
                e.preventDefault();
                e.stopPropagation();
                dzClosure.processQueue();

            });*/
            dzClosure.on("success", function (file, response) {

                var _this = this;
                console.log("sucesso" + response + " file  data:" + file.name);
                var data = JSON.parse(response);
                dresult = data.listOfData;
                console.log(dresult);

            });

            dzClosure.on("removedfile", function (file) {

                console.log("File REmoved Successfully = " + file.name + " file = " + file.id);


                for (var i = 0; i < dresult.length; i++) {


                    var n = dresult[i].id;
                    var name = dresult[i].name;
                    if (file.name == name) {
                        console.log("Data  Id = " + dresult[i].id + " Name = " + dresult[i].name);
                        sendRequest("?action_type=delete&request_type=products&functionality_type=delete_products_picture", {
                            id: n,


                        }, "POST")
                            .then((data) => {
                                console.log(data)
                                var data = JSON.parse(data);
                                console.log("Successfully Delete " + data);


                            })
                            .catch((error) => {
                                console.log(error)
                            })

                    }


                }



            });

        }

        //send all the form data along with the files:


    }


</script>

<script type="text/javascript">
    $("#menu-toggle").click(function (e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });
    $('.selectpicker').selectpicker();


    $('.addpro_sub_cat').click(function () {
        $('.addpro_subcategory').show();
        $('.addpro_childcategory').hide();

    });
    $('.addpro_child_cat').click(function () {
        $('.addpro_childcategory').show();

    });

    function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $(".image-upload-wrap").hide();

                $(".file-upload-image").attr("src", e.target.result);

                $(".file-upload-content").show();

                $(".image-title").html(input.files[0].name);
            };

            reader.readAsDataURL(input.files[0]);
        } else {
            removeUpload();
        }
    }

    function removeUpload() {
        $(".file-upload-input").replaceWith($(".file-upload-input").clone());
        $(".file-upload-content").hide();
        $(".image-upload-wrap").show();
    }

    $(".image-upload-wrap").bind("dragover", function () {
        $(".image-upload-wrap").addClass("image-dropping");
    });
    $(".image-upload-wrap").bind("dragleave", function () {
        $(".image-upload-wrap").removeClass("image-dropping");
    });

    function showimage() {
        var s = $("#cat-name-upload").val();
        var v = $(".file-upload-image").attr("src");
    }

    function colsemodel() {
        $(".file-upload-content").hide();
        $(".image-upload-wrap").show();

    }

    function addproductfield() {
        var v = $('#addpro_cat').val();

        //   alert(v);
        var t = '<label class="container">' + v +
            '<input type="checkbox">' +
            '<span class="checkmark"></span>' +
            '</label>';
        $('#addpro_check').append(t);
        $("#addproduct_catogories").modal('hide');

        $("#modal-form").trigger("reset");

    }

    function addprosubcat() {
        var v = $('#addpro_subcatagory-add').val();
        //   alert(v);
        var t = '<label class="container">' + v +
            '<input type="checkbox">' +
            '<span class="checkmark"></span>' +
            '</label>';
        $('.addpro_subcat-label').append(t);
        $("#addpro_subcategories").modal('hide');
        $(".subcatgory_Modal_form").trigger("reset");


    }

    function addprochildcat() {
        var v = $('#addpro_child_cat_input').val();
        //   alert(v);
        var t = '<label class="container">' + v +
            '<input type="checkbox">' +
            '<span class="checkmark"></span>' +
            '</label>';
        $('.addpro_child_label').append(t);
        $("#addpro_childcatogories").modal('hide');
        $("#child_catagories_modal_form").trigger("reset");

    }

    var switchStatus = false;
    $("#customSwitch3").on('change', function () {
        if ($(this).is(':checked')) {
            switchStatus = $(this).is(':checked');
            // alert(switchStatus);
            $('.option1').show();
        } else {
            switchStatus = $(this).is(':checked');
            //    alert(switchStatus);// To verify
            $('.option1').hide();
        }
    });
    $("#customSwitch1").on('change', function () {
        if ($(this).is(':checked')) {
            switchStatus = $(this).is(':checked');
            // alert(switchStatus);
            $('.option2').show();

        } else {
            switchStatus = $(this).is(':checked');
            //    alert(switchStatus);// To verify
            $('.option2').hide();
        }
    });
    $("#customSwitch6").on('change', function () {
        if ($(this).is(':checked')) {
            switchStatus = $(this).is(':checked');
            // alert(switchStatus);
            $('.hide_discount').show();

        } else {
            switchStatus = $(this).is(':checked');
            //    alert(switchStatus);// To verify
            $('.hide_discount').hide();
        }
    });
    $("#customSwitch4").on('change', function () {
        if ($(this).is(':checked')) {
            switchStatus = $(this).is(':checked');
            // alert(switchStatus);
            $('#hideimage').show();

        } else {
            switchStatus = $(this).is(':checked');
            $('#hideimage').hide();
        }
    });
    $("#customSwitch5").on('change', function () {
        if ($(this).is(':checked')) {
            switchStatus = $(this).is(':checked');
            // alert(switchStatus);
            $('#hideimage2').show();

        } else {
            switchStatus = $(this).is(':checked');
            $('#hideimage2').hide();
        }
    });
    // var optval = 0;
    //
    // function productfieldadd() {
    //     var val = $('#addpro_productfieldadd').val();
    //     optval = optval + 1;
    //     var textappend = '<h2  class="close' + optval + '">Option ' + optval + '</h2>' +
    //         '<div class="row close' + optval + '">' +
    //
    //         '<div class="col-xl-6 option1" >' +
    //         '<div class="addvalue" style="display: flex;">' +
    //         '<div style="border:2px solid #e6e9f4;height:40px;width:80%; padding: 5px; border-radius:4px">' +
    //         '<div>' +
    //         '<h4 style="font-size: 14px;color: #131523; font-size: 14px;font-weight: 400;line-height: 24px;padding-left: 4px" id="opt' +
    //         optval + '">' + val + '</h4></div></div>' +
    //         '<div style="height: 40px; width: 20%;text-align: center; padding: 5px;">' +
    //         '<img src="../public/image/edit.png" width="13px" height="13px" data-toggle="modal" style="padding: 1px;" data-target="#addpro_product_input_edit" onclick="editoption(' +
    //         optval + ')"  />' +
    //         '<img src="../public/image/close.png" width="12px" height="12px" style="margin-left: 8px; padding: 1px;" onclick="deleteoption(' +
    //         optval + ')" /></div></div></div>' +
    //         '<div class="col-xl-6 option1" >' +
    //         ' <input type="hidden" class="optv" value="' + optval + '" >' +
    //         '<div class="addvalue" style="display: flex;">' +
    //         '<div class="wrp " id="wrp' + optval + '"></div>' +
    //
    //         '<div style="height: 40px; width: 20%;text-align: center; padding: 4px;" >' +
    //         '<img src="../public/image/plus (5).png" width="13px" height="13px" data-toggle="modal" data-id="' +
    //         optval +
    //         '" class="modal_btn" onclick="showID(this)"  data-target="#addpro_addfieldtag" /></div>' +
    //
    //         '</div>' +
    //         '</div>' +
    //         '</div>';
    //     $('#optionid').append(textappend);
    //     $("#addpro_product_input").modal('hide');
    //     $('.add_text_for_product_modal_form').trigger('reset');
    //
    //
    //
    // }

    // function deleteoption(val) {
    //     $('.close' + val).remove();
    //
    // }

    function editoption(g) {
        var inputval = $('#opt' + g).text();
        $('#addpro_productfilededit').val(inputval);
        $('#addpro_productfilededit2').val(g);
    }

    // $('.updatefun').click(function () {
    //     var s = $('#addpro_productfilededit2').val();
    //     var y = $('#addpro_productfilededit').val();
    //     $('#opt' + s).text(y);
    //     $("#addpro_product_input_edit").modal('hide');
    //
    // });

    // var tagv = 0;
    //
    // function addprotag() {
    //
    //     tagv = tagv + 1;
    //     // var s=$('#addpro_productfilededit2').val();
    //     var j = $('.optv').val();
    //
    //     var z = $('#addpro_addtag_input_name').val();
    //     var y = $('#addpro_addtag_input_price').val();
    //     var i = $('.addpro_addimage_tag').attr("src");
    //
    //
    //     //    alert(i);
    //
    //
    //     var tex = '<div class="item tg' + tagv + '">' +
    //
    //         '<span style="font-size: 12px;padding-top: 6px;" id="txg' + tagv + '">' + z + '</span>' +
    //         '<div><span><i class="fas fa-pencil-alt" data-toggle="modal" data-target="#addpro_addfieldtag_update" onclick="updtagval(' +
    //         tagv + ')"  style="padding-left: 10px;font-size: 8px;color: gray;"></i></span>' +
    //         '<span style="padding-left: 5px" onclick="deltagval(' + tagv +
    //         ')"><i class="fas fa-times" style="font-size: 9px;"></i></span> </div>' +
    //         '<span style="font-size: 12px;padding-top: 6px; display:none" id="txgprice' + tagv + '">' + y +
    //         '</span>' +
    //         '<img id="txgimg' + tagv + '" style="display:none"  src="' + i + '" alt="">   </div>';
    //
    //
    //     $('#wrp' + j + '').append(tex);
    //     $("#addpro_addfieldtag").modal('hide');
    //     $('.add_text_for_add_modal_form').trigger('reset');
    //
    //
    // }

    function showID(s) {
        var dataid = $(s).attr('data-id');
        $('.optv').val(dataid);
        $(".file-upload-content").hide();
        $(".image-upload-wrap").show();

    }

    // function deltagval(t) {
    //     //    alert(t);
    //     $('.tg' + t).remove();
    //
    // }

    function updtagval(a) {

        var inputval = $('#txg' + a).text();
        var inputval2 = $('#txgprice' + a).text();
        var img = $('#txgimg' + a).attr("src");

        // alert(img);
        if (img == "#") {
            $(".file-upload-content").hide();
            $(".image-upload-wrap").show();
        } else {
            $(".image-upload-wrap").hide();
            $(".file-upload-image").attr("src", img);
            $(".file-upload-content").show();

        }


        $('#addpro_addtag_input_name_update').val(inputval);
        $('#addpro_addtag_input_price_update').val(inputval2);
        $('#addpro_addtag_input_name_update2').val(a);

        $('.add_text_for_add_modal_form').trigger('reset');


        // alert(inputval);

    }

    // $('.updtag').click(function () {
    //     var s = $('#addpro_addtag_input_name_update2').val();
    //     var y = $('#addpro_addtag_input_name_update').val();
    //     var g = $('#addpro_addtag_input_price_update').val();
    //     var uimg = $(".file-upload-image").attr("src");
    //     // alert(uimg);
    //     $('#txg' + s).text(y);
    //     $('#txgprice' + s).text(g);
    //     $('#txgimg' + s).attr('src', uimg);
    //
    //     //         var inputval2 = $('#txgprice' + s).text();
    //     // var img = $('#txgimg'+s).attr("src");
    //
    //     //     $(".image-upload-wrap").hide();
    //     $("#addpro_addfieldtag_update").modal('hide');
    // });


    $('#example').tagsInput({
        limit: 7,

    });

    $('.list_prodcut_active').addClass('active');
</script>

<script>


    function retriveSubCategoriesData(n) {
        $('.addpro_subcategory').show();
        $('.addpro_childcategory').hide();

        $('.addpro_subcat-label').empty();
        // gh = [];
        $('#cat-id').val(n);
        $('#sub-cat-link').attr('data-id', n);
        sendRequest("?action_type=retrieve&request_type=products&functionality_type=retrieve_sub_categories", {
            category_id: n,

        }, "POST")
            .then((data) => {
                console.log(data)
                var data = JSON.parse(data);
                console.log("Successfully Positioned " + result);
                if (data.code == "202") {
                    var result = data.listOfData;
                    for (var i = 0; i < result.length; i++) {

                        console.log("Data  Id = " + result[i].id + " Name = " + result[i].name + " enable = " + result[i]
                            .enable);
                        var n = result[i].id;
                        var name = result[i].name;
                        var enable = result[i].enable;

                        var text = '<label class="container">' + name +
                            '<input type="radio" name="sub_radio" id="subcategory-checkboxs-' + n + '" onclick="retriveChildCategoriesData(' + n + ')" value="' + n + '">' +
                            '<span class="checkmark"></span>' +
                            '</label>';

                        $(".addpro_subcat-label").append(text);
                    }
                }
            })
            .catch((error) => {
                console.log(error)
            })


        // $("#second-box").empty();

    }

    function retriveChildCategoriesData(n) {
        $('.addpro_childcategory').show();
        $('.addpro_child_label').empty();
        // gh = [];
        $('#sub-cat-id').val(n);
        $('#child-cat-link').attr('data-id', n);
        sendRequest("?action_type=retrieve&request_type=products&functionality_type=retrieve_child_categories", {
            category_id: n,

        }, "POST")
            .then((data) => {
                console.log(data)
                var data = JSON.parse(data);
                console.log("Successfully Positioned " + result);
                if (data.code == "202") {
                    var result = data.listOfData;
                    for (var i = 0; i < result.length; i++) {

                        console.log("Data  Id = " + result[i].id + " Name = " + result[i].name + " enable = " + result[i]
                            .enable);
                        var n = result[i].id;
                        var name = result[i].name;
                        var enable = result[i].enable;

                        var text = '<label class="container">' + name +
                            '<input type="radio" name="child_radio" id="childcategory-checkboxs-' + n + '" onclick="getChildCategoriesId(' + n + ')" value="' + n + '">' +
                            '<span class="checkmark"></span>' +
                            '</label>';

                        $(".addpro_child_label").append(text);
                    }
                }
            })
            .catch((error) => {
                console.log(error)
            })


        // $("#second-box").empty();

    }

    function getChildCategoriesId(id) {
        $("#child-cat-id").val(id);

    }

    function addCategoryiesData() {
        var cat_name = $(".category_name").val();
        var img = $(".file-upload-image").attr("src");


        $.ajax({
            contentType: "application/json; charset=utf-8",
            url: "all-category-action.php?type=add_new_category",
            type: "POST",
            data: JSON.stringify({
                position: 0,
                category_name: cat_name,
                category_picture: img,
                type: "add_new_category"
            }),
            /*dataType: "json" ,*/
            success: function (data) {
                data = JSON.parse(data);

                if (data.code == "202") {

                    console.log(data.message);
                    var data_arr = data.response;
                    var catgory_id = data_arr[0].last_id;
                    // alert(data_arr[0].last_id);
                    var text = '<label class="container">' + cat_name +
                        '<input type="radio" name="radio" id="category-checkboxs-' + catgory_id + '" onclick="retriveSubCategoriesData(' + catgory_id + ')" value="' + catgory_id + '">' +
                        '<span class="checkmark"></span>' +
                        '</label>';


                    $(".category-product-class").append(text);
                    $("#addproduct_catogories").modal('hide');
                    $(".file-upload-content").hide();
                    $(".image-upload-wrap").show();


                } else if (data.status == "206") {
                    ///alert("Failed to Delete");
                    console.log("Failed to Positioned");
                }

            },

            error: function (XMLHttpRequest, textStatus, errorThrown) {
                window.alert("Problem = " + errorThrown);

            }
        });

    }

    function addSubcategory() {
        var cat_name = $(".subcategory_name_class").val();
        var id = $("#cat-id").val();

        $.ajax({
            contentType: "application/json; charset=utf-8",
            url: "all-category-action.php?type=add_sub_new_category",
            type: "POST",
            data: JSON.stringify({
                category_id: id,
                subcategory_name: cat_name,
            }),
            /*dataType: "json" ,*/
            success: function (data) {
                data = JSON.parse(data);

                if (data.code == "202") {

                    console.log(data.message);
                    var data_arr = data.response;
                    var catgory_id = data_arr[0].last_id;
                    // alert(data_arr[0].last_id);
                    var text = '<label class="container">' + cat_name +
                        '<input type="radio" name="sub_radio" id="subcategory-checkboxs-' + catgory_id + '" onclick="retriveChildCategoriesData(' + catgory_id + ')" value="' + catgory_id + '">' +
                        '<span class="checkmark"></span>' +
                        '</label>';


                    $(".addpro_subcat-label").append(text);
                    $("#addpro_subcategories").modal('hide');
                    // $(".file-upload-content").hide();
                    // $(".image-upload-wrap").show();


                } else if (data.status == "206") {
                    ///alert("Failed to Delete");
                    console.log("Failed to Positioned");
                }

            },

            error: function (XMLHttpRequest, textStatus, errorThrown) {
                window.alert("Problem = " + errorThrown);

            }
        });

    }

    function addChildData() {
        var cat_name = $(".child_name_class").val();
        var id = $("#sub-cat-id").val();
        var img = $(".file-upload-image").attr('src');

        $.ajax({
            contentType: "application/json; charset=utf-8",
            url: "all-category-action.php?type=add_child_new_category",
            type: "POST",
            data: JSON.stringify({
                child_id: id,
                childcategory_name: cat_name,
                childcategory_picture: img,
            }),
            /*dataType: "json" ,*/
            success: function (data) {
                data = JSON.parse(data);

                if (data.code == "202") {

                    console.log(data.message);
                    var data_arr = data.response;
                    var catgory_id = data_arr[0].last_id;
                    // alert(data_arr[0].last_id);
                    var text = '<label class="container">' + cat_name +
                        '<input type="radio" name="child_radio" id="childcategory-checkboxs-' + catgory_id + '" onclick="getChildCategoriesId(' + catgory_id + ')" value="' + catgory_id + '">' +
                        '<span class="checkmark"></span>' +
                        '</label>';


                    $(".addpro_child_label").append(text);
                    $("#addpro_childcatogories").modal('hide');
                    $(".file-upload-content").hide();
                    $(".image-upload-wrap").show();


                } else if (data.status == "206") {
                    ///alert("Failed to Delete");
                    console.log("Failed to Positioned");
                }

            },

            error: function (XMLHttpRequest, textStatus, errorThrown) {
                window.alert("Problem = " + errorThrown);

            }
        });

    }

    // var s = $(".tags-input").val();
    // alert(s);
    $('#example').keypress(function (e) {
        if (e.which == 13) {
            var s = $(".tags-input").val();
            alert(s);
            // return false;    //<---- Add this line
        }
    });

    function productfieldadd() {
        var id = $("#random-no").val();
        var val = $('#addpro_productfieldadd').val();
        sendRequest("?action_type=create&request_type=store&functionality_type=insert_product_attribute", {
            id: id,
            name: val,

        }, "POST")
            .then((data) => {
                // console.log(data.listOfData[0].last_id)

                var responseObject = JSON.parse(data);

                console.log("Last Insert ID = " + responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    // var result = data.listOfData;
                    // var data_arr = data.response;
                    var optval = responseObject.id;

                    var textappend = '<h2  class="close' + optval + '">Option ' + optval + '</h2>' +
                        '<div class="row close' + optval + '">' +

                        '<div class="col-xl-6 option1" >' +
                        '<div class="addvalue" style="display: flex;">' +
                        '<div style="border:2px solid #e6e9f4;height:40px;width:80%; padding: 5px; border-radius:4px">' +
                        '<div>' +
                        '<h4 style="font-size: 14px;color: #131523; font-size: 14px;font-weight: 400;line-height: 24px;padding-left: 4px" id="opt' +
                        optval + '">' + val + '</h4></div></div>' +
                        '<div style="height: 40px; width: 20%;text-align: center; padding: 5px;">' +
                        '<img src="../public/image/edit.png" width="13px" height="13px" data-toggle="modal" style="padding: 1px;" data-target="#addpro_product_input_edit" onclick="editoption(' +
                        optval + ')"  />' +
                        '<img src="../public/image/close.png" width="12px" height="12px" style="margin-left: 8px; padding: 1px;" onclick="deleteoption(' +
                        optval + ')" /></div></div></div>' +
                        '<div class="col-xl-6 option1" >' +
                        ' <input type="hidden" class="optv" value="' + optval + '" >' +
                        '<div class="addvalue" style="display: flex;">' +
                        '<div class="wrp " id="wrp' + optval + '"></div>' +

                        '<div style="height: 40px; width: 20%;text-align: center; padding: 4px;" >' +
                        '<img src="../public/image/plus (5).png" width="13px" height="13px" data-toggle="modal" data-id="' +
                        optval +
                        '" class="modal_btn" onclick="showID(this)"  data-target="#addpro_addfieldtag" /></div>' +

                        '</div>' +
                        '</div>' +
                        '</div>';
                    $('#optionid').append(textappend);
                    $("#addpro_product_input").modal('hide');
                    $('.add_text_for_product_modal_form').trigger('reset');

                }

            })
            .catch((error) => {
                console.log(error)
            })
    }

    function deleteoption(val) {

        sendRequest("?action_type=delete&request_type=store&functionality_type=delete_product_attribute", {
            id: val,


        }, "POST")
            .then((data) => {
                console.log(data)
                var responseObject = JSON.parse(data);

                // console.log("Last Insert ID = "+responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    $('.close' + val).remove();

                }
            })
            .catch((error) => {
                console.log(error)
            })

    }

    $('.updatefun').click(function () {
        var s = $('#addpro_productfilededit2').val();
        var y = $('#addpro_productfilededit').val();
        sendRequest("?action_type=update&request_type=store&functionality_type=update_product_attribute", {
            id: s,
            name: y,


        }, "POST")
            .then((data) => {
                console.log(data)
                var responseObject = JSON.parse(data);

                // console.log("Last Insert ID = "+responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    $('#opt' + s).text(y);
                    $("#addpro_product_input_edit").modal('hide');
                }
            })
            .catch((error) => {
                console.log(error)
            })


    });

    function addprotag() {

        // tagv = tagv + 1;
        // var s=$('#addpro_productfilededit2').val();
        var j = $('.optv').val();

        var z = $('#addpro_addtag_input_name').val();
        var y = $('#addpro_addtag_input_price').val();
        var i = $('.addpro_addimage_tag').attr("src");


        sendRequest("?action_type=create&request_type=store&functionality_type=insert_attributeitem", {
            attr_id: j,
            name: z,
            price: y,
            image: i,

        }, "POST")
            .then((data) => {
                // console.log(data.listOfData[0].last_id)

                var responseObject = JSON.parse(data);

                console.log("Last Insert ID = " + responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    // var result = data.listOfData;
                    // var data_arr = data.response;
                    var tagv = responseObject.id;

                    var tex = '<div class="item tg' + tagv + '">' +

                        '<span style="font-size: 12px;padding-top: 6px;" id="txg' + tagv + '">' + z + '</span>' +
                        '<div><span><i class="fas fa-pencil-alt" data-toggle="modal" data-target="#addpro_addfieldtag_update" onclick="updtagval(' +
                        tagv + ')"  style="padding-left: 10px;font-size: 8px;color: gray;"></i></span>' +
                        '<span style="padding-left: 5px" onclick="deltagval(' + tagv +
                        ')"><i class="fas fa-times" style="font-size: 9px;"></i></span> </div>' +
                        '<span style="font-size: 12px;padding-top: 6px; display:none" id="txgprice' + tagv + '">' + y +
                        '</span>' +
                        '<img id="txgimg' + tagv + '" style="display:none"  src="' + i + '" alt="">   </div>';


                    $('#wrp' + j + '').append(tex);
                    $("#addpro_addfieldtag").modal('hide');
                    $('.add_text_for_add_modal_form').trigger('reset');

                }

            })
            .catch((error) => {
                console.log(error)
            })


    }

    function deltagval(t) {

        sendRequest("?action_type=delete&request_type=store&functionality_type=delete_attributeitem", {
            id: t,


        }, "POST")
            .then((data) => {
                console.log(data)
                var responseObject = JSON.parse(data);

                // console.log("Last Insert ID = "+responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    $('.tg' + t).remove();

                }
            })
            .catch((error) => {
                console.log(error)
            })
        //    alert(t);


    }

    $('.updtag').click(function () {
        var s = $('#addpro_addtag_input_name_update2').val();
        var y = $('#addpro_addtag_input_name_update').val();
        var g = $('#addpro_addtag_input_price_update').val();
        var uimg = $(".file-upload-image").attr("src");
        // alert(uimg);

        sendRequest("?action_type=update&request_type=store&functionality_type=update_attributeitem", {
            id: s,
            name: y,
            price: g,
            image: uimg,


        }, "POST")
            .then((data) => {
                console.log(data)
                var responseObject = JSON.parse(data);

                // console.log("Last Insert ID = "+responseObject.id);
                // console.log("Successfully Positioned " + data);
                if (responseObject.code == "202") {
                    $('#txg' + s).text(y);
                    $('#txgprice' + s).text(g);
                    $('#txgimg' + s).attr('src', uimg);


                    $("#addpro_addfieldtag_update").modal('hide');
                }
            })
            .catch((error) => {
                console.log(error)
            })

    });
    function readURL4(input) {
        if (input.files && input.files[0]) {

            var reader = new FileReader();

            reader.onload = function (e) {
                $('.image-upload-wrap4').hide();

                $('.file-upload-image4').attr('src', e.target.result);
                $("#cimagecimage").val(e.target.result);
                $('#brand-cover-photo').val(e.target.result);
                $('.file-upload-content4').show();

                $('.image-title4').html(input.files[0].name);
            };

            reader.readAsDataURL(input.files[0]);

        } else {
            removeUpload4();
        }
    }

    function removeUpload4() {
        $('.file-upload-input4').replaceWith($('.file-upload-input4').clone());
        $('.file-upload-content4').hide();
        $('.image-upload-wrap4').show();
    }

</script>


</body>

</html>