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

components/goods-card/index.wxss

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

components/goods-list/index.js

@@ -1,3 +1,5 @@
+import { goodsList } from "~/model/goods";
+
 Component({
   externalClasses: ['wr-class'],
 
@@ -38,7 +40,7 @@ Component({
       const { index } = e.currentTarget.dataset;
       this.triggerEvent('click', { ...e.detail, index });
     },
-
+    
     onAddCart(e) {
       const { index } = e.currentTarget.dataset;
       this.triggerEvent('addcart', { ...e.detail, index });
@@ -50,6 +52,7 @@ Component({
     },
 
     init() {
+      console.log(this.properties.goodsList);
       this.genIndependentID(this.id || '');
       this.setData({ type: this.properties.type });
     },

pages/shop/all-goods/index.js

@@ -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();
+    }
   },
 
 

pages/shop/all-goods/index.wxml

@@ -1,7 +1,8 @@
 <view class="shop-detail-page">
 
   <!-- 店铺信息 -->
-  <view style="padding: 10px;" class="shop-big-box" wx:if="{{ value == 'all' }}" bindtap="handlePopup">
+  <!-- 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">
         <image alt="" src="{{shopDetails.shopLogo}}" class="shop-left-img" mode="aspectFit" />
@@ -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,8 +70,8 @@
 </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}}">
+<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>
 </t-tab-bar>

services/shop/fetchShopGoodsCategory.js

@@ -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);
+      }
+    });
+  });
+}