fix: 修改收藏管理页面

src/components/ShopCredit/index.less

+.shopCredit {
+  position: relative;
+
+  .shopCreditIcon {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 18px;
+    height: 16px;
+  }
+
+  .pointWrap {
+    background-color: #FFE6C8;
+    border-radius: 1px;
+    height: 16px;
+    line-height: 16px;
+    font-size: 12px;
+    color: #773100;
+    padding-right: 4px;
+    padding-left: 12px;
+    margin-left: 9px;
+  }
+}
+
+
+.yearbox {
+  height: 16px;
+  display: flex;
+  align-items: center;
+  border-radius: 1px;
+  border: 1px solid #6A8DDA;
+  padding: 0 4px;
+  font-size: 12px;
+  color: #6A8DDA;
+}

src/components/ShopCredit/index.tsx

+import React from 'react'
+import creditIcon from './credit.png'
+import styles from './index.less'
+
+interface ShopCreditType {
+  creditPoint: number,
+}
+
+const ShopCredit: React.FC<ShopCreditType> = (props) => {
+  const { creditPoint } = props
+
+  return (
+    <div className={styles.shopCredit}>
+      <img className={styles.shopCreditIcon} src={creditIcon} />
+      <div className={styles.pointWrap}>
+        <span>{creditPoint}</span>
+      </div>
+    </div>
+  )
+}
+
+export default ShopCredit

src/components/ShopCredit/year.tsx

+import React from 'react'
+import styles from './index.less'
+
+interface YearBoxProps {
+  year: number;
+  style?: React.CSSProperties
+}
+
+const YearBox: React.FC<YearBoxProps> = (props) => {
+  const { year, style } = props
+
+  return (
+    <div className={styles.yearbox} style={style ? style : {} }>
+      <span>入驻{year}年</span>
+    </div>
+  )
+}
+
+export default YearBox

src/components/StarRate/index.less

+.star_rate {
+  background-color: #F4F5F7;
+  border-radius: 8px;
+  height: 16px;
+  display: flex;
+  width: 89px;
+  line-height: 16px;
+  align-items: center;
+  justify-content: center;
+
+  .star_rate_value {
+    color: #303133;
+    font-size: 12px;
+    line-height: 12px;
+  }
+
+  .star {
+    font-size: 12px;
+    line-height: 12px;
+    margin-left: 4px;
+    color: #FCA110 !important;
+
+    :global {
+      .ant-rate-star {
+        &:not(:last-child) {
+          margin-right: 1px;
+        }
+      }
+    }
+  }
+}

src/components/StarRate/index.tsx

+import React from 'react'
+import { Rate } from 'antd'
+import styles from './index.less'
+
+interface StarRatePropsType {
+  value: number,
+  showValue?: boolean
+}
+
+const StarRate: React.FC<StarRatePropsType> = (props) => {
+  const { value, showValue } = props
+
+  return (
+    <label className={styles.star_rate}>
+      {
+        showValue && <span className={styles.star_rate_value}>{value}</span>
+      }
+      <Rate className={styles.star} count={5} disabled defaultValue={value} />
+    </label>
+  )
+}
+
+StarRate.defaultProps = {
+  showValue: true
+}
+
+export default StarRate

src/constants/index.ts

@@ -16,6 +16,33 @@ export const REQUEST_HEADER = 'http://'
  */
 export const TOP_DOMAIN = process.env.NODE_ENV !== 'development' ? getTopDomainByHost(GlobalConfig.global.siteInfo.siteUrl) : 'lingxidev.com'
 
