update 修改商品广场页面

peng

2025-06-27 4c3dbf9c9d6e4c657d059c64803ad0e752753576

update 修改商品广场页面

 pages/commodity-square/commoditySquare.vue

@@ -2,9 +2,10 @@
    <view class="container">
        <top-bar selectedTitleIndex="shop" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>
        <input type="text" v-show="false" v-model="flushDom" />
        <view class="search">
        <view class="search" :style="{marginTop: buttonHeight+10+'px',}">
            <u-search class="nav-search" @blur='searchGoods' placeholder="搜索商品" :show-action="false"></u-search>
        </view>
        <scroll-view class="scrollContainer"  :scroll-y="true" @scrolltolower="loadMoreData" >
        <view class="commoditySquare">
            <view class="left" style="width: 310rpx;">
                <view class="commoditySquareItem" v-for="(item,index) in goodsList1"
@@ -20,7 +21,7 @@
                        <view class="goodsName">{{item.goodsName}}</view>
                        <view class="priceInfo">
                            <view class="goodsPrice">￥{{item.price}}</view>
                            <view class="">已售: {{item.buyCount}}</view>
                            <view class="">已售1: {{item.buyCount}}</view>
                        </view>
                    </view>
                </view>
@@ -39,17 +40,20 @@
                        <view class="goodsName">{{item.goodsName}}</view>
                        <view class="priceInfo">
                            <view class="goodsPrice">￥{{item.price}}</view>
                            <view class="">已售: {{item.buyCount}}</view>
                            <view class="">已售2: {{item.buyCount}}</view>
                        </view>
                    </view>
                </view>
            </view>


            <view class="openShowLeft" @click="showDrawer('showLeft')" v-if="!showLeft">
                <uni-icons type="right" size="30"></uni-icons>
            </view>
            <uni-drawer ref="showLeft" mode="left" width="120" height="80vh" @change="change($event,'showLeft')"
        </view>
        <view style="display: flex;align-items: center;justify-content: center;margin-top: 20rpx;" v-if="canLoadMore">
            没有更多数据了.................</view>
        </scroll-view>
            <uni-drawer ref="showLeft" mode="left" width="120" height="80vh" :drawerTop="buttonHeight" @change="change($event,'showLeft')"
                :cus-style="true" class="navigationLeft">
                <scroll-view class="typeNavigation" :scroll-y="true" show-scrollbar="false">
                    <view class="typeNavigationItem" :class="{typeNavigationItemCheck:currentCategort ==item.id}"
@@ -58,9 +62,6 @@
                    </view>
                </scroll-view>
            </uni-drawer>
        </view>
        <view style="display: flex;align-items: center;justify-content: center;margin-top: 20rpx;" v-if="canLoadMore">
            没有更多数据了.................</view>
    </view>
</template>

@@ -77,6 +78,7 @@
        components: {TopBar},
        data() {
            return {
                buttonHeight:0,
                //记录两列高度
                listHeight1: 0,
                listHeight2: 0,
@@ -172,6 +174,16 @@
                    url: `/pages/product/goods?id=${item.id}&goodsId=${item.goodsId}`
                });
            },
            //触底获取数据
            async loadMoreData() {
                if (this.getGoodsParam.pageNumber < this.maxPages) {
                    this.getGoodsParam.pageNumber++;
                    await this.getgoodsData()
                } else {
                    this.canLoadMore = true;
                }
			
            },
            //获取分类导航栏
            async loadCategoryList() {
                let list = await getCategoryList(0);
@@ -240,20 +252,15 @@
            this.showDrawer('showLeft')
        },
        async onLoad() {
            // 获取状态栏高度
            const systemInfo = uni.getSystemInfoSync();
            this.buttonHeight = systemInfo.statusBarHeight +80;
            console.log('-------------------------------->',this.buttonHeight)
            await this.loadCategoryList();
            this.getGoodsParam.pageNumber = 1
            this.getGoodsParam.categoryId = ""
            this.getGoodsParam.keyword = ""
            await this.getgoodsData()
        },
        async onReachBottom() {
            if (this.getGoodsParam.pageNumber < this.maxPages) {
                this.getGoodsParam.pageNumber++;
                await this.getgoodsData()
            } else {
                this.canLoadMore = true;
            }

        }
    }
