feat: 分类开发完成

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`,
+      {}
+    );
+  }

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

pages.json

@@ -39,6 +39,12 @@
         "navigationBarTitleText": "全部分类"
       }
     },
+    {
+      "path": "pages/category2/index",
+      "style": {
+        "navigationBarTitleText": "全部分类"
+      }
+    },
     {
       "path": "pages/cart/index",
       "style": {

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 class="price-x">¥{{ item.showPromotionPrice }}</text>
-                      <text v-if="item.line_price_min > 0" class="price-y">¥{{ item.line_price_min }}</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) {
+        if (this.list[this.curIndex] && this.list[this.curIndex].childrens) {
-          return this.list[this.curIndex].children
+          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
+              const newList = result.data.rows
-              app.goodsList.data = getMoreListData(newList, app.goodsList, pageNo)
+              app.goodsList.data = getMoreListData({ data: newList }, app.goodsList, pageNo)
-              app.goodsList.last_page = newList.last_page
+            //   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
       },
 
       // 一级分类：选中分类

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>

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分钟自动刷新一次页面数据
+      // 每间隔5分钟自动刷新一次页面数据 testzc
-      const curTime = new Date().getTime()
+     /*  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 => {
-            // 初始化分类模板设置
+            // 初始化分类模板设置 testorigin
-            app.initSetting(result[0])
+            // 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
       },
 
 

pages/category2/components/secondary.vue

@@ -7,10 +7,10 @@
     </scroll-view>
     <view class="cate-content">
       <!-- 二级分类列表 -->
-      <view class="category-list clearfix">
+      <view class="category-list clearfix" v-if="list.length">
-        <view class="category-item" v-for="(item, index) in list[curIndex].children" :key="index" @click="handleGoods(item.category_id)">
+        <view class="category-item" v-for="(item, index) in list[curIndex].childrens" :key="index" @click="handleGoods(item.id)">
-          <view v-if="item.image" class="item-image">
+          <view class="item-image">
-            <image class="image" mode="scaleToFill" :src="item.image.preview_url"></image>
+            <image class="image" mode="scaleToFill" :src="item.imageUrl"></image>
           </view>
           <view class="item-name">
             <text class="oneline-hide">{{ item.name }}</text>

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>