Merge branch 'dev' into 'master'

uniapp【修复】:商品分类页面无论是返回进入，重新计算购物车数量 See merge request jianweie/coreshoppro!89
2025-12-06 16:13:26 +08:00 · 2024-11-17 03:57:45 +00:00
parent 02410612e4 38b037bf79
commit 7509b9ea75
4 changed files with 55 additions and 47 deletions
--- a/CoreCms.Net.Uni-App/CoreShop/core/models/cart.ts
+++ b/CoreCms.Net.Uni-App/CoreShop/core/models/cart.ts
@@ -10,4 +10,9 @@ export interface CartListType {
 	userId ?: number;
 	weight ?: number;
 	select ?: boolean;
+}
+
+export interface CartMoneyNumType {
+	count ?: number,
+	money ?: number,
 }
--- a/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify-page/classify-five/classify-five.vue
+++ b/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify-page/classify-five/classify-five.vue
@@ -85,8 +85,8 @@
                    <image class="img" :src="handleStaticResources('/static/images/cart-bag.png')"></image>
                </view>
                <view class="price-box">
-                    <text class="num">购物车数量:{{ state.cartCount }}</text>
-                    <text class="price">￥{{ state.cartMoney }}</text>
+                    <text class="num">购物车数量:{{ props.cartData.count }}</text>
+                    <text class="price">￥{{ props.cartData.money }}</text>
                </view>
            </view>
            <view class="btn-buy" @click="handleGoPay">
@@ -126,8 +126,8 @@
    import { reactive, watch, ref, onMounted, getCurrentInstance, nextTick } from 'vue';
    import { advertPosition, UserToken, onClassifyPageHide, onClassifyPagePullDownRefresh } from '@/core/consts';
    import { useLoginStore } from '@/core/store';
-    import { queryGoodsPageList, queryCartNumAndMoney, queryGoodsDetailByToken, queryGoodsDetail, queryAddCart } from '@/core/api';
-    import type { CategoriesType, Response, GoodsListType, GoodsType } from '@/core/models';
+    import { queryGoodsPageList, queryGoodsDetailByToken, queryGoodsDetail, queryAddCart } from '@/core/api';
+    import type { CategoriesType, Response, GoodsListType, GoodsType, CartMoneyNumType } from '@/core/models';
    import { getDomInfo, handleStaticResources, handleRouteNavigateTo, handleShowToast, handleRouteSwitchTab } from '@/core/utils';
    import { AddCartEnum, PaymentTypeEnum, RouteSwitchTabEnum } from '@/core/enum';
    import GoodsDetailSkuPopup from '@/pages/components/goods-detail/components/goods-detail-sku/goods-detail-sku.vue';
@@ -142,10 +142,12 @@
        data : Array<CategoriesType>,
        height : number,
        statusBarHeight : number,
+        cartData : CartMoneyNumType,
    }>(), {
        data: () => [],
        height: 0,
        statusBarHeight: 0,
+        cartData: () => ({}),
    });

    const bigClassifyPop = ref();
@@ -190,8 +192,9 @@
    const addCartLoading = ref(false);

    const handleBuyNow = useLoadingFn(onBuyNow, buyNowLoading);
