shihaam/akaunting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wizard steps updated to vue

Browse Source
This commit is contained in:
batuhanbas 2020-01-15 19:48:53 +03:00
parent 9405cf4aa2
commit 4eaf60603b
13 changed files with 178 additions and 243 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
public/css/element.css vendored
View File

@ -10493,13 +10493,13 @@
}
.el-step__head.is-process {
color: #303133;
border-color: #303133
color: #3c3f72;
border-color: #3c3f72
}
.el-step__head.is-wait {
color: #C0C4CC;
border-color: #C0C4CC
color: #e5e5e5;
border-color: #e5e5e5
}
.el-step__head.is-success {
@ -10529,19 +10529,37 @@
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 24px;
height: 24px;
font-size: 14px;
width: 80px;
height: 80px;
font-size: 40px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: #FFF;
background: #3c3f72;
-webkit-transition: .15s ease-out;
transition: .15s ease-out
}
.el-step__head.is-wait .el-step__icon {
background: #e5e5e5 ;
}
.el-step__head.is-success .el-step__icon {
background: #6da252;
}
.el-step__head.is-success .el-step__icon:hover {
cursor: pointer;
border: 5px solid #3c3f72;
background: #3c3f72;
}
.el-step__head.is-wait .el-step__icon-inner {
color: #999999;
}
.el-step__icon.is-text {
border-radius: 50%;
border: 2px solid;
border: 5px solid;
border-color: inherit
}
@ -10555,7 +10573,7 @@
text-align: center;
font-weight: 700;
line-height: 1;
color: inherit
color: #ffffff;
}
.el-button,.el-checkbox,.el-image-viewer__btn {
@ -10577,12 +10595,12 @@
.el-step__line {
position: absolute;
border-color: inherit;
background-color: #C0C4CC
background-color: #e5e5e5;
}
.el-step__line-inner {
display: block;
border-width: 1px;
border-width: 2px !important;
border-style: solid;
border-color: inherit;
-webkit-transition: .15s ease-out;
@ -10605,7 +10623,7 @@
.el-step__title.is-process {
font-weight: 700;
color: #303133
color: #3c3f72;
}
.el-step__title.is-wait {
@ -10657,8 +10675,8 @@
}
.el-step.is-horizontal .el-step__line {
height: 2px;
top: 11px;
height: 5px;
top: 40px;
left: 0;
right: 0
}

18
resources/assets/js/views/wizard/company.js vendored
View File

@ -14,8 +14,10 @@ import Global from './../../mixins/global';
import Form from './../../plugins/form';
import {Step, Steps} from 'element-ui';
// plugin setup
Vue.use(DashboardPlugin);
Vue.use(DashboardPlugin, Step, Steps);
const app = new Vue({
el: '#app',
@ -24,9 +26,21 @@ const app = new Vue({
Global
],
components: {
[Step.name]: Step,
[Steps.name]: Steps,
},
data: function () {
return {
form: new Form('company')
form: new Form('company'),
active: 0
}
},
methods: {
next() {
if (this.active++ > 1) this.active = 0;
}
}
});

16
resources/assets/js/views/wizard/currencies.js vendored
View File

@ -15,8 +15,10 @@ import Global from '../../mixins/global';
import Form from '../../plugins/form';
import BulkAction from './../../plugins/bulk-action';
import {Step, Steps} from 'element-ui';
// plugin setup
Vue.use(DashboardPlugin);
Vue.use(DashboardPlugin, Step, Steps);
const app = new Vue({
el: '#app',
@ -25,9 +27,15 @@ const app = new Vue({
Global
],
components: {
[Step.name]: Step,
[Steps.name]: Steps,
},
data: function () {
return {
form: new Form('currency'),
active: 1,
bulk_action: new BulkAction(url + '/settings/currencies'),
show: false,
currency: {
@ -36,7 +44,7 @@ const app = new Vue({
rate: '1',
enabled: 1
},
submit_function: ''
submit_function: '',
}
},
@ -97,6 +105,10 @@ const app = new Vue({
})
.catch(error => {
});
},
next() {
if (this.active++ > 1) this.active = 0;
}
}
});

43
resources/assets/js/views/wizard/finish.js vendored Normal file
View File

@ -0,0 +1,43 @@
/**
* 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 DashboardPlugin from './../../plugins/dashboard-plugin';
import Global from './../../mixins/global';
import {Step, Steps} from 'element-ui';
// plugin setup
Vue.use(DashboardPlugin, Step, Steps);
const app = new Vue({
el: '#app',
mixins: [
Global
],
components: {
[Step.name]: Step,
[Steps.name]: Steps,
},
data: function () {
return {
active: 3
}
},
methods: {
next() {
if (this.active++ > 1) this.active = 0;
}
}
});

14
resources/assets/js/views/wizard/taxes.js vendored
View File

@ -15,8 +15,10 @@ import Global from '../../mixins/global';
import Form from '../../plugins/form';
import BulkAction from './../../plugins/bulk-action';
import {Step, Steps} from 'element-ui';
// plugin setup
Vue.use(DashboardPlugin);
Vue.use(DashboardPlugin, Step, Steps);
const app = new Vue({
el: '#app',
@ -25,9 +27,15 @@ const app = new Vue({
Global
],
components: {
[Step.name]: Step,
[Steps.name]: Steps,
},
data: function () {
return {
form: new Form('tax'),
active: 2,
bulk_action: new BulkAction(url + '/settings/taxes'),
show: false,
tax: {
@ -69,6 +77,10 @@ const app = new Vue({
});
this.show = true;
},
next() {
if (this.active++ > 1) this.active = 0;
}
}
});

10
resources/views/partials/wizard/steps.blade.php Normal file
View File

@ -0,0 +1,10 @@
@stack('steps_start')
<div class="card-header wizard-header p-3">
<el-steps :active="active" finish-status="success" align-center>
<el-step href="{{ url('wizard/companies') }}" title="Company"></el-step>
<el-step href="{{ url('wizard/currencies') }}" title="Currency"></el-step>
<el-step href="{{ url('wizard/taxes') }}" title="Taxes"></el-step>
<el-step href="{{ url('wizard/finish') }}" title="Finish"></el-step>
</el-steps>
</div>
@stack('steps_end')

45
resources/views/wizard/companies/edit.blade.php
View File

@ -17,49 +17,8 @@
]) !!}
<div id="wizard-loading"></div>
<div class="card-header wizard-header pb-0">
<div class="container-fluid">
<div class="row">
<hr class="wizard-line">
@include('partials.wizard.steps')
<div class="col-md-3">
<div class="text-center">
<button href="#step-1" type="button" class="btn btn-default btn-lg wizard-steps rounded-circle">
<span class="btn-inner--icon wizard-steps-inner">1</span>
</button>
<p class="mt-2 after-step-text">{{ trans_choice('general.companies', 1) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">2</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.currencies', 2) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">3</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.taxes', 2) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">4</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.finish', 1) }}</p>
</div>
</div>
</div>
</div>
</div>
<div class="card-body">
<div id="wizard-loading"></div>
@ -109,7 +68,7 @@
'<div v-if="form.loading" class="aka-loader-frame"><div class="aka-loader"></div></div> <span v-if="!form.loading" class="btn-inner--icon"><i class="fas fa-save"></i></span>' . '<span v-if="!form.loading" class="btn-inner--text"> ' . trans('general.save') . '</span>',
[':disabled' => 'form.loading', 'type' => 'submit', 'class' => 'btn btn-icon btn-success button-submit header-button-top', 'data-loading-text' => trans('general.loading')]) !!}
<a href="{{ url('wizard/currencies') }}" id="wizard-skip" class="btn btn-white header-button-top">
<a href="{{ url('wizard/currencies') }}" id="wizard-skip" class="btn btn-white header-button-top" @click="next">
<span class="fa fa-share"></span> &nbsp;{{ trans('general.skip') }}
</a>
</div>

48
resources/views/wizard/currencies/index.blade.php
View File

@ -4,51 +4,7 @@
@section('content')
<div class="card">
<div class="card-header pb-0">
<div class="container-fluid">
<div class="row">
<hr class="wizard-line">
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/companies') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.companies', 1) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button href="#step-2" type="button" class="btn btn-default btn-lg wizard-steps rounded-circle">
<span class="btn-inner--icon wizard-steps-inner">2</span>
</button>
<p class="mt-2 after-step-text">{{ trans_choice('general.currencies', 2) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">3</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.taxes', 2) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">4</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.finish', 1) }}</p>
</div>
</div>
</div>
</div>
</div>
@include('partials.wizard.steps')
<div class="card-body border-bottom-0">
<div class="row">
@ -167,7 +123,7 @@
<div class="card-footer">
<div class="row">
<div class="col-12 text-right">
<a href="{{ url('wizard/taxes') }}" id="wizard-skip" class="btn btn-white header-button-top">
<a href="{{ url('wizard/taxes') }}" id="wizard-skip" class="btn btn-white header-button-top" @click="next">
<span class="fa fa-share"></span> &nbsp;{{ trans('general.skip') }}
</a>
</div>

56
resources/views/wizard/finish/index.blade.php
View File

@ -4,55 +4,7 @@
@section('content')
<div class="card">
<div class="card-header pb-0">
<div class="container-fluid">
<div class="row">
<hr class="wizard-line">
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/companies') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.companies', 1) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/currencies') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.currencies', 2) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/taxes') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.taxes', 2) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button href="#step-4" type="button" class="btn btn-default btn-lg wizard-steps rounded-circle">
<span class="btn-inner--icon wizard-steps-inner">4</span>
</button>
<p class="mt-2 after-step-text">{{ trans_choice('general.finish', 1) }}</p>
</div>
</div>
</div>
</div>
</div>
@include('partials.wizard.steps')
<div class="card-body bg-default">
<div class="row">
@ -98,7 +50,7 @@
<div class="card-footer">
<div class="row">
<div class="col-md-12 text-right">
<a href="{{ url('/') }}" class="btn btn-lg btn-success header-button-top">
<a href="{{ url('/') }}" class="btn btn-lg btn-success header-button-top" @click="next">
<span class="fa fa-tachometer-alt"></span> &nbsp;{{ trans('general.go_to', ['name' => trans_choice('general.dashboards', 1)]) }}
</a>
</div>
@ -106,3 +58,7 @@
</div>
</div>
@endsection
@push('scripts_start')
<script src="{{ asset('public/js/wizard/finish.js?v=' . version('short')) }}"></script>
@endpush

50
resources/views/wizard/taxes/index.blade.php
View File

@ -4,53 +4,7 @@
@section('content')
<div class="card">
<div class="card-header pb-0">
<div class="container-fluid">
<div class="row">
<hr class="wizard-line">
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/companies') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.companies', 1) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<a href="{{ url('wizard/currencies') }}">
<button type="button" class="btn btn-secondary btn-lg wizard-steps wizard-steps-color-active rounded-circle">
<span class="btn-inner--icon wizard-steps-inner"><i class="fa fa-check"></i></span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.currencies', 2) }}</p>
</a>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button href="#step-3" type="button" class="btn btn-default btn-lg wizard-steps rounded-circle">
<span class="btn-inner--icon wizard-steps-inner">3</span>
</button>
<p class="mt-2 after-step-text">{{ trans_choice('general.taxes', 2) }}</p>
</div>
</div>
<div class="col-md-3">
<div class="text-center">
<button type="button" class="btn btn-secondary btn-lg wizard-steps rounded-circle steps">
<span class="btn-inner--icon wizard-steps-inner wizard-steps-color">4</span>
</button>
<p class="mt-2 text-muted step-text">{{ trans_choice('general.finish', 1) }}</p>
</div>
</div>
</div>
</div>
</div>
@include('partials.wizard.steps')
<div class="card-body border-bottom-0">
<div class="row">
@ -152,7 +106,7 @@
<div class="card-footer">
<div class="row">
<div class="col-12 text-right">
<a href="{{ url('wizard/finish') }}" id="wizard-skip" class="btn btn-white header-button-top">
<a href="{{ url('wizard/finish') }}" id="wizard-skip" class="btn btn-white header-button-top" @click="next">
<span class="fa fa-share"></span> &nbsp;{{ trans('general.skip') }}
</a>
</div>

1
webpack.mix.js vendored
View File

@ -71,5 +71,6 @@ mix
.js('resources/assets/js/views/wizard/company.js', 'public/js/wizard')
.js('resources/assets/js/views/wizard/currencies.js', 'public/js/wizard')
.js('resources/assets/js/views/wizard/taxes.js', 'public/js/wizard')
.js('resources/assets/js/views/wizard/finish.js', 'public/js/wizard')
.sass('resources/assets/sass/argon.scss', 'public/css');