|
|
|
@ -13,8 +13,11 @@ |
|
|
|
<scroll-view class="cate-left" scroll-y="true"> |
|
|
|
<view class="type-nav" :class="{ selected: curIndex == index }" v-for="(item, index) in menus" :key="index" |
|
|
|
@click="handleSelectNav(index)"> |
|
|
|
<image class="cate-left-image" :src="'./static/tabbar/'+item.image"></image> |
|
|
|
<text class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</text> |
|
|
|
<view> |
|
|
|
<image class="cate-left-image" :src="'./static/tabbar/'+item.image"></image> |
|
|
|
<view class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</view> |
|
|
|
</view> |
|
|
|
<!-- <text class="cate-left-text" :class="curIndex == index ? item.class : ''">{{ item.name }}</text> --> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
<!-- 右侧 二级分类 --> |
|
|
|
@ -289,17 +292,59 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 左侧一级分类 |
|
|
|
// .type-nav { |
|
|
|
// position: relative; |
|
|
|
// height: 180rpx; |
|
|
|
// z-index: 10; |
|
|
|
// font-size: 26rpx; |
|
|
|
// display: flex; |
|
|
|
// justify-content: center; |
|
|
|
// align-items: center; |
|
|
|
// font-weight: bold; |
|
|
|
|
|
|
|
// &.selected { |
|
|
|
// background: #fff; |
|
|
|
// color: #cec7bf; |
|
|
|
// border-right: none; |
|
|
|
// font-size: 28rpx; |
|
|
|
// font-weight: bold; |
|
|
|
// } |
|
|
|
|
|
|
|
// .cate-left-image{ |
|
|
|
// position: absolute; |
|
|
|
// width: 50rpx; |
|
|
|
// height: 50rpx; |
|
|
|
// border-radius: 10rpx; |
|
|
|
// margin-bottom: 20rpx; |
|
|
|
// } |
|
|
|
// .cate-left-text{ |
|
|
|
// position: absolute; |
|
|
|
// margin-top: 80rpx; |
|
|
|
// } |
|
|
|
// .selected-0 { |
|
|
|
// color: #d81e06; |
|
|
|
// } |
|
|
|
// .selected-1 { |
|
|
|
// color: #d4237a; |
|
|
|
// } |
|
|
|
// .selected-2 { |
|
|
|
// color: #13227a; |
|
|
|
// } |
|
|
|
// } |
|
|
|
|
|
|
|
// 左侧一级分类 |
|
|
|
.type-nav { |
|
|
|
position: relative; |
|
|
|
// position: relative; |
|
|
|
height: 180rpx; |
|
|
|
z-index: 10; |
|
|
|
// z-index: 10; |
|
|
|
font-size: 26rpx; |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
text-align: center; |
|
|
|
align-items: center; |
|
|
|
font-weight: bold; |
|
|
|
|
|
|
|
|
|
|
|
&.selected { |
|
|
|
background: #fff; |
|
|
|
color: #cec7bf; |
|
|
|
@ -307,27 +352,27 @@ export default { |
|
|
|
font-size: 28rpx; |
|
|
|
font-weight: bold; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.cate-left-image{ |
|
|
|
position: absolute; |
|
|
|
// position: absolute; |
|
|
|
width: 50rpx; |
|
|
|
height: 50rpx; |
|
|
|
border-radius: 10rpx; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
.cate-left-text{ |
|
|
|
position: absolute; |
|
|
|
margin-top: 80rpx; |
|
|
|
} |
|
|
|
.selected-0 { |
|
|
|
color: #d81e06; |
|
|
|
} |
|
|
|
.selected-1 { |
|
|
|
color: #d4237a; |
|
|
|
} |
|
|
|
.selected-2 { |
|
|
|
color: #13227a; |
|
|
|
// position: absolute; |
|
|
|
// margin-top: 5px; |
|
|
|
} |
|
|
|
.selected-0 { |
|
|
|
color: #d81e06; |
|
|
|
} |
|
|
|
.selected-1 { |
|
|
|
color: #d4237a; |
|
|
|
} |
|
|
|
.selected-2 { |
|
|
|
color: #13227a; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 右侧二级分类 |
|
|
|
|
