feat: 店铺分类

config/config.js

@@ -287,6 +287,7 @@ export default {
 			"menu": iu + "?ctl=Store&met=menu&typ=json",
 			// "lists":iu + "?ctl=Store&met=lists&typ=json",
 			"lists": ip + "shop/store/lists",
+			"category": ip + "shop/store/category",
       // 附近门店列表
       "nearList": ip + 'shop/store/near/list',
 			"listsChain": iu + "?ctl=Chain&met=lists&typ=json",
@@ -1115,7 +1116,7 @@ export default {
 				"text": "推荐"
 			},
 			{
-				"pagePath": "pages/category/category",
+				"pagePath": "pages/category/storeCategory",
 				"iconPath": "static/images/tabBar2.png",
 				"selectedIconPath": "static/images/tabBar_sel2.png",
 				"text": "分类"

pages.json

@@ -77,6 +77,16 @@
       }
     },
     
+    {
+      "path": "pages/category/storeCategory",
+      "style": {
+        "navigationBarTitleText": "分类",
+        "app-plus": {
+          "titleNView": false
+        }
+      }
+    },
+
     /*
 		{
 			"path": "pages/index/community",
@@ -1524,7 +1534,7 @@
         "text": "推荐"
       },
       {
-        "pagePath": "pages/category/category",
+        "pagePath": "pages/category/storeCategory",
         "iconPath": "static/images/tabBar2.png",
         "selectedIconPath": "static/images/tabBar_sel2.png",
         "text": "分类"

pages/category/storeCategory.vue

@@ -0,0 +1,155 @@
+<template>
+  <view class="storeCategory">
+    <scroll-view class="category_left" scroll-y>
+      <view
+        v-for="(item, index) in categoryMenu"
+        :class="[
+          'item',
+          {
+            current: categoryMenuIndex === index,
+          },
+        ]"
+        @click="categoryMenuClick(index, $event)"
+      >
+        {{ item.name }}
+      </view>
+    </scroll-view>
+    <scroll-view class="category_right" scroll-y>
+      <view v-for="(item, index) in categoryList" class="box" :key="index">
+        <view class="tit">{{ item.name }}</view>
+        <view class="list">
+            <navigator class="item"  :url="`/pagesub/index/store?store_id=${shop.store_id}`" v-if="item.storeList!=null"  v-for="(shop, cur) in item.storeList.items" :key="cur">
+                  <image lazy-load class="img" :src="shop.store_logo"></image>
+                  <view class="desc">{{ shop.store_name }}</view>
+            </navigator>
+        </view>
+        <view class="nodata" v-if="item.storeList.items.length==0">该分类暂无店铺数据</view>
+      </view>
+    </scroll-view>
+  </view>
+</template>
+
+<script>
+import { mapState } from "vuex";
+
+export default {
+  data() {
+    return {
+      categoryMenu: [],
+      categoryList: [],
+      categoryMenuIndex: 0,
+    };
+  },
+  computed: mapState([
+    "Config",
+    "StateCode",
+    "notice",
+    "plantformInfo",
+    "shopInfo",
+    "userInfo",
+    "hasLogin",
+  ]),
+  mounted() {
+    const _this = this;
+    const params = {
+      openFindStore: true,
+      pageSize: 9999,
+    };
+    this.$.request({
+      url: this.Config.URL.store.category,
+      data: params,
+      dataType: "json",
+      success(data, status, msg, code) {
+        const items = data.items
+        _this.categoryMenu = items;
+         _this.categoryList = items[_this.categoryMenuIndex]?.sub;
+      },
+    });
+  },
+  methods: {
+    categoryMenuClick(index) {
+      this.categoryMenuIndex = index;
+      this.categoryList = this.categoryMenu[index]?.sub; 
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.category_left {
+  width: 200rpx;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 12rpx;
+  z-index: 1;
+  box-sizing: border-box;
+  .item {
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    color: #222;
+    font-size: 28rpx;
+    font-weight: bold;
+    padding: 16rpx;
+    &.current {
+      color: #fe411b;
+    }
+  }
+}
+.category_right {
+  width: calc(100vw - 232rpx - 20rpx);
+  position: absolute;
+  top: 20rpx;
+  bottom: 0;
+  left: 232rpx;
+  z-index: 1;
+   .box {
+    min-height: 180rpx;
+    padding: 16rpx;
+    border-radius: 12rpx;
+    margin-bottom: 12rpx;
+    background: #fff;
+    .list{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        flex-direction: row;
+        flex-wrap: wrap;
+        gap: 10rpx;
+    }
+    .tit{
+        padding-bottom: 10rpx;
+    }
+    .item{
+         display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+         width: 140rpx;
+        .img{
+            width: 120rpx;
+            height: 120rpx;
+            border-radius: 8rpx;
+            margin-bottom: 8rpx;
+        }
+        .desc{
+            width: 140rpx;
+            text-align: center;
+            font-size: 24rpx;
+            color: #666;
+             white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+    }
+    .nodata{
+        text-align: center;
+        color: #999;
+        padding: 50rpx;
+        font-size: 24rpx;
+    }
+  }
+}
+</style>