Updates page fixes..
This commit is contained in:
		
							
								
								
									
										145
									
								
								resources/assets/js/views/install/update.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										145
									
								
								resources/assets/js/views/install/update.js
									
									
									
									
										vendored
									
									
										Normal file
									
								
							@@ -0,0 +1,145 @@
 | 
			
		||||
/**
 | 
			
		||||
 * First we will load all of this project's JavaScript dependencies which
 | 
			
		||||
 * includes Vue and other libraries. It is a great starting point when
 | 
			
		||||
 * building robust, powerful web applications using Vue and Laravel.
 | 
			
		||||
 */
 | 
			
		||||
 | 
			
		||||
require('../../bootstrap');
 | 
			
		||||
 | 
			
		||||
import Vue from 'vue';
 | 
			
		||||
 | 
			
		||||
import Global from './../../mixins/global';
 | 
			
		||||
 | 
			
		||||
import {Progress} from 'element-ui';
 | 
			
		||||
 | 
			
		||||
Vue.use(Progress);
 | 
			
		||||
 | 
			
		||||
const app = new Vue({
 | 
			
		||||
    el: '#app',
 | 
			
		||||
 | 
			
		||||
    mixins: [
 | 
			
		||||
        Global
 | 
			
		||||
    ],
 | 
			
		||||
 | 
			
		||||
    components: {
 | 
			
		||||
        [Progress.name]: Progress,
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    data: function () {
 | 
			
		||||
        return {
 | 
			
		||||
            changelog: {
 | 
			
		||||
                show:false,
 | 
			
		||||
                html: null
 | 
			
		||||
            },
 | 
			
		||||
            update: {
 | 
			
		||||
                steps: [],
 | 
			
		||||
                steps_total: 0,
 | 
			
		||||
                total: 0,
 | 
			
		||||
                path: '',
 | 
			
		||||
                status: 'success',
 | 
			
		||||
                html: ''
 | 
			
		||||
            },
 | 
			
		||||
            page: 'check',
 | 
			
		||||
            name: null,
 | 
			
		||||
            version: null
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    mounted() {
 | 
			
		||||
        if (document.getElementById('page') != null && document.getElementById('page').value == 'update') {
 | 
			
		||||
            this.steps();
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    methods: {
 | 
			
		||||
        onChangelog() {
 | 
			
		||||
            axios.get(url + '/install/updates/changelog')
 | 
			
		||||
            .then(response => {
 | 
			
		||||
                this.changelog.show = true;
 | 
			
		||||
                this.changelog.html = response.data;
 | 
			
		||||
            })
 | 
			
		||||
            .catch(e => {
 | 
			
		||||
                this.errors.push(e)
 | 
			
		||||
            })
 | 
			
		||||
            .finally(function () {
 | 
			
		||||
                // always executed
 | 
			
		||||
            });
 | 
			
		||||
        },
 | 
			
		||||
 | 
			
		||||
        steps() {
 | 
			
		||||
            let name = document.getElementById('name').value;
 | 
			
		||||
 | 
			
		||||
            axios.post(url + '/install/updates/steps', {
 | 
			
		||||
                name: name,
 | 
			
		||||
                version: version
 | 
			
		||||
            })
 | 
			
		||||
            .then(response => {
 | 
			
		||||
                if (response.data.error) {
 | 
			
		||||
                    this.update.status = 'exception';
 | 
			
		||||
                    this.update.html = '<div class="text-danger">' + response.data.message + '</div>';
 | 
			
		||||
                }
 | 
			
		||||
 | 
			
		||||
                // Set steps
 | 
			
		||||
                if (response.data.data) {
 | 
			
		||||
                    this.update.steps = response.data.data;
 | 
			
		||||
                    this.update.steps_total = this.update.steps.length;
 | 
			
		||||
 | 
			
		||||
                    this.next();
 | 
			
		||||
                }
 | 
			
		||||
            })
 | 
			
		||||
            .catch(error => {
 | 
			
		||||
            });
 | 
			
		||||
        },
 | 
			
		||||
 | 
			
		||||
        next() {
 | 
			
		||||
            let data = this.update.steps.shift();
 | 
			
		||||
 | 
			
		||||
            let name = document.getElementById('name').value;
 | 
			
		||||
            let alias = document.getElementById('alias').value;
 | 
			
		||||
            let version = document.getElementById('version').value;
 | 
			
		||||
            let installed = document.getElementById('installed').value;
 | 
			
		||||
 | 
			
		||||
            if (data) {
 | 
			
		||||
                this.update.total = (100 - ((this.update.steps.length / this.update.steps_total) * 100));
 | 
			
		||||
 | 
			
		||||
                this.update.html = '<span class="text-default"><i class="fa fa-spinner fa-spin update-spin"></i> ' + data['text'] + '</span> </br>';
 | 
			
		||||
 | 
			
		||||
                axios.post(data.url, {
 | 
			
		||||
                    name: name,
 | 
			
		||||
                    alias: alias,
 | 
			
		||||
                    version: version,
 | 
			
		||||
                    installed: installed,
 | 
			
		||||
                    path: this.update.path,
 | 
			
		||||
                })
 | 
			
		||||
                .then(response => {
 | 
			
		||||
                    if (response.data.error) {
 | 
			
		||||
                        this.update.status = 'exception';
 | 
			
		||||
                        this.update.html = '<div class="text-danger"><i class="fa fa-times update-error"></i> ' + response.data.message + '</div>';
 | 
			
		||||
                    }
 | 
			
		||||
 | 
			
		||||
                    if (response.data.success) {
 | 
			
		||||
                        this.update.status = 'success';
 | 
			
		||||
                    }
 | 
			
		||||
 | 
			
		||||
                    if (response.data.data.path) {
 | 
			
		||||
                        this.update.path = response.data.data.path;
 | 
			
		||||
                    }
 | 
			
		||||
 | 
			
		||||
                    if (!response.data.error && !response.data.redirect) {
 | 
			
		||||
                        let self = this;
 | 
			
		||||
 | 
			
		||||
                        setTimeout(function() {
 | 
			
		||||
                            self.next();
 | 
			
		||||
                        }, 800);
 | 
			
		||||
                    }
 | 
			
		||||
 | 
			
		||||
                    if (response.data.redirect) {
 | 
			
		||||
                        window.location = response.data.redirect;
 | 
			
		||||
                    }
 | 
			
		||||
                })
 | 
			
		||||
                .catch(error => {
 | 
			
		||||
                });
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
});
 | 
			
		||||
@@ -3,7 +3,11 @@
 | 
			
		||||
@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>  {{ trans('updates.check') }}</a></span>
 | 
			
		||||
    <span class="new-button">
 | 
			
		||||
        <a href="{{ route('updates.check') }}" class="btn btn-warning btn-sm">
 | 
			
		||||
            <span class="fa fa-history"></span>  {{ trans('updates.check') }}
 | 
			
		||||
        </a>
 | 
			
		||||
    </span>
 | 
			
		||||
@endsection
 | 
			
		||||
 | 
			
		||||
@section('content')
 | 
			
		||||
@@ -14,100 +18,20 @@
 | 
			
		||||
 | 
			
		||||
        <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>
 | 
			
		||||
                <el-progress :text-inside="true" :stroke-width="24" :percentage="update.total" :status="update.status"></el-progress>
 | 
			
		||||
 | 
			
		||||
                <div id="progress-text"></div>
 | 
			
		||||
                <div id="progress-text" v-html="update.html"></div>
 | 
			
		||||
 | 
			
		||||
                {{ Form::hidden('page', 'update', ['id' => 'page']) }}
 | 
			
		||||
                {{ Form::hidden('name', $name, ['id' => 'name']) }}
 | 
			
		||||
                {{ Form::hidden('version', $version, ['id' => 'version']) }}
 | 
			
		||||
                {{ Form::hidden('alias', $alias, ['id' => 'alias']) }}
 | 
			
		||||
                {{ Form::hidden('installed', $installed, ['id' => 'installed']) }}
 | 
			
		||||
            </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>
 | 
			
		||||
@push('scripts_start')
 | 
			
		||||
    <script src="{{ asset('public/js/install/update.js?v=' . version('short')) }}"></script>
 | 
			
		||||
@endpush
 | 
			
		||||
 
 | 
			
		||||
@@ -23,8 +23,13 @@
 | 
			
		||||
                        {{ trans('updates.new_core') }}
 | 
			
		||||
                    </div>
 | 
			
		||||
                    <div class="col-sm-10 col-md-6 text-right">
 | 
			
		||||
                        <a href="{{ url('install/updates/update', ['alias' => 'core', 'version' => $core]) }}" data-toggle="tooltip" title="{{ trans('updates.update', ['version' => $core]) }}" class="btn btn-info btn-sm header-button-top o-y"><i class="fa fa-refresh"></i>  {{ trans('updates.update', ['version' => $core]) }}</a>
 | 
			
		||||
                        <a href="{{ route('updates.changelog') }}" data-toggle="tooltip" title="{{ trans('updates.changelog') }}" class="btn btn-white btn-sm header-button-bottom"><i class="fa fa-exchange-alt"></i>  {{ trans('updates.changelog') }}</a>
 | 
			
		||||
                        <a href="{{ url('install/updates/update', ['alias' => 'core', 'version' => $core]) }}"
 | 
			
		||||
                            class="btn btn-info btn-sm header-button-top o-y">
 | 
			
		||||
                            <i class="fa fa-refresh"></i>  {{ trans('updates.update', ['version' => $core]) }}
 | 
			
		||||
                        </a>
 | 
			
		||||
                        <button type="button" @click="onChangelog" class="btn btn-white btn-sm header-button-bottom">
 | 
			
		||||
                            <i class="fa fa-exchange-alt"></i>  {{ trans('updates.changelog') }}
 | 
			
		||||
                        </button>
 | 
			
		||||
                    </div>
 | 
			
		||||
                @endif
 | 
			
		||||
            </div>
 | 
			
		||||
@@ -56,7 +61,9 @@
 | 
			
		||||
                                <td class="col-sm-3 col-md-2 hidden-sm">{{ $module->installed }}</td>
 | 
			
		||||
                                <td class="col-xs-4 col-md-2 col-sm-3">{{ $module->latest }}</td>
 | 
			
		||||
                                <td class="col-xs-4 col-sm-2 col-md-2 text-center">
 | 
			
		||||
                                    <a href="{{ url('install/updates/update/' . $module->alias . '/' . $module->latest) }}" class="btn btn-warning btn-sm"><i class="fa fa-refresh" aria-hidden="true"></i> {{ trans_choice('general.updates', 1) }}</a>
 | 
			
		||||
                                    <a href="{{ url('install/updates/update/' . $module->alias . '/' . $module->latest) }}" class="btn btn-warning btn-sm">
 | 
			
		||||
                                        <i class="fa fa-refresh" aria-hidden="true"></i> {{ trans_choice('general.updates', 1) }}
 | 
			
		||||
                                    </a>
 | 
			
		||||
                                </td>
 | 
			
		||||
                            </tr>
 | 
			
		||||
                        @endforeach
 | 
			
		||||
@@ -73,4 +80,18 @@
 | 
			
		||||
            </table>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <akaunting-modal v-if="changelog.show"
 | 
			
		||||
        :show="changelog.show"
 | 
			
		||||
        :title="'{{ trans('updates.changelog') }}'"
 | 
			
		||||
        @cancel="changelog.show = false"
 | 
			
		||||
        :message="changelog.html">
 | 
			
		||||
        <template #card-footer>
 | 
			
		||||
            <span></span>
 | 
			
		||||
        </template>
 | 
			
		||||
    </akaunting-modal>
 | 
			
		||||
@endsection
 | 
			
		||||
 | 
			
		||||
@push('scripts_start')
 | 
			
		||||
    <script src="{{ asset('public/js/install/update.js?v=' . version('short')) }}"></script>
 | 
			
		||||
@endpush
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user