+/**
+ * 平台首页域名
+ */
+
+export const PLATFORM_DOMAIN = `${REQUEST_HEADER}www.${TOP_DOMAIN}`
+
+
+/**
+ * 行情资讯域名
+ */
+export const INFO_CENTER_URL = `${REQUEST_HEADER}info.${TOP_DOMAIN}`
+
+/**
+ * 企业采购域名
+ */
+export const SRM_CENTER_URL = `${REQUEST_HEADER}srm.${TOP_DOMAIN}`
+
+/**
+ * 物流服务域名
+ */
+export const LOGISTICS_CENTER_URL = `${REQUEST_HEADER}logistics.${TOP_DOMAIN}`
+
+/**
+ * 加工服务域名
+ */
+export const MANUFACTURE_CENTER_URL = `${REQUEST_HEADER}manufacture.${TOP_DOMAIN}`
+
 export const MALL_TYPE = {
   1: '企业商城',
   2: '积分商城',

src/pages/systemSetting/collection/commodity.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Button, Pagination, message, Modal } from 'antd'
 import { StarFilled } from '@ant-design/icons'
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import credit_icon from '@/assets/imgs/credit_icon.png'
 import styles from './index.less'
 import { PublicApi } from '@/services/api'
@@ -148,7 +149,7 @@ const Commodity: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.commodity_list}>
         {
           list && list.map((item, index) => (
@@ -183,7 +184,7 @@ const Commodity: React.FC = () => {
               <div className={cx(styles.commodity_list_item_item)}>
                 <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={cx(styles.commodity_list_item_item, styles.float_right)}>
                 <div className={styles.collection_state_wrap}>
                   <div className={cx(styles.collection_state)} onClick={() => handleCancelCollect(item)}>
                     <StarFilled />
@@ -197,13 +198,13 @@ const Commodity: React.FC = () => {
         }
       </div>
       {
-        totalCount > 0 && (
+        totalCount > pageSize && (
           <div className={styles.pagination_wrap}>
             <Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }
 

src/pages/systemSetting/collection/information.tsx

 import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Pagination, message, Modal } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import { StarFilled, EyeOutlined, ClockCircleOutlined } from '@ant-design/icons'
 import { PublicApi } from '@/services/api'
 import { numFormat } from '@/utils/numberFomat'
@@ -82,7 +83,7 @@ const Information: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.information_list}>
         {
           list && list.map((item, index) => (
@@ -113,7 +114,7 @@ const Information: React.FC = () => {
               <div className={cx(styles.information_list_item_item)}>
                 <span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
-              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
+              <div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
                 <div className={cx(styles.collection_state)}>
                   <StarFilled />
                   <label>收藏</label>
@@ -131,7 +132,7 @@ const Information: React.FC = () => {
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }
 

src/pages/systemSetting/collection/logistics.tsx

 import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Pagination, message, Modal } from 'antd'
+import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import { StarFilled } from '@ant-design/icons'
 import { PublicApi } from '@/services/api'
 import { LOGISTICS_CENTER_URL } from '@/constants'
@@ -82,7 +83,7 @@ const Logistics: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.information_list}>
         {
           list && list.map((item, index) => (
@@ -102,7 +103,7 @@ const Logistics: React.FC = () => {
               <div className={cx(styles.information_list_item_item)}>
                 <span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
-              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
+              <div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
                 <div className={cx(styles.collection_state)}>
                   <StarFilled />
                   <label>收藏</label>
@@ -120,7 +121,7 @@ const Logistics: React.FC = () => {
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }
 

src/pages/systemSetting/collection/process.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Pagination, message, Modal } from 'antd'
 import { StarFilled } from '@ant-design/icons'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
 import { PublicApi } from '@/services/api'
 import { MANUFACTURE_CENTER_URL } from '@/constants'
 import moment from 'moment'
@@ -82,7 +83,7 @@ const Process: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.information_list}>
         {
           list && list.map((item, index) => (
@@ -102,7 +103,7 @@ const Process: React.FC = () => {
               <div className={cx(styles.information_list_item_item)}>
                 <span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
-              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
+              <div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
                 <div className={cx(styles.collection_state)}>
                   <StarFilled />
                   <label>收藏</label>
@@ -120,7 +121,7 @@ const Process: React.FC = () => {
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }
 

src/pages/systemSetting/collection/purchase.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Pagination, message, Modal } from 'antd'
 import { StarFilled } from '@ant-design/icons'
+import { PageHeaderWrapper } from '@ant-design/pro-layout'
 import { PublicApi } from '@/services/api'
 import { SRM_CENTER_URL } from '@/constants'
 import moment from 'moment'
@@ -82,7 +83,7 @@ const Purchase: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.information_list}>
         {
           list && list.map((item, index) => (
@@ -102,7 +103,7 @@ const Purchase: React.FC = () => {
               <div className={cx(styles.information_list_item_item)}>
                 <span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
-              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
+              <div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
                 <div className={cx(styles.collection_state)}>
                   <StarFilled />
                   <label>收藏</label>
@@ -120,7 +121,7 @@ const Purchase: React.FC = () => {
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }
 

src/pages/systemSetting/collection/shops.tsx

@@ -2,8 +2,9 @@ import React, { useEffect, useState } from 'react'
 import cx from 'classnames'
 import { Rate, Pagination, Modal, message } 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 { PageHeaderWrapper } from '@ant-design/pro-layout'
+import ShopCredit from '@/components/ShopCredit'
+import StarRate from '@/components/StarRate'
 import { PublicApi } from '@/services/api'
 import moment from 'moment'
 import styles from './index.less'
@@ -83,12 +84,12 @@ const Shops: React.FC = () => {
   }
 
   return (
-    <>
+    <PageHeaderWrapper>
       <div className={styles.shops_list}>
         {
           list && list.map((item, index) => (
             <div className={styles.shops_list_item} key={`shops_list_item_${index}`}>
-              <div className={cx(styles.shops_list_item_item, styles.morehalf)}>
+              <div className={cx(styles.shops_list_item_item)}>
                 <div className={styles.shop_header_info}>
                   <div className={styles.shop_header_info_logo}>
                     <img src={item.logo} />
@@ -98,7 +99,8 @@ const Shops: React.FC = () => {
                       <span>{item.memberName}</span>
                     </div>
                     <div className={styles.shop_header_info_content_about}>
-                      <div className={styles.shop_header_info_content_about_item}>
+                      <ShopCredit creditPoint={item.creditPoint || 0} />
+                      {/* <div className={styles.shop_header_info_content_about_item}>
                         <i className={styles.icon}><img src={shop_icon} /></i>
                         <span className={styles.red}>{item.registerYears || 0}</span>
                         <span>年</span>
@@ -106,7 +108,7 @@ const Shops: React.FC = () => {
                       <div className={styles.shop_header_info_content_about_item}>
                         <i className={styles.icon}><img src={credit_icon} /></i>
                         <span>{item.creditPoint || 0}</span>
-                      </div>
+                      </div> */}
                     </div>
 
                   </div>
@@ -116,13 +118,14 @@ const Shops: React.FC = () => {
                 {/* <i className={cx(styles.level_icon, styles.level3)}></i> */}
                 <div className={styles.rate_wrap}>
                   <span>满意度：</span>
-                  <Rate disabled defaultValue={item.avgTradeCommentStar || 0} />
+                  <StarRate value={item.avgTradeCommentStar || 0} />
+                  {/* <Rate disabled defaultValue={item.avgTradeCommentStar || 0} /> */}
                 </div>
               </div>
               <div className={cx(styles.shops_list_item_item)}>
                 <span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
               </div>
-              <div className={cx(styles.shops_list_item_item)}>
+              <div className={cx(styles.shops_list_item_item, styles.float_right)}>
                 <div className={cx(styles.collection_state)} onClick={() => handleCancelCollect(item)}>
                   <StarFilled />
                   <label>收藏</label>
@@ -134,13 +137,13 @@ const Shops: React.FC = () => {
 
       </div>
       {
-        totalCount > 0 && (
+        totalCount > pageSize && (
           <div className={styles.pagination_wrap}>
             <Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
           </div>
         )
       }
-    </>
+    </PageHeaderWrapper>
   )
 }