sszdot
a1feb8bb4b
【原 因】： 【过 程】：从接口拿订单数据 同时进行 ‘订单快照’ 字段的 序列化 并且把sku spu的图片路径 补全 ps:完整的访问路径 【影 响】： # 类型 包含: # feat：新功能（feature） # fix：修补bug # docs：文档（documentation） # style： 格式（不影响代码运行的变动） # refactor：重构（即不是新增功能，也不是修改bug的代码变动） # test：增加测试 # chore：构建过程或辅助工具的变动
369 lines
9.3 KiB
JavaScript
369 lines
9.3 KiB
JavaScript
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
|
||
}) {
|
||
try {
|
||
// 请求订单列表
|
||
const res = await uni.$u.http.get('/Api/Check/getOrderList', {
|
||
header: {
|
||
'Token': state.userInfo.token
|
||
}
|
||
})
|
||
|
||
if (res.data.status === 1) {
|
||
// 对订单列表处理
|
||
const orderList = res.data.orderList.map(item => {
|
||
let tempPS
|
||
|
||
try {
|
||
// 解析 product_snapshot 字段
|
||
tempPS = JSON.parse(item.product_snapshot)
|
||
} catch (error) {
|
||
console.error(`product_snapshot 解析失败: ${error.message}`)
|
||
tempPS = []
|
||
}
|
||
|
||
// 遍历 product_snapshot 数组
|
||
tempPS = tempPS.map(spu => {
|
||
// 给 spu_photo 添加完整路径
|
||
spu.spu_photo = spu.spu_photo.map(photo => spuPath + photo)
|
||
|
||
// 遍历 sku_arr，给 sku_photo 添加完整路径
|
||
spu.sku_arr = spu.sku_arr.map(sku => {
|
||
sku.sku_photo = sku.sku_photo.map(photo => skuPath +
|
||
photo)
|
||
return sku
|
||
})
|
||
|
||
return spu
|
||
})
|
||
|
||
return {
|
||
...item,
|
||
product_snapshot: tempPS
|
||
}
|
||
})
|
||
|
||
// 提交更新到 Vuex 的状态
|
||
commit('setOrderList', orderList)
|
||
} else {
|
||
commit('setOrderList', [])
|
||
}
|
||
} catch (error) {
|
||
console.error(`获取订单列表失败: ${error.message}`)
|
||
commit('setOrderList', [])
|
||
}
|
||
},
|
||
//获取站点列表
|
||
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 |