C端vuex

为什么80%的码农都做不了架构师？>>>   

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import qs from 'qs'
const api = require('../config').request

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    peopleIng: true,
    deskStatus: 0,
    dialogText: '',
    dialogShow: false,
    deskId: '',
    token: '',
    foodList: [],
    shopDetail: {desk: {name: ''}, shop: {name: ''}},
    arrAllCard: [],
    foodTypes: [],
    totalPrice: 0,
    orderObj: {},
    mealFee: 0,
    sumCount: 0,
    changeMessage: {},
    changeIng: false,
    count: 1,
    computeHeight: false,
    anchorArr: []
  },
  mutations: {
    setAnchor (state, payload) {
      state.anchorArr = payload
    },
    //**选择人数，总价计算
    peopleSelectFinish (state, payload) {
      state.mealFee = payload.meal_fee
      state.peopleIng = false
      state.shopDetail.desk.people = payload.people
      state.deskStatus = payload.status
      var arrAllCard = state.arrAllCard
      state.totalPrice = arrAllCard.reduce((total, item) => {
        return total + (item.price * item.count)
      }, payload.meal_fee)
    },
    //判断是否能选择人数
    peopelCount (state, payload) {
      state.peopleIng = payload.status
      if (!!payload.count) {
        state.shopDetail.desk.people = payload.count
      }
    },
    changeDialog (state, payload) {
      state.dialogShow = payload.show
      state.dialogText = payload.content
    },
    setDeskId (state, payload) {
      state.deskId = payload
    },
    setToken (state, payload) {
      state.token = payload
    },
    //**获取店铺详情
    getShopDetail (state, payload) {
      state.shopDetail = payload.res
      if (payload.res.desk.people != 0) {
        state.peopleIng = false
      }
      state.deskStatus = payload.res.desk.status
    },
    changeDeskStatus (state, payload) {
      state.deskStatus = payload
    },
    paySuccess (state, payload) {

    },
    getFoodList (state, payload) {
      state.foodList = payload.res
      state.computeHeight = true
    },
    getShopCar (state, payload) {
      state.arrAllCard = payload.arrAllCard
      state.foodTypes = payload.foodTypes
      state.totalPrice = payload.totalPrice
      state.mealFee = payload.mealFee
      var arrAllCard = payload.arrAllCard
      var foodList = state.foodList
      var sumCount = 0
      arrAllCard.forEach((item, index) => {
        for (let value of foodList) {
          if (index == 0) value.count = 0
          value.foods.some(cell => {
            if (index == 0) cell.count = 0
            if (cell.id == item.food_id) {
              sumCount += item.count
              cell.count += item.count
              value.count += item.count
              return true
            } else {
              return false
            }
          })
        }
      })
      state.sumCount = sumCount
    },
    //清空购物车列表
    clearShopCar (state) {
      state.foodList.forEach(item => {
        item.count = 0
        for (let value of item.foods) {
          value.count = 0
        }
      })
      state.arrAllCard = []
      state.foodTypes = []
      state.sumCount = 0
      state.totalPrice = state.mealFee
      if (state.deskStatus == 2) {
        state.totalPrice = 0
      }
    },
    orderDetail (state, payload) {
      state.orderObj = payload.res
      var foodList = state.foodList
      foodList.forEach((item) => {
        for (let cell of item.foods) {
          if (cell.count > 0) {
            cell.buy_status = 1
          }
        }
      })
    },
   /* 有人加菜或者減菜的時候，
      state.changeIng设置动态的显示，
      判断新菜，判断规格
      更新购物车列表
    */
    countChange (state, payload) {
      // debugger;
      state.changeIng = true
      clearTimeout(this.$settime)
      this.$settime = setTimeout(() => {
        state.changeIng = false
      }, 2000);
      var foodList = state.foodList
      payload.count = payload.count * 1
      state.changeMessage = payload
      // 判断有没有这道菜
      var haveFood = false
      var currentFood = {}
      var standards = false
      var haveError = false
      // 遍历食物列表
      foodList.some(item => {
        return item.foods.some(cell => {
          if (cell.id == payload.food_id) {
            // 可以在这里做错误处理
            if (cell.count > 0) {
              haveFood = true
            } else {
              // 判断数量是否有错
              if (payload.count < 0) {
                haveError = true
                return true
              }
            }
            cell.count += payload.count
            item.count += payload.count
            if (item.count < 0) haveError = true
            currentFood = cell
            currentFood.typeName = item.name
            if (cell.food_senior_standards.length > 0) standards = true
            return true
          } else {
            return false
          }
        })
      })

      if (haveError) {
        console.log('数量错误')
        return
      }
      // 判断是否是新的选规格
      var isNewXgg = standards ? true : false
      // 遍历购物车
      var arrAllCard = state.arrAllCard
      if (haveFood) {
        // 如果有有规格
        if (standards) {
          arrAllCard.some((item, index) => {
            if (item.food_id == payload.food_id) {
              if (item.standard_combination_id == payload.standard_combination_id) {
                item.count += payload.count
                // 可以做错误处理
                if (item.count == 0) {
                  arrAllCard.splice(index, 1)
                }
                isNewXgg = false
                return true
              }
            }
          })
        } else {
          arrAllCard.some((item, index) => {
            if (item.food_id == payload.food_id) {
              item.count += payload.count
              if (item.count == 0) {
                arrAllCard.splice(index, 1)
              }
              // 可以做错误处理
              return true
            }
          })
        }
      }

      // 添加新菜
      if (!haveFood || isNewXgg) {
        var obj = {
          count: payload.count,
          price: payload.price,
          name: currentFood.name,
          standard_combination_name: payload.standard_combination_name,
          food_id: payload.food_id,
          standard_combination_id: payload.standard_combination_id
        }
        arrAllCard.push(obj)
      }

      // 接下来，要改变type数组中的值了
      var foodTypes = state.foodTypes
      typeAdd:
      if (haveFood) {
        if (standards) {
          // 以下情况一定有这道菜
          if (!isNewXgg) {
            for (var i in foodTypes) {
              for (var j in foodTypes[i].foodData) {
                if (foodTypes[i].foodData[j].food_id == payload.food_id && foodTypes[i].foodData[j].standard_combination_id == payload.standard_combination_id) {
                  foodTypes[i].foodData[j].count += payload.count
                  foodTypes[i].food_count += payload.count
                  if (foodTypes[i].foodData[j].count == 0) {
                    foodTypes[i].foodData.splice(j, 1)
                  }
                  if (foodTypes[i].food_count == 0) {
                    foodTypes.splice(i, 1)
                  }
                  break typeAdd
                }
              }
            }
          }
        } else {
          // 不是选规格，一定有
          foodTypes.some((item, index1) => {
            return item.foodData.some((cell, index2) => {
              if (cell.food_id == payload.food_id) {
                cell.count += payload.count
                item.food_count += payload.count
                if (cell.count == 0) item.foodData.splice(index2, 1)
                if (item.food_count == 0) foodTypes.splice(index1, 1)
                return true
              }
            })
          })
        }
      }

        var obj = {
          count: payload.count,
          price: payload.price,
          name: currentFood.name,
          standard_combination_name: payload.standard_combination_name,
          food_id: payload.food_id,
          standard_combination_id: payload.standard_combination_id,
          food_type_id: currentFood.food_type_id
        }
        if (!haveFood || isNewXgg) {
        // 首先判断有没有这种类的菜
        var foodTypeed = foodTypes.some(item => {
          if (item.id == currentFood.food_type_id) {
            item.food_count += payload.count
            item.foodData.push(obj)
            return true
          }
        })

        if (!foodTypeed) {
          var typeObj = {
            name: currentFood.typeName,
            food_count: payload.count,
            foodData: [obj],
            id: currentFood.food_type_id
          }
          foodTypes.push(typeObj)
        }
      }

      var totalPrice = state.totalPrice
      if (payload.count < 0) {
        totalPrice -= payload.price
      } else {
        totalPrice += payload.price
      }
      state.totalPrice = totalPrice
      state.sumCount += payload.count
      state.arrAllCard = arrAllCard
      state.foodTypes = foodTypes
      state.foodList = foodList
    }
  },
  actions: {
    getShopCar ({commit, state}) {
      // console.log('获取购物车')
      // 获取本桌号的购物车列表
      axios.get(`${api}/c/getshoppingitems/${state.deskId}`)
      .then(res => {
          commit({
              type: 'getShopCar',
              arrAllCard: res.data.data.shopCartItemsData.shopCartItems,
              foodTypes: res.data.data.foodTypesData.foodTypes,
              totalPrice:  res.data.data.shopCartItemsData.total_price,
              mealFee: res.data.data.shopCartItemsData.meal_fee
          })
      })
    },
    //读取菜品列表
    getFoodList ({commit, state}) {
      var deskId = state.deskId
      axios.get(`${api}/c/getshopdetail/${deskId}`)
        .then(res => {
          commit({
            type: 'getShopDetail',
            res: res.data.data
          })
        })
      axios.get(`${api}/c/getfoodlist/?desk_id=${deskId}`)
        .then(res => {
          var foodList = res.data.data
          foodList.forEach(item => {
            item.count = 0
            for (let value of item.foods) {
              value.count = 0
            }
          })
          commit({
            type: 'getFoodList',
            res: foodList
          })
        })
        .then(() => {
          // 获取本桌号的购物车列表
          axios.get(`${api}/c/getshoppingitems/${deskId}`)
            .then(res => {
              commit({
                type: 'getShopCar',
                arrAllCard: res.data.data.shopCartItemsData.shopCartItems,
                foodTypes: res.data.data.foodTypesData.foodTypes,
                totalPrice: res.data.data.shopCartItemsData.total_price,
                mealFee: res.data.data.shopCartItemsData.meal_fee
              })
            })
        })
    },

    orderDetail ({commit, state}, payload) {
      var url = ``
      if (payload.timestamp) {
        url = `${api}/c/getorderitems/${payload.deskId}?desk_timestamp=${payload.timestamp}`
      } else {
        url = `${api}/c/getorderitems/${state.deskId}`
      }
      axios.get(url)
        .then((res) => {
          commit({
            type: 'orderDetail',
            res: res.data.data
          })
          if (!payload.timestamp) {
            commit('changeDeskStatus', 2)
            commit('clearShopCar')
          }
        })
    },
    //axios向后台更新，增加或者减少的菜品
    countChange ({ state }, payload) {
      // 增加购物车接口然后mutains
      var obj = {
        desk_id: state.deskId,
        food_id: payload.id,
        count: payload.count
      }
      if (!!payload.combinationId) {
        obj.standard_combination_id = payload.combinationId
      }
      axios.post(`${api}/c/updateshoppingitem`, qs.stringify(obj))
    }
  }
})

转载于:https://my.oschina.net/dmq/blog/1838969