feat 添加商品详情页的店铺信息接口对接，店铺详情页

2023-07-20 15:09:23 +08:00 · 2023-07-20 15:09:23 +08:00 · fb7a1be9b4
commit fb7a1be9b4
parent 860f89d0c5
17 changed files with 860 additions and 36 deletions
--- a/app.json
+++ b/app.json
@ -33,7 +33,8 @@
    "pages/order/fill-tracking-no/index",
    "pages/order/delivery-detail/index",
    "pages/order/invoice/index",
-    "pages/usercenter/name-edit/index"
+    "pages/usercenter/name-edit/index",
+    "pages/shop/all-goods/index"
  ],
  "tabBar": {
    "custom": true,
--- a/components/filter/index.js
+++ b/components/filter/index.js
@ -24,12 +24,21 @@ Component({
        });
      },
    },
-    sorts: {
+    priceSorts: {
      type: String,
      value: '',
-      observer(sorts) {
+      observer(priceSorts) {
        this.setData({
-          sorts,
+          priceSorts,
+        });
+      },
+    },
+    soldSorts: {
+      type: String,
+      value: '',
+      observer(soldSorts) {
+        this.setData({
+          soldSorts,
        });
      },
    },
@ -42,7 +51,8 @@ Component({
  data: {
    layout: 1,
    overall: 1,
-    sorts: '',
+    priceSorts: '',
+    soldSorts: '',
  },

  methods: {
@ -53,11 +63,36 @@ Component({
    },

    handlePriseSort() {
-      const { sorts } = this.data;
+      const { priceSorts } = this.data;
+      this.setData({
+        soldSorts: ""
+      })
      this.triggerEvent('change', {
        ...this.properties,
        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 nextOverall = overall === 1 ? 0 : 1;
      const nextData = {
-        sorts: '',
+        priceSorts: '',
+        soldSorts: '',
        prices: [],
      };
      this.triggerEvent('change', {
--- a/components/filter/index.wxml
+++ b/components/filter/index.wxml
@ -4,20 +4,37 @@
 		<view class="filter-item {{overall === 1 ? 'filter-active-item' : ''}}" bindtap="onOverallAction">
 			综合
 		</view>
-		<view class="filter-item" bind:tap="handlePriseSort">
-			<text style="color: {{sorts !== '' ? color : '' }}">价格</text>
+    <view class="filter-item" bind:tap="handleSoldSort">
+			<text style="color: {{soldSorts !== '' ? color : '' }}">销量</text>
 			<view class="filter-price">
 				<t-icon
 				  prefix="wr"
 				  name="arrow_drop_up"
 				  size="18rpx"
-				  style="color:{{sorts === 'asc' ? color : '#bbb'}}"
+				  style="color:{{soldSorts === 'asc' ? color : '#bbb'}}"
 				/>
 				<t-icon
 				  prefix="wr"
 				  name="arrow_drop_down"
 				  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>
--- a/components/goods-card/index.js
+++ b/components/goods-card/index.js
@ -43,10 +43,15 @@ Component({
        }
      },
    },
+    type:{
+      type: String,
+      value: "card"
+    }
  },

  data: {
    independentID: '',
+    type: '',
    goods: { id: '' },
    isValidityLinePrice: false,
  },
@ -93,8 +98,11 @@ Component({
    },

    init() {
-      const { thresholds, id } = this.properties;
+      const { thresholds, id ,type } = this.properties;
      this.genIndependentID(id);
+      this.setData({
+        type
+      })
      if (thresholds && thresholds.length) {
        this.createIntersectionObserverHandle();
      }
--- a/components/goods-card/index.wxml
+++ b/components/goods-card/index.wxml
@ -3,6 +3,7 @@
  class="goods-card"
  bind:tap="clickHandle"
  data-goods="{{ goods }}"
+  wx:if="{{type == 'card'}}"
 >
 	<view class="goods-card__main">
 		<view class="goods-card__thumb" bind:tap="clickThumbHandle">
@ -64,3 +65,75 @@
 	</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>
+
--- a/components/goods-card/index.wxss
+++ b/components/goods-card/index.wxss
@ -131,3 +131,46 @@
 .spec-for-symbol {
  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;
+}
--- a/components/goods-list/index.js
+++ b/components/goods-list/index.js
@ -17,6 +17,10 @@ Component({
      type: Array,
      value: [],
    },
+    type:{
+      type: String,
+      value: "card"
+    }
  },

  data: {
@ -47,6 +51,7 @@ Component({

    init() {
      this.genIndependentID(this.id || '');
+      this.setData({ type: this.properties.type });
    },

    genIndependentID(id) {
--- a/components/goods-list/index.wxml
+++ b/components/goods-list/index.wxml
@ -7,6 +7,7 @@
 		  thresholds="{{thresholds}}"
 		  class="goods-card-inside"
 		  data-index="{{index}}"
+      type="{{type}}"
 		  bind:thumb="onClickGoodsThumb"
 		  bind:click="onClickGoods"
 		  bind:add-cart="onAddCart"
--- a/pages/goods/category/components/goods-category/components/c-tabbar/index.wxml
+++ b/pages/goods/category/components/goods-category/components/c-tabbar/index.wxml
@ -1,4 +1,4 @@
-<view class="c-tabbar custom-class">
+<!-- <view class="c-tabbar custom-class">
  <scroll-view
    wx:if="{{ tabList.length > 0 }}"
    class="c-tabbar__scroll"
@ -26,4 +26,6 @@
    bindselect="onClick"
  />
  <slot />
-</view>
+</view> -->
+
+<view>111</view>
--- a/pages/goods/details/index.js
+++ b/pages/goods/details/index.js
@ -315,6 +315,15 @@ Page({
    });
  },

+  gotoShop(){
+    const {
+      shopGuid
+    } = this.data.details;
+    wx.navigateTo({
+      url: "/pages/shop/all-goods/index?shopGuid=" + shopGuid,
+    });
+  },
+
  specsConfirm() {
    const {
      buyType
--- a/pages/goods/details/index.wxml
+++ b/pages/goods/details/index.wxml
@ -107,17 +107,17 @@
      <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" />
+                    src="{{details.shopLogo}}"
+                    class="shop-left-img" mode="aspectFit"/>
          </view>
          <view>
-              <view class="shop-name">三星官方旗舰店</view>
-              <view class="shop-sold">已售：244万</view>
-              <view class="shop-intro">三星手机官方旗舰店</view>
+              <view class="shop-name">{{details.shopName}}</view>
+              <view class="shop-sold">已售：{{details.shopSalesOrderCount}}</view>
+              <view class="shop-intro">{{details.shopIntro}}</view>
          </view>
      </view>
      <view class="shop-right-box">
-          <view class="shop-right-button">进店逛逛 ></view>
+          <view class="shop-right-button" bindtap="gotoShop">进店逛逛 ></view>
      </view>
  </view>

--- a/pages/goods/list/index.js
+++ b/pages/goods/list/index.js
@ -3,7 +3,8 @@ import Toast from 'tdesign-miniprogram/toast/index';

 const initFilters = {
  overall: 1,
-  sorts: '',
+  priceSorts: '',
+  soldSorts: '',
  layout: 0,
 };

@ -11,7 +12,8 @@ Page({
  data: {
    goodsList: [],
    layout: 0,
-    sorts: '',
+    priceSorts: '',
+    soldSorts: '',
    overall: 1,
    show: false,
    minVal: '',
@ -28,11 +30,12 @@ Page({
  total: 0,

  handleFilterChange(e) {
-    const { layout, overall, sorts } = e.detail;
+    const { layout, overall, priceSorts, soldSorts } = e.detail;
    this.pageNum = 1;
    this.setData({
      layout,
-      sorts,
+      priceSorts,
+      soldSorts,
      overall,
      loadMoreStatus: 0,
    });
@ -40,9 +43,9 @@ Page({
  },

  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 { sorts, overall } = filter;
+    // const { priceSorts,soldSorts, overall } = filter;
    const params = {
      goodsSort: 0, // 0 综合，1 价格
      pageNum: 1,
@ -51,18 +54,23 @@ Page({
      // keyword: keywords,
    };

-    if (sorts) {
+    if (priceSorts) {
      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) {
      params.goodsSort = 0;
    } else {
-      params.goodsSort = 1;
+      // params.goodsSort = 1;
    }
-    // params.minPrice = minVal ? minVal * 100 : 0;
-    // params.maxPrice = maxVal ? maxVal * 100 : undefined;
+    console.log(minVal,'最小价格');
+    params.minPrice = minVal ? minVal : 0;
+    params.maxPrice = maxVal ? maxVal : 0;
    if (reset) return params;
    return {
      ...params,
@ -188,6 +196,7 @@ Page({
  onMinValAction(e) {
    const { value } = e.detail;
    this.setData({ minVal: value });
+    console.log(this.data.minVal,'最凶啊');
  },

  onMaxValAction(e) {
@ -222,10 +231,10 @@ Page({
    this.setData(
      {
        show: false,
-        minVal: '',
-        goodsList: [],
+        // minVal: '',
+        // goodsList: [],
        loadMoreStatus: 0,
-        maxVal: '',
+        // maxVal: '',
      },
      () => {
        this.init();
--- a/pages/goods/list/index.wxml
+++ b/pages/goods/list/index.wxml
@ -3,7 +3,8 @@
    wr-class="filter-container"
    bind:change="handleFilterChange"
    layout="{{layout}}"
-    sorts="{{sorts}}"
+    priceSorts="{{priceSorts}}"
+    soldSorts="{{soldSorts}}"
    overall="{{overall}}"
    bind:showFilterPopup="showFilterPopup"
  >
--- a/pages/shop/all-goods/index.js
+++ b/pages/shop/all-goods/index.js
@ -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
+      });
+    }
+  },
+
+});
--- a/pages/shop/all-goods/index.json
+++ b/pages/shop/all-goods/index.json
@ -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"
+  }
+}
--- a/pages/shop/all-goods/index.wxml
+++ b/pages/shop/all-goods/index.wxml
@ -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" />
--- a/pages/shop/all-goods/index.wxss
+++ b/pages/shop/all-goods/index.wxss
@ -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;
+}