</script>
@@ -262,16 +269,22 @@
    .container {
        width: 750rpx;
        padding-bottom: 64rpx;
        height: 100vh;
        overflow: hidden;
    }

    .commoditySquare {
        width: 750rpx;
        position: relative;
        box-sizing: border-box;
        display: flex;
        justify-content: space-around;
        height: 100%;
    }

    .scrollContainer{
        overflow: hidden;
        height: 1224rpx;
        -webkit-overflow-scrolling: touch;
    }
    .left {
        box-sizing: border-box;
    }
@@ -323,13 +336,13 @@
    }


    .scroll-view {
        /* #ifndef APP-NVUE */
        width: 100%;
        height: 100%;
        /* #endif */
        flex: 1
    }
    // .scroll-view {
    //     /* #ifndef APP-NVUE */
    //     width: 100%;
    //     height: 100%;
    //     /* #endif */
    //     flex: 1
    // }

    // .priceInfo {
    //     margin-top: 10rpx;
@@ -338,14 +351,14 @@
    // }

    // 处理抽屉内容滚动
    .scroll-view-box {
        flex: 1;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
    // .scroll-view-box {
    //     flex: 1;
    //     position: absolute;
    //     top: 0;
    //     right: 0;
    //     bottom: 0;
    //     left: 0;
    // }


    .typeNavigation {

 pages/kitchen/KitchenVideo.vue

@@ -237,7 +237,7 @@
        </view>
      </view>
    </uni-popup>
    <uni-drawer ref="showLeft" mode="left" width="120" :cus-style="true" height="93vh"
    <uni-drawer ref="showLeft" mode="left" width="120" :cus-style="true" height="80vh"
                @change="change($event,'showLeft')" class="navigationLeft">
      <scroll-view class="typeNavigation" :scroll-y="true" :show-scrollbar="false">
        <view class="typeNavigationItem" :class="{typeNavigationItemCheck:currentCategort ==item.id}"

 uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue

@@ -1,7 +1,7 @@
<template>
    <view v-if="visibleSync" :class="{ 'uni-drawer--visible': showDrawer }" class="uni-drawer" @touchmove.stop.prevent="clear">
        <view class="uni-drawer__mask" :class="{ 'uni-drawer__mask--visible': showDrawer && mask }" @tap="close('mask')" />
        <view class="uni-drawer__content" :class="{'uni-drawer--right': rightMode,'uni-drawer--left': !rightMode, 'uni-drawer__content--visible': showDrawer,'custom-style':cusStyle}" :style="{width:drawerWidth+'px',maxHeight:drawerHeight}">
        <view class="uni-drawer__content" :class="{'uni-drawer--right': rightMode,'uni-drawer--left': !rightMode, 'uni-drawer__content--visible': showDrawer,'custom-style':cusStyle}" :style="{width:drawerWidth+'px',maxHeight:drawerHeight,top:drawerTop+'rpx'}">
            <slot />
        </view>
        <!-- #ifdef H5 -->
@@ -76,6 +76,10 @@
            cusStyle: {
                type: Boolean,
                default: false
            },
            drawerTop:{
                type: Number,
                default: 0
            }
        },
        data() {
@@ -86,12 +90,14 @@
                watchTimer: null,
                drawerWidth: 220,
                drawerHeight: null,
                drawerTop:0
            }
        },
        created() {
            // #ifndef APP-NVUE
            this.drawerWidth = this.width
            this.drawerHeight = this.height
            this.drawerTop = this.drawerTop
            console.log("执行了",this.drawerHeight,this.height)
            // #endif
            this.rightMode = this.mode === 'right'
@@ -154,7 +160,6 @@
    }
    .custom-style{
        border-radius: 0 24rpx 24rpx 0;
        top: 100px;
    }

    .uni-drawer--left {