akaunting/resources/views/install/updates/edit.blade.php

@extends('layouts.admin')

@section('title', trans_choice('general.updates', 2))

@section('new_button')
    <span class="new-button"><a href="{{ route('updates.check') }}" class="btn btn-warning btn-sm"><span class="fa fa-history"></span> &nbsp;{{ trans('updates.check') }}</a></span>
@endsection

@section('content')
    <div class="card">
        <div class="card-header">
            <span class="title-filter hidden-xs">{{ $name }}</span>
        </div>

        <div class="card-body">
            <p>
                <div class="progress">
                    <div id="progress-bar" class="progress-bar progress-bar-success w-0" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
                        <span class="sr-only">{{ trans('modules.installation.start', ['module' => $name]) }}</span>
                    </div>
                </div>

                <div id="progress-text"></div>
            </p>
        </div>
    </div>
@endsection

@push('scripts')
    <script type="text/javascript">
        var step = new Array();
        var total = 0;
        var path = '';

        $(document).ready(function() {
            $.ajax({
                url: '{{ route("updates.steps") }}',
                type: 'post',
                dataType: 'json',
                data: {name: '{{ $name }}', version: '{{ $version }}'},
                headers: { 'X-CSRF-TOKEN': '{{ csrf_token() }}' },
                success: function(json) {
                    if (json['errorr']) {
                        $('#progress-bar').addClass('progress-bar-danger');
                        $('#progress-text').html('<div class="text-danger">' + json['error'] + '</div>');
                    }

                    if (json['step']) {
                        step = json['step'];
                        total = step.length;

                        next();
                    }
                }
            });
        });

        function next() {
            data = step.shift();

            if (data) {
                $('#progress-bar').css('width', (100 - (step.length / total) * 100) + '%');

                $.each($('#progress-text .text-default'), function( index, value ) {
                    // Remove Loading font
                    $(this).find('.update-spin').remove();
                    // Remove Check font
                    $(this).find('.update-check').remove();
                    // Add Check font
                    $(this).append(' <i class="fa fa-check update-check text-success"></i>');
                });

                $('#progress-text').append('<span class="text-default"><i class="fa fa-spinner fa-spin update-spin"></i> ' + data['text'] + '</span> </br>');

                setTimeout(function() {
                    $.ajax({
                        url: data.url,
                        type: 'post',
                        dataType: 'json',
                        data: {path: path, alias: '{{ $alias }}', installed: '{{ $installed }}', version: '{{ $version }}'},
                        headers: { 'X-CSRF-TOKEN': '{{ csrf_token() }}' },
                        success: function(json) {
                            if (json['errors']) {
                                $('#progress-bar').addClass('progress-bar-danger');
                                $('#progress-text').append('<div class="text-danger"><i class="fa fa-times update-error"></i> ' + json['errors'] + '</div>');
                            }

                            if (json['success']) {
                                $('#progress-bar').removeClass('progress-bar-danger');
                                $('#progress-bar').addClass('progress-bar-success');
                            }

                            if (json['data']['path']) {
                                path = json['data']['path'];
                            }

                            if (!json['errors'] && !json['redirect']) {
                                next();
                            }

                            if (json['redirect']) {
                                window.location = json['redirect'];
                            }
                        },
                        error: function(xhr, ajaxOptions, thrownError) {
                            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
                        }
                    });
                }, 800);
            }
        }
    </script>
@endpush