This commit is contained in:
杨鹏
2025-10-10 21:56:04 +08:00
parent 1aba303ed9
commit 0f450c6691
4 changed files with 35 additions and 40 deletions
+19 -24
View File
@@ -6,10 +6,8 @@
:key="item.text" :key="item.text"
@tap="sheep.$router.go(item.url)" @tap="sheep.$router.go(item.url)"
> >
<cover-view class="content-box"> <cover-image class="tabbar-icon" :src="sheep.$url.cdn(item.iconUrl)" />
<cover-image class="tabbar-icon" :src="sheep.$url.cdn(item.iconUrl)" /> <cover-view class="active-line" v-show="activeUrl === item.url" />
<cover-view class="active-line" v-show="activeUrl === item.url" />
</cover-view>
</cover-view> </cover-view>
</cover-view> </cover-view>
</template> </template>
@@ -47,28 +45,25 @@
background: #fff; background: #fff;
.cover-tabbar-item { .cover-tabbar-item {
flex: 1; width: 20%;
height: 20px;
position: relative;
.content-box { .tabbar-icon {
display: flex; width: 16px;
flex-direction: column; height: 16px;
align-items: center; position: absolute;
position: relative; left: calc(50% - 8px);
height: 32px; top: 0;
}
.tabbar-icon { .active-line {
width: 25px; width: 12px;
height: 25px; height: 1px;
} background: #000;
position: absolute;
.active-line { left: calc(50% - 6px);
width: 20rpx; bottom: 0;
height: 1rpx;
background: #000;
position: absolute;
left: calc(50% - 10rpx);
bottom: 0rpx;
}
} }
} }
} }
+2 -2
View File
@@ -86,8 +86,8 @@
} }
&__slot-icon { &__slot-icon {
width: 25px; width: 16px;
height: 25px; height: 16px;
} }
} }
} }
+10 -10
View File
@@ -199,32 +199,32 @@ const adaptTemplate = async (appTemplate, templateId) => {
appTemplate.basic.tabbar.items = [ appTemplate.basic.tabbar.items = [
{ {
activeIconUrl: "https://puton.huimeimeta.com/imgs/home.png", activeIconUrl: "https://puton.huimeimeta.com/imgs/Home.png",
iconUrl: "https://puton.huimeimeta.com/imgs/home.png", iconUrl: "https://puton.huimeimeta.com/imgs/Home.png",
text: "首页", text: "首页",
url: "/pages/index/index", url: "/pages/index/index",
}, },
{ {
activeIconUrl: "https://puton.huimeimeta.com/imgs/list.png", activeIconUrl: "https://puton.huimeimeta.com/imgs/List.png",
iconUrl: "https://puton.huimeimeta.com/imgs/list.png", iconUrl: "https://puton.huimeimeta.com/imgs/List.png",
text: "商品列表", text: "商品列表",
url: "/pages/index/list", url: "/pages/index/list",
}, },
{ {
activeIconUrl: "https://puton.huimeimeta.com/imgs/room.png", activeIconUrl: "https://puton.huimeimeta.com/imgs/Room.png",
iconUrl: "https://puton.huimeimeta.com/imgs/room.png", iconUrl: "https://puton.huimeimeta.com/imgs/Room.png",
text: "试衣间", text: "试衣间",
url: "/pages/index/room", url: "/pages/index/room",
}, },
{ {
activeIconUrl: "https://puton.huimeimeta.com/imgs/cart.png", activeIconUrl: "https://puton.huimeimeta.com/imgs/Vector.png",
iconUrl: "https://puton.huimeimeta.com/imgs/cart.png", iconUrl: "https://puton.huimeimeta.com/imgs/Vector.png",
text: "购物车", text: "购物车",
url: "/pages/index/cart", url: "/pages/index/cart",
}, },
{ {
activeIconUrl: "https://puton.huimeimeta.com/imgs/my.png", activeIconUrl: "https://puton.huimeimeta.com/imgs/My.png",
iconUrl: "https://puton.huimeimeta.com/imgs/my.png", iconUrl: "https://puton.huimeimeta.com/imgs/My.png",
text: "我的", text: "我的",
url: "/pages/index/user", url: "/pages/index/user",
}, },
+4 -4
View File
@@ -223,12 +223,12 @@
justify-content: center; justify-content: center;
.active-line { .active-line {
width: 20rpx; width: 12px;
height: 1rpx; height: 1px;
background: #000; background: #000;
position: absolute; position: absolute;
left: calc(50% - 10rpx); left: calc(50% - 6px);
bottom: -5rpx; bottom: 0px;
} }
} }