From 7a63035017c6dbc9359e7c61739f0d34cfea56f5 Mon Sep 17 00:00:00 2001 From: zc <2064281269@qq.com> Date: Tue, 2 Dec 2025 23:51:09 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E8=B4=AD=E7=89=A9=E8=BD=A6=E5=BC=80?= =?UTF-8?q?=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- api/order.js | 8 +++ components/add-cart-popup/index.vue | 18 +++--- core/app.js | 2 +- core/bootstrap.js | 8 +-- pages/cart/index.vue | 91 ++++++++++++++--------------- pages/checkout/index.vue | 11 ++-- pages/goods/components/SkuPopup.vue | 8 +-- store/getters.js | 2 +- store/modules/user.js | 50 +++++----------- utils/storage.js | 56 +----------------- 10 files changed, 90 insertions(+), 164 deletions(-) diff --git a/api/order.js b/api/order.js index 9c1acc6..c1e0f52 100644 --- a/api/order.js +++ b/api/order.js @@ -84,4 +84,12 @@ export const apiActionOrder = (url, data) => { ); } +// 获取购物车列表 +export const apiGetCartList = (data) => { + return httpRequest.post( + `${baseUrl}/shipping/cart/list`, + data + ); + } + diff --git a/components/add-cart-popup/index.vue b/components/add-cart-popup/index.vue index f8b7887..441d07e 100644 --- a/components/add-cart-popup/index.vue +++ b/components/add-cart-popup/index.vue @@ -45,20 +45,16 @@ // 加入购物车事件 async handle(goods) { this.goods = goods - if (goods.spec_type == SpecTypeEnum.SINGLE.value) { - this.singleEvent() - } - if (goods.spec_type == SpecTypeEnum.MULTI.value) { - this.multiEvent() - } + this.singleEvent() + // this.multiEvent() }, // 单规格商品事件 singleEvent() { const { goods } = this this.addCart({ - goods_id: goods.goods_id, - goods_sku_id: '0', + goods_id: goods.id, + goods_sku_id: goods.skuId, buy_num: 1 }) }, @@ -153,11 +149,11 @@ // 加入购物车按钮 addCart(selectShop) { const app = this - const { goods_id, goods_sku_id, buy_num } = selectShop - CartApi.add(goods_id, goods_sku_id, buy_num) + const { goods_sku_id, buy_num } = selectShop + GoodsApi.apiAddCart({ skuId: goods_sku_id, num: buy_num }) .then(result => { // 显示成功 - app.$toast(result.message, 1000, false) + app.$toast(result.msg, 1000, false) // 隐藏当前弹窗 app.onChangeValue(false) // 购物车商品总数量 diff --git a/core/app.js b/core/app.js index 1915967..6b3dd4c 100644 --- a/core/app.js +++ b/core/app.js @@ -182,7 +182,7 @@ export const setCartTabBadge = () => { * 验证是否已登录 */ export const checkLogin = () => { - return !!store.getters.userId + return !!store.getters.buyerId } /** diff --git a/core/bootstrap.js b/core/bootstrap.js index 769f706..e0f79ed 100644 --- a/core/bootstrap.js +++ b/core/bootstrap.js @@ -2,15 +2,11 @@ import store from '@/store' import storage from '@/utils/storage' import Config from '@/core/config' import platform from '@/core/platform' -import { ACCESS_TOKEN, USER_ID, APP_THEME } from '@/store/mutation-types' +import { APP_THEME } from '@/store/mutation-types' export default function YoShop2() { // 当前运行的终端 store.commit('SET_PLATFORM', platform) - // 用户认证token - store.commit('SET_TOKEN', storage.get(ACCESS_TOKEN)) - // 当前用户ID - store.commit('SET_USER_ID', storage.get(USER_ID)) - // 全局自定义主题 + store.commit('SET_USER_INFO', storage.get('user_info')) store.commit('SET_APP_THEME', storage.get(APP_THEME)) } diff --git a/pages/cart/index.vue b/pages/cart/index.vue index 6471655..80e2e19 100644 --- a/pages/cart/index.vue +++ b/pages/cart/index.vue @@ -23,25 +23,25 @@ - - + + - - {{ item.goods.goods_name }} + + {{ item.productName }} - - {{ props.value.name }} + + {{ props.propertyValue }} ￥ - {{ item.goods.skuInfo.goods_price }} + {{ item.singlePrice }} - + @@ -73,7 +73,7 @@ - + 去结算 @@ -91,6 +91,8 @@ import { inArray, arrayIntersect, debounce } from '@/utils/util' import { checkLogin, setCartTotalNum, setCartTabBadge } from '@/core/app' import * as CartApi from '@/api/cart' + import * as OrderApi from '@/api/order' + import storage from '@/utils/storage' const CartIdsIndex = 'CartIds' @@ -101,28 +103,19 @@ data() { return { inArray, - // 正在加载 isLoading: true, - // 当前模式: normal正常 edit编辑 - mode: 'normal', - // 购物车商品列表 + mode: 'normal', // 当前模式: normal正常 edit编辑 list: [], - // 购物车商品总数量 total: null, - // 选中的商品ID记录 checkedIds: [], - // 选中的商品总金额 totalPrice: '0.00' } }, watch: { - // 监听选中的商品 checkedIds: { handler(val) { - // 计算合计金额 - this.onCalcTotalPrice() - // 记录到缓存中 - uni.setStorageSync(CartIdsIndex, val) + this.onCalcTotalPrice() // 计算合计金额 + uni.setStorageSync(CartIdsIndex, val) // 记录到缓存中 }, deep: true, immediate: false @@ -134,10 +127,6 @@ setCartTabBadge() } }, - - /** - * 生命周期函数--监听页面显示 - */ onShow() { // 获取缓存中的选中记录 this.checkedIds = uni.getStorageSync(CartIdsIndex) @@ -146,7 +135,6 @@ }, methods: { - // 计算合计金额 (根据选中的商品) onCalcTotalPrice() { const app = this @@ -156,8 +144,8 @@ let tempPrice = 0; checkedList.forEach(item => { // 商品单价, 为了方便计算先转换单位为分 (整数) - const unitPrice = item.goods.skuInfo.goods_price * 100 - tempPrice += unitPrice * item.goods_num + const unitPrice = item.singlePrice * 100 + tempPrice += unitPrice * item.num }) app.totalPrice = (tempPrice / 100).toFixed(2) }, @@ -166,14 +154,13 @@ getCartList() { const app = this app.isLoading = true - CartApi.list() - .then(result => { - app.list = result.data.list - app.total = result.data.cartTotal + OrderApi.apiGetCartList({}).then(res => { + app.total = res.data.total + app.list = res.data.rows.map(item => ({ ...item, skuInfo: JSON.parse(item.skuInfo) })) // 清除checkedIds中无效的ID app.onClearInvalidId() - }) - .finally(() => app.isLoading = false) + }) + .finally(() => app.isLoading = false) }, // 清除checkedIds中无效的ID @@ -191,19 +178,20 @@ // 监听步进器更改事件 onChangeStepper({ value }, item) { // 这里是组织首次启动时的执行 - if (item.goods_num == value) return + if (item.num == value) return // 记录一个节流函数句柄 if (!item.debounceHandle) { - item.oldValue = item.goods_num - item.debounceHandle = debounce(this.onUpdateCartNum, 500) + item.oldValue = item.num + item.num = value + this.onCalcTotalPrice() + // item.debounceHandle = debounce(this.onUpdateCartNum, 500) } // 更新商品数量 - item.goods_num = value // 提交更新购物车数量 (节流) - item.debounceHandle(item, item.oldValue, value) + // item.debounceHandle(item, item.oldValue, value) }, - // 提交更新购物车数量 + /* // 提交更新购物车数量 onUpdateCartNum(item, oldValue, newValue) { const app = this CartApi.update(item.goods_id, item.goods_sku_id, newValue) @@ -220,7 +208,7 @@ item.goods_num = oldValue setTimeout(() => app.$toast(err.errMsg), 10) }) - }, + }, */ // 跳转到商品详情页 onTargetGoods(goodsId) { @@ -246,11 +234,20 @@ }, // 结算选中的商品 - handleOrder() { + onSubmit() { const app = this if (app.checkedIds.length) { - const cartIds = app.checkedIds.join() - app.$navTo('pages/checkout/index', { mode: 'cart', cartIds }) + const arr = app.list.filter(item => inArray(item.id, app.checkedIds)).map(item => ({ + goodsId: item.productId, + goodsSkuId: item.skuId, + buy_num: item.num, + title: item.productName, + image: item.imageUrl, + price: item.singlePrice, + skuInfo: item.skuInfo + })) + storage.set('goods', arr) + app.$navTo('pages/checkout/index', { mode: 'cart' }) } }, @@ -270,7 +267,6 @@ } }) }, - // 确认删除商品 onClearCart() { const app = this @@ -376,11 +372,14 @@ color: #ababab; font-size: 24rpx; overflow: hidden; + display: flex; + align-items: center; + gap: 10rpx; .goods-props-item { padding: 4rpx 16rpx; border-radius: 12rpx; - background-color: #fcfcfc; + background-color: #efefef; } } diff --git a/pages/checkout/index.vue b/pages/checkout/index.vue index 3fa458a..fb44c26 100644 --- a/pages/checkout/index.vue +++ b/pages/checkout/index.vue @@ -54,9 +54,9 @@ {{ item.title }} - - {{ props.group.name }}: - {{ props.value.name }}； + + {{ props.propertyName }}: + {{ props.propertyValue }}； @@ -226,6 +226,7 @@ import * as OrderApi from '@/api/order' import { CouponTypeEnum } from '@/common/enum/coupon' import { OrderTypeEnum, DeliveryTypeEnum } from '@/common/enum/order' +import storage from '@/utils/storage' const CouponColors = ['red', 'blue', 'violet', 'yellow'] @@ -309,10 +310,10 @@ */ onShow() { // 获取当前订单信息 - const goods = JSON.parse(decodeURIComponent(this.options.goods)) + const goods = storage.get('goods') console.warn('----- my data is goods: ', goods) goods.forEach(item => { - item.skuInfo = { goods_props: [] } + item.skuInfo = item.skuInfo || [] }) this.order.goodsList = goods // this.getOrderData() diff --git a/pages/goods/components/SkuPopup.vue b/pages/goods/components/SkuPopup.vue index c8efc18..ee205a0 100644 --- a/pages/goods/components/SkuPopup.vue +++ b/pages/goods/components/SkuPopup.vue @@ -10,6 +10,7 @@ import { hex2rgba } from '@/utils/color' import * as GoodsApi from '@/api/goods' import GoodsSkuPopup from '@/components/goods-sku-popup' + import storage from '@/utils/storage' export default { components: { @@ -144,9 +145,7 @@ // 立即购买 buyNow(selectShop) { // 跳转到订单结算页 - this.$navTo('pages/checkout/index', { - mode: 'buyNow', - goods: encodeURIComponent(JSON.stringify([{ + storage.set('goods', [{ goodsId: selectShop.goods_id, goodsSkuId: selectShop.goods_sku_id, goodsNum: selectShop.buy_num, @@ -154,7 +153,8 @@ image: selectShop.image, price: selectShop.price, buy_num: selectShop.buy_num - }]))}) + }]) + this.$navTo('pages/checkout/index', { mode: 'buyNow' }) // 隐藏当前弹窗 this.onChangeValue(false) } diff --git a/store/getters.js b/store/getters.js index 3f96677..e3c6e12 100644 --- a/store/getters.js +++ b/store/getters.js @@ -1,7 +1,7 @@ const getters = { platform: state => state.app.platform, token: state => state.user.token, - userId: state => state.user.userId, + buyerId: state => state.user.buyerId, appTheme: state => state.theme.appTheme, pageQuery: state => state.page.query } diff --git a/store/modules/user.js b/store/modules/user.js index 3cec0a2..2dac087 100644 --- a/store/modules/user.js +++ b/store/modules/user.js @@ -2,51 +2,30 @@ import { ACCESS_TOKEN, USER_ID, FLAG } from '@/store/mutation-types' import storage from '@/utils/storage' import * as LoginApi from '@/api/login' -// 登陆成功后执行 -const loginSuccess = (commit, { token, buyerId, flag }) => { - // 过期时间30天 - const expiryTime = 30 * 86400 - // 保存tokne和userId到缓存 - storage.set(USER_ID, buyerId, expiryTime) - storage.set(ACCESS_TOKEN, token, expiryTime) - storage.set(FLAG, flag, expiryTime) - // 记录到store全局变量 - commit('SET_TOKEN', token) - commit('SET_USER_ID', buyerId) - commit('SET_FLAG', flag) -} - const user = { state: { - // 用户认证token token: '', - // 用户ID - userId: null, - // 用户标识 + buyerId: null, flag: null, }, mutations: { - SET_TOKEN: (state, value) => { - state.token = value - }, - SET_USER_ID: (state, value) => { - state.userId = value - }, - SET_FLAG: (state, value) => { - state.flag = value + SET_USER_INFO: (state, value) => { + state.token = value.token + state.buyerId = value.buyerId + state.flag = value.flag } }, actions: { - // 用户登录 (普通登录: 输入手机号和验证码) Login({ commit }, data) { return new Promise((resolve, reject) => { LoginApi.login({ form: data }) .then(response => { const result = response.data - loginSuccess(commit, result) + storage.set('user_info', result.buyer) + commit('SET_USER_INFO', result.buyer) resolve(response) }) .catch(reject) @@ -60,8 +39,8 @@ const user = { LoginApi.quickLogin(data) .then(response => { const result = response.data - uni.setStorageSync('user_info', result.buyer) - loginSuccess(commit, result.buyer) + storage.set('user_info', result.buyer) + commit('SET_USER_INFO', result.buyer) resolve(response) }) .catch(reject) @@ -74,7 +53,8 @@ const user = { LoginApi.loginMpWxMobile({ form: data }, { isPrompt: true }) .then(response => { const result = response.data - loginSuccess(commit, result) + uni.setStorageSync('user_info', result.buyer) + commit('SET_USER_INFO', result.buyer) resolve(response) }) .catch(reject) @@ -86,12 +66,8 @@ const user = { const store = this return new Promise((resolve, reject) => { if (store.getters.userId > 0) { - // 删除缓存中的tokne和userId - storage.remove(USER_ID) - storage.remove(ACCESS_TOKEN) - // 记录到store全局变量 - commit('SET_TOKEN', '') - commit('SET_USER_ID', null) + storage.remove('user_info') + commit('SET_USER_INFO', { token: '', flag: '', buyerId: '' }) resolve() } }) diff --git a/utils/storage.js b/utils/storage.js index 7b2ac32..199f7df 100644 --- a/utils/storage.js +++ b/utils/storage.js @@ -1,69 +1,20 @@ -/** - * 缓存数据优化 - * import storage from '@/utils/storage' - * 使用方法 【 - * 一、设置缓存 - * string storage.set('k', 'string你好啊'); - * json storage.set('k', { "b": "3" }, 2); - * array storage.set('k', [1, 2, 3]); - * boolean storage.set('k', true); - * 二、读取缓存 - * 默认值 storage.get('k') - * string storage.get('k', '你好') - * json storage.get('k', { "a": "1" }) - * 三、移除/清理 - * 移除: storage.remove('k'); - * 清理：storage.clear(); - * 】 - * @type {String} - */ - -const postfix = '_expiry' // 缓存有效期后缀 - export default { /** * 设置缓存 * @param {[type]} k [键名] * @param {[type]} v [键值] - * @param {[type]} t [时间、单位秒] */ - set(k, v, t) { + set(k, v) { uni.setStorageSync(k, v) - const seconds = parseInt(t) - if (seconds > 0) { - let timestamp = Date.parse(new Date()) - timestamp = timestamp / 1000 + seconds - uni.setStorageSync(k + postfix, timestamp + '') - } else { - uni.removeStorageSync(k + postfix) - } }, /** * 获取缓存 * @param {[type]} k [键名] - * @param {[type]} def [获取为空时默认] */ - get(k, def) { - const deadtime = parseInt(uni.getStorageSync(k + postfix)) - if (deadtime) { - if (parseInt(deadtime) < Date.parse(new Date()) / 1000) { - if (def) { - return def - } else { - return false - } - } - } - const res = uni.getStorageSync(k) - if (res) { - return res - } - if (def == undefined || def == "") { - def = false - } - return def + get(k) { + return uni.getStorageSync(k) }, /** @@ -72,7 +23,6 @@ export default { */ remove(k) { uni.removeStorageSync(k) - uni.removeStorageSync(k + postfix) }, /**