feat 添加店铺商品类目接口对接

This commit is contained in:
lwh 2023-07-20 21:34:01 +08:00
parent 4d7db88e3c
commit cd8590d259
5 changed files with 80 additions and 76 deletions

View File

@ -174,3 +174,7 @@
font-size: 23rpx;
color: #7e7e7e;
}
.custom-tab-bar {
--td-tab-bar-active-bg: #ff0000; /* 设置选中状态的背景颜色为红色 */
}

View File

@ -1,3 +1,5 @@
import { goodsList } from "~/model/goods";
Component({
externalClasses: ['wr-class'],
@ -50,6 +52,7 @@ Component({
},
init() {
console.log(this.properties.goodsList);
this.genIndependentID(this.id || '');
this.setData({ type: this.properties.type });
},

View File

@ -4,13 +4,11 @@ import {
import {
fetchShop
} from '~/services/shop/fetchShop';
import {
fetchShopGoodsCategory
} from '~/services/shop/fetchShopGoodsCategory';
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,
@ -22,6 +20,7 @@ const initFilters = {
Page({
data: {
goodsList: [],
shopCategoryGoodsList: [],
layout: 0,
priceSorts: '',
soldSorts: '',
@ -51,48 +50,9 @@ Page({
},
],
sideBarIndex: 1,
sideBarIndex: 0,
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),
},
],
categories: [],
},
offsetTopList: [],
@ -138,7 +98,7 @@ Page({
goodsSort: 0, // 0 综合1 价格
pageNum: 1,
pageSize: 6,
shopGuid: shopGuid
shopGuid: shopGuid,
// keyword: keywords,
};
@ -232,6 +192,8 @@ Page({
hasLoaded: true,
loading: false,
});
return Promise.resolve();
},
onLoad(query) {
@ -242,23 +204,7 @@ Page({
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();
this.init(true)
},
onReachBottom() {
@ -378,10 +324,38 @@ Page({
);
},
onChange(e) {
async onChange(e) {
this.setData({
value: e.detail.value,
});
if (this.data.value == "category") {
// 获取店铺商品类目
const {
shopGuid
} = this.data
const shopGoodsCategoryResult = await fetchShopGoodsCategory({
shopGuid: shopGuid
});
this.setData({
categories: shopGoodsCategoryResult
})
const query2 = wx.createSelectorQuery().in(this);
const {
sideBarIndex
} = this.data;
query2
.selectAll('.title')
.boundingClientRect((rects) => {
console.log(rects, '123123123');
this.offsetTopList = rects.map((item) => item.top);
this.setData({
scrollTop: rects[sideBarIndex].top
});
})
.exec();
}
},

View File

@ -1,6 +1,7 @@
<view class="shop-detail-page">
<!-- 店铺信息 -->
<!-- wx:if="{{ value == 'all' }}" -->
<view style="padding: 10px;" class="shop-big-box" wx:if="{{ value == 'all' }}" bindtap="handlePopup">
<view style="padding: 10px;" class="shop-left-box">
<view class="shop-left-img-box">
@ -45,19 +46,19 @@
<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-item wx:for="{{categories}}" wx:key="index" value="{{item.value || index}}" label="{{item.label}}" 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>
<!-- <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="title">{{item.label}}</view>
<view class="goods-category-crad">
<view class="empty-wrap" wx:if="{{goodsList.length === 0 && hasLoaded}}">
<view class="empty-wrap" wx:if="{{item.items.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 class="category-goods-list" wx:if="{{item.items.length}}">
<goods-list wr-class="wr-goods-list" type="category-card" goodsList="{{item.items}}" bind:click="gotoGoodsDetail" bind:addcart="handleAddCart" />
</view>
</view>
</view>
@ -69,7 +70,7 @@
</view>
<!-- 底部导航栏 -->
<t-tab-bar value="{{value}}" bindchange="onChange" theme="tag" split="{{false}}">
<t-tab-bar t-class="custom-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>

View File

@ -0,0 +1,22 @@
import {
request
} from '../_utils/request';
/** 获取店铺详情 */
export function fetchShopGoodsCategory(parm) {
return new Promise((resolve, reject) => {
request({
url: `ShopGoodsCategoryApi/getShopGoodsCategoryTreeList`,
data: parm,
method: 'GET',
success: function (res) {
let data = res.data;
resolve(data);
},
fail: function (error) {
reject(error);
}
});
});
}