feat:商品收藏接口和申请成为会员接口对接

src/pages/lxMall/commodityDetail/components/Exhibition/index.tsx

 import React, { useState, useEffect } from 'react'
 import cx from 'classnames'
-import { LeftOutlined, RightOutlined, StarOutlined } from '@ant-design/icons'
+import { LeftOutlined, RightOutlined, StarOutlined, StarFilled } from '@ant-design/icons'
 import { GetSearchShopStoreGetCommodityDetailResponse } from '@/services/SearchApi'
+import { getAuth } from '@/utils/auth'
+import { PublicApi } from '@/services/api'
 import styles from './index.less'
+import { message } from 'antd'
 
 interface imgItemType {
   id: number;
@@ -18,6 +21,14 @@ const Exhibition: React.FC<ExhibitionPropsType> = (props) => {
   const { imgList = [], commodityDetail } = props
   const [previewImg, setPreviewImg] = useState<any>()
   const [offSetLeft, setOffSetLeft] = useState<number>(0)
+  const [collectState, setCollectState] = useState<boolean>(false)
+  const [collectCount, setCollectCount] = useState<number>(0)
+  let collectFlg = true
+  useEffect(() => {
+    if (commodityDetail) {
+      getCollectState()
+    }
+  }, [commodityDetail])
 
   useEffect(() => {
     if (imgList.length > 0) {
@@ -40,6 +51,66 @@ const Exhibition: React.FC<ExhibitionPropsType> = (props) => {
     }
   }
 
+  /**
+   * 获取收藏状态
+   */
+  const getCollectState = () => {
+    if (getAuth()) {
+      //@ts-ignore
+      PublicApi.getSearchShopCommodityCollectGetCommodityCollect({ commodityId: commodityDetail.id }).then(res => {
+        if (res.code === 1000) {
+          setCollectState(res.data.isCollect)
+          setCollectCount(res.data.count)
+        }
+      })
+    }
+  }
+
+  /**
+   * 收藏或取消收藏
+   */
+  const handleToggleCollect = () => {
+    if (!getAuth()) {
+      if (collectFlg) {
+        collectFlg = false
+        message.info("请先进行登录")
+        setTimeout(() => {
+          collectFlg = true
+          window.location.replace(`/user/login?redirect=${btoa(encodeURIComponent(String(window.location)))}`)
+        }, 1500);
+      }
+    }
+    if (collectFlg) {
+      collectFlg = false
+      let postFn;
+      let param: any = {
+        commodityId: commodityDetail.id
+      }
+      if (collectState) {
+        postFn = PublicApi.postSearchShopCommodityCollectDeleteCommodityCollect
+      } else {
+        postFn = PublicApi.postSearchShopCommodityCollectSaveCommodityCollect
+      }
+      postFn && postFn(param).then(res => {
+        if (res.code === 1000) {
+          message.destroy()
+          if (collectState) {
+            message.success('取消收藏成功')
+            setCollectState(false)
+            setCollectCount(collectCount - 1)
+          } else {
+            setCollectState(true)
+            setCollectCount(collectCount + 1)
+            message.success('收藏成功')
+          }
+        }
+        collectFlg = true
+      }).catch(() => {
+        collectFlg = true
+      })
+    }
+  }
+
   return (
     <div className={styles.exhibition}>
       <div className={styles.exhibition_img_container}>
@@ -60,9 +131,9 @@ const Exhibition: React.FC<ExhibitionPropsType> = (props) => {
         </div>
         <div className={cx(styles.exhibition_tool_item, styles.next)} onClick={() => handleNext()}><RightOutlined /></div>
       </div>
-      <div className={cx(styles.collection_state)}>
-        <StarOutlined />
-        <label>收藏商品(112)</label>
+      <div className={cx(styles.collection_state, collectState ? styles.active : '')} onClick={() => handleToggleCollect()}>
+        {collectState ? <StarFilled /> : <StarOutlined />}
+        <label>收藏商品{collectCount > 0 ? `(${collectCount})` : ""}</label>
       </div>
     </div>
   )

src/pages/lxMall/commodityDetail/index.tsx

@@ -207,8 +207,8 @@ const CommodityDetail = (props) => {
   }, [selectAttrVal, commodityDetail])
 
   const getCommodityPriceRange = () => {
-    if (commodityDetail?.unitPriceAndPicList) {
-      for (let item of commodityDetail?.unitPriceAndPicList) {
+    if (commodityDetail?.unitPricePicList) {
+      for (let item of commodityDetail?.unitPricePicList) {
 
         let temp = item.attributeAndValueList.map(attrItem => {
           return {
@@ -252,13 +252,10 @@ const CommodityDetail = (props) => {
     if (clickFlag) {
       clickFlag = false
       let param = {
-        commodityUnitPrice: {
-          id: selectCommodityId
-        },
+        commodityUnitPriceId: selectCommodityId,
         count: buyCount
       }
-
-      PublicApi.postProductPurchaseSaveOrUpdatePurchase(param).then(res => {
+      PublicApi.postSearchShopPurchaseSaveOrUpdatePurchase(param).then(res => {
         clickFlag = true
         if (res.code === 1000) {
           message.destroy()
@@ -403,11 +400,11 @@ const CommodityDetail = (props) => {
 
   /**
    * 初始化商品详情数据
-   * @param unitPriceAndPicList 
+   * @param unitPricePicList 
    */
   const initAttributeAndValueList = (dataInfo: any) => {
-    let unitPriceAndPicList = dataInfo?.unitPriceAndPicList
-    if (!unitPriceAndPicList) {
+    let unitPricePicList = dataInfo?.unitPricePicList
+    if (!unitPricePicList) {
       return
     }
     let tempAttrList = []
@@ -415,7 +412,7 @@ const CommodityDetail = (props) => {
       id: dataInfo.id,
       commodityPic: dataInfo.mainPic
     }]
-    for (let item of unitPriceAndPicList) {
+    for (let item of unitPricePicList) {
       // 初始化商品图片-》 商品主图加上商品属性图片
       if (item.commodityPic) {
         let tempCommodityPic = item.commodityPic.map((picItem, picIndex) => {
@@ -456,8 +453,8 @@ const CommodityDetail = (props) => {
         }
       }
     }
-    setCurrentPriceRange(sortUnitPrice(unitPriceAndPicList[0].unitPrice))
-    setStockCount(unitPriceAndPicList[0].stockCount)
+    setCurrentPriceRange(sortUnitPrice(unitPricePicList[0].unitPrice))
+    setStockCount(unitPricePicList[0].stockCount)
     setCommodityImgList(tempImgList)
     setAttributeList(tempAttrList)
   }
@@ -614,9 +611,9 @@ const CommodityDetail = (props) => {
     let newSelectAttrVal = JSON.parse(JSON.stringify(selectAttrVal))
     if (selectAttrVal.length > 0) {
       // newSelectAttrVal.pop()
-      if (commodityDetail?.unitPriceAndPicList) {
+      if (commodityDetail?.unitPricePicList) {
         let tempList = []
-        for (let item of commodityDetail?.unitPriceAndPicList) {
+        for (let item of commodityDetail?.unitPricePicList) {
           let temp = item.attributeAndValueList.map(attrItem => {
             return {
               attrId: attrItem.customerAttribute.id,

src/pages/lxMall/components/ShopHeader/index.less

@@ -253,7 +253,8 @@
           height: 32px;
           background-color: #D32F2F;
           color: #FFF;
-          line-height: 32px;
+          border: none;
+          outline: none;
           text-align: center;
           font-size: 12px;
           cursor: pointer;

src/pages/lxMall/components/ShopHeader/index.tsx

 import React, { useState, useEffect } from 'react'
 import { CaretDownOutlined } from '@ant-design/icons'
-import { Rate, Input } from 'antd'
+import { Rate, Input, Button } from 'antd'
 import { history, Link } from 'umi'
 import isEmpty from 'lodash/isEmpty'
 // import logo from '@/theme/imgs/logo_w.png'
 import shop_icon from '@/assets/imgs/shop_icon.png'
 import credit_icon from '@/assets/imgs/credit_icon.png'
-import { GetTemplateShopFindShopResponse } from '@/services/TemplateApi'
 import styles from './index.less'
+import { PublicApi } from '@/services/api'
 
 interface ShopHeaderPropsType {
   shopId: number;
   shopUrlParam: string;
-  shopInfo: GetTemplateShopFindShopResponse;
+  shopInfo: any;
   logo: string;
 }
 
 const ShopHeader: React.FC<ShopHeaderPropsType> = (props) => {
   const { shopId, shopUrlParam, shopInfo, logo } = props
   const [searchValue, setSearchValue] = useState<string>("")
+  const [applyLoading, setApplyLoading] = useState<boolean>(false)
   const { search } = history.location.query
 
   useEffect(() => {
@@ -37,6 +38,24 @@ const ShopHeader: React.FC<ShopHeaderPropsType> = (props) => {
     }
   }
 
+  const applyFroVip = () => {
+    if (shopInfo) {
+      let param = {
+        memberId: shopInfo.memberId,
+        roleId: shopInfo.roleId
+      }
+      setApplyLoading(true)
+      PublicApi.postMemberAbilityMallSubApply(param).then((res) => {
+        if (res.code === 1000) {
+
+        }
+        setApplyLoading(false)
+      }).catch(() => {
+        setApplyLoading(false)
+      })
+    }
+  }
+
   return (
     <div className={styles.shop_header}>
       <div className={styles.shop_header_container}>
@@ -94,7 +113,7 @@ const ShopHeader: React.FC<ShopHeaderPropsType> = (props) => {
               <div className={styles.shop_info_btn}><Link to={`/shop?shopId=${shopUrlParam}`}>进入店铺</Link></div>
               <div className={styles.shop_info_btn}>收藏本店</div>
             </div>
-            <div className={styles.apply_member_btn}>申请成为本店会员</div>
+            <Button loading={applyLoading} className={styles.apply_member_btn} onClick={() => applyFroVip()}>申请成为本店会员</Button>
           </div>
         </div>
         <div className={styles.mall_search}>

src/pages/lxMall/information/detail.tsx

@@ -106,7 +106,7 @@ const InformationDetail: React.FC<InformationDetailPropsType> = (props) => {
                 <div className={styles.information_detail_view}>
                   <div className={styles.information_detail_view_item}>
                     <ClockCircleOutlined />
-                    <span className={styles.information_detail_view_item_text}>{(moment(newsDetail.createTime).format('YYYY-MM-DD HH:mm:ss'))}</span>
+                    <span className={styles.information_detail_view_item_text}>{(moment(newsDetail.createTime).format('YYYY-MM-DD HH:mm'))}</span>
                   </div>
                   <div className={styles.information_detail_view_item}>
                     <EyeOutlined />

src/pages/lxMall/information/index.tsx

@@ -205,7 +205,7 @@ const Information: React.FC<InformationPropsType> = (props) => {
                       <div className={styles.information_common_view}>
                         <div className={styles.information_common_view_item}>
                           <ClockCircleOutlined />
-                          <span className={styles.information_common_view_item_text}>{(moment(item.createTime).format('YYYY-MM-DD HH:mm:ss'))}</span>
+                          <span className={styles.information_common_view_item_text}>{(moment(item.createTime).format('YYYY-MM-DD HH:mm'))}</span>
                         </div>
                         <div className={styles.information_common_view_item}>
                           <EyeOutlined />

src/pages/lxMall/information/search.tsx

@@ -200,7 +200,7 @@ const InformationSearch: React.FC<InformationPropsType> = (props) => {
                       <div className={styles.information_common_view}>
                         <div className={styles.information_common_view_item}>
                           <ClockCircleOutlined />
-                          <span className={styles.information_common_view_item_text}>{(moment(item.createTime).format('YYYY-MM-DD HH:mm:ss'))}</span>
+                          <span className={styles.information_common_view_item_text}>{(moment(item.createTime).format('YYYY-MM-DD HH:mm'))}</span>
                         </div>
                         <div className={styles.information_common_view_item}>
                           <EyeOutlined />

src/pages/lxMall/purchaseOrder/index.less

@@ -84,6 +84,7 @@
               width: 120px;
               text-align: center;
               margin-top: 10px;
+              white-space: nowrap;
             }
           }
 

src/pages/lxMall/purchaseOrder/index.tsx

@@ -11,9 +11,8 @@ import { priceFormat, numFormat } from "@/utils/numberFomat"
 import { useLocalStore, observer } from 'mobx-react'
 import { store } from '@/store'
 import { LAYOUT_TYPE } from '@/constants'
-import { GetProductPurchaseGetPurchaseListResponse } from '@/services/ProductApi'
+import { GetSearchShopPurchaseGetPurchaseListResponse } from '@/services/SearchApi'
 import { GetTemplateChannelFindChannelResponse } from '@/services/TemplateApi'
-import { GlobalConfig } from '@/global/config'
 import { isEmpty } from 'lodash'
 
 interface PurchaseOrderPropsType {
@@ -40,14 +39,14 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
 
   const fetchPurchaseList = (initState = false) => {
 
-    PublicApi.getProductPurchaseGetPurchaseList().then(res => {
+    PublicApi.getSearchShopPurchaseGetPurchaseList().then(res => {
       if (res.code === 1000) {
         initPurchaseList(res.data, initState)
       }
     })
   }
 
-  const initPurchaseList = (list: GetProductPurchaseGetPurchaseListResponse, initState) => {
+  const initPurchaseList = (list: GetSearchShopPurchaseGetPurchaseListResponse, initState) => {
     let result = []
     for (let item of list) {
       // 判断店铺id是否已存在数组中
@@ -185,7 +184,7 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
         id,
         count
       }
-      PublicApi.postProductPurchaseSaveOrUpdatePurchase(param).then(res => {
+      PublicApi.postSearchShopPurchaseSaveOrUpdatePurchase(param).then(res => {
         countState = true
         if (res.code === 1000) {
           message.destroy()
@@ -245,7 +244,7 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
       content: `是否从进货单中移除该商品？`,
       onOk: () => {
         return new Promise((resolve, reject) => {
-          PublicApi.postProductPurchaseDeletePurchase({ idList: [id] }).then(res => {
+          PublicApi.postSearchShopPurchaseDeletePurchase({ idList: [id] }).then(res => {
             if (res.code === 1000) {
               // fetchPurchaseList()
               deleteListItems([id])
@@ -279,7 +278,7 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
       content: `是否从进货单中移除选中的商品？`,
       onOk: () => {
         return new Promise((resolve, reject) => {
-          PublicApi.postProductPurchaseDeletePurchase({ idList: idList }).then(res => {
+          PublicApi.postSearchShopPurchaseDeletePurchase({ idList: idList }).then(res => {
             if (res.code === 1000) {
               // fetchPurchaseList()
               deleteListItems(idList)

src/pages/systemSetting/collection/commodity.tsx

-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Button, Pagination } from 'antd'
 import { StarFilled } from '@ant-design/icons'
-import shop_icon from '@/assets/imgs/shop_icon.png'
 import credit_icon from '@/assets/imgs/credit_icon.png'
 import styles from './index.less'
+import { PublicApi } from '@/services/api'
+import { numFormat } from '@/utils/numberFomat'
+import moment from 'moment'
 import { COMMODITY_TYPE } from '@/constants'
 
 const Commodity: React.FC = () => {
+  const [list, setList] = useState([])
+  const [current, setCurrent] = useState<number>(1)
+  const [pageSize, setPageSize] = useState<number>(10)
+  const [totalCount, setTotalCount] = useState<number>(0)
+
+  useEffect(() => {
+    fetchCollectCommodityList()
+  }, [])
+
+  /**
+   * 获取收藏的商品列表
+   */
+  const fetchCollectCommodityList = () => {
+    let param = {
+      current,
+      pageSize
+    }
+    //@ts-ignore
+    PublicApi.getSearchShopCommodityCollectGetCommodityCollectList(param).then(res => {
+      if (res.code === 1000) {
+        setList(res.data.data)
+        setTotalCount(res.data.totalCount)
+      }
+    })
+  }
 
   let CommodityList = Array.apply({}, new Array(7))
 
@@ -22,19 +49,19 @@ const Commodity: React.FC = () => {
     }
   }
 
-  const renderPrice = (priceType) => {
+  const renderPrice = (priceType, commodity) => {
     switch (priceType) {
       case COMMODITY_TYPE.prompt:
         return (
           <div className={styles.commodity_price}>
             <span>￥</span>
-            <label>79.00</label>
+            <label>{commodity.min}</label>
           </div>
         )
       case COMMODITY_TYPE.integral:
         return (
           <div className={styles.commodity_point}>
-            2,000~3,000积分
+            {numFormat(commodity.min)}~{numFormat(commodity.max)}积分
           </div>
         )
       case COMMODITY_TYPE.inquiry:
@@ -46,19 +73,21 @@ const Commodity: React.FC = () => {
     <>
       <div className={styles.commodity_list}>
         {
-          CommodityList.map((item, index) => (
+          list && list.map((item, index) => (
             <div className={styles.commodity_list_item} key={`commodity_list_item_${index}`}>
               <div className={cx(styles.commodity_list_item_item, styles.morehalf)}>
                 <div className={styles.shop_header_info}>
                   <div className={styles.shop_header_info_logo}>
-                    <img src="https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/69f3f329d5a848119dc89029a10acb081600332395671.jpg" />
+                    <img src={item.commodity.mainPic} />
                   </div>
                   <div className={styles.shop_header_info_content}>
-                    <p className={styles.commodity_name}>0.8-1.0mm黑色手折纹胎水牛皮</p>
+                    <p className={styles.commodity_name}>{item.commodity.name}</p>
                     <ul className={styles.tags_list}>
-                      <li className={styles.tags_list_item} key={`tags_list_item_1`}>黄牛头皮层自然摔纹</li>
-                      <li className={styles.tags_list_item} key={`tags_list_item_2`}>硬度适中偏软</li>
-                      <li className={styles.tags_list_item} key={`tags_list_item_3`}>手感舒适</li>
+                      {
+                        item.commodity.sellingPoint && item.commodity.sellingPoint.map((pointItem, pointIndex) => (
+                          <li className={styles.tags_list_item} key={`tags_list_item_${pointIndex}`}>{pointItem}</li>
+                        ))
+                      }
                     </ul>
                   </div>
                 </div>
@@ -66,15 +95,15 @@ const Commodity: React.FC = () => {
               <div className={cx(styles.commodity_list_item_item)}>
                 <div className={styles.shop_header_info_content_about_item}>
                   <i className={styles.icon}><img src={credit_icon} /></i>
-                  <span>1288</span>
+                  <span>{item.commodity.creditScore || 0}</span>
                 </div>
-                <div className={styles.commodity_shopname}>温州市龙昌皮业有限公司</div>
+                <div className={styles.commodity_shopname}>{item.commodity.memberName}</div>
               </div>
               <div className={cx(styles.commodity_list_item_item)}>
-                {renderPrice(1)}
+                {renderPrice(item.commodity.priceType, item.commodity)}
               </div>
               <div className={cx(styles.commodity_list_item_item)}>
-                <span className={styles.date}>2020-10-25  10:58</span>
+                <span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
               <div className={cx(styles.commodity_list_item_item)}>
                 <div className={styles.collection_state_wrap}>

src/store/filter/index.ts

@@ -215,7 +215,7 @@ class FilterStore {
             break
         }
       }
-      PublicApi.postProductShopOftenSelectSaveOrUpdateOftenSelect(tempFilterParam).then(res => {
+      PublicApi.postSearchShopOftenSelectSaveOrUpdateOftenSelect(tempFilterParam).then(res => {
         if (res.code === 1000) {
           this.getCommonlyUsedFilterList()
           resolve()
@@ -235,7 +235,7 @@ class FilterStore {
       current: 1,
       pageSize: 50,
     }
-    const res = await PublicApi.getProductShopOftenSelectGetOftenSelectList(param)
+    const res = await PublicApi.getSearchShopOftenSelectGetOftenSelectList(param)
     runInAction(() => {
       if (res.code === 1000) {
         this.commonlyUseFilter = res.data.data || []
@@ -250,7 +250,7 @@ class FilterStore {
   public async deleteCommonlyUsedFilterItem(id: number) {
     return new Promise((resolve, reject) => {
       //@ts-ignore
-      PublicApi.postProductShopOftenSelectDeleteOftenSelect({ id }).then(res => {
+      PublicApi.postSearchShopOftenSelectDeleteOftenSelect({ id }).then(res => {
         if (res.code === 1000) {
           this.getCommonlyUsedFilterList()
           resolve()
@@ -272,7 +272,7 @@ class FilterStore {
       this.commonlyUseFilterId = id
     }
     //@ts-ignore
-    const res = await PublicApi.getProductShopOftenSelectGetOftenSelect({ id })
+    const res = await PublicApi.getSearchShopOftenSelectGetOftenSelect({ id })
     runInAction(() => {
       if (res.code === 1000) {
         const data = res.data