@modyo/cli/lib/widget/create/templates/vue-retail-bank-credit-cards-widget/store.js

Modyo Command Line Interface

/* eslint no-param-reassign: ["error", {"ignorePropertyModificationsFor": ["state"] }] */
import Vuex from 'vuex';
import axios from 'axios';

export default new Vuex.Store({
  state: {
    activeCard: null,
    activeTab: 'movements',
    cards: [],
    filterBy: 'all',
    fromDate: dateFns.startOfMonth(new Date()),
    isLoadingCards: true,
    isLoadingTransactions: true,
    paramCardId: 1,
    paramClientId: 1,
    showDatePicker: false,
    showFilters: false,
    showMovements: false,
    showSearch: false,
    toDate: new Date(),
    transactions: [],
    selectedTransaction: null,
    isConfig: false,

  },
  mutations: {
    SET_CARDS(state, data) {
      state.cards = data;
    },
    SET_SELECTED_TRANSACTION(state, data) {
      state.selectedTransaction = data;
    },
    SET_ACTIVE_CARD(state, data) {
      state.activeCard = data;
    },
    SET_IS_CONFIG(state, data) {
      state.isConfig = data;
    },
    SET_ACTIVE_TAB(state, data) {
      state.activeTab = data;
    },

    SET_FROM_DATE(state, data) {
      state.fromDate = data;
    },

    SET_FILTER_BY(state, data) {
      state.filterBy = data;
    },

    SET_IS_LOADING_CARDS(state, data) {
      state.isLoadingCards = data;
    },

    SET_IS_LOADING_TRANSACTIONS(state, data) {
      state.isLoadingTransactions = data;
    },

    SET_PARAM_CLIENT_ID(state, data) {
      state.paramClientId = data;
    },

    SET_PARAM_CARD_ID(state, data) {
      state.paramCardId = data;
    },

    SET_SHOW_MOVEMENTS(state, data) {
      state.showMovements = data;
    },

    SET_SHOW_DATEPICKER(state, data) {
      state.showDatePicker = data;
    },

    SET_SHOW_FILTERS(state, data) {
      state.showFilters = data;
    },

    SET_SHOW_SEARCH(state, data) {
      state.showSearch = data;
    },

    SET_TO_DATE(state, data) {
      state.toDate = data;
    },

    SET_TRANSACTIONS(state, data) {
      state.transactions = data;
    },
  },
  actions: {
    DO_DATA_INITIALIZATION(context) {
      return new Promise(((resolve, reject) => {
        context.dispatch('GET_CARDS')
          .then(() => {
            context.commit(
              'SET_ACTIVE_CARD',
              context.state.cards.find(card => card.id === context.state.paramCardId).id,
            );
            context.dispatch('GET_TRANSACTIONS');
            return resolve();
          })
          .catch(() => reject());
      }));
    },

    GET_CARDS(context) {
      context.commit('SET_ACTIVE_TAB', 'movements');
      context.commit('SET_CARDS', []);

      return axios.get(`https://api-bank.herokuapp.com/api/v1/clients/${context.state.paramClientId}/creditCards`)
        .then((creditCards) => {
          context.commit('SET_CARDS', creditCards.data);
          context.commit('SET_IS_LOADING_CARDS', false);
          return creditCards;
        })
        .catch(err => err);
    },

    GET_TRANSACTIONS(context) {
      context.commit('SET_FILTER_BY', 'all');
      context.commit('SET_TRANSACTIONS', []);
      context.commit('SET_IS_LOADING_TRANSACTIONS', true);

      return axios.get(`https://api-bank.herokuapp.com/api/v1/creditCards/${context.state.activeCard}/movements/`, {
        params: {
          from: context.state.fromDate,
          to: context.state.toDate,
        },
      })
        .then((movements) => {
          context.commit('SET_TRANSACTIONS', movements.data);
          context.commit('SET_IS_LOADING_TRANSACTIONS', false);
          return movements;
        })
        .catch(err => err);
    },

    GET_STATEMENTS(context) {
      context.commit('SET_FILTER_BY', 'all');
      context.commit('SET_TRANSACTIONS', []);
      context.commit('SET_IS_LOADING_TRANSACTIONS', true);
      return axios
        .get(`https://api-bank.herokuapp.com/api/v1/creditCards/${context.state.activeCard}/creditCardStatements/`)
        .then((statements) => {
          context.commit('SET_TRANSACTIONS', statements.data);
          context.commit('SET_IS_LOADING_TRANSACTIONS', false);
          return statements;
        })
        .catch(err => err);
    },
  },
});