Service in Vue

user.service.js

import UserService from './user.service.js';
...
data() {
   return {
       users: []
   }
},
mounted() {
   loadUsers();
},
method: {
   loadUsers(queryParams = {}) {
       UserService.all(queryParams}).then(res => { this.users = res.data })
   }
}

// UserService

import Vue from 'vue'
import VueResource from 'vue-resource'
Vue.use(VueResource);

export class UserService {
    static all(queryParams = {}) {
        return Vue.http.get(<YOUR-URL>, { params: queryParams })
        .then(response => {
            return response.data;
          }, error => {
            console.error(error);
          }
        );
    }
}

// js/store/user.js

export default {

    namespaced: true,

    state: {
        list: []
    },

    getters: {
        getList(state) {
            return state.list;
        }
    },

    actions: {
        
        browse(context, payload) {

            let opts = {
                url: "<YOUR-URL>",
                method: "<YOUR-METHOD>",
            };

            if (payload != undefined && payload.params != undefined) {

                // Assuming that payload.params is an array of strings.
                opts.url += "?" + params.join("&");
            }

            axios(opts).then((r) => {
                context.state.list = r;
            });

        },
    }, // End of actions
}

// Your component

import {mapGetters, mapActions} from "vuex";

export default {

    computed: {

        ...mapGetters('user', ['getList']),
    },

    methods: {

        ...mapActions('user', ['browse']),
    },

    mounted() {
        this.browse().then(() => {
            console.log(this.getList);
        });
    },
}

 // User Component;

import {mapState} from "vuex";
import {mapGetters} from "vuex";

export default {
    data() {
        return {
        };
    },
    created() {
        this.getUsers();
    },
    computed: {
        ...mapState("user", ["users"]),
        ...mapGetters("user", ["inActiveUsers"])
    },
    methods: {
        getUsers(page) {
            this.$store.dispatch("user/getUsers");
        }
    }
};

//User Vuex Module

import user from "../services/user";

export default {
    namespaced: true,
    state: {
        users: []
    },
    mutations: {
        setUsers(state, param) {
		state.users = param;
	},
	errors(state, param) {
		state.errors = errors;
	}
    },
    getters: {
        inActiveUsers: state => {
	    // Code to get inactive users
            return inActiveUsers;
        }
    },
    actions: {
        async getUsers({ commit }) {
            try {
                let response = await user.getUsers();
                commit("users", response);
            } catch (errors) {
                commit("errors", errors);
            }
        }
    }
};

// User Service

import auth from "./auth";
import api from "./api";

export default {
    getUsers() {
        return new Promise((resolve, reject) => {
            api.get(<URL>, <AUTH>)
                .then(response => {
                    return resolve(response);
                })
                .catch((status, error) => {
                    reject(status, error);
                });
        });
    }
};