From 36e794d948b856f2a542aaadd0e374892635be14 Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期三, 25 六月 2025 21:19:17 +0800
Subject: [PATCH] 自定义顶部组件优化
---
pages/kitchen/KitchenVideo.vue | 2 +
pages.json | 51 +++++++++----------------
pages/mine/activity/reportActivity.vue | 2
components/TopBar.vue | 11 ++++-
uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue | 1
pages/health/healthVideo.vue | 14 ++++++
components/custom-tabbar.vue | 6 +-
pages/tabbar/index/home.vue | 2
pages/commodity-square/commoditySquare.vue | 6 +-
9 files changed, 51 insertions(+), 44 deletions(-)
diff --git a/components/TopBar.vue b/components/TopBar.vue
index 64913f8..b1d6ffe 100644
--- a/components/TopBar.vue
+++ b/components/TopBar.vue
@@ -8,10 +8,11 @@
v-for="(item, index) in titleList"
:key="index"
:class="{active: selectedTitleIndex === item.index, 'title-item': true}"
+ :style="{color: textColor}"
@click="changeTab(item)"
>
<text>{{item.title}}</text>
- <view class="underline" v-if="selectedTitleIndex === item.index"></view>
+ <view class="underline" :style="{backgroundColor: textColor}" v-if="selectedTitleIndex === item.index"></view>
</view>
</view>
</scroll-view>
@@ -26,6 +27,10 @@
selectedTitleIndex: {
type: String,
default: 'home'
+ },
+ textColor: {
+ type: String,
+ default: 'white'
}
},
data() {
@@ -117,7 +122,7 @@
position: relative;
padding: 0 24rpx;
font-size: 32rpx;
- color: white;
+ /* color: white; */
height: 100%;
display: flex;
align-items: center;
@@ -136,7 +141,7 @@
transform: translateX(-50%);
width: calc(100% - 76rpx);
height: 4rpx;
- background-color: white;
+ /* background-color: white; */
border-radius: 4rpx;
}
</style>
\ No newline at end of file
diff --git a/components/custom-tabbar.vue b/components/custom-tabbar.vue
index 75aec2e..7d29bed 100644
--- a/components/custom-tabbar.vue
+++ b/components/custom-tabbar.vue
@@ -48,12 +48,12 @@
},
{
// "pagePath": "/pages/tabbar/category/category",
- "pagePath": "/pages/commodity-square/commoditySquare",
+ "pagePath": "/pages/kitchen/KitchenVideo",
"iconPath": "/static/tabbar/category.png",
"selectedIconPath": "/static/tabbar/category-s.png",
- "text": "鍟嗗煄",
- "key": 'shop'
+ "text": "绁炲帹",
+ "key": 'kitchen'
},
{
"pagePath": "/pages/tabbar/video/video",
diff --git a/pages.json b/pages.json
index 49495a3..e03183c 100644
--- a/pages.json
+++ b/pages.json
@@ -36,6 +36,13 @@
}
},
{
+ "path": "pages/kitchen/KitchenVideo",
+ "style": {
+ "navigationBarTitleText": "绁炲帹",
+ "navigationStyle": "custom" // 闅愯棌绯荤粺瀵艰埅鏍�
+ }
+ },
+ {
"path": "pages/tabbar/home/title",
"style": {
"navigationBarTitleText": "娑堟伅"
@@ -65,7 +72,7 @@
{
// "path": "pages/tabbar/category/category",
"path": "pages/commodity-square/commoditySquare",
-
+
"style": {
"navigationBarTitleText": "鍟嗗搧骞垮満",
"navigationStyle": "custom", // 闅愯棌绯荤粺瀵艰埅鏍�
@@ -988,7 +995,7 @@
},
{
"path" : "video-goods-detail",
- "style" :
+ "style" :
{
"navigationBarTitleText" : "瑙嗛鎺ㄨ崘鍟嗗搧",
"componentPlaceholder": {
@@ -1440,27 +1447,7 @@
"navigationStyle": "custom"
}
}]
- },
- {
- "root": "pages/kitchen",
- "pages": [{
- "path": "KitchenVideo",
- "style": {
- "navigationBarTitleText": "鍘ㄧ"
- }
- }]
- },
- {
- "root": "pages/supplier",
- "pages": [{
- "path" : "suppler-order/suppler-order",
- "style" :
- {
- "navigationBarTitleText" : ""
- }
- }]
}
-
// ,
// {
// "root": "pages/commodity-square",
@@ -1498,13 +1485,13 @@
"selectedIconPath": "static/tabbar/home-s.png",
"text": "棣栭〉"
},
- // {
- // // "pagePath": "pages/tabbar/category/category",
- // "pagePath": "pages/commodity-square/commoditySquare",
- // "iconPath": "static/tabbar/category.png",
- // "selectedIconPath": "static/tabbar/category-s.png",
- // "text": "鍟嗗煄"
- // },
+ {
+ // "pagePath": "pages/tabbar/category/category",
+ "pagePath": "pages/kitchen/KitchenVideo",
+ "iconPath": "static/tabbar/category.png",
+ "selectedIconPath": "static/tabbar/category-s.png",
+ "text": "绁炲帹"
+ },
{
"pagePath": "pages/tabbar/video/video",
"iconPath": "static/tabbar/video.png",
@@ -1524,11 +1511,11 @@
}
]
},
- // #todo 涓轰粈涔堣娉ㄩ噴condition涓嬩唬鐮侊紵
+ // #todo 涓轰粈涔堣娉ㄩ噴condition涓嬩唬鐮侊紵
// IOS plus.runtime.arguments 娣诲姞 condition鑺傜偣鍚庯紝 妗嗘灦浼氫慨鏀� runtime.arguments
// 浼氬奖鍝嶄粈涔堝姛鑳斤紵
// -鍦╤5涓敜閱抋pp浼氫竴鐩磋繑鍥為粯璁ゅ�� {"name":"","path":"","query":"","id":0}
- "condition": { //妯″紡閰嶇疆锛屼粎寮�鍙戞湡闂寸敓鏁�
+ "condition": { //妯″紡閰嶇疆锛屼粎寮�鍙戞湡闂寸敓鏁�
// "current": 0, //褰撳墠婵�娲荤殑妯″紡(list 鐨勭储寮曢」)
// "list": [{
// "name": "", //妯″紡鍚嶇О
@@ -1536,4 +1523,4 @@
// "query": "" //鍚姩鍙傛暟锛屽湪椤甸潰鐨刼nLoad鍑芥暟閲岄潰寰楀埌
// }]
}
-}
+}
\ No newline at end of file
diff --git a/pages/commodity-square/commoditySquare.vue b/pages/commodity-square/commoditySquare.vue
index e83e4e5..8a0e232 100644
--- a/pages/commodity-square/commoditySquare.vue
+++ b/pages/commodity-square/commoditySquare.vue
@@ -1,6 +1,6 @@
<template>
<view class="container">
- <top-bar selectedTitleIndex="shop" @changeTab="topBarChange" class="topBar"></top-bar>
+ <top-bar selectedTitleIndex="shop" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>
<input type="text" v-show="false" v-model="flushDom" />
<view class="search">
<u-search class="nav-search" @blur='searchGoods' placeholder="鎼滅储鍟嗗搧" :show-action="false"></u-search>
@@ -49,7 +49,7 @@
<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')"
+ <uni-drawer ref="showLeft" mode="left" width="120" height="80vh" @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}"
@@ -303,7 +303,7 @@
.openShowLeft {
position: fixed;
- top: 120rpx;
+ top: 200rpx;
left: 0;
align-items: center;
justify-content: flex-start;
diff --git a/pages/health/healthVideo.vue b/pages/health/healthVideo.vue
index 4ac5030..8fef229 100644
--- a/pages/health/healthVideo.vue
+++ b/pages/health/healthVideo.vue
@@ -1,6 +1,6 @@
<template>
<view class="video-container">
- <top-bar selectedTitleIndex="health" @changeTab="topBarChange" class="topBar"></top-bar>
+ <top-bar selectedTitleIndex="health" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>
<!-- 瑙嗛鍔犺浇 -->
<zero-loading v-show="videoLoading" type="circle" color="#0ebd57" text=""></zero-loading>
<!-- 瑙嗛鍒楄〃 -->
@@ -250,6 +250,7 @@
import { getUserInfo } from "@/api/members";
import storage from "@/utils/storage.js";
export default {
+ components: {TopBar},
computed: {
hasPlayTime() {
return this.sliderFormatTime(this.progress > 0 ? this.duration * this.progress / 100 : 0);
@@ -381,6 +382,17 @@
}
},
methods: {
+ topBarChange(titleObj) {
+ if (titleObj.index === 'home') {
+ uni.switchTab({
+ url: titleObj.pagePath
+ });
+ } else {
+ uni.redirectTo({
+ url: titleObj.pagePath
+ });
+ }
+ },
// 闈欓粯鐧诲綍
wxSilentLogin(callback) {
//鑾峰彇code
diff --git a/pages/kitchen/KitchenVideo.vue b/pages/kitchen/KitchenVideo.vue
index adb9b71..a01aae6 100644
--- a/pages/kitchen/KitchenVideo.vue
+++ b/pages/kitchen/KitchenVideo.vue
@@ -247,6 +247,8 @@
</scroll-view>
</uni-drawer>
<view v-if="videoList.length===0" style="display: flex;align-items: center;justify-content: center;background-color: #fff;height: 100%">褰撳墠娌℃湁鍙互鏌ョ湅鐨勮棰�</view>
+
+ <custom-tabbar bgColor="#ffffff" selected="kitchen"></custom-tabbar>
</view>
</template>
diff --git a/pages/mine/activity/reportActivity.vue b/pages/mine/activity/reportActivity.vue
index 017f929..4929634 100644
--- a/pages/mine/activity/reportActivity.vue
+++ b/pages/mine/activity/reportActivity.vue
@@ -1,6 +1,6 @@
<template>
<view class="wrapper">
- <top-bar selectedTitleIndex="activity" @changeTab="topBarChange" class="topBar"></top-bar>
+ <top-bar selectedTitleIndex="activity" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>
<view style="height: 100rpx"></view>
<!-- 鍐呭鍖哄煙 -->
diff --git a/pages/tabbar/index/home.vue b/pages/tabbar/index/home.vue
index 4e2f810..9aebf49 100644
--- a/pages/tabbar/index/home.vue
+++ b/pages/tabbar/index/home.vue
@@ -1,6 +1,6 @@
<template>
<view class="video-container">
- <top-bar selectedTitleIndex="home" @changeTab="topBarChange" class="topBar"></top-bar>
+ <top-bar selectedTitleIndex="home" textColor="white" @changeTab="topBarChange" class="topBar"></top-bar>
<!-- 瑙嗛鍔犺浇 -->
<zero-loading v-show="videoLoading" type="circle" color="#0ebd57" text=""></zero-loading>
<!-- 瑙嗛鍒楄〃 -->
diff --git a/uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue b/uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue
index 4d0deef..5608140 100644
--- a/uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue
+++ b/uni_modules/uni-drawer/components/uni-drawer/uni-drawer.vue
@@ -154,6 +154,7 @@
}
.custom-style{
border-radius: 0 24rpx 24rpx 0;
+ top: 100px;
}
.uni-drawer--left {
--
Gitblit v1.8.0