• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149
• 150
• 151
• 152
• 153
• 154
• 155
• 156
• 157
• 158
• 159
• 160
• 161
• 162
• 163
• 164
• 165
• 166
• 167
• 168
• 169
• 170
• 171
• 172
• 173
• 174
• 175
• 176
• 177
• 178
• 179
• 180
• 181
• 182
• 183
• 184
• 185
• 186
• 187
• 188
• 189
• 190
• 191
• 192
• 193
• 194
• 195
• 196
• 197
• 198
• 199
• 200
• 201
• 202
• 203
• 204
• 205
• 206
• 207
• 208
• 209
• 210
• 211
• 212
• 213
• 214

//import Auth from '../middleware/auth';
import createPersistedState from 'vuex-persistedstate'
import axios from 'axios'

//const auth = new Auth()

/*
 * Components will dispatch() these actions
 * with $store.dispatch(""), and
 * Actions will commit() a mutation fn
 */

const actions = {

  async setUserData ({ commit, dispatch }, obj)
  {
    commit('SET_USER_DATA', obj)    
  },  

  async logout ({ commit }, router)
  {    
    var req = await axios.get('{{HOST}}/api/user/logout')
    if (req.data.result == 'success')
    {
      console.log('LOGGING OUT ACTION...')
      await commit('SET_USER_DATA', {email: '', id: ''})
      Cookies.remove('koa:sess')
      router.push('/')      
    }
    // TODO show an error if could not logout     
  },

  toggleDialog ({ commit, dispatch }, obj)
  {
    commit('TOGGLE_DIALOG', obj)
  },

  updateCrate ({ commit, dispatch }, obj)
  {
    commit('UPDATE_CRATE', obj)
  },

  updateShippingAddress ({ commit }, obj)
  {
    commit('UPDATE_SHIPPING_ADDRESS', obj)
  }
  
  
}



const mutations = {
  TOGGLE_DIALOG (state, obj)
  {
    state.dialogs[obj.dialogKey].show = obj.show
    state.dialogs[obj.dialogKey].args = obj.args || {}
  },
  
  SET_USER_DATA (state, obj)
  {
    Object.keys(obj).forEach( key => state.user[key] = obj[key] )
  },

  UPDATE_CRATE (state, obj)
  {
    state.crates[obj.crate].quantity = obj.qty
  },

  UPDATE_SHIPPING_ADDRESS (state, obj)
  {
    Object.keys(obj).forEach( key => state.checkout.shipping[key] = obj[key] )
  }
}

/*
 * A mutation fn will update the state
 */
const state = {  
  hasCheckedout: false,
  dialogs: {
    loginRegister: {
      show: false,
      args: {}
    },
    newAddress: {
      show: false,
      args: {}
    }
  },
  user: {
    id: null,
    email: null,
    token: null,
    addresses: []
  },
  
  usePremium: false,
  crates: {
    shower: {
      quantity: 1,
      price: 5.99,
      items: {
        shampoo: {
          quantity: 1,
          price: 0
        },
        conditioner: {
          quantity: 1,
          price: 0
        },
        soap: {
          quantity: 1,
          price: 0
        },
        'shower cap': {
          quantity: 1,
          price: 0
        }
      }
    },
    grooming: {
      quantity: 0,
      price: 4.99,
      items: {
        razor: {
          quantity: 2,
          price: 0
        },
        'body shaving gel': {
          quantity: 1,
          price: 0
        },
        'facial shaving cream': {
          quantity: 1,
          price: 0
        }
      }
    },
    smiley: {
      quantity: 0,
      price: 3.99,
      items: {
        toothbrush: {
          quantity: 2,
          price: 0
        },
        toothpaste: {
          quantity: 2,
          price: 1
        }
      }
    }
  },
  checkout: {
    email: '',
    shippingAddress: {
      name: '',
      street: '',
      address2: '',
      city: '',
      state: '',
      zip: '',
      country: 'us'
    }
  }

}


/*
 * Getters are like computed() for Vuex
 */
const getters = {
  total: state => {
    var total = 0
    var crates = state.crates
    for (let crate in crates)
    {
      if (crates[crate].quantity > 0)
      {
        total += (crates[crate].price * crates[crate].quantity)
      }
    }
    if (state.usePremium)
    {
      total += 1
    }
    return Math.floor(total * 100) / 100
  },

  reversedAddresses: state => {
    return state.user.addresses.reverse()
  }
}



const store = {
  state,
  actions,
  getters,
  mutations,  
  plugins: [createPersistedState({
    // Exclude dialogs from our persisted state
    filter(mutation) {
      return mutation.type !== 'TOGGLE_DIALOG'
    }
  })],
  
}

export default store