H5-ThreeDoorder/store/module/shopping/index.js

308 lines
9.2 KiB
JavaScript

import {
ADD_CART,
REDUCE_CART,
SETSHOPDETAIL,
INIT_BUYCART,
MODEAL,
SETBRANDINFOR,
SETNAVINDEX,
EMPTY,
SETMODE,
SETREPLACE,
SETINFOR,
SETPHONE
} from '../../mutation-types';
import cartClass from '../../mall-method';
import {
addMethod,
removeMethod
} from '../../goodsOperation';
// 加入购物车
let add = new addMethod();
// 移除购物车
let remove = new removeMethod();
// 深拷贝
const deepClone = function(source) {
if (!source || typeof source !== 'object') {
throw new Error('error arguments', 'shallowClone');
}
var targetObj = source.constructor === Array ? [] : {};
for (var keys in source) {
if (source.hasOwnProperty(keys)) {
if (source[keys] && typeof source[keys] === 'object') {
targetObj[keys] = source[keys].constructor === Array ? [] : {};
targetObj[keys] = deepClone(source[keys]);
} else {
targetObj[keys] = source[keys];
}
}
}
return targetObj;
};
export default {
namespaced: true,
state: {
// 餐厅类型
restaurant_type: null,
// 所选餐厅ID
// restaurant_id: null,
// 购物车清单对象是用户在各个店铺中加入购物车的商品的列表清单
// 结算清单是结算页面要结算的商品清单
// 用户进入餐厅之后会先拿本地数据展示到页面购物车列表,但是此时会有一个问题,因为肯德基等快餐店商品展示形式是
// 早上:早餐类
// 中午:午餐类,
// 晚上:晚餐类
// 所以会出现,用户早上选择的商品加入购物车之后,但是没有下单去买,到中午或者晚上的时候再次进来接口返回的商品中就没有早上用户选择的早餐类型的商品了,
// 而又因为结算页面使用的是直接获取本地购物车的方式展示用户所购买的商品,所以当用户在店铺展示页选择了三个中午的商品,但是到了结算页面就会连同早上和中午的商品一同展示的BUG
// 所以曲线救国方式,再创建一个结算清单数据,将用户要结算的商品放入此数组,中在结算页面使用,当用户只要支付完成了,就会清空该店铺的购物车
// 购物车清单
cartList: {},
// 结算清单
shopshopping: [],
// 餐厅信息
shopDetail: {
city_name: "",
close_time: "",
distance: "",
is_open: 1,
latitude: 0,
longitude: 0,
open_time: "07:00",
province_name: "",
regoin_name: null,
restaurant_address: "",
restaurant_id: 2890,
restaurant_name: "",
special: false,
},
// 用户进入的品牌
BInfor: {
brand_id: 0,
brand_name: "",
brand_status: true,
end_time: null,
img_url: "",
open_time: null,
},
// 点餐底部导航索引
navindex: 0,
// 就餐方式
eat_type: 'EAT_IN',
// 当前所选商品详情数据(弹框展示)
commodityInfor: {},
Phone:''
},
getters: {
// 使用地方:
// 2.进入餐厅后展示餐厅信息时
GetShopInfor: state => state['shopDetail'],
// 获取餐厅购物车
GetCartList: state => state['cartList'][state['BInfor']['brand_id']] ? state['cartList'][state['BInfor'][
'brand_id'
]][state['shopDetail']['restaurant_id']] ? state['cartList'][state['BInfor'][
'brand_id'
]][state['shopDetail']['restaurant_id']] : {} : {},
// 获取品牌ID
BrandInfor: state => state['BInfor'],
// 获取底部导航索引
Getnavindex: state => state['navindex'],
// 获取用户进入餐厅之后就餐方式
GetMODE: state => state['eat_type'],
// 获取结算列表
Getshopshopping: state => state['shopshopping'],
// 获取当前商品详情
GetcommodityInfor: state => state['commodityInfor'],
getCityName: state => '',
getPhone: state => state['Phone'],
},
mutations: {
[SETINFOR](state, data) {
state['commodityInfor'] = data;
},
// 设置底部导航索引 0 , 1
[SETNAVINDEX](state, index) {
console.log('设置底部导航')
state['navindex'] = index;
},
// 选择餐厅时就餐方式
[SETMODE](state, type) {
state['eat_type'] = type;
},
// 因为后台没有餐厅信息接口,需要前端在选择餐厅列表时将餐厅信息带过去所以在此处将餐厅信息保存起来
// 使用地方:
// 1.选择餐厅时保存
[SETSHOPDETAIL](state, data) {
state['shopDetail'] = data;
console.log(state['shopDetail'], '设置店铺信息');
},
// 结算清单,
[SETREPLACE](state, arr) {
state['shopshopping'] = arr;
console.log(state['shopshopping'], 'shopshopping');
},
//网页初始化时从本地缓存获取购物车数据
[INIT_BUYCART](state) {
console.log('调用');
let initCart = uni.getStorageSync('shopping');
console.log(initCart, 'initCart');
if (initCart) {
state['cartList'] = JSON.parse(initCart);
console.log(state['cartList'], 'cartList');
}
},
// 存入弹框变量
[MODEAL]() {
uni.setStorageSync('firstshow', false);
},
// 设置进入品牌ID
[SETBRANDINFOR](state, data) {
state['BInfor'] = data;
console.log('设置品牌', state['BInfor']);
},
[SETPHONE](state,data){
state['Phone'] = data;
console.log(state['Phone'] , data,'手机号');
},
// 修改数据
SetData(state, data) {
state['cartList'] = {
...data
};
console.log('购物车数据重新赋值成功');
uni.setStorageSync('shopping', JSON.stringify(state['cartList']));
},
},
actions: {
// 删除本地店铺购物车
// 清空当前购物车
[EMPTY]({
commit,
state
}, restaurant_id) {
// 深拷贝
// 获取当前所有店铺购物列表
let cart = deepClone(state['cartList']);
// 当前所有购物车 下有该品牌的购物车则继续使用该品牌的购物车没有则创建一个空对象
Reflect.set(cart, state['BInfor']['brand_id'], cart[state['BInfor']['brand_id']] || {});
let brand = cart[state['BInfor']['brand_id']];
// 当前品牌 下的某个店铺的购物车是否存在。存在则继续使用不存在则创建空对象
Reflect.set(brand, restaurant_id, brand[restaurant_id] || {});
return new Promise((success, fail) => {
// Reflect.defineProperty(brand, restaurant_id, {
// value: {},
// writable: true,
// enumerable: true
// });
// 删除当前店铺购物车
Reflect.deleteProperty(brand, restaurant_id);
// 修改vuex数据
commit('SetData', cart);
// 重置本地缓存购物车数据
uni.setStorageSync('shopping', JSON.stringify(state['cartList']));
// 返回成功开始执行后面的逻辑
success({
list: state['cartList'],
shopping: JSON.parse(uni.getStorageSync('shopping'))
})
})
},
// 加入购物车
// 可能会有操作需要加入购物车之后执行所以写入promise
[ADD_CART]({
commit,
state
}, {
commodity,
quantity = 1
}) {
return new Promise((reslove, reject) => {
console.log(commodity,'commodity')
commodity['restaurant_id'] = state['shopDetail']['restaurant_id'];
commodity['brand_id'] = state['BInfor']['brand_id'];
add.Sex = {
cartList: deepClone(state['cartList']),
commodity,
quantity
};
add.init().then(res => {
console.log(res,'resres');
commit('SetData', res);
reslove()
})
})
// console.log(commodity, quantity, '参数');
// return new Promise((reslove, reject) => {
// /**
// * @param {Object} cartList-当前店铺的购物车
// * @param {Object} commodity-需要操作的商品restaurant_id
// * @param {Number} quantity-商品操作的数量
// */
// commodity['restaurant_id'] = state['shopDetail']['restaurant_id'];
// commodity['brand_id'] = state['BInfor']['brand_id'];
// let Ncart = new cartClass({
// cartList: deepClone(state['cartList']),
// commodity,
// quantity
// });
// Ncart.ADD_CART().then(data => {
// commit('SetData', data);
// reslove()
// }).catch(res => {
// console.log(res, '*-*-*');
// })
// })
},
// 移除购物车
[REDUCE_CART]({
commit,
state
}, data) {
// let add = new addMethod();
return new Promise((reslove, reject) => {
console.log(data,'data');
data['restaurant_id'] = state['shopDetail']['restaurant_id'];
data['brand_id'] = state['BInfor']['brand_id'];
remove.Sex = {
cartList: deepClone(state['cartList']),
commodity:data,
quantity:1
};
remove.init().then(res => {
console.log(res,'resres');
commit('SetData', res);
reslove()
});
// return
// /**
// * @param {Object} cartList-当前店铺的购物车
// * @param {Object} commodity-需要操作的商品
// * @param {Number} quantity-商品操作的数量
// */
// data['restaurant_id'] = state['shopDetail']['restaurant_id'];
// data['brand_id'] = state['BInfor']['brand_id'];
// let Ncart = new cartClass({
// cartList: deepClone(state['cartList']),
// commodity: data,
// quantity: 1
// });
// Ncart.REDUCE_CART().then(res => {
// commit('SetData', res);
// reslove()
// });
})
}
}
}