text: function initialState() {
      return {
          item: {
              id: null,
              title: null,
              permission: [],
          },
          permissionsAll: [],
          
          loading: false,
      }
  }
  
  const getters = {
      item: state => state.item,
      loading: state => state.loading,
      permissionsAll: state => state.permissionsAll,
      
  }
  
  const actions = {
      storeData({ commit, state, dispatch }) {
          commit('setLoading', true)
          dispatch('Alert/resetState', null, { root: true })
  
          return new Promise((resolve, reject) => {
              let params = new FormData();
  
              for (let fieldName in state.item) {
                  let fieldValue = state.item[fieldName];
                  if (typeof fieldValue !== 'object') {
                      params.set(fieldName, fieldValue);
                  } else {
                      if (fieldValue && typeof fieldValue[0] !== 'object') {
                          params.set(fieldName, fieldValue);
                      } else {
                          for (let index in fieldValue) {
                              params.set(fieldName + '[' + index + ']', fieldValue[index]);
                          }
                      }
                  }
              }
  
              if (_.isEmpty(state.item.permission)) {
                  params.delete('permission')
              } else {
                  for (let index in state.item.permission) {
                      params.set('permission['+index+']', state.item.permission[index].id)
                  }
              }
  
              axios.post('/api/v1/roles', params)
                  .then(response => {
                      commit('resetState')
                      resolve()
                  })
                  .catch(error => {
                      let message = error.response.data.message || error.message
                      let errors  = error.response.data.errors
  
                      dispatch(
                          'Alert/setAlert',
                          { message: message, errors: errors, color: 'danger' },
                          { root: true })
  
                      reject(error)
                  })
                  .finally(() => {
                      commit('setLoading', false)
                  })
          })
      },
      updateData({ commit, state, dispatch }) {
          commit('setLoading', true)
          dispatch('Alert/resetState', null, { root: true })
  
          return new Promise((resolve, reject) => {
              let params = new FormData();
              params.set('_method', 'PUT')
  
              for (let fieldName in state.item) {
                  let fieldValue = state.item[fieldName];
                  if (typeof fieldValue !== 'object') {
                      params.set(fieldName, fieldValue);
                  } else {
                      if (fieldValue && typeof fieldValue[0] !== 'object') {
                          params.set(fieldName, fieldValue);
                      } else {
                          for (let index in fieldValue) {
                              params.set(fieldName + '[' + index + ']', fieldValue[index]);
                          }
                      }
                  }
              }
  
              if (_.isEmpty(state.item.permission)) {
                  params.delete('permission')
              } else {
                  for (let index in state.item.permission) {
                      params.set('permission['+index+']', state.item.permission[index].id)
                  }
              }
  
              axios.post('/api/v1/roles/' + state.item.id, params)
                  .then(response => {
                      commit('setItem', response.data.data)
                      resolve()
                  })
                  .catch(error => {
                      let message = error.response.data.message || error.message
                      let errors  = error.response.data.errors
  
                      dispatch(
                          'Alert/setAlert',
                          { message: message, errors: errors, color: 'danger' },
                          { root: true })
  
                      reject(error)
                  })
                  .finally(() => {
                      commit('setLoading', false)
                  })
          })
      },
      fetchData({ commit, dispatch }, id) {
          axios.get('/api/v1/roles/' + id)
              .then(response => {
                  commit('setItem', response.data.data)
              })
  
          dispatch('fetchPermissionsAll')
      },
      fetchPermissionsAll({ commit }) {
          axios.get('/api/v1/permissions')
              .then(response => {
                  commit('setPermissionsAll', response.data.data)
              })
      },
      setTitle({ commit,dispatch }, value) {
          dispatch('Alert/removeError', 'title', { root: true });
          commit('setTitle', value)
      },
      setPermission({ commit,dispatch }, value) {
          dispatch('Alert/removeError', 'permission', { root: true });
          commit('setPermission', value)
      },
      resetState({ commit }) {
          commit('resetState')
      }
  }
  
  const mutations = {
      setItem(state, item) {
          state.item = item
      },
      setTitle(state, value) {
          state.item.title = value
      },
      setPermission(state, value) {
          state.item.permission = value
      },
      setPermissionsAll(state, value) {
          state.permissionsAll = value
      },
      
      setLoading(state, loading) {
          state.loading = loading
      },
      resetState(state) {
          state = Object.assign(state, initialState())
      }
  }
  
  export default {
      namespaced: true,
      state: initialState,
      getters,
      actions,
      mutations
  }
  