<?php $__env->startSection('content'); ?>
    <div class="container">
        <div class="row p-2" style="background-color: #fff">
            <div class="col-md-6">
                <h4 class="pt-2">Create Product</h4>
            </div>
            <div class="col-md-6 d-flex justify-content-end align-items-center">
                <span style="float:right;"><a href="<?php echo e(route('product.index')); ?>"
                        class="btn btn-primary shadow-none">Back</a></span>
            </div>
        </div>
        <div class="row" style="background-color: #fff">
            <form action="<?php echo e(route('product.store')); ?>" method="POST" enctype="multipart/form-data">
                <?php echo csrf_field(); ?>
                <div class="row border border-dark p-3 m-3">
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <label for="title" class="form-label">Catalog Name</label>
                            <input class="form-control" type="text" name="title" id="title"
                                value="<?php echo e(old('title')); ?>">
                            <span class="text-danger">
                                <?php $__errorArgs = ['title'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                        <div class="col-md-6">
                            <label for="main_image" class="form-label">Main Image</label>
                            <input class="form-control" type="file" name="main_image" id="main_image"
                                onchange="previewImage(event)">
                            <span class="text-danger">
                                <?php $__errorArgs = ['main_image'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                            <!-- Thumbnail preview -->
                            <img id="thumbnail" src="#" alt="Image Preview"
                                style="display: none; margin-top: 10px; max-width: 100px; max-height: 100px;">
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <label for="categoryid" class="form-label">Category</label>
                            <select id="categoryid" name="categoryid" class="form-select">
                                <option disabled selected>Select</option>
                                <?php $__currentLoopData = $categories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <?php if($category->is_parent == 1): ?>
                                        <option value="<?php echo e($category->id); ?>"
                                            <?php echo e(old('categoryid') == $category->id ? 'selected' : ''); ?>>
                                            <?php echo e($category->categoryname); ?>

                                        </option>
                                        <?php if($category->children->isNotEmpty()): ?>
                                            <?php $__currentLoopData = $category->children; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $child): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <option value="<?php echo e($child->id); ?>"
                                                    <?php echo e(old('categoryid') == $child->id ? 'selected' : ''); ?>>
                                                    &nbsp;&nbsp;&nbsp;&nbsp; - <?php echo e($child->categoryname); ?>

                                                </option>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                        <?php endif; ?>
                                    <?php endif; ?>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>

                            </select>
                            <span class="text-danger">
                                <?php $__errorArgs = ['categoryid'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                        <div class="col-md-6">
                            <label for="description" class="form-label">Description</label>
                            <textarea type="text" name="description" class="form-control"><?php echo e(old('description')); ?></textarea>
                            <span class="text-danger">
                                <?php $__errorArgs = ['description'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-md-4">
                            <input type="hidden" name="is_active" value="No">
                            <input type="checkbox" id="is_active" name="is_active" value="Yes"
                                <?php echo e(old('is_active') === 'Yes' ? 'checked' : ''); ?> checked>
                            <label for="is_active" class="form-label ms-2">Is Active</label>
                        </div>

                        <span class="text-danger">
                            <?php $__errorArgs = ['is_active'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <?php echo e($message); ?>

                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </span>

                        <div class="col-md-6">
                            <label for="base_price" class="form-label">Base Price</label>
                            <input class="form-control" type="text" name="base_price" id="base_price"
                                value="<?php echo e(old('base_price')); ?>">
                            <span class="text-danger">
                                <?php $__errorArgs = ['base_price'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                        <div class="col-md-6">
                            <label for="discount_amt" class="form-label">Discount Amount</label>
                            <input class="form-control" type="text" name="discount_amt" id="discount_amt"
                                value="<?php echo e(old('discount_amt')); ?>">
                            <span class="text-danger">
                                <?php $__errorArgs = ['discount_amt'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <label for="tax_price" class="form-label">Tax Price</label>
                            <input class="form-control" type="text" name="tax_price" id="tax_price"
                                value="<?php echo e(old('tax_price')); ?>">
                            <span class="text-danger">
                                <?php $__errorArgs = ['tax_price'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                        <div class="col-md-6">
                            <label for="mrp" class="form-label">MRP</label>
                            <input class="form-control" type="text" name="mrp" id="mrp"
                                value="<?php echo e(old('mrp')); ?>">
                            <span class="text-danger">
                                <?php $__errorArgs = ['mrp'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                    <?php echo e($message); ?>

                                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </span>
                        </div>
                    </div>
                </div>
                <div id="additional-blocks">
                    <div class="col-md-12 d-flex justify-content-end">
                        <button type="button" id="add-block" class="btn btn-secondary shadow-none me-5">Add Block</button>
                    </div>

                    <div class="row border border-dark p-3 m-3 single-product">
                        <div class="row mb-3">
                            <div class="col-md-5">
                                <label for="slug" class="form-label">Slug</label>
                                <input class="form-control slug" type="text" name="sku[slug][]" id="slug">
                                <span class="text-danger"></span>
                            </div>
                            <div class="col-md-2">
                                <label for="quantity" class="form-label">Opening Stock</label>
                                <input class="form-control" type="text" name="sku[quantity][]" id="quantity">
                                <span class="text-danger"></span>
                            </div>
                            <div class="col-md-5">
                                <label for="image" class="form-label">Image</label>
                                <input class="form-control image-input" type="file" name="sku[image][]" id="image">
                                <span class="text-danger"></span>
                                <img class="image-preview" src="" alt="Selected Image" style="display: none; margin-top: 10px; max-width: 100%;">
                            </div>
                        </div>
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <label for="sku" class="form-label">SKU</label>
                                <select class="form-select sku-input" name="sku[sku][]">
                                    <option value="">Select</option>
                                    <?php $__currentLoopData = $skus; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $sku): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <option value="<?php echo e($sku->prefix); ?>" data-color="<?php echo e($sku->colorname); ?>"><?php echo e($sku->prefix); ?></option>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </select>
                                <span class="text-danger"></span>
                            </div>
                            <div class="col-md-3">
                                <label for="color" class="form-label">Color</label>
                                <input class="form-control color-input" type="text" name="sku[color][]" id="color" readonly>
                                <span class="text-danger"></span>
                            </div>
                            <div class="col-md-3">
                                <label for="size" class="form-label">Size</label>
                                <input class="form-control" type="text" name="sku[size][]" id="size">
                                <span class="text-danger"></span>
                            </div>
                        </div>
                    </div>
                </div>

                <?php if(!empty(old('sku')['slug']) && count(old('sku')['slug']) > 1): ?>
                    <?php for($i = 1; $i < count(old('sku')['slug']); $i++): ?>
                        <?php if(!empty(old('sku')['slug'][$i]) && !empty(old('sku')['quantity'][$i]) && !empty(old('sku')['sku'][$i]) && !empty(old('sku')['color'][$i])): ?>
                            <div class="row border border-dark p-3 m-3 dynamic-block single-product">
                                <div class="row mb-3">
                                    <div class="col-md-5">
                                        <label for="slug" class="form-label">Slug</label>
                                        <input class="form-control slug" type="text" name="sku[slug][<?php echo e($i); ?>]" id="slug" value="<?php echo e(old('sku')['slug'][$i] ?? ''); ?>">
                                        <span class="text-danger"></span>
                                    </div>
                                    <div class="col-md-2">
                                        <label for="quantity" class="form-label">Opening Stock</label>
                                        <input class="form-control" type="text" name="sku[quantity][<?php echo e($i); ?>]" id="quantity" value="<?php echo e(old('sku')['quantity'][$i] ?? ''); ?>">
                                        <span class="text-danger"></span>
                                    </div>
                                    <div class="col-md-4">
                                        <label for="image" class="form-label">Image</label>
                                        <input class="form-control image-input" type="file" name="sku[image][<?php echo e($i); ?>]" id="image">
                                        <span class="text-danger"></span>
                                        <img class="image-preview" src="" alt="Selected Image" style="display: none; margin-top: 10px; max-width: 100%;">
                                    </div>
                                </div>
                                <div class="row mb-3">
                                    <div class="col-md-4">
                                        <label for="sku" class="form-label">SKU</label>
                                        <select class="form-select sku-input" name="sku[sku][]">
                                            <option value="">Select</option>
                                            <?php $__currentLoopData = $skus; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $sku): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <option value="<?php echo e($sku->prefix); ?>" data-color="<?php echo e($sku->colorname); ?>" <?php echo e(old('sku')['sku'][$i] == $sku->prefix ? 'selected' : ''); ?>>
                                                    <?php echo e($sku->prefix); ?>

                                                </option>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                        </select>
                                        <span class="text-danger"></span>
                                    </div>
                                    <div class="col-md-3">
                                        <label for="color" class="form-label">Color</label>
                                        <input class="form-control color-input" type="text" name="sku[color][]" id="color" value="<?php echo e(old('sku')['color'][$i] ?? ''); ?>" readonly>
                                        <span class="text-danger"></span>
                                    </div>
                                </div>
                                <div class="row mb-3">
                                    <div class="col-md-12 d-flex justify-content-end">
                                        <button type="button" class="btn btn-danger remove-block">Remove Block</button>
                                    </div>
                                </div>
                            </div>
                        <?php endif; ?>
                    <?php endfor; ?>
                <?php endif; ?>
                <div class="row d-flex justify-content-end mb-5">
                    <div class="col-md-12 d-flex justify-content-center">
                        <button type="submit" class="btn btn-primary">Submit</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <?php $__env->startSection('script'); ?>
        <script>
            // Add Block
            document.getElementById('add-block').addEventListener('click', function() {
                var newBlock = document.createElement('div');
                newBlock.classList.add('row', 'border', 'border-dark', 'p-3', 'm-3', 'dynamic-block', 'single-product');
                newBlock.innerHTML = `
                    <div class="row mb-3">
                        <div class="col-md-5">
                            <label for="slug" class="form-label">Slug</label>
                            <input class="form-control slug" type="text" name="sku[slug][]" id="slug">
                            <span class="text-danger"></span>
                        </div>
                        <div class="col-md-2">
                            <label for="quantity" class="form-label">Opening Stock</label>
                            <input class="form-control" type="text" name="sku[quantity][]" id="quantity">
                            <span class="text-danger"></span>
                        </div>
                        <div class="col-md-5">
                            <label for="image" class="form-label">Image</label>
                            <input class="form-control image-input" type="file" name="sku[image][]" id="image">
                            <span class="text-danger"></span>
                            <img class="image-preview" src="" alt="Selected Image" style="display: none; margin-top: 10px; max-width: 100%;">
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-md-4">
                            <label for="sku" class="form-label">SKU</label>
                            <select class="form-select sku-input" name="sku[sku][]">
                                <option value="">Select</option>
                                <?php $__currentLoopData = $skus; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $sku): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($sku->prefix); ?>" data-color="<?php echo e($sku->colorname); ?>"><?php echo e($sku->prefix); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                            <span class="text-danger"></span>
                        </div>
                        <div class="col-md-3">
                            <label for="color" class="form-label">Color</label>
                            <input class="form-control color-input" type="text" name="sku[color][]" id="color" readonly>
                            <span class="text-danger"></span>
                        </div>
                        <div class="col-md-3">
                            <label for="size" class="form-label">Size</label>
                            <input class="form-control" type="text" name="sku[size][]" id="size">
                            <span class="text-danger"></span>
                        </div>
                    </div>
                    <div class="row mb-3">
                        <div class="col-md-12 d-flex justify-content-end">
                            <button type="button" class="btn btn-danger remove-block">Remove Block</button>
                        </div>
                    </div>
                `;
                document.getElementById('additional-blocks').appendChild(newBlock);
            });

            // Remove Block
            document.addEventListener('click', function(e) {
                if (e.target.classList.contains('remove-block')) {
                    e.target.closest('.dynamic-block').remove();
                }
            });

            // Convert Spaces to Dashes
            document.addEventListener('input', function(e) {
                if (e.target.classList.contains('slug')) {
                    var slug = e.target.value;
                    slug = slug.replace(/\s+/g, '-').toLowerCase();
                    e.target.value = slug;
                }
            });

            // Handle Image Preview
            document.addEventListener('change', function(e) {
                if (e.target.classList.contains('image-input')) {
                    var input = e.target;
                    var preview = input.closest('.single-product').querySelector('.image-preview');
                    var file = input.files[0];
                    if (file) {
                        var reader = new FileReader();
                        reader.onload = function(e) {
                            preview.src = e.target.result;
                            preview.style.display = 'block';
                        };
                        reader.readAsDataURL(file);
                    } else {
                        preview.src = '';
                        preview.style.display = 'none';
                    }
                }
            });

            // Update Color Based on SKU Selection
            document.addEventListener('change', function(e) {
                if (e.target.classList.contains('sku-input')) {
                    var selectedOption = e.target.options[e.target.selectedIndex];
                    var colorInput = e.target.closest('.single-product').querySelector('.color-input');
                    colorInput.value = selectedOption.getAttribute('data-color');
                }
            });
        </script>
    <?php $__env->stopSection(); ?>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app2', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH F:\flipcode\laravel\MSOnline(UmangBhai)\resources\views/product/create.blade.php ENDPATH**/ ?>