feat:对接商城首页和店铺列表活跃店铺和人气店铺的接口

src/pages/lxMall/components/Filter/components/ActiveStores/index.tsx

@@ -3,10 +3,13 @@
  * @Author: ghua 
  * @Date: 2020-08-20 16:23:39 
  * @Last Modified by: ghua
- * @Last Modified time: 2020-10-22 18:03:14
+ * @Last Modified time: 2020-11-04 10:23:59
  */
 
-import React from 'react'
+import React, { useEffect, useState } from 'react'
+import { PublicApi } from '@/services/api'
+import ImageBox from '@/components/ImageBox'
+import { GetReportMallGetActiveMerchantListResponse } from '@/services/ReportApi'
 import styles from './index.less'
 
 interface ActiveStoresPropsType {
@@ -14,6 +17,20 @@ interface ActiveStoresPropsType {
 }
 
 const ActiveStores: React.FC<ActiveStoresPropsType> = (props) => {
+  const [shopList, setShopList] = useState<GetReportMallGetActiveMerchantListResponse>([])
+
+  useEffect(() => {
+    fetchData()
+  }, [])
+
+  const fetchData = () => {
+    PublicApi.getReportMallGetActiveMerchantList().then(res => {
+      if(res.code === 1000) {
+        setShopList(res.data)
+      }
+    })
+
+  }
 
   return (
     <div className={styles.active_stores}>
@@ -21,43 +38,19 @@ const ActiveStores: React.FC<ActiveStoresPropsType> = (props) => {
         <label>活跃店铺</label>
       </div>
       <div className={styles.active_stores_list}>
-
-        <div className={styles.active_stores_list_item}>
-          <div className={styles.active_stores_rank}>01</div>
-          <div className={styles.active_stores_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.active_stores_name}> <a href="/">无锡市群明钢业有限公司</a></div>
-        </div>
-
-        <div className={styles.active_stores_list_item}>
-          <div className={styles.active_stores_rank}>02</div>
-          <div className={styles.active_stores_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.active_stores_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.active_stores_list_item}>
-          <div className={styles.active_stores_rank}>03</div>
-          <div className={styles.active_stores_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.active_stores_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.active_stores_list_item}>
-          <div className={styles.active_stores_rank}>04</div>
-          <div className={styles.active_stores_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.active_stores_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.active_stores_list_item}>
-          <div className={styles.active_stores_rank}>05</div>
-          <div className={styles.active_stores_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.active_stores_name}>无锡市群明钢业有限公司</div>
-        </div>
+        {
+          shopList && shopList.map((item, index) => (
+            <div className={styles.active_stores_list_item}>
+              <div className={styles.active_stores_rank}>0{index+1}</div>
+              <div className={styles.active_stores_logo}>
+                <ImageBox width={36} height={36} imgUrl={item.memberLogo}  />
+              </div>
+              <div className={styles.active_stores_name}>
+                <a href={`/shop?shopId=${btoa(JSON.stringify({ shopId: item.memberShopId, memberId: item.memberId }))}`}>{item.memberName}</a>
+              </div>
+            </div>
+          ))
+        }
       </div>
     </div>
   )

src/pages/lxMall/components/FindMore/components/popularShops/index.tsx

-import React from 'react'
+import React, { useEffect, useState } from 'react'
+import { PublicApi } from '@/services/api'
+import { GetReportMallGetPopularShopListResponse } from '@/services/ReportApi'
+import ImageBox from '@/components/ImageBox'
 import styles from '../../index.less'
 
-interface PopularShopsPropsType {
-
-}
+interface PopularShopsPropsType {}
 
 const PopularShops: React.FC<PopularShopsPropsType> = (props) => {
+  const [shopList, setShopList] = useState<GetReportMallGetPopularShopListResponse>([])
+
+  useEffect(() => {
+    fetchData()
+  }, [])
+
+  const fetchData = () => {
+    PublicApi.getReportMallGetPopularShopList().then(res => {
+      if(res.code === 1000) {
+        setShopList(res.data)
+      }
+    })
+  }
 
   return (
     <div className={styles.popular_shops}>
@@ -14,43 +28,19 @@ const PopularShops: React.FC<PopularShopsPropsType> = (props) => {
         <span>排名每天凌晨更新</span>
       </div>
       <div className={styles.popular_shops_list}>
-
-        <div className={styles.popular_shops_list_item}>
-          <div className={styles.popular_shops_rank}>01</div>
-          <div className={styles.popular_shops_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.popular_shops_name}> <a href="/">无锡市群明钢业有限公司</a></div>
-        </div>
-
-        <div className={styles.popular_shops_list_item}>
-          <div className={styles.popular_shops_rank}>02</div>
-          <div className={styles.popular_shops_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.popular_shops_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.popular_shops_list_item}>
-          <div className={styles.popular_shops_rank}>03</div>
-          <div className={styles.popular_shops_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.popular_shops_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.popular_shops_list_item}>
-          <div className={styles.popular_shops_rank}>04</div>
-          <div className={styles.popular_shops_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.popular_shops_name}>无锡市群明钢业有限公司</div>
-        </div>
-        <div className={styles.popular_shops_list_item}>
-          <div className={styles.popular_shops_rank}>05</div>
-          <div className={styles.popular_shops_logo}>
-            <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3381279230,433852972&fm=26&gp=0.jpg" />
-          </div>
-          <div className={styles.popular_shops_name}>无锡市群明钢业有限公司</div>
-        </div>
+        {
+          shopList && shopList.map((item, index) => index <=5 && (
+            <div className={styles.popular_shops_list_item}>
+              <div className={styles.popular_shops_rank}>0{index+1}</div>
+              <div className={styles.popular_shops_logo}>
+                <ImageBox width={36} height={36} imgUrl={item.memberLogo} />
+              </div>
+              <div className={styles.popular_shops_name}>
+                <a href={`/shop?shopId=${btoa(JSON.stringify({ shopId: item.memberShopId, memberId: item.memberId }))}`}>{item.memberName}</a>
+              </div>
+            </div>
+          ))
+        }
       </div>
     </div>
   )

src/pages/lxMall/components/FindMore/components/shoppingNews/index.tsx

@@ -8,45 +8,6 @@ import { PublicApi } from '@/services/api'
 import moment from 'moment'
 import styles from '../../index.less'
 
-const buy_dynamic_list = [
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 0,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 0,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 0,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 1,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 1,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-  {
-    title: '黑色头层牛皮自然摔纹',
-    state: 1,
-    content: '2000平方英尺',
-    date: '09/09 09:00'
-  },
-]
-
 const ShoppingNews: React.FC = () => {
   const [list, setList] = useState<any>([])
   const actionRef = useRef<any>()

src/services/api.ts

@@ -10,6 +10,7 @@ import * as OrderApi from './OrderApi'
 import * as SettleApi from './SettleApi'
 import * as AfterService from './AfterServiceApi'
 import * as EnhanceApi from './EnhanceApi'; 
+import * as ReportApi from './ReportApi'; 
 
 /**
  * 可在这里写入自定义的接口
@@ -31,5 +32,6 @@ export const PublicApi = {
   ...OrderApi,
   ...SettleApi,
   ...AfterService,
-  ...EnhanceApi
+  ...EnhanceApi,
+  ...ReportApi
 }

ytt.config.ts

@@ -11,7 +11,8 @@ const tokenList = [
   { name: 'Settle', token: 'fffbeeaaa198c285955997c606bc279fc6950fea118580c786f2c73eecccaa6a' },  //结算服务
   { name: 'AfterService', token: '39db719680bf1b3db21bc1deda933cde16d17559e9676bf848ec96c1320e68df' }, // '售后服务' 
   // { name: '', token: 'c0e920f071595a73ba234b6fa6cfe42192d3d740d59f030caa2c7f0f08777d78' } // 商户会员管理服务
-  { name: 'Enhance', token: '594a7e7ff17f6f40fb9fb726c1da9a3f282a926a8d386eb6cbfd668a3f75f251'} // 加工服务
+  { name: 'Enhance', token: '594a7e7ff17f6f40fb9fb726c1da9a3f282a926a8d386eb6cbfd668a3f75f251'}, // 加工服务
+  { name: 'Report', token: '69ee5a79363c763ded1a2eb42952a5181ffcdfc5ffb93b6e1e22ac92a25b38bf'}, // 报表服务
 ]
 
 const getConfigMap = (tokens) => tokens.map(v => ({