feat: 分类开发完成

2025-11-29 21:24:46 +08:00 · 2025-11-29 21:24:46 +08:00 · 9740ed4fc3
commit 9740ed4fc3
parent b8e3de0f9b
8 changed files with 198 additions and 186 deletions
--- a/api/category/index.js
+++ b/api/category/index.js
@ -1,4 +1,6 @@
 import request from '@/utils/request'
+import {httpRequest} from '@/utils/request/axios'
+const baseUrl = 'https://api.1024api.com/api-interface'

 // api地址
 const api = {
@ -9,3 +11,10 @@ const api = {
 export function list() {
  return request.get(api.list)
 }
+
+export const apiGetAppCategoryList = () => {
+    return httpRequest.post(
+      `${baseUrl}/app/category/list`,
+      {}
+    );
+  }
--- a/api/goods/index.js
+++ b/api/goods/index.js
@ -1,4 +1,6 @@
 import request from '@/utils/request'
+import {httpRequest} from '@/utils/request/axios'
+const baseUrl = 'https://api.1024api.com/api-interface'

 // api地址
 const api = {
@ -35,3 +37,11 @@ export const specData = (goodsId) => {
 export const skuInfo = (goodsId, goodsSkuId, param) => {
  return request.get(api.skuInfo, { goodsId, goodsSkuId, ...param })
 }
+
+export const apiGetCommodityList = (data) => {
+    return httpRequest.post(
+      `${baseUrl}/app/index/page/list`,
+      data
+    );
+  }
+
--- a/pages.json
+++ b/pages.json
@ -39,6 +39,12 @@
        "navigationBarTitleText": "全部分类"
      }
    },
+    {
+      "path": "pages/category2/index",
+      "style": {
+        "navigationBarTitleText": "全部分类"
+      }
+    },
    {
      "path": "pages/cart/index",
      "style": {
--- a/pages/category/components/commodity.vue
+++ b/pages/category/components/commodity.vue
@ -29,24 +29,24 @@
        <!-- 商品列表 -->
        <view class="goods-list">
          <view class="goods-item--container" v-for="(item, index) in goodsList.data" :key="index">
-            <view class="goods-item" @click="onTargetGoods(item.goods_id)">
+            <view class="goods-item" @click="onTargetGoods(item.id)">
              <!-- 商品图片 -->
              <view class="goods-item-left">
-                <image class="image" :src="item.goods_image"></image>
+                <image class="image" :src="item.mainImageUrl"></image>
              </view>
              <view class="goods-item-right">
                <!-- 商品标题 -->
                <view class="goods-name">
-                  <text class="twoline-hide">{{ item.goods_name }}</text>
+                  <text class="twoline-hide">{{ item.title }}</text>
                </view>
                <!-- 商品信息 -->
                <view class="goods-item-desc">
                  <view class="desc-footer">
                    <view class="item-prices oneline-hide">
-                      <text class="price-x">¥{{ item.goods_price_min }}</text>
-                      <text v-if="item.line_price_min > 0" class="price-y">¥{{ item.line_price_min }}</text>
+                      <text class="price-x">¥{{ item.showPromotionPrice }}</text>
+                      <text class="price-y">¥{{ item.showSalePrice }}</text>
                    </view>
-                    <add-cart-btn v-if="setting.showAddCart" :btnStyle="setting.cartStyle" @handleAddCart="handleAddCart(item)" />
+                    <add-cart-btn :btnStyle="1" @handleAddCart="handleAddCart(item)" />
                  </view>
                </view>
              </view>
@ -84,11 +84,6 @@
        type: Array,
        default: []
      },
-      // 分类设置
-      setting: {
-        type: Object,
-        default: () => {}
-      },
      // query参数
      query: {
        type: Object,
@ -133,8 +128,8 @@
    computed: {
      // 二级分类列表
      subCateList() {
-        if (this.list[this.curIndex] && this.list[this.curIndex].children) {
-          return this.list[this.curIndex].children
+        if (this.list[this.curIndex] && this.list[this.curIndex].childrens) {
+          return this.list[this.curIndex].childrens
        }
        return []
      }
@ -145,7 +140,7 @@
      findCateIndex(cateId, pIndex = -1) {
        if (!cateId) return -1
        const data = pIndex > -1 ? this.list[pIndex].children : this.list
-        return data.findIndex(item => item.category_id == cateId)
+        return data.findIndex(item => item.id == cateId)
      },

      /**
@ -173,11 +168,15 @@
        const app = this
        const categoryId = app.getCategoryId()
        return new Promise((resolve, reject) => {
-          GoodsApi.list({ categoryId, page: pageNo }, { load: false })
+          GoodsApi.list({ categoryId, page: pageNo }, { load: false }).then(res => {
+            console.warn('----- my data is categoryId: ', res)
+          })
+            // testorigin GoodsApi.list({ categoryId, page: pageNo }, { load: false })
+          GoodsApi.apiGetCommodityList({ categoryId })
            .then(result => {
-              const newList = result.data.list
-              app.goodsList.data = getMoreListData(newList, app.goodsList, pageNo)
-              app.goodsList.last_page = newList.last_page
+              const newList = result.data.rows
+              app.goodsList.data = getMoreListData({ data: newList }, app.goodsList, pageNo)
+            //   app.goodsList.last_page = newList.last_page
              resolve(newList)
            })
            .catch(reject)
@ -188,9 +187,9 @@
      getCategoryId() {
        const app = this
        if (app.curIndex2 > -1) {
-          return app.subCateList[app.curIndex2].category_id
+          return app.subCateList[app.curIndex2].id
        }
-        return app.curIndex > -1 ? app.list[app.curIndex].category_id : 0
+        return app.curIndex > -1 ? app.list[app.curIndex].id : 0
      },

      // 一级分类：选中分类
--- a/pages/category/components/primary.vue
+++ b/pages/category/components/primary.vue
@ -1,110 +0,0 @@
-<template>
-  <view class="primary">
-    <!-- 一级分类(大图) 10 -->
-    <view v-if="list.length > 0 && display == PageCategoryStyleEnum.ONE_LEVEL_BIG.value" class="cate-content">
-      <view class="cate-wrapper cate_style__10 clearfix">
-        <view class="cate-item" v-for="(item, index) in list" :key="index" @click="onTargetGoodsList(item.category_id)">
-          <image v-if="item.image" class="image" mode="widthFix" :src="item.image.preview_url"></image>
-        </view>
-      </view>
-    </view>
-    <!-- 一级分类(小图) 11 -->
-    <view v-if="list.length > 0 && display == PageCategoryStyleEnum.ONE_LEVEL_SMALL.value" class="cate-content">
-      <view class="cate-wrapper cate_style__11 clearfix">
-        <view class="cate-item" v-for="(item, index) in list" :key="index" @click="onTargetGoodsList(item.category_id)">
-          <image v-if="item.image" class="image" mode="scaleToFill" :src="item.image.preview_url"></image>
-          <view class="cate-name">{{ item.name }}</view>
-        </view>
-      </view>
-    </view>
-    <empty v-if="!list.length" :tips="'亲，暂无商品分类' + display" />
-  </view>
-</template>
-
-<script>
-  import { PageCategoryStyleEnum } from '@/common/enum/store/page/category'
-  import Empty from '@/components/empty'
-
-  export default {
-    components: {
-      Empty
-    },
-    props: {
-      // 分类页样式
-      display: {
-        type: Number,
-        default: 10
-      },
-      // 分类列表
-      list: {
-        type: Array,
-        default: []
-      }
-    },
-    data() {
-      return {
-        // 枚举类
-        PageCategoryStyleEnum,
-      }
-    },
-
-    methods: {
-
-      // 跳转至商品列表页
-      onTargetGoodsList(categoryId) {
-        this.$navTo('pages/goods/list', { categoryId })
-      }
-
-    }
-  }
-</script>
-
-<style lang="scss" scoped>
-  // 分类内容
-  .cate-content {
-    z-index: 1;
-    background: #fff;
-    padding-top: 96rpx;
-
-    .cate-wrapper {
-      padding: 0 20rpx 20rpx 20rpx;
-      box-sizing: border-box;
-    }
-  }
-
-  // 一级分类(大图) 10
-  .cate_style__10 .cate-item {
-    margin-bottom: 20rpx;
-
-    &:last-child {
-      margin-bottom: 0;
-    }
-
-    .image {
-      display: block;
-      width: 100%;
-      height: auto;
-    }
-  }
-
-  // 一级分类(小图) 11
-  .cate_style__11 .cate-item {
-    float: left;
-    padding: 25rpx;
-    width: 33.3333%;
-    text-align: center;
-    box-sizing: border-box;
-
-    .image {
-      display: block;
-      width: 188rpx;
-      height: 188rpx;
-      margin-bottom: 12rpx;
-    }
-
-    .cate-name {
-      font-size: 28rpx;
-      color: #555;
-    }
-  }
-</style>
--- a/pages/category/index.vue
+++ b/pages/category/index.vue
@ -5,16 +5,8 @@
      <search tips="搜索商品" @event="$navTo('pages/search/index')" />
    </view>

-    <!-- 一级分类 -->
-    <primary
-      v-if="setting.style == PageCategoryStyleEnum.ONE_LEVEL_BIG.value || setting.style == PageCategoryStyleEnum.ONE_LEVEL_SMALL.value"
-      :display="setting.style" :list="list" />
-
-    <!-- 二级分类 -->
-    <secondary v-if="setting.style == PageCategoryStyleEnum.TWO_LEVEL.value" :list="list" />
-
    <!-- 分类+商品 -->
-    <commodity v-if="setting.style == PageCategoryStyleEnum.COMMODITY.value" ref="mescrollItem" :list="list" :setting="setting" :query="query" />
+    <commodity ref="mescrollItem" :list="list" :query="query" />

  </view>
 </template>
@ -23,13 +15,8 @@
  import store from '@/store'
  import MescrollCompMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp'
  import { setCartTabBadge } from '@/core/app'
-  import SettingKeyEnum from '@/common/enum/setting/Key'
-  import { PageCategoryStyleEnum } from '@/common/enum/store/page/category'
-  import SettingModel from '@/common/model/Setting'
  import * as CategoryApi from '@/api/category'
  import Search from '@/components/search'
-  import Primary from './components/primary'
-  import Secondary from './components/secondary'
  import Commodity from './components/commodity'

  // 最后一次刷新时间
@ -38,37 +25,19 @@
  export default {
    components: {
      Search,
-      Primary,
-      Secondary,
      Commodity
    },
    mixins: [MescrollCompMixin],
    data() {
      return {
-        // 枚举类
-        PageCategoryStyleEnum,
-        // 分类列表
        list: [],
-        // 分类模板设置
-        setting: {},
-        // 正在加载中
        isLoading: true,
-        // query参数
        query: { categoryId1: undefined, categoryId2: undefined }
      }
    },
-
-    /**
-     * 生命周期函数--监听页面加载
-     */
    onLoad() {
-      // 加载页面数据
      this.onRefreshPage()
    },
-
-    /**
-     * 生命周期函数--监听页面显示
-     */
    onShow() {

      // 监听query参数
@ -80,15 +49,14 @@
          // console.log('onShow',  this.query, res )
        })

-      // 每间隔5分钟自动刷新一次页面数据
-      const curTime = new Date().getTime()
+      // 每间隔5分钟自动刷新一次页面数据 testzc
+     /*  const curTime = new Date().getTime()
      if ((curTime - lastRefreshTime) > 5 * 60 * 1000) {
        this.onRefreshPage()
-      }
+      } */
    },

    methods: {
-
      // 刷新页面
      onRefreshPage() {
        // 记录刷新时间
@ -104,35 +72,26 @@
        const app = this
        app.isLoading = true
        Promise.all([
-            // 获取分类模板设置
-            // 优化建议: 可以将此处的false改为true 启用缓存
-            SettingModel.data(false),
            // 获取分类列表
-            CategoryApi.list()
+            // CategoryApi.list(), // testorigin
+            CategoryApi.apiGetAppCategoryList()
+
          ])
          .then(result => {
-            // 初始化分类模板设置
-            app.initSetting(result[0])
+            // 初始化分类模板设置 testorigin
+            // app.initSetting(result[0])
            // 初始化分类列表数据
-            app.initCategory(result[1])
+            app.initCategory(result[0])
          })
          .finally(() => app.isLoading = false)
      },

-      /**
-       * 初始化分类模板设置
-       * @param {Object} result
-       */
-      initSetting(setting) {
-        this.setting = setting[SettingKeyEnum.PAGE_CATEGORY_TEMPLATE.value]
-      },
-
      /**
       * 初始化分类列表数据
       * @param {Object} result
       */
      initCategory(result) {
-        this.list = result.data.list
+        this.list = result.data
      },


--- a/pages/category2/components/secondary.vue
+++ b/pages/category2/components/secondary.vue
@ -7,10 +7,10 @@
    </scroll-view>
    <view class="cate-content">
      <!-- 二级分类列表 -->
-      <view class="category-list clearfix">
-        <view class="category-item" v-for="(item, index) in list[curIndex].children" :key="index" @click="handleGoods(item.category_id)">
-          <view v-if="item.image" class="item-image">
-            <image class="image" mode="scaleToFill" :src="item.image.preview_url"></image>
+      <view class="category-list clearfix" v-if="list.length">
+        <view class="category-item" v-for="(item, index) in list[curIndex].childrens" :key="index" @click="handleGoods(item.id)">
+          <view class="item-image">
+            <image class="image" mode="scaleToFill" :src="item.imageUrl"></image>
          </view>
          <view class="item-name">
            <text class="oneline-hide">{{ item.name }}</text>
--- a/pages/category2/index.vue
+++ b/pages/category2/index.vue
@ -0,0 +1,139 @@
+<template>
+  <view class="container">
+    <!-- 搜索框 -->
+    <view class="search">
+      <search tips="搜索商品" @event="$navTo('pages/search/index')" />
+    </view>
+    <!-- 二级分类 -->
+    <secondary :list="list" />
+  </view>
+</template>
+
+<script>
+  import store from '@/store'
+  import MescrollCompMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-comp'
+  import { setCartTabBadge } from '@/core/app'
+  import * as CategoryApi from '@/api/category'
+  import Search from '@/components/search'
+    import Secondary from './components/secondary'
+
+  // 最后一次刷新时间
+  let lastRefreshTime;
+
+  export default {
+    components: {
+      Search,
+      Secondary,
+    },
+    mixins: [MescrollCompMixin],
+    data() {
+      return {
+        list: [],
+        isLoading: true,
+        query: { categoryId1: undefined, categoryId2: undefined }
+      }
+    },
+    onLoad() {
+      this.onRefreshPage()
+    },
+    onShow() {
+
+      // 监听query参数
+      store.dispatch('OnceQueryParam')
+        .then(res => {
+          if (res !== null) {
+            this.query = res
+          }
+          // console.log('onShow',  this.query, res )
+        })
+
+      // 每间隔5分钟自动刷新一次页面数据 testzc
+     /*  const curTime = new Date().getTime()
+      if ((curTime - lastRefreshTime) > 5 * 60 * 1000) {
+        this.onRefreshPage()
+      } */
+    },
+
+    methods: {
+      // 刷新页面
+      onRefreshPage() {
+        // 记录刷新时间
+        lastRefreshTime = new Date().getTime()
+        // 获取页面数据
+        this.getPageData()
+        // 更新购物车角标
+        setCartTabBadge()
+      },
+
+      // 获取页面数据
+      getPageData() {
+        const app = this
+        app.isLoading = true
+        Promise.all([
+            // 获取分类列表
+            // CategoryApi.list(), // testorigin
+            CategoryApi.apiGetAppCategoryList()
+
+          ])
+          .then(result => {
+            // 初始化分类模板设置 testorigin
+            // app.initSetting(result[0])
+            // 初始化分类列表数据
+            app.initCategory(result[0])
+          })
+          .finally(() => app.isLoading = false)
+      },
+
+      /**
+       * 初始化分类列表数据
+       * @param {Object} result
+       */
+      initCategory(result) {
+        this.list = result.data
+      },
+
+
+    },
+
+    /**
+     * 设置分享内容
+     */
+    onShareAppMessage() {
+      const app = this
+      return {
+        title: _this.templet.shareTitle,
+        path: '/pages/category/index?' + app.$getShareUrlParams()
+      }
+    },
+
+    /**
+     * 分享到朋友圈
+     * 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
+     * https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
+     */
+    onShareTimeline() {
+      const app = this
+      return {
+        title: _this.templet.shareTitle,
+        path: '/pages/category/index?' + app.$getShareUrlParams()
+      }
+    }
+
+  }
+</script>
+
+<style>
+  page {
+    background: #fff;
+  }
+</style>
+<style lang="scss" scoped>
+  // 搜索框
+  .search {
+    position: fixed;
+    top: var(--window-top);
+    left: var(--window-left);
+    right: var(--window-right);
+    z-index: 9;
+  }
+</style>