|
@@ -1,12 +1,7 @@
|
|
|
<template>
|
|
<template>
|
|
|
<view class="shop-listType_box">
|
|
<view class="shop-listType_box">
|
|
|
<view class="cat-list-area">
|
|
<view class="cat-list-area">
|
|
|
- <view v-for="item in classData" :key="item.id" :class="[categoryId===item.id?'active':'']" @click="changeCategory(item)" >
|
|
|
|
|
- <image style="width:67upx;height:50upx;" :src="item.cover" lazy-load="true" :lazy-load-margin="0" mode="aspectFill" ></image>
|
|
|
|
|
- <view style="position:absolute;background-color: rgba(0, 0, 0, 0.5);bottom:0;width: 100%;height:12upx;text-align:center;">
|
|
|
|
|
- <text style="font-size:10upx;font-weight:bold;text-align:center;">{{item.name}}</text>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ <view v-for="item in classData" :key="item.id" :class="[categoryId===item.id?'active':'']" @click="changeCategory(item)" > {{item.name}} </view>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="shop-show_box">
|
|
<view class="shop-show_box">
|
|
|
<view v-for="item in itemInfoList" :key="item.id" class="show-shop_box">
|
|
<view v-for="item in itemInfoList" :key="item.id" class="show-shop_box">
|
|
@@ -180,17 +175,16 @@ export default {
|
|
|
justify-content:flex-start;
|
|
justify-content:flex-start;
|
|
|
padding-bottom:2upx;
|
|
padding-bottom:2upx;
|
|
|
& > view {
|
|
& > view {
|
|
|
- position:relative;
|
|
|
|
|
border:1px solid #e4e4e4;
|
|
border:1px solid #e4e4e4;
|
|
|
|
|
+ padding: 12upx 0upx;
|
|
|
font-size: 10upx;
|
|
font-size: 10upx;
|
|
|
width: 68upx;
|
|
width: 68upx;
|
|
|
- height:51upx;
|
|
|
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
white-space: nowrap;
|
|
white-space: nowrap;
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
- color:white;
|
|
|
|
|
&.active {
|
|
&.active {
|
|
|
- color: yellow;
|
|
|
|
|
|
|
+ background-color: #428369;
|
|
|
|
|
+ color: #ffffff;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|