feat 添加商品详情页的店铺信息接口对接,店铺详情页
This commit is contained in:
parent
860f89d0c5
commit
fb7a1be9b4
3
app.json
3
app.json
@ -33,7 +33,8 @@
|
|||||||
"pages/order/fill-tracking-no/index",
|
"pages/order/fill-tracking-no/index",
|
||||||
"pages/order/delivery-detail/index",
|
"pages/order/delivery-detail/index",
|
||||||
"pages/order/invoice/index",
|
"pages/order/invoice/index",
|
||||||
"pages/usercenter/name-edit/index"
|
"pages/usercenter/name-edit/index",
|
||||||
|
"pages/shop/all-goods/index"
|
||||||
],
|
],
|
||||||
"tabBar": {
|
"tabBar": {
|
||||||
"custom": true,
|
"custom": true,
|
||||||
|
@ -24,12 +24,21 @@ Component({
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
sorts: {
|
priceSorts: {
|
||||||
type: String,
|
type: String,
|
||||||
value: '',
|
value: '',
|
||||||
observer(sorts) {
|
observer(priceSorts) {
|
||||||
this.setData({
|
this.setData({
|
||||||
sorts,
|
priceSorts,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
soldSorts: {
|
||||||
|
type: String,
|
||||||
|
value: '',
|
||||||
|
observer(soldSorts) {
|
||||||
|
this.setData({
|
||||||
|
soldSorts,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -42,7 +51,8 @@ Component({
|
|||||||
data: {
|
data: {
|
||||||
layout: 1,
|
layout: 1,
|
||||||
overall: 1,
|
overall: 1,
|
||||||
sorts: '',
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
@ -53,11 +63,36 @@ Component({
|
|||||||
},
|
},
|
||||||
|
|
||||||
handlePriseSort() {
|
handlePriseSort() {
|
||||||
const { sorts } = this.data;
|
const { priceSorts } = this.data;
|
||||||
|
this.setData({
|
||||||
|
soldSorts: ""
|
||||||
|
})
|
||||||
this.triggerEvent('change', {
|
this.triggerEvent('change', {
|
||||||
...this.properties,
|
...this.properties,
|
||||||
overall: 0,
|
overall: 0,
|
||||||
sorts: sorts === 'desc' ? 'asc' : 'desc',
|
soldSorts: '',
|
||||||
|
});
|
||||||
|
this.triggerEvent('change', {
|
||||||
|
...this.properties,
|
||||||
|
overall: 0,
|
||||||
|
priceSorts: priceSorts === 'desc' ? 'asc' : 'desc',
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
handleSoldSort() {
|
||||||
|
const { soldSorts } = this.data;
|
||||||
|
this.setData({
|
||||||
|
priceSorts: ""
|
||||||
|
})
|
||||||
|
this.triggerEvent('change', {
|
||||||
|
...this.properties,
|
||||||
|
overall: 0,
|
||||||
|
priceSorts: '',
|
||||||
|
});
|
||||||
|
this.triggerEvent('change', {
|
||||||
|
...this.properties,
|
||||||
|
overall: 0,
|
||||||
|
soldSorts: soldSorts === 'desc' ? 'asc' : 'desc',
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -71,7 +106,8 @@ Component({
|
|||||||
const { overall } = this.data;
|
const { overall } = this.data;
|
||||||
const nextOverall = overall === 1 ? 0 : 1;
|
const nextOverall = overall === 1 ? 0 : 1;
|
||||||
const nextData = {
|
const nextData = {
|
||||||
sorts: '',
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
prices: [],
|
prices: [],
|
||||||
};
|
};
|
||||||
this.triggerEvent('change', {
|
this.triggerEvent('change', {
|
||||||
|
@ -4,20 +4,37 @@
|
|||||||
<view class="filter-item {{overall === 1 ? 'filter-active-item' : ''}}" bindtap="onOverallAction">
|
<view class="filter-item {{overall === 1 ? 'filter-active-item' : ''}}" bindtap="onOverallAction">
|
||||||
综合
|
综合
|
||||||
</view>
|
</view>
|
||||||
<view class="filter-item" bind:tap="handlePriseSort">
|
<view class="filter-item" bind:tap="handleSoldSort">
|
||||||
<text style="color: {{sorts !== '' ? color : '' }}">价格</text>
|
<text style="color: {{soldSorts !== '' ? color : '' }}">销量</text>
|
||||||
<view class="filter-price">
|
<view class="filter-price">
|
||||||
<t-icon
|
<t-icon
|
||||||
prefix="wr"
|
prefix="wr"
|
||||||
name="arrow_drop_up"
|
name="arrow_drop_up"
|
||||||
size="18rpx"
|
size="18rpx"
|
||||||
style="color:{{sorts === 'asc' ? color : '#bbb'}}"
|
style="color:{{soldSorts === 'asc' ? color : '#bbb'}}"
|
||||||
/>
|
/>
|
||||||
<t-icon
|
<t-icon
|
||||||
prefix="wr"
|
prefix="wr"
|
||||||
name="arrow_drop_down"
|
name="arrow_drop_down"
|
||||||
size="18rpx"
|
size="18rpx"
|
||||||
style="color:{{sorts === 'desc' ? color : '#bbb'}}"
|
style="color:{{soldSorts === 'desc' ? color : '#bbb'}}"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="filter-item" bind:tap="handlePriseSort">
|
||||||
|
<text style="color: {{priceSorts !== '' ? color : '' }}">价格</text>
|
||||||
|
<view class="filter-price">
|
||||||
|
<t-icon
|
||||||
|
prefix="wr"
|
||||||
|
name="arrow_drop_up"
|
||||||
|
size="18rpx"
|
||||||
|
style="color:{{priceSorts === 'asc' ? color : '#bbb'}}"
|
||||||
|
/>
|
||||||
|
<t-icon
|
||||||
|
prefix="wr"
|
||||||
|
name="arrow_drop_down"
|
||||||
|
size="18rpx"
|
||||||
|
style="color:{{priceSorts === 'desc' ? color : '#bbb'}}"
|
||||||
/>
|
/>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
@ -43,10 +43,15 @@ Component({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
type:{
|
||||||
|
type: String,
|
||||||
|
value: "card"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
data: {
|
data: {
|
||||||
independentID: '',
|
independentID: '',
|
||||||
|
type: '',
|
||||||
goods: { id: '' },
|
goods: { id: '' },
|
||||||
isValidityLinePrice: false,
|
isValidityLinePrice: false,
|
||||||
},
|
},
|
||||||
@ -93,8 +98,11 @@ Component({
|
|||||||
},
|
},
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
const { thresholds, id } = this.properties;
|
const { thresholds, id ,type } = this.properties;
|
||||||
this.genIndependentID(id);
|
this.genIndependentID(id);
|
||||||
|
this.setData({
|
||||||
|
type
|
||||||
|
})
|
||||||
if (thresholds && thresholds.length) {
|
if (thresholds && thresholds.length) {
|
||||||
this.createIntersectionObserverHandle();
|
this.createIntersectionObserverHandle();
|
||||||
}
|
}
|
||||||
|
@ -3,6 +3,7 @@
|
|||||||
class="goods-card"
|
class="goods-card"
|
||||||
bind:tap="clickHandle"
|
bind:tap="clickHandle"
|
||||||
data-goods="{{ goods }}"
|
data-goods="{{ goods }}"
|
||||||
|
wx:if="{{type == 'card'}}"
|
||||||
>
|
>
|
||||||
<view class="goods-card__main">
|
<view class="goods-card__main">
|
||||||
<view class="goods-card__thumb" bind:tap="clickThumbHandle">
|
<view class="goods-card__thumb" bind:tap="clickThumbHandle">
|
||||||
@ -64,3 +65,75 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view
|
||||||
|
id="{{independentID}}"
|
||||||
|
class="goods-category-card"
|
||||||
|
bind:tap="clickHandle"
|
||||||
|
data-goods="{{ goods }}"
|
||||||
|
wx:if="{{type == 'category-card'}}"
|
||||||
|
>
|
||||||
|
<view class="goods-category-card__main">
|
||||||
|
<view class="goods-category-card__thumb" bind:tap="clickThumbHandle">
|
||||||
|
<!-- <t-image
|
||||||
|
wx:if="{{ !!goods.thumb }}"
|
||||||
|
t-class="goods-card__img"
|
||||||
|
src="{{ goods.thumb }}"
|
||||||
|
mode="aspectFill"
|
||||||
|
lazy-load
|
||||||
|
/> -->
|
||||||
|
<image class="goods-category-card__img" src="{{goods.thumb}}" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="goods-card__body">
|
||||||
|
<view class="goods-card__upper">
|
||||||
|
<view wx:if="{{ goods.title }}" class="goods-card__title">
|
||||||
|
{{ goods.title }}
|
||||||
|
</view>
|
||||||
|
<view class="goods-category-sold-num">{{goods.soldNum}}人付款</view>
|
||||||
|
<!-- <view class="goods-category-sold-num">月销{{goods.soldNum}}</view> -->
|
||||||
|
|
||||||
|
<view wx:if="{{ goods.tags && !!goods.tags.length }}" class="goods-card__tags">
|
||||||
|
<view
|
||||||
|
wx:for="{{ goods.tags }}"
|
||||||
|
wx:key="index"
|
||||||
|
wx:for-item="tag"
|
||||||
|
class="goods-card__tag"
|
||||||
|
data-index="{{index}}"
|
||||||
|
>
|
||||||
|
{{tag}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="goods-card__down">
|
||||||
|
<price
|
||||||
|
wx:if="{{ goods.price }}"
|
||||||
|
priceUnit="yuan"
|
||||||
|
wr-class="spec-for-price"
|
||||||
|
symbol-class="spec-for-symbol"
|
||||||
|
symbol="{{currency}}"
|
||||||
|
price="{{goods.price}}"
|
||||||
|
/>
|
||||||
|
<price
|
||||||
|
wx:if="{{ goods.originPrice && isValidityLinePrice }}"
|
||||||
|
priceUnit="yuan"
|
||||||
|
wr-class="goods-card__origin-price"
|
||||||
|
symbol="{{currency}}"
|
||||||
|
price="{{goods.originPrice}}"
|
||||||
|
type="delthrough"
|
||||||
|
/>
|
||||||
|
<t-icon
|
||||||
|
class="goods-card__add-cart"
|
||||||
|
prefix="wr"
|
||||||
|
name="cartAdd"
|
||||||
|
id="{{independentID}}-cart"
|
||||||
|
data-id="{{independentID}}"
|
||||||
|
catchtap="addCartHandle"
|
||||||
|
size="48rpx"
|
||||||
|
color="#FA550F"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
@ -131,3 +131,46 @@
|
|||||||
.spec-for-symbol {
|
.spec-for-symbol {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.goods-category-card{
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-category-card__main{
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
line-height: 1;
|
||||||
|
padding: 0;
|
||||||
|
background: transparent;
|
||||||
|
width: 100%;
|
||||||
|
/* justify-content: center; */
|
||||||
|
padding: 16rpx;
|
||||||
|
border-bottom: 1px solid #eeeeee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-category-card__thumb {
|
||||||
|
flex-shrink: 0;
|
||||||
|
position: relative;
|
||||||
|
width: 220rpx;
|
||||||
|
height: 220rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-category-card__thumb:empty {
|
||||||
|
display: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.goods-category-card__img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-category-sold-num{
|
||||||
|
margin-top: 10rpx;
|
||||||
|
font-size: 23rpx;
|
||||||
|
color: #7e7e7e;
|
||||||
|
}
|
@ -17,6 +17,10 @@ Component({
|
|||||||
type: Array,
|
type: Array,
|
||||||
value: [],
|
value: [],
|
||||||
},
|
},
|
||||||
|
type:{
|
||||||
|
type: String,
|
||||||
|
value: "card"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
data: {
|
data: {
|
||||||
@ -47,6 +51,7 @@ Component({
|
|||||||
|
|
||||||
init() {
|
init() {
|
||||||
this.genIndependentID(this.id || '');
|
this.genIndependentID(this.id || '');
|
||||||
|
this.setData({ type: this.properties.type });
|
||||||
},
|
},
|
||||||
|
|
||||||
genIndependentID(id) {
|
genIndependentID(id) {
|
||||||
|
@ -7,6 +7,7 @@
|
|||||||
thresholds="{{thresholds}}"
|
thresholds="{{thresholds}}"
|
||||||
class="goods-card-inside"
|
class="goods-card-inside"
|
||||||
data-index="{{index}}"
|
data-index="{{index}}"
|
||||||
|
type="{{type}}"
|
||||||
bind:thumb="onClickGoodsThumb"
|
bind:thumb="onClickGoodsThumb"
|
||||||
bind:click="onClickGoods"
|
bind:click="onClickGoods"
|
||||||
bind:add-cart="onAddCart"
|
bind:add-cart="onAddCart"
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
<view class="c-tabbar custom-class">
|
<!-- <view class="c-tabbar custom-class">
|
||||||
<scroll-view
|
<scroll-view
|
||||||
wx:if="{{ tabList.length > 0 }}"
|
wx:if="{{ tabList.length > 0 }}"
|
||||||
class="c-tabbar__scroll"
|
class="c-tabbar__scroll"
|
||||||
@ -26,4 +26,6 @@
|
|||||||
bindselect="onClick"
|
bindselect="onClick"
|
||||||
/>
|
/>
|
||||||
<slot />
|
<slot />
|
||||||
</view>
|
</view> -->
|
||||||
|
|
||||||
|
<view>111</view>
|
@ -315,6 +315,15 @@ Page({
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
gotoShop(){
|
||||||
|
const {
|
||||||
|
shopGuid
|
||||||
|
} = this.data.details;
|
||||||
|
wx.navigateTo({
|
||||||
|
url: "/pages/shop/all-goods/index?shopGuid=" + shopGuid,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
specsConfirm() {
|
specsConfirm() {
|
||||||
const {
|
const {
|
||||||
buyType
|
buyType
|
||||||
|
@ -107,17 +107,17 @@
|
|||||||
<view style="padding: 10px;" class="shop-left-box">
|
<view style="padding: 10px;" class="shop-left-box">
|
||||||
<view class="shop-left-img-box" >
|
<view class="shop-left-img-box" >
|
||||||
<image alt=""
|
<image alt=""
|
||||||
src="https://tool.aerwen.net/prod-api/Uploads/uploads/20230719/35BB64FE6D80E253.jpg"
|
src="{{details.shopLogo}}"
|
||||||
class="shop-left-img" />
|
class="shop-left-img" mode="aspectFit"/>
|
||||||
</view>
|
</view>
|
||||||
<view>
|
<view>
|
||||||
<view class="shop-name">三星官方旗舰店</view>
|
<view class="shop-name">{{details.shopName}}</view>
|
||||||
<view class="shop-sold">已售:244万</view>
|
<view class="shop-sold">已售:{{details.shopSalesOrderCount}}</view>
|
||||||
<view class="shop-intro">三星手机官方旗舰店</view>
|
<view class="shop-intro">{{details.shopIntro}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="shop-right-box">
|
<view class="shop-right-box">
|
||||||
<view class="shop-right-button">进店逛逛 ></view>
|
<view class="shop-right-button" bindtap="gotoShop">进店逛逛 ></view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
@ -3,7 +3,8 @@ import Toast from 'tdesign-miniprogram/toast/index';
|
|||||||
|
|
||||||
const initFilters = {
|
const initFilters = {
|
||||||
overall: 1,
|
overall: 1,
|
||||||
sorts: '',
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
layout: 0,
|
layout: 0,
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -11,7 +12,8 @@ Page({
|
|||||||
data: {
|
data: {
|
||||||
goodsList: [],
|
goodsList: [],
|
||||||
layout: 0,
|
layout: 0,
|
||||||
sorts: '',
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
overall: 1,
|
overall: 1,
|
||||||
show: false,
|
show: false,
|
||||||
minVal: '',
|
minVal: '',
|
||||||
@ -28,11 +30,12 @@ Page({
|
|||||||
total: 0,
|
total: 0,
|
||||||
|
|
||||||
handleFilterChange(e) {
|
handleFilterChange(e) {
|
||||||
const { layout, overall, sorts } = e.detail;
|
const { layout, overall, priceSorts, soldSorts } = e.detail;
|
||||||
this.pageNum = 1;
|
this.pageNum = 1;
|
||||||
this.setData({
|
this.setData({
|
||||||
layout,
|
layout,
|
||||||
sorts,
|
priceSorts,
|
||||||
|
soldSorts,
|
||||||
overall,
|
overall,
|
||||||
loadMoreStatus: 0,
|
loadMoreStatus: 0,
|
||||||
});
|
});
|
||||||
@ -40,9 +43,9 @@ Page({
|
|||||||
},
|
},
|
||||||
|
|
||||||
generalQueryData(reset = false) {
|
generalQueryData(reset = false) {
|
||||||
const { filter, keywords, minVal, maxVal , goodsCategoryGuid,sorts, overall} = this.data;
|
const { filter, keywords, minVal, maxVal , goodsCategoryGuid,priceSorts, soldSorts ,overall} = this.data;
|
||||||
const { pageNum, pageSize } = this;
|
const { pageNum, pageSize } = this;
|
||||||
// const { sorts, overall } = filter;
|
// const { priceSorts,soldSorts, overall } = filter;
|
||||||
const params = {
|
const params = {
|
||||||
goodsSort: 0, // 0 综合,1 价格
|
goodsSort: 0, // 0 综合,1 价格
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
@ -51,18 +54,23 @@ Page({
|
|||||||
// keyword: keywords,
|
// keyword: keywords,
|
||||||
};
|
};
|
||||||
|
|
||||||
if (sorts) {
|
if (priceSorts) {
|
||||||
params.goodsSort = 1;
|
params.goodsSort = 1;
|
||||||
params.goodsSortType = sorts === 'desc' ? 1 : 0;
|
params.goodsSortType = priceSorts === 'desc' ? 1 : 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(soldSorts){
|
||||||
|
params.goodsSort = 2;
|
||||||
|
params.goodsSortType = soldSorts === 'desc' ? 1 : 0;
|
||||||
|
}
|
||||||
if (overall) {
|
if (overall) {
|
||||||
params.goodsSort = 0;
|
params.goodsSort = 0;
|
||||||
} else {
|
} else {
|
||||||
params.goodsSort = 1;
|
// params.goodsSort = 1;
|
||||||
}
|
}
|
||||||
// params.minPrice = minVal ? minVal * 100 : 0;
|
console.log(minVal,'最小价格');
|
||||||
// params.maxPrice = maxVal ? maxVal * 100 : undefined;
|
params.minPrice = minVal ? minVal : 0;
|
||||||
|
params.maxPrice = maxVal ? maxVal : 0;
|
||||||
if (reset) return params;
|
if (reset) return params;
|
||||||
return {
|
return {
|
||||||
...params,
|
...params,
|
||||||
@ -188,6 +196,7 @@ Page({
|
|||||||
onMinValAction(e) {
|
onMinValAction(e) {
|
||||||
const { value } = e.detail;
|
const { value } = e.detail;
|
||||||
this.setData({ minVal: value });
|
this.setData({ minVal: value });
|
||||||
|
console.log(this.data.minVal,'最凶啊');
|
||||||
},
|
},
|
||||||
|
|
||||||
onMaxValAction(e) {
|
onMaxValAction(e) {
|
||||||
@ -222,10 +231,10 @@ Page({
|
|||||||
this.setData(
|
this.setData(
|
||||||
{
|
{
|
||||||
show: false,
|
show: false,
|
||||||
minVal: '',
|
// minVal: '',
|
||||||
goodsList: [],
|
// goodsList: [],
|
||||||
loadMoreStatus: 0,
|
loadMoreStatus: 0,
|
||||||
maxVal: '',
|
// maxVal: '',
|
||||||
},
|
},
|
||||||
() => {
|
() => {
|
||||||
this.init();
|
this.init();
|
||||||
|
@ -3,7 +3,8 @@
|
|||||||
wr-class="filter-container"
|
wr-class="filter-container"
|
||||||
bind:change="handleFilterChange"
|
bind:change="handleFilterChange"
|
||||||
layout="{{layout}}"
|
layout="{{layout}}"
|
||||||
sorts="{{sorts}}"
|
priceSorts="{{priceSorts}}"
|
||||||
|
soldSorts="{{soldSorts}}"
|
||||||
overall="{{overall}}"
|
overall="{{overall}}"
|
||||||
bind:showFilterPopup="showFilterPopup"
|
bind:showFilterPopup="showFilterPopup"
|
||||||
>
|
>
|
||||||
|
408
pages/shop/all-goods/index.js
Normal file
408
pages/shop/all-goods/index.js
Normal file
@ -0,0 +1,408 @@
|
|||||||
|
import {
|
||||||
|
fetchGoodsList
|
||||||
|
} from '../../../services/good/fetchGoodsList';
|
||||||
|
import Toast from 'tdesign-miniprogram/toast/index';
|
||||||
|
|
||||||
|
const image = 'https://tdesign.gtimg.com/miniprogram/images/example2.png';
|
||||||
|
const items = new Array(12).fill({
|
||||||
|
label: '标题文字',
|
||||||
|
image
|
||||||
|
}, 0, 12);
|
||||||
|
|
||||||
|
const initFilters = {
|
||||||
|
overall: 1,
|
||||||
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
|
layout: 0,
|
||||||
|
};
|
||||||
|
|
||||||
|
Page({
|
||||||
|
data: {
|
||||||
|
goodsList: [],
|
||||||
|
layout: 0,
|
||||||
|
priceSorts: '',
|
||||||
|
soldSorts: '',
|
||||||
|
overall: 1,
|
||||||
|
show: false,
|
||||||
|
minVal: '',
|
||||||
|
maxVal: '',
|
||||||
|
filter: initFilters,
|
||||||
|
hasLoaded: false,
|
||||||
|
loadMoreStatus: 0,
|
||||||
|
loading: true,
|
||||||
|
shopGuid: 0,
|
||||||
|
|
||||||
|
value: 'category',
|
||||||
|
list: [{
|
||||||
|
value: 'all',
|
||||||
|
label: '全部',
|
||||||
|
icon: 'home'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'category',
|
||||||
|
label: '分类',
|
||||||
|
icon: 'app'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
|
||||||
|
sideBarIndex: 1,
|
||||||
|
scrollTop: 0,
|
||||||
|
categories: [{
|
||||||
|
label: '选项一',
|
||||||
|
title: '标题一',
|
||||||
|
icon: 'app',
|
||||||
|
badgeProps: {},
|
||||||
|
items,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '选项二',
|
||||||
|
title: '标题二',
|
||||||
|
icon: 'app',
|
||||||
|
badgeProps: {
|
||||||
|
dot: true,
|
||||||
|
},
|
||||||
|
items: items.slice(0, 9),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '选项三',
|
||||||
|
title: '标题三',
|
||||||
|
icon: 'app',
|
||||||
|
badgeProps: {},
|
||||||
|
items: items.slice(0, 9),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '选项四',
|
||||||
|
title: '标题四',
|
||||||
|
icon: 'app',
|
||||||
|
badgeProps: {
|
||||||
|
count: 6,
|
||||||
|
},
|
||||||
|
items: items.slice(0, 6),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '选项五',
|
||||||
|
title: '标题五',
|
||||||
|
icon: 'app',
|
||||||
|
badgeProps: {},
|
||||||
|
items: items.slice(0, 3),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
|
||||||
|
offsetTopList: [],
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 6,
|
||||||
|
total: 0,
|
||||||
|
|
||||||
|
handleFilterChange(e) {
|
||||||
|
const {
|
||||||
|
layout,
|
||||||
|
overall,
|
||||||
|
priceSorts,
|
||||||
|
soldSorts
|
||||||
|
} = e.detail;
|
||||||
|
this.pageNum = 1;
|
||||||
|
this.setData({
|
||||||
|
layout,
|
||||||
|
priceSorts,
|
||||||
|
soldSorts,
|
||||||
|
overall,
|
||||||
|
loadMoreStatus: 0,
|
||||||
|
});
|
||||||
|
this.init(true);
|
||||||
|
},
|
||||||
|
|
||||||
|
generalQueryData(reset = false) {
|
||||||
|
const {
|
||||||
|
filter,
|
||||||
|
keywords,
|
||||||
|
minVal,
|
||||||
|
maxVal,
|
||||||
|
shopGuid,
|
||||||
|
priceSorts,
|
||||||
|
soldSorts,
|
||||||
|
overall
|
||||||
|
} = this.data;
|
||||||
|
const {
|
||||||
|
pageNum,
|
||||||
|
pageSize
|
||||||
|
} = this;
|
||||||
|
// const { priceSorts,soldSorts, overall } = filter;
|
||||||
|
const params = {
|
||||||
|
goodsSort: 0, // 0 综合,1 价格
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 6,
|
||||||
|
shopGuid: shopGuid
|
||||||
|
// keyword: keywords,
|
||||||
|
};
|
||||||
|
|
||||||
|
if (priceSorts) {
|
||||||
|
params.goodsSort = 1;
|
||||||
|
params.goodsSortType = priceSorts === 'desc' ? 1 : 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (soldSorts) {
|
||||||
|
params.goodsSort = 2;
|
||||||
|
params.goodsSortType = soldSorts === 'desc' ? 1 : 0;
|
||||||
|
}
|
||||||
|
if (overall) {
|
||||||
|
params.goodsSort = 0;
|
||||||
|
} else {
|
||||||
|
// params.goodsSort = 1;
|
||||||
|
}
|
||||||
|
console.log(minVal, '最小价格');
|
||||||
|
params.minPrice = minVal ? minVal : 0;
|
||||||
|
params.maxPrice = maxVal ? maxVal : 0;
|
||||||
|
if (reset) return params;
|
||||||
|
return {
|
||||||
|
...params,
|
||||||
|
pageNum: pageNum + 1,
|
||||||
|
pageSize,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
async init(reset = true) {
|
||||||
|
const {
|
||||||
|
loadMoreStatus,
|
||||||
|
goodsList = []
|
||||||
|
} = this.data;
|
||||||
|
const params = this.generalQueryData(reset);
|
||||||
|
if (loadMoreStatus !== 0) return;
|
||||||
|
this.setData({
|
||||||
|
loadMoreStatus: 1,
|
||||||
|
loading: true,
|
||||||
|
});
|
||||||
|
try {
|
||||||
|
const result = await fetchGoodsList(params);
|
||||||
|
const code = 'Success';
|
||||||
|
const data = result;
|
||||||
|
if (code.toUpperCase() === 'SUCCESS') {
|
||||||
|
const {
|
||||||
|
result,
|
||||||
|
totalNum = 0
|
||||||
|
} = data;
|
||||||
|
if (totalNum === 0 && reset) {
|
||||||
|
this.total = totalNum;
|
||||||
|
this.setData({
|
||||||
|
emptyInfo: {
|
||||||
|
tip: '抱歉,未找到相关商品',
|
||||||
|
},
|
||||||
|
hasLoaded: true,
|
||||||
|
loadMoreStatus: 0,
|
||||||
|
loading: false,
|
||||||
|
goodsList: [],
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const _goodsList = reset ? result : goodsList.concat(result);
|
||||||
|
const _loadMoreStatus = _goodsList.length === totalNum ? 2 : 0;
|
||||||
|
this.pageNum = params.pageNum || 1;
|
||||||
|
this.total = totalNum;
|
||||||
|
this.setData({
|
||||||
|
goodsList: _goodsList,
|
||||||
|
loadMoreStatus: _loadMoreStatus,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.setData({
|
||||||
|
loading: false,
|
||||||
|
});
|
||||||
|
wx.showToast({
|
||||||
|
title: '查询失败,请稍候重试',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
this.setData({
|
||||||
|
loading: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
hasLoaded: true,
|
||||||
|
loading: false,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad(query) {
|
||||||
|
const {
|
||||||
|
shopGuid
|
||||||
|
} = query;
|
||||||
|
this.setData({
|
||||||
|
shopGuid: shopGuid,
|
||||||
|
});
|
||||||
|
|
||||||
|
this.init(true);
|
||||||
|
|
||||||
|
const query2 = wx.createSelectorQuery().in(this);
|
||||||
|
const {
|
||||||
|
sideBarIndex
|
||||||
|
} = this.data;
|
||||||
|
|
||||||
|
query2
|
||||||
|
.selectAll('.title')
|
||||||
|
.boundingClientRect((rects) => {
|
||||||
|
this.offsetTopList = rects.map((item) => item.top);
|
||||||
|
console.log(this.offsetTopList,'123123123');
|
||||||
|
this.setData({
|
||||||
|
scrollTop: rects[sideBarIndex].top
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.exec();
|
||||||
|
},
|
||||||
|
|
||||||
|
onReachBottom() {
|
||||||
|
const {
|
||||||
|
goodsList
|
||||||
|
} = this.data;
|
||||||
|
const {
|
||||||
|
total = 0
|
||||||
|
} = this;
|
||||||
|
if (goodsList.length === total) {
|
||||||
|
this.setData({
|
||||||
|
loadMoreStatus: 2,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.init(false);
|
||||||
|
},
|
||||||
|
|
||||||
|
handleAddCart() {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message: '点击加购',
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
tagClickHandle() {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message: '点击标签',
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
gotoGoodsDetail(e) {
|
||||||
|
const {
|
||||||
|
index
|
||||||
|
} = e.detail;
|
||||||
|
const {
|
||||||
|
spuId
|
||||||
|
} = this.data.goodsList[index];
|
||||||
|
wx.navigateTo({
|
||||||
|
url: `/pages/goods/details/index?spuId=${spuId}`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
showFilterPopup() {
|
||||||
|
this.setData({
|
||||||
|
show: true,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
showFilterPopupClose() {
|
||||||
|
this.setData({
|
||||||
|
show: false,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onMinValAction(e) {
|
||||||
|
const {
|
||||||
|
value
|
||||||
|
} = e.detail;
|
||||||
|
this.setData({
|
||||||
|
minVal: value
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
onMaxValAction(e) {
|
||||||
|
const {
|
||||||
|
value
|
||||||
|
} = e.detail;
|
||||||
|
this.setData({
|
||||||
|
maxVal: value
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
reset() {
|
||||||
|
this.setData({
|
||||||
|
minVal: '',
|
||||||
|
maxVal: ''
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
confirm() {
|
||||||
|
const {
|
||||||
|
minVal,
|
||||||
|
maxVal
|
||||||
|
} = this.data;
|
||||||
|
let message = '';
|
||||||
|
if (minVal && !maxVal) {
|
||||||
|
message = `价格最小是${minVal}`;
|
||||||
|
} else if (!minVal && maxVal) {
|
||||||
|
message = `价格范围是0-${minVal}`;
|
||||||
|
} else if (minVal && maxVal && minVal <= maxVal) {
|
||||||
|
message = `价格范围${minVal}-${this.data.maxVal}`;
|
||||||
|
} else {
|
||||||
|
message = '请输入正确范围';
|
||||||
|
}
|
||||||
|
if (message) {
|
||||||
|
Toast({
|
||||||
|
context: this,
|
||||||
|
selector: '#t-toast',
|
||||||
|
message,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.pageNum = 1;
|
||||||
|
this.setData({
|
||||||
|
show: false,
|
||||||
|
// minVal: '',
|
||||||
|
// goodsList: [],
|
||||||
|
loadMoreStatus: 0,
|
||||||
|
// maxVal: '',
|
||||||
|
},
|
||||||
|
() => {
|
||||||
|
this.init();
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(e) {
|
||||||
|
this.setData({
|
||||||
|
value: e.detail.value,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
// 商品分类
|
||||||
|
onSideBarChange(e) {
|
||||||
|
const {
|
||||||
|
value
|
||||||
|
} = e.detail;
|
||||||
|
this.setData({
|
||||||
|
sideBarIndex: value,
|
||||||
|
scrollTop: this.offsetTopList[value]
|
||||||
|
});
|
||||||
|
},
|
||||||
|
onScroll(e) {
|
||||||
|
const {
|
||||||
|
scrollTop
|
||||||
|
} = e.detail;
|
||||||
|
const threshold = 50; // 下一个标题与顶部的距离
|
||||||
|
|
||||||
|
if (scrollTop < threshold) {
|
||||||
|
this.setData({
|
||||||
|
sideBarIndex: 0
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const index = this.offsetTopList.findIndex((top) => top > scrollTop && top - scrollTop <= threshold);
|
||||||
|
|
||||||
|
if (index > -1) {
|
||||||
|
this.setData({
|
||||||
|
sideBarIndex: index
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
});
|
18
pages/shop/all-goods/index.json
Normal file
18
pages/shop/all-goods/index.json
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
{
|
||||||
|
"navigationBarTitleText": "店铺详情",
|
||||||
|
"usingComponents": {
|
||||||
|
"t-input": "tdesign-miniprogram/input/input",
|
||||||
|
"t-empty": "tdesign-miniprogram/empty/empty",
|
||||||
|
"t-toast": "tdesign-miniprogram/toast/toast",
|
||||||
|
"goods-list": "/components/goods-list/index",
|
||||||
|
"filter": "/components/filter/index",
|
||||||
|
"filter-popup": "/components/filter-popup/index",
|
||||||
|
"load-more": "/components/load-more/index",
|
||||||
|
"t-tab-bar": "tdesign-miniprogram/tab-bar/tab-bar",
|
||||||
|
"t-tab-bar-item": "tdesign-miniprogram/tab-bar-item/tab-bar-item",
|
||||||
|
"t-side-bar": "tdesign-miniprogram/side-bar/side-bar",
|
||||||
|
"t-side-bar-item": "tdesign-miniprogram/side-bar-item/side-bar-item",
|
||||||
|
"t-grid": "tdesign-miniprogram/grid/grid",
|
||||||
|
"t-grid-item": "tdesign-miniprogram/grid-item/grid-item"
|
||||||
|
}
|
||||||
|
}
|
78
pages/shop/all-goods/index.wxml
Normal file
78
pages/shop/all-goods/index.wxml
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
<view class="shop-detail-page">
|
||||||
|
|
||||||
|
<!-- 店铺信息 -->
|
||||||
|
<view style="padding: 10px;" class="shop-big-box" wx:if="{{ value == 'all' }}">
|
||||||
|
<view style="padding: 10px;" class="shop-left-box">
|
||||||
|
<view class="shop-left-img-box">
|
||||||
|
<image alt="" src="https://tool.aerwen.net/prod-api/Uploads/uploads/20230719/35BB64FE6D80E253.jpg" class="shop-left-img" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view class="shop-name">三星官方旗舰店</view>
|
||||||
|
<view class="shop-sold">已售:244万</view>
|
||||||
|
<view class="shop-intro">三星手机官方旗舰店</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="shop-right-box">
|
||||||
|
<!-- <view class="shop-right-button" bindtap="gotoShop">进店逛逛 ></view> -->
|
||||||
|
<view class="shop-right-arrow">></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 全部商品列表 -->
|
||||||
|
<view wx:if="{{ value == 'all' }}" class="goods-list-container">
|
||||||
|
<filter wr-class="filter-container" bind:change="handleFilterChange" layout="{{layout}}" priceSorts="{{priceSorts}}" soldSorts="{{soldSorts}}" overall="{{overall}}" bind:showFilterPopup="showFilterPopup">
|
||||||
|
<filter-popup slot="filterPopup" show="{{show}}" bind:showFilterPopupClose="showFilterPopupClose" bind:reset="reset" bind:confirm="confirm">
|
||||||
|
<view class="price-container" slot="filterSlot">
|
||||||
|
<view class="price-between">价格区间</view>
|
||||||
|
<view class="price-ipts-wrap">
|
||||||
|
<t-input align="center" type="number" t-class="price-ipt" placeholder="最低价" value="{{minVal}}" bindchange="onMinValAction" />
|
||||||
|
<view class="price-divided">-</view>
|
||||||
|
<t-input align="center" type="number" t-class="price-ipt" placeholder="最高价" value="{{maxVal}}" bindchange="onMaxValAction" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</filter-popup>
|
||||||
|
</filter>
|
||||||
|
<view class="empty-wrap" wx:if="{{goodsList.length === 0 && hasLoaded}}">
|
||||||
|
<t-empty t-class="empty-tips" size="240rpx" description="暂无相关商品" />
|
||||||
|
</view>
|
||||||
|
<view class="category-goods-list" wx:if="{{goodsList.length}}">
|
||||||
|
<goods-list wr-class="wr-goods-list" goodsList="{{goodsList}}" bind:click="gotoGoodsDetail" bind:addcart="handleAddCart" />
|
||||||
|
</view>
|
||||||
|
<load-more wx:if="{{goodsList.length > 0}}" status="{{loadMoreStatus}}" no-more-text="没有更多了" />
|
||||||
|
</view>
|
||||||
|
<!-- 分类商品列表 -->
|
||||||
|
<view wx:if="{{ value == 'category' }}">
|
||||||
|
|
||||||
|
<view class="side-bar-wrapper">
|
||||||
|
<t-side-bar value="{{sideBarIndex}}" bind:change="onSideBarChange">
|
||||||
|
<t-side-bar-item wx:for="{{categories}}" wx:key="index" value="{{item.value || index}}" label="{{item.label}}" icon="{{item.icon}}" badge-props="{{item.badgeProps}}" />
|
||||||
|
</t-side-bar>
|
||||||
|
<scroll-view class="content" scroll-y scroll-with-animation scroll-top="{{scrollTop}}" bind:scroll="onScroll">
|
||||||
|
<filter wr-class="filter-container" bind:change="handleFilterChange" layout="{{layout}}" priceSorts="{{priceSorts}}" soldSorts="{{soldSorts}}" overall="{{overall}}" bind:showFilterPopup="showFilterPopup">
|
||||||
|
</filter>
|
||||||
|
<view wx:for="{{categories}}" wx:key="index" class="section">
|
||||||
|
<view class="title">{{item.title || item.label}}</view>
|
||||||
|
<view class="goods-category-crad">
|
||||||
|
<view class="empty-wrap" wx:if="{{goodsList.length === 0 && hasLoaded}}">
|
||||||
|
<t-empty t-class="empty-tips" size="240rpx" description="暂无相关商品" />
|
||||||
|
</view>
|
||||||
|
<view class="category-goods-list" wx:if="{{goodsList.length}}">
|
||||||
|
<goods-list wr-class="wr-goods-list" type="category-card" goodsList="{{goodsList}}" bind:click="gotoGoodsDetail" bind:addcart="handleAddCart" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 底部导航栏 -->
|
||||||
|
<t-tab-bar value="{{value}}" bindchange="onChange" theme="tag" split="{{false}}">
|
||||||
|
<t-tab-bar-item wx:for="{{list}}" wx:key="index" value="{{item.value}}" icon="{{item.icon}}">
|
||||||
|
{{item.label}}
|
||||||
|
</t-tab-bar-item>
|
||||||
|
</t-tab-bar>
|
||||||
|
|
||||||
|
<t-toast id="t-toast" />
|
115
pages/shop/all-goods/index.wxss
Normal file
115
pages/shop/all-goods/index.wxss
Normal file
@ -0,0 +1,115 @@
|
|||||||
|
/* pages/shop/all-goods/index.wxss */
|
||||||
|
@import '/pages/goods/list/index.wxss';
|
||||||
|
|
||||||
|
.shop-detail-page{
|
||||||
|
background-color: #f8f8f8;
|
||||||
|
/* height: 100vw; */
|
||||||
|
padding-top: 30rpx;
|
||||||
|
padding-bottom: 170rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 店铺 */
|
||||||
|
.shop-big-box {
|
||||||
|
width: 90%;
|
||||||
|
margin: 0rpx auto 30rpx auto;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-left-img-box {
|
||||||
|
height: 150rpx;
|
||||||
|
width: 150rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-left-img {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
border: 1rpx solid rgb(204, 204, 204);
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-left-box {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 250rpx;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-sold {
|
||||||
|
font-size: 25rpx;
|
||||||
|
margin: 15rpx 0rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-intro {
|
||||||
|
font-size: 25rpx;
|
||||||
|
width: 250rpx;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-right-button {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
padding: 15rpx 20rpx;
|
||||||
|
background-color: rgb(251, 48, 44);
|
||||||
|
border-radius: 50rpx;
|
||||||
|
color: white;
|
||||||
|
font-size: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop-right-arrow{
|
||||||
|
margin-top: 20rpx;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.shop-bottom-box{
|
||||||
|
width: 100%;
|
||||||
|
height: 150rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 商品分类 */
|
||||||
|
page .round-image {
|
||||||
|
border-radius: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-bar-wrapper {
|
||||||
|
display: flex;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-bar-wrapper .content {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-bar-wrapper .section {
|
||||||
|
padding: 32rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-bar-wrapper .title {
|
||||||
|
padding-left: 40rpx;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
line-height: 52rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.side-bar-wrapper .image {
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user