From ca1ce1acc217be0b510e7ee44fcdd3ee85558fde Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期日, 29 六月 2025 20:00:25 +0800
Subject: [PATCH] 视频发布、编辑页面优化、绿满筐名字更换
---
pages/commodity-square/commoditySquare.vue | 135 +++++++++++++++++++++++++++++---------------
1 files changed, 88 insertions(+), 47 deletions(-)
diff --git a/pages/commodity-square/commoditySquare.vue b/pages/commodity-square/commoditySquare.vue
index d7c7fad..2512eaa 100644
--- a/pages/commodity-square/commoditySquare.vue
+++ b/pages/commodity-square/commoditySquare.vue
@@ -1,10 +1,12 @@
<template>
<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+'px',}">
<u-search class="nav-search" @blur='searchGoods' placeholder="鎼滅储鍟嗗搧" :show-action="false"></u-search>
</view>
- <view class="commoditySquare">
+ <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"
@click="goToGoodsInfo('goodsList1',item.id)">
@@ -12,7 +14,7 @@
:controls="false" object-fit="contain" :show-play-btn="false" :show-center-play-btn="false"
@loadedmetadata="getvideoInfo($event,'goodsList1',index)" :ref="'video'+item.id"
:style="{width:item.width,height:item.height}"></video> -->
- <image :src="item.thumbnail"
+ <image :src="item.thumbnail"
mode="aspectFill" class="goodsImg">
</image>
<view class="goodsInfo">
@@ -31,7 +33,7 @@
:controls="false" object-fit="contain" :show-play-btn="false" :show-center-play-btn="false"
@loadedmetadata="getvideoInfo($event,'goodsList2',index)" :ref="'video'+item.id"
:style="{width:item.width,height:item.height}"></video> -->
- <image :src="item.thumbnail"
+ <image :src="item.thumbnail"
mode="aspectFill" class="goodsImg">
</image>
<view class="goodsInfo">
@@ -44,27 +46,27 @@
</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="94vh" @change="change($event,'showLeft')"
- :cus-style="true" class="navigationLeft">
- <scroll-view class="typeNavigation" :scroll-y="true" show-scrollbar="false">
+ </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" :mask="false">
+ <scroll-view class="typeNavigation" :scroll-y="true" :show-scrollbar="false" >
<view class="typeNavigationItem" :class="{typeNavigationItemCheck:currentCategort ==item.id}"
@click="chooseCategory(item.id)" v-for="item in categoryList" :key="item.id">
{{item.name}}
</view>
</scroll-view>
</uni-drawer>
- </view>
- <view style="display: flex;align-items: center;justify-content: center;margin-top: 20rpx;" v-if="canLoadMore">
- 娌℃湁鏇村鏁版嵁浜�.................</view>
- <custom-tabbar bgColor="#ffffff" selected="shop"></custom-tabbar>
</view>
</template>
<script>
+ import TopBar from "@/components/TopBar.vue";
import {
getCategoryList,
getGoodsList
@@ -73,8 +75,10 @@
getSTSToken
} from '@/api/common.js'
export default {
+ components: {TopBar},
data() {
return {
+ buttonHeight:0,
//璁板綍涓ゅ垪楂樺害
listHeight1: 0,
listHeight2: 0,
@@ -104,6 +108,17 @@
}
},
methods: {
+ topBarChange(titleObj) {
+ if (titleObj.index === 'home') {
+ uni.switchTab({
+ url: titleObj.pagePath
+ });
+ } else {
+ uni.redirectTo({
+ url: titleObj.pagePath
+ });
+ }
+ },
async searchGoods(keyWard) {
this.getGoodsParam.keyword = keyWard
this.getGoodsParam.pageNumber = 1
@@ -158,6 +173,16 @@
uni.navigateTo({
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() {
@@ -227,20 +252,15 @@
this.showDrawer('showLeft')
},
async onLoad() {
+ // 鑾峰彇鐘舵�佹爮楂樺害
+ const systemInfo = uni.getSystemInfoSync();
+ this.buttonHeight = systemInfo.statusBarHeight +40;
+ 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>
@@ -249,16 +269,27 @@
.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;
+ }
+ .scrollContainer::-webkit-scrollbar {
+ display: none; /* Chrome/Safari绛� */
+ width: 0 !important; /* 鍏煎iOS */
+ height: 0 !important;
+ }
.left {
box-sizing: border-box;
}
@@ -290,7 +321,7 @@
.openShowLeft {
position: fixed;
- top: 120rpx;
+ top: 200rpx;
left: 0;
align-items: center;
justify-content: flex-start;
@@ -310,13 +341,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;
@@ -325,14 +356,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 {
@@ -347,13 +378,12 @@
font-size: 28rpx;
color: black;
margin-top: 10rpx;
- border-radius: 12rpx;
- border: 1rpx solid gray;
}
.typeNavigationItemCheck {
- background-color: #42b993;
- color: #fff;
+ color: #ef321e;
+ font-size: 32rpx;
+ font-weight: bold;
border: 0;
}
@@ -379,9 +409,14 @@
flex-direction: column;
}
.goodsName{
- display: flex;
- align-items: center;
- justify-content: center;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 1;
+ height: 32rpx;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ text-align: center;
+ vertical-align: middle;
}
.priceInfo{
margin-top: 10rpx;
@@ -393,4 +428,10 @@
color: red;
font-weight: bold;
}
-</style>
\ No newline at end of file
+ .topBar {
+ position: fixed;
+ top: 20rpx;
+ left: 20rpx;
+ z-index: 1000
+ }
+</style>
--
Gitblit v1.8.0