-    const handleAddCart = useLoadingFn(onAddCart, addCartLoading)
-
+    const handleAddCart = useLoadingFn(onAddCart, addCartLoading) 
+    
+    const emit = defineEmits(['getCartNumAndMoney'])

    watch(() => props.data, (newVal : Array<CategoriesType>) => {
        if (newVal) {
@@ -216,9 +219,9 @@
    })

    onMounted(() => {
-        if (uni.getStorageSync(UserToken)) {
-            getCartNumAndMoney();
-        }
+        uni.$on(onClassifyPageHide, () => {
+            state.showSku = false;
+        })

        uni.$on(onClassifyPagePullDownRefresh, () => {
            state.page = 1;
@@ -226,10 +229,6 @@
            state.goodsList = [];
        })

-        uni.$on(onClassifyPageHide, () => {
-            state.showSku = false;
-        })
-
        nextTick(async () => {
            state.bigClassifyH = ((await getDomInfo('.big-classify', instance.proxy)) as { height : number }).height;
            setTimeout(async () => {
@@ -252,13 +251,6 @@
        }
    }

-    /** 获取购物车数量和价格 */
-    const getCartNumAndMoney = async () => {
-        const cartNumAndMoney : Response<{ count : number, money : number }> = await queryCartNumAndMoney();
-        state.cartCount = cartNumAndMoney?.data?.count || 0;
-        state.cartMoney = cartNumAndMoney?.data?.money || 0;
-    }
-
    /** 选择sku */
    const handleSelectSku = (id : number) => {
        _useLoginStore.checkLogin(async () => {
@@ -296,7 +288,7 @@
        if (addCart.status) {
            handleShowToast(addCart.msg, "success");
            /** 添加成功后，重新获取购物车数量和价格 */
-            getCartNumAndMoney();
+            emit("getCartNumAndMoney");
            /** 关闭sku弹框 */
            handleChangePopup(false);
        } else {
@@ -336,7 +328,7 @@
            state.leftTabId = item?.child[0].id;
            state.leftTabList = item?.child;
            state.rightTabList = item?.child[0]?.child;
-            
+
            handleResetGoodsList();
            hanlderHidebigClassifyPop();
        }
--- a/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify-page/classify-four/classify-four.vue
+++ b/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify-page/classify-four/classify-four.vue
@@ -56,8 +56,8 @@
                    <image class="img" :src="handleStaticResources('/static/images/cart-bag.png')"></image>
                </view>
                <view class="price-box">
-                    <text class="num">购物车数量:{{ state.cartCount }}</text>
-                    <text class="price">￥{{ state.cartMoney }}</text>
+                    <text class="num">购物车数量:{{ props.cartData.count }}</text>
+                    <text class="price">￥{{ props.cartData.money }}</text>
                </view>
            </view>
            <view class="btn-buy" @click="handleGoPay">
@@ -77,8 +77,8 @@
 <script setup lang="ts">
    import { onMounted, reactive, ref, watch } from 'vue';
    import { UserToken, advertPosition, onClassifyPageHide, onClassifyPagePullDownRefresh } from '@/core/consts';
-    import { queryGoodsPageList, queryCartNumAndMoney, queryGoodsDetailByToken, queryGoodsDetail, queryAddCart } from '@/core/api';
-    import type { CategoriesType, Response, GoodsListType, GoodsType } from '@/core/models';
+    import { queryGoodsPageList, queryGoodsDetailByToken, queryGoodsDetail, queryAddCart } from '@/core/api';
+    import type { CategoriesType, Response, GoodsListType, GoodsType ,CartMoneyNumType} from '@/core/models';
    import { handleStaticResources, handleRouteNavigateTo, handleShowToast, handleRouteSwitchTab } from '@/core/utils';
    import { useLoginStore } from '@/core/store'
    import { AddCartEnum, PaymentTypeEnum, RouteSwitchTabEnum } from '@/core/enum';
@@ -91,9 +91,11 @@
    const props = withDefaults(defineProps<{
        data : Array<CategoriesType>,
        height : number,
+        cartData : CartMoneyNumType,
    }>(), {
        data: () => [],
        height: 0,
+        cartData:()=>({}),
    });

    const state = reactive<{
@@ -127,7 +129,9 @@

    const handleBuyNow = useLoadingFn(onBuyNow, buyNowLoading);
    const handleAddCart = useLoadingFn(onAddCart, addCartLoading)
-
+    
+    const emit = defineEmits(['getCartNumAndMoney'])
+    
    watch(() => props.data, (newVal : Array<CategoriesType>) => {
        if (newVal) {
            state.classifyData = newVal.map((item : CategoriesType) => {
@@ -147,10 +151,6 @@
    })

    onMounted(() => {
-        if (uni.getStorageSync(UserToken)) {
-            getCartNumAndMoney();
-        }
-
        uni.$on(onClassifyPagePullDownRefresh, () => {
            state.page = 1;
            state.totalPages = 1;
@@ -176,13 +176,6 @@
        }
    }

-    /** 获取购物车数量和价格 */
-    const getCartNumAndMoney = async () => {
-        const cartNumAndMoney : Response<{ count : number, money : number }> = await queryCartNumAndMoney();
-        state.cartCount = cartNumAndMoney?.data?.count || 0;
-        state.cartMoney = cartNumAndMoney?.data?.money || 0;
-    }
-
    /** 选择sku */
    const handleSelectSku = (id : number) => {
        _useLoginStore.checkLogin(async () => {
@@ -220,7 +213,7 @@
        if (addCart.status) {
            handleShowToast(addCart.msg, 'success');
            /** 添加成功后，重新获取购物车数量和价格 */
-            await getCartNumAndMoney();
+            emit("getCartNumAndMoney");
            /** 关闭sku弹框 */
            handleChangePopup(false);
        } else {
--- a/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify.vue
+++ b/CoreCms.Net.Uni-App/CoreShop/pages/classify/classify.vue
@@ -33,10 +33,10 @@
                <classifyThree v-else-if="shopConfigStore.config.cateStyle == GoodsListEnum.three"
                    :data="state.categoriesList" :height="state.height"></classifyThree>
                <classifyFour v-else-if="shopConfigStore.config.cateStyle == GoodsListEnum.four"
-                    :data="state.categoriesList" :height="state.height">
+                    :data="state.categoriesList" :cartData="state.cartData" :height="state.height" @getCartNumAndMoney="getCartNumAndMoney">
                </classifyFour>
                <classifyFive v-else-if="shopConfigStore.config.cateStyle == GoodsListEnum.five"
-                    :data="state.categoriesList" :height="state.height" :statusBarHeight="statusBarHeight">
+                    :data="state.categoriesList" :cartData="state.cartData" :height="state.height" :statusBarHeight="statusBarHeight"  @getCartNumAndMoney="getCartNumAndMoney">
                </classifyFive>
            </view>
        </view>
@@ -45,13 +45,13 @@

 <script setup lang="ts">
    import { onMounted, reactive, watchEffect, ref } from 'vue';
-    import { onHide, onPullDownRefresh } from '@dcloudio/uni-app';
+    import { onHide, onPullDownRefresh, onShow } from '@dcloudio/uni-app';
    import { useShopConfigStore } from '@/core/store';
-    import { queryAllCategories } from '@/core/api';
+    import { queryAllCategories, queryCartNumAndMoney } from '@/core/api';
    import { GoodsListEnum } from '@/core/enum';
    import { handleRouteNavigateTo } from '@/core/utils';
-    import { onClassifyPageHide, onClassifyPagePullDownRefresh } from '@/core/consts';
-    import type { Response, ShopConfigStoreType, CategoriesType } from '@/core/models';
+    import { onClassifyPageHide, onClassifyPagePullDownRefresh, UserToken } from '@/core/consts';
+    import type { Response, ShopConfigStoreType, CategoriesType ,CartMoneyNumType} from '@/core/models';
    import classifyOne from './classify-page/classify-one/classify-one.vue';
    import classifyTwo from './classify-page/classify-two/classify-two.vue';
    import classifyThree from './classify-page/classify-three/classify-three.vue';
@@ -70,10 +70,12 @@
        categoriesList : Array<CategoriesType>,
        height : number,
        keyWord : string;
+        cartData : CartMoneyNumType;
    }>({
        categoriesList: [],
        height: 0,
        keyWord: "",
+        cartData: {},
    })

    const handleuAllCategories = useLoadingFn(getAllCategories, loading);
@@ -88,10 +90,17 @@
    })

    onHide(() => {
-        /** 触发自定义onhide事件，让后代组件监听页面是关闭 */
+        /** 触发自定义onhide事件，让后代组件监听页面是关闭 - 用于关闭sku弹框 */
        uni.$emit(onClassifyPageHide);
    });

+    onShow(() => {
+        if ((shopConfigStore.config.cateStyle == GoodsListEnum.four || shopConfigStore.config.cateStyle == GoodsListEnum.five) &&
+            uni.getStorageSync(UserToken)) {
+            getCartNumAndMoney();
+        }
+    });
+
    onPullDownRefresh(async () => {
        /** 触发onPullDownRefresh事件，让后代组件监听页面是下拉刷新 */
        uni.$emit(onClassifyPagePullDownRefresh);
@@ -101,12 +110,21 @@
    });


-    /** 获取购物车数量价格 */
+    /** 获取数据分类 */
    async function getAllCategories() {
        const allCategories : Response<Array<CategoriesType>> = await queryAllCategories();
        state.categoriesList = allCategories.data || [];
    }

+    /** 获取购物车数量和价格 */
+    const getCartNumAndMoney = async () => {
+        const cartNumAndMoney : Response<{ count : number, money : number }> = await queryCartNumAndMoney();
+        state.cartData = {
+            count: cartNumAndMoney?.data?.count || 0,
+            money: cartNumAndMoney?.data?.money || 0,
+        }
+    }
+
    /** 搜索 */
    const handleSearch = () => {
        handleRouteNavigateTo(`/pages/category/category?key=${state.keyWord}`);