Нет, вот пример компонента: <script> import {mapActions, mapState}

Question

Нет, вот пример компонента: <script> import {mapActions, mapState}

from 'vuex';

const statusBgs = {
'success': 'bg-green',
'error': 'bg-red',
'recognition': 'bg-aqua',
'': 'bg-yellow'
};
const statusIcons = {
'success': 'fa-check',
'error': 'fa-times',
'recognition': 'fa-cog fa-spin',
'': 'fa-spinner fa-spin'
};
const statusWords = {
'success': 'Обработка завершена',
'error': 'Завершилось с ошибкой',
'recognition': 'Идет обработка',
'uploaded': 'Ждет обработки',
'': 'Загрузка данных'
};

export default {
name: "Status",
data: function() {
return {
isRestarted: false
}
},
computed: {
bgClass: function () {
const status = this.image ? this.image.status : null;
return status && statusBgs[status] !== undefined ? statusBgs[status] : statusBgs[''];
},
iconClass: function () {
const status = this.image ? this.image.status : null;
return status && statusIcons[status] !== undefined ? statusIcons[status] : statusIcons[''];
},
word: function () {
const status = this.image ? this.image.status : null;
return status && statusWords[status] !== undefined ? statusWords[status] : statusWords[''];
},
...mapState({image: state => state.image})
},
methods: {
makeRestart() {
this.isRestarted = true;
this.restart();
setTimeout(() => this.isRestarted = false, 5000);
},
...mapActions(['restart'])
}
}
</script>
А в store.js:
```
Vue.use(Vuex);

const processingStatusses = ['uploaded', 'recognition'];

const store = new Vuex.Store({
state: {
id: null,
image: null,
...: null
},
mutations: {
init(state, id) {
state.id = id;
},
image(state, data) {
state.image = data;
},
....(state, data) {
state.... = data;
}
},
actions: {
async init({commit, dispatch}, id) {
commit('init', id);
await dispatch('load....');
await dispatch('load');
},
async load({state, commit, dispatch}) {
try {
const res = await request.get(/images/show/${state.id});
commit('image', res.data);
if (processingStatusses.indexOf(res.data.status) !== -1)
setTimeout(() => dispatch('load'), 1000);
}
catch (error) {
dispatch('error', {message: 'Произошла сетевая ошибка, попробуйте еще раз', error});
}
},
async restart({state, dispatch}) {
await request.post(/images/restart/${state.id}/);
dispatch('load');
},