import Vue from 'vue' import Vuex from 'vuex' //把vuex作为插件引入到Vue示例中 ps:注册 Vue.use(Vuex) //引用全局设定 import settings from '@/settings.js' const { host, baseURL, listPath, spuPath, skuPath, sitePath, logoPath } = settings const store = new Vuex.Store({ //全局状态 state: { shop_id: null, //商铺id site_id: null, //当前站点id userInfo: { name: null, photo: null, sex: '0', tel: null, token: null, topic_prefix: null }, //用户信息 orderList: [], //订单列表 siteList: [], //站点列表 menuList: [], //分类列表 spuList: [], //spu列表 skuList: [], //sku列表 shopCon: {}, //商铺信息 cartList: [], //购物车列表 结构:[{"spu_id":"id","skuG":[sku_id,sku_id],"conutG":[数量,数量],"priceG":[单价,单价]},{.....}] tabbarCurrent: 0, //tabbar的当前激活项 cartShow: false, //列表页 购物车折叠显隐 mqttState: false, //标记mqtt服务器是否已经连接成功 }, //修改状态 mutations: { //设置 二维码获取商铺id setShopId(state, shop_id) { state.shop_id = shop_id; }, //设置 二维码获取站点id setSiteId(state, site_id) { state.site_id = site_id; }, //设置 列表页 购物车折叠显隐 setCartShow(state, val) { Vue.set(state, 'cartShow', val) }, //设置 标记用户登录状态 setMqttState(state, val) { Vue.set(state, 'mqttState', val) }, //设置tabbar当前激活像 setTabbarCurrent(state, val) { Vue.set(state, 'tabbarCurrent', val) }, //把用户信息 从本地缓存 提取到内存当中 setUserInfo(state, obj) { Vue.set(state.userInfo, 'name', obj.name) Vue.set(state.userInfo, 'photo', obj.photo) Vue.set(state.userInfo, 'sex', obj.sex) Vue.set(state.userInfo, 'tel', obj.tel) Vue.set(state.userInfo, 'token', obj.token) Vue.set(state.userInfo, 'topic_prefix', obj.topic_prefix) }, //清除用户信息 clearUserInfo(state) { Vue.set(state.userInfo, 'name', null) Vue.set(state.userInfo, 'photo', null) Vue.set(state.userInfo, 'sex', '0') Vue.set(state.userInfo, 'tel', null) Vue.set(state.userInfo, 'token', null) Vue.set(state.userInfo, 'topic_prefix', null) }, //设置订单列表 setOrderList(state, list) { state.orderList = list }, //设置站点列表 setSiteList(state, list) { state.siteList = list }, //设置分类列表 setMenuList(state, list) { state.menuList = list }, //设置spu列表 setSpuList(state, list) { state.spuList = list }, //设置sku列表 setSkuList(state, list) { state.skuList = list }, //设置商铺信息 setShopCon(state, obj) { state.shopCon = obj }, //清空购物车 clearCartList(state) { Vue.set(state, 'cartList', []) }, // 设置购物车列表 setCartList(state, obj) { let isExisting = false state.cartList.forEach(item => { // 判断是否存在相同的skuG组合 if (JSON.stringify(item.skuG) === JSON.stringify(obj.skuG)) { // 如果存在相同的skuG组合,则将现有商品的数量加1 for (let i = 0; i < item.countG.length; i++) { // 使用 Vue.set 或 this.$set 来确保 Vue 能够响应这个变化 Vue.set(item.countG, i, item.countG[i] + 1) } isExisting = true } }) // 如果购物车中不存在相同的skuG组合,则将新商品添加到购物车列表中 if (!isExisting) { state.cartList.push(obj) } }, //给spu添加最低价格字段 addMinPriceToSpuList(state) { state.spuList.forEach((spuItem, index) => { let totalPrice = 0 spuItem.bind_sku.forEach(skuGroup => { let minPrice = 0 let sku skuGroup.value.forEach(skuId => { sku = state.skuList.find(sku => skuId == sku .id) if (Number(minPrice) === 0 || Number(minPrice) > Number(sku .price)) { minPrice = Number(sku.price) } }) totalPrice += Number(minPrice) }) // 添加新的字段 js不能用this.$set(注意) Vue.set(spuItem, 'minPrice', parseFloat(totalPrice.toFixed(2))) }) }, //给spu.bind_sku.skuG 字段添加解构数据 ps:此函数在加载完skuList后执行 addSkuGToSpuList(state) { state.spuList.forEach(spuItem => { spuItem.bind_sku.forEach(item => { const skuG = item.value.map(id => state.skuList.find(sku => Number(sku .id) === Number(id))) Vue.set(item, 'skuG', skuG) }) }) } }, //异步请求 actions: { //获取订单列表 async fetchOrderList({ state, commit }) { await uni.$u.http.get('/Api/Check/getOrderList', { header:{ 'Token': state.userInfo.token, } }).then(res => { if (res.data.status === 1) { //更新数据 commit('setOrderList', res.data.orderList) } else { commit('setSiteList', []) } }) }, //获取站点列表 async fetchSiteList({ state, commit }) { await uni.$u.http.get('/Api/Normal/getSiteList', { params: { shop_id: state.shop_id } }).then(res => { if (res.data.status === 1) { // 反序列化处理 字段 res.data.siteList.forEach(site => { site.photo = JSON.parse(site.photo) site.photo.forEach((p, index) => { site.photo[index] = sitePath + p }) }) //更新数据 commit('setSiteList', res.data.siteList) } else { commit('setSiteList', []) } }) }, //获取分类列表 async fetchMenuList({ state, commit }) { await uni.$u.http.get('/Api/Normal/getCategoryList', { params: { shop_id: state.shop_id } }).then(res => { if (res.data.status === 1) { // 反序列化处理 字段 res.data.categoryList.forEach(category => { category.photo = JSON.parse(category.photo) category.photo.forEach((p, index) => { category.photo[index] = listPath + p }) }) //更新数据 commit('setMenuList', res.data.categoryList) } else { commit('setMenuList', []) } }) }, // 获取spu列表 fetchSpuList({ state, commit }) { return new Promise((resolve, reject) => { uni.$u.http.get('/Api/Normal/getSpuList', { params: { shop_id: state.shop_id } }).then(res => { if (res.data.status === 1) { // 反序列化处理 字段 res.data.spuList.forEach(spu => { spu.photo = JSON.parse(spu.photo) spu.photo.forEach((p, index) => { spu.photo[index] = spuPath + p }) spu.bind_sku = JSON.parse(spu.bind_sku) spu.bind_sku.forEach(bs => { Vue.set(bs, 'skuG', [] ) //添加对应sku组 字段 临时先加一个空数组 在另外的方法等skuList异步加载完成在 添加 结构这个字段 }) Vue.set(spu, 'bind_sku', spu.bind_sku) Vue.set(spu, 'pro_tag', JSON.parse(spu.pro_tag)) }) //更新数据 commit('setSpuList', res.data.spuList) resolve() // 请求成功后 resolve } else { commit('setSpuList', []) reject() // 请求失败时 reject } }).catch(error => { reject(error) // 请求出错时 reject }) }) }, // 获取sku列表 fetchSkuList({ state, commit }) { return new Promise((resolve, reject) => { uni.$u.http.get('/Api/Normal/getSkuList', { params: { shop_id: state.shop_id } }).then(res => { if (res.data.status === 1) { // 反序列化处理 字段 res.data.skuList.forEach(sku => { sku.photo = JSON.parse(sku.photo) sku.photo.forEach((p, index) => { sku.photo[index] = skuPath + p }) }) //更新数据 commit('setSkuList', res.data.skuList) resolve() // 请求成功后 resolve } else { commit('setSkuList', []) reject() // 请求失败时 reject } }).catch(error => { reject(error) // 请求出错时 reject }) }) }, //获取商品信息 async fetchShopCon({ state, commit }) { await uni.$u.http.get('/Api/Normal/getShopCon', { params: { shop_id: state.shop_id } }).then(res => { if (res.data.status === 1) { // 反序列化处理 字段 res.data.shopCon.logo = JSON.parse(res.data.shopCon.logo) res.data.shopCon.logo.forEach((p, index) => { res.data.shopCon.logo[index] = logoPath + p }) //更新数据 commit('setShopCon', res.data.shopCon) } else { commit('setShopCon', {}) } }) }, } }) export default store