<?php $__env->startSection('title','Admin | Slider Images'); ?>
<?php $__env->startSection('content'); ?>
<div class="loader"></div>
<div id="app">
    <div class="main-wrapper main-wrapper-1">
        <?php echo $__env->make('layouts.navbar', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?>
        <div class="main-content">
            <section class="section">
                <div class="section-body">
                    <?php if(session('success')): ?>
                    <div class="alert alert-success">
                        <?php echo e(session('success')); ?>

                    </div>
                    <?php endif; ?>
                    <div class="row">
                        <div class="col-12 col-md-12 col-lg-12">
                            <div class="card">
                                <div class="card-header">
                                    <h4>Slider Image </h4>
                                </div>
                                <form action="<?php echo e(route('slider-images.store')); ?>" method="POST" enctype="multipart/form-data">
                                    <?php echo csrf_field(); ?>
                                    <div class="card-body">
                                        <div class="row">
                                            <div class="form-group col-6">
                                                <label>Slider Images</label>
                                                <div class="input-group">
                                                    <input type="file" name="sliderImage" id="sliderImage" class="form-control" accept="image/*">
                                                </div>
                                                <?php $__errorArgs = ['sliderImage'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                                <div class="alert alert-danger mt-4">
                                                    <?php echo e($message); ?>

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

                                            <div class="col-4">
                                                <div id="image-preview"></div>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <button type="submit" class="btn btn-outline-primary">Add</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <h3>Slider Images</h3>
            <div class="row mb-5">
                <div class="col-12">
                    <div class="d-flex">
                        <?php $__empty_1 = true; $__currentLoopData = $sliderImages; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $img): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                        <div class="m-3">
                            <img src="<?php echo e($img->url); ?>" alt="" height="200" width="200"><br>
                            <a class="btn btn-danger mt-2" href="<?php echo e(route('slider-images.destroy', ['id' => $img->id])); ?>">DELETE</a>
                        </div>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                        <p class="mt-2">No Images yet</p>
                        <?php endif; ?>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
<script>
    const input = document.getElementById('sliderImage');
    const preview = document.getElementById('image-preview');

    input.addEventListener('change', () => {
        preview.innerHTML = '';

        for (const file of input.files) {
            const img = document.createElement('img');
            img.src = URL.createObjectURL(file);
            img.height = 200
            img.width = 200
            preview.appendChild(img);
        }
    });
</script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/shyambabamatka/public_html/alpha786.com/resources/views/dashboard/slider-images/index.blade.php ENDPATH**/ ?>