One Hat Cyber Team

View File Name : 013c85c2c26ce66927c47553bcd53ef5.php

<style>
    .dropzone{
        min-height: 200px;
    }
    .dropzone .dz-message{
        font-size: 1.3rem;
        height: auto;
    }
    .dropzone .dz-message::before{
        font-size: 50px;
    }
    .dz-default{
        display: none;
    }
    .dz-details{
        height: 100%;
        opacity: 1 !important;
    }
    .thumbnail-image{
        height: 100%;
        width: 100%;
    }
    .tox-tinymce{
        height: 300px !important;
    }
    .dropzone .dz-preview .dz-details{
        top: 10px;
    }
</style>
<form class="form" action="<?php echo e($url); ?>" method="POST">
    <?php echo csrf_field(); ?>
    <input type="hidden" id="image_id" name="image_id" value="<?php echo e(@$item['image_id']); ?>">
    <input type="hidden" name="id" value="<?php echo e(@$item['id']); ?>">
    <div class="modal-header">
        <div class="col row justify-content-center align-items-center">
            <h4 class="modal-title" id="modal_title"><i data-feather="<?php echo e($icon); ?>"></i> Slide</h4>
        </div>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
    </div>
    <div class="modal-body">
        <div class="form-body mx-2">
            <div class="row">
                <div class="col-12 mt-2 mb-2" style="margin-left: 0.4rem; margin-top: 1%;">
                    <div class="d-flex flex-column">
                        <label for="status">Status</label>
                        <select id="status" name="status" class="form-control">
                            <option value="Active" <?php echo e(@$item['status'] == 'Active'?'selected':''); ?>>Active</option>
                            <option value="Inactive" <?php echo e(@$item['status'] == 'Inactive'?'selected':''); ?>>Inactive</option>
                        </select>
                    </div>
                </div>
                <div class="col-12 dropzone dropzone-area dz-clickable mt-1" id="dpz-image-upload" style="margin-left: 1rem; width: 97%;">
                    <?php if(@$item['image']): ?>
                        <div class="dz-preview dz-processing dz-image-preview dz-success" id="image<?php echo e($item['image']['id']); ?>">
                            <div class="dz-details">
                                <img class="thumbnail-image" data-dz-thumbnail="" alt="<?php echo e(@$item['image']['original_name']); ?>" src="<?php echo e((isset($item['image_id']))? asset('/images/'.$item->image->filename) : ''); ?>">
                            </div>
                            <a class="dz-remove" href="javascript:undefined;" data-dz-remove="" onclick="deleteImage(<?php echo e($item['image']['id']); ?>)" >Remove File</a>
                        </div>
                    <?php else: ?>
                        <div class="dz-message">Drop Files to Upload</div>
                    <?php endif; ?>
                    <input type="hidden" name="image" id="image" value="">
                </div>

            </div>

        </div>
    </div>
    </div>
    <div class="modal-footer">
        <button type="submit" class="btn btn-primary">Save <i class="fa fa-spinner fa-spin d-none"></i></button>
    </div>
</form>

<script>
    //Dropzone.autoDiscover = false;
    $("div#dpz-image-upload").dropzone({
        paramName: "slider_image",
        url: '/sliders/images/upload',
        uploadMultiple: true,
        maxFilesize: 10,
        addRemoveLinks: true,
        acceptedFiles: 'image/*',
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        removedfile: function(file) {
            $.ajax({
                url: "/sliders/images/remove",
                type: 'POST',
                data: {
                    'id':file._removeLink.getAttribute('data-pk'),
                },
                error: function (response) {
                    response = $.parseJSON(response.responseText);
                    $.each(response, function (key, value) {
                        if ($.isPlainObject(value)) {
                            $.each(value, function (key, value) {
                                toastr.error(value, 'Error');
                            });
                        }
                    });
                },
                success: function (response) {
                    if (response.message) {
                        toastr.success(response.message, 'Success');
                    }
                }
            });
            var _ref;
            return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0;
        },
        init: function () {
            this.on("maxfilesexceeded", function (file) {
                this.removeAllFiles();
                this.addFile(file);
            });
            this.on("success",function (file,response) {
                if (response.message){
                    document.getElementById('image_id').value = response.file.id;
                    document.getElementById('image').value = response.file.id;
                    toastr.success(response.message);
                }

                file._removeLink.setAttribute('data-pk',response.file.id);

            });
            this.on("error",function (file,response) {
                $.each(response, function (key, value) {
                    if ($.isPlainObject(value)) {
                        $.each(value, function (key, value) {
                            toastr.error(value, 'Error');
                        });
                    }
                });
            })
        }
    });

    function deleteImage(id){
        $.ajax({
            url: "/sliders/images/remove",
            type: 'POST',
            data: {
                'id':id,
            },
            error: function (response) {
                response = $.parseJSON(response.responseText);
                $.each(response, function (key, value) {
                    if ($.isPlainObject(value)) {
                        $.each(value, function (key, value) {
                            toastr.error(value, 'Error');
                        });
                    }
                });
            },
            success: function (response) {
                document.getElementById("image"+id).style.display = "none";
                if (response.message) {
                    toastr.success(response.message, 'Success');
                }
            }
        });
    }
</script>

<?php /**PATH /home/empartsotifcrew/public_html/resources/views/dashboard/sliders/modal.blade.php ENDPATH**/ ?>