Vuex вынесение в геттеры

168
06 декабря 2018, 07:10

Всем привет,не получается вынести в геттеры небольшой функционал,подскажите как правильно это сделать Вот такая функция в компоненте

 methods: {
    fillDamages(num) {
      for(let ind in this.info.components) {
        if(this.info.components[ind].id == num) {
          this.info.components[ind].active = true;
          this.selected = this.info.components[ind];
          this.current = ind;
        } else {
          this.info.components[ind].active = false;
        }
      }
    },
    nextDamage() {
      let last = this.info.components.length - 1;
      this.info.components.map(item =>{
        if(item.id === this.selected.id && this.message){
          this.$set(item,'comment',this.message);
        }
      });
      this.message = '';
      if(this.current < last) {
        this.info.components[this.current].save = true;
        this.current++;
        for(let comp of this.info.components) {
            comp.active = false;
        }
        this.info.components[this.current].active = true;
        this.selected = this.info.components[this.current];
      } else {
        this.info.components[this.current].save = true;
        this.$router.push('/infocar')
      }
    },

И вот тут она используется

 <v-btn
            v-model="next"
            @click="nextDamage"
            class="btn-see"
            color="red">Далее</v-btn>

И тут

<v-card
          v-on:click.native="fillDamages(component.id)"
          v-for="component in info.components"
          :key="component.id"
          tabindex="1"
          class="item">
          <h3>{{component.serialNumber}} . {{component.name}}</h3>
          <v-icon v-if="component.comment" class="icon-damage" color="green">check_circle</v-icon>
        </v-card>

Вот как я пытаюсь сделать

import axios from 'axios'
export default {
  state:{
    info:[]
  },
  actions: {
    setDamages ({ commit }) {
      axios.get('api/v1/inspection/script', {
        headers: {
          Authorization: `Bearer ${localStorage.getItem('user-token')}`
        },
      }).then(response => {
        commit('setDamages', response.data)
      });
    },
    loadFile({commit},file){
      axios.post('api/v1/files/create', {count: 1},{headers:{Authorization: `Bearer ${localStorage.getItem('user-token')}`},})
        .then(() => axios.put('api/v1/files', file,{headers: {
          'content-type': 'multipart/form-data',
          Authorization:`Bearer ${localStorage.getItem('user-token')}`
        }}));
    },
  },
  mutations: {
    setDamages (state, payload) {
      state.info = payload
    }
  },
  getters: {
    nextDamages: (state) => (next) => {
      let last = this.info.components.length - 1;
      this.info.components.find(item =>{
        if(item.id === this.selected.id && this.message){
          this.$set(item,'comment',this.message);
        }
      });
      this.message = '';
      if(this.current < last) {
        this.info.components[this.current].save = true;
        this.current++;
        for(let comp of this.info.components) {
          comp.active = false;
        }
        this.info.components[this.current].active = true;
        this.selected = this.info.components[this.current];
      } else {
        this.info.components[this.current].save = true;
        this.$router.push('/infocar')
      }
    }
  }
}

в компоненте

nextDamage() {
      return this.$store.getters.nextDamages(this.next)
    },
            <v-btn
            v-model="next"
            @click="nextDamage"
            class="btn-see"
            color="red">Далее</v-btn>
READ ALSO
Owl courusel и табы при загрузке страницы

Owl courusel и табы при загрузке страницы

При переключении между табами, в которых есть слайдер на долю секунды показываются все слайдыМожет кто сталкивался с проблемой, как фиксить?

145
Скроллинг в iframe по кнопке JS

Скроллинг в iframe по кнопке JS

интересует такой вопросЕсть iframe, встроен на страницу WordPress, скроллинг реализовал функцией JS, т

127
Uncaught TypeError: Cannot read property &#39;top&#39; of undefined как исправить?

Uncaught TypeError: Cannot read property 'top' of undefined как исправить?

Скрипт меняет класс навигации при скролле по секциям на странице

155
как из строки сделать массив и поместить данные с этого массива в select

как из строки сделать массив и поместить данные с этого массива в select

задача состоит в том чтобы при клике на кнопкуbtn получить

146