Merge branch 'dev' of http://10.0.0.22:3000/lingxi/lingxi-business-paltform into dev

package.json

@@ -59,7 +59,7 @@
     "god": "^0.2.4",
     "immutability-helper": "^3.1.1",
     "lingxi-design": "^1.0.8",
-    "lingxi-design-ui": "^1.1.20",
+    "lingxi-design-ui": "^1.1.21",
     "lingxi-editor-core": "^1.0.6",
     "lingxi-web": "^1.0.6",
     "lint-staged": "^10.0.7",

src/assets/icons/TOP1.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>TOP1</title>
+    <defs>
+        <linearGradient x1="-3.87425714%" y1="-5.98975792%" x2="103.384324%" y2="108.298707%" id="linearGradient-1">
+            <stop stop-color="#FDD382" offset="0%"></stop>
+            <stop stop-color="#FDA41A" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="TOP1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g transform="translate(2.000000, 0.000000)">
+            <g id="编组" transform="translate(4.000000, 0.000000)" fill="url(#linearGradient-1)">
+                <g id="皇冠" transform="translate(1.000000, 1.000000)">
+                    <path d="M11.6554562,12.7448195 C11.9859208,12.7448195 12.2549716,13.0124081 12.2549716,13.3443349 C12.2549716,13.6747995 11.987383,13.9438503 11.6554562,13.9438503 L1.97840074,13.9438503 C1.64793616,13.9438503 1.37888536,13.6747995 1.37888536,13.3443349 C1.37888536,13.0138703 1.64647393,12.7448195 1.97840074,12.7448195 L11.6554562,12.7448195 Z M6.81692848,0.0073111631 C7.82733122,0.0073111631 8.64471925,0.82616143 8.64471925,1.83510194 C8.64471925,2.60046614 8.1735145,3.25644352 7.50557359,3.52856547 L10.2751086,6.62830047 L12.597134,4.97159091 C12.7301972,4.82682988 12.9305231,4.74933155 13.1381601,4.78442513 C13.3282503,4.81659425 13.4817848,4.93503509 13.5665943,5.09149398 L13.5665943,5.09149398 C13.5680565,5.09734291 13.5709809,5.10026738 13.5724432,5.10465408 C13.6543282,5.25672627 13.6645638,5.42926972 13.6119235,5.58426638 L13.6119235,5.58426638 L12.3383189,11.4522059 C12.3207721,11.5589489 12.2754428,11.653994 12.2125668,11.7314923 C12.1028994,11.8747911 11.9303559,11.9669118 11.735879,11.9669118 L11.735879,11.9669118 L2.06467246,11.9669118 C2.0442012,11.9727607 2.02372995,11.9771474 2.00325869,11.9800719 C1.71958556,12.0283255 1.44761029,11.8660177 1.34671624,11.6072025 C1.31747159,11.5399398 1.2999248,11.4668282 1.29700033,11.3893299 L1.29700033,11.3893299 L0.0263201872,5.55794619 C-0.00146223262,5.46582553 -0.00584893048,5.36785595 0.0131600936,5.27281083 C0.0555648396,5.03008021 0.247117313,4.82975434 0.503008021,4.7873496 C0.707720588,4.75371825 0.903659759,4.82682988 1.03672293,4.96574198 L1.03672293,4.96574198 L3.38945521,6.64292279 L6.16038062,3.54128752 C5.47548773,3.27733312 4.9891377,2.61266887 4.9891377,1.83510194 C4.9891377,0.82616143 5.80652574,0.0073111631 6.81692848,0.0073111631 Z" id="形状结合"></path>
+                </g>
+            </g>
+            <text font-family="DIN-Medium, DIN" font-size="10" font-weight="400" line-spacing="10" fill="#FDA41A">
+                <tspan x="0" y="28">TOP1</tspan>
+            </text>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

src/assets/icons/TOP2.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>TOP2</title>
+    <defs>
+        <linearGradient x1="-5.1734644%" y1="-10.5135212%" x2="105.360208%" y2="104.508676%" id="linearGradient-1">
+            <stop stop-color="#D3D1D2" offset="0%"></stop>
+            <stop stop-color="#A7A5A6" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="TOP2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g transform="translate(2.000000, 0.000000)">
+            <g id="编组" transform="translate(4.000000, 0.000000)" fill="url(#linearGradient-1)">
+                <g id="皇冠" transform="translate(1.000000, 1.000000)">
+                    <path d="M11.6554562,12.7448195 C11.9859208,12.7448195 12.2549716,13.0124081 12.2549716,13.3443349 C12.2549716,13.6747995 11.987383,13.9438503 11.6554562,13.9438503 L1.97840074,13.9438503 C1.64793616,13.9438503 1.37888536,13.6747995 1.37888536,13.3443349 C1.37888536,13.0138703 1.64647393,12.7448195 1.97840074,12.7448195 L11.6554562,12.7448195 Z M6.81692848,0.0073111631 C7.82733122,0.0073111631 8.64471925,0.82616143 8.64471925,1.83510194 C8.64471925,2.60046614 8.1735145,3.25644352 7.50557359,3.52856547 L10.2751086,6.62830047 L12.597134,4.97159091 C12.7301972,4.82682988 12.9305231,4.74933155 13.1381601,4.78442513 C13.3282503,4.81659425 13.4817848,4.93503509 13.5665943,5.09149398 L13.5665943,5.09149398 C13.5680565,5.09734291 13.5709809,5.10026738 13.5724432,5.10465408 C13.6543282,5.25672627 13.6645638,5.42926972 13.6119235,5.58426638 L13.6119235,5.58426638 L12.3383189,11.4522059 C12.3207721,11.5589489 12.2754428,11.653994 12.2125668,11.7314923 C12.1028994,11.8747911 11.9303559,11.9669118 11.735879,11.9669118 L11.735879,11.9669118 L2.06467246,11.9669118 C2.0442012,11.9727607 2.02372995,11.9771474 2.00325869,11.9800719 C1.71958556,12.0283255 1.44761029,11.8660177 1.34671624,11.6072025 C1.31747159,11.5399398 1.2999248,11.4668282 1.29700033,11.3893299 L1.29700033,11.3893299 L0.0263201872,5.55794619 C-0.00146223262,5.46582553 -0.00584893048,5.36785595 0.0131600936,5.27281083 C0.0555648396,5.03008021 0.247117313,4.82975434 0.503008021,4.7873496 C0.707720588,4.75371825 0.903659759,4.82682988 1.03672293,4.96574198 L1.03672293,4.96574198 L3.38945521,6.64292279 L6.16038062,3.54128752 C5.47548773,3.27733312 4.9891377,2.61266887 4.9891377,1.83510194 C4.9891377,0.82616143 5.80652574,0.0073111631 6.81692848,0.0073111631 Z" id="形状结合"></path>
+                </g>
+            </g>
+            <text font-family="DIN-Medium, DIN" font-size="10" font-weight="400" line-spacing="10" fill="#94949B">
+                <tspan x="0" y="28">TOP2</tspan>
+            </text>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

src/assets/icons/TOP3.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="28px" height="28px" viewBox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>TOP3</title>
+    <defs>
+        <linearGradient x1="-4.34743079%" y1="-6.33455695%" x2="102.97459%" y2="107.275344%" id="linearGradient-1">
+            <stop stop-color="#F0C198" offset="0%"></stop>
+            <stop stop-color="#DD8E5F" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="TOP3" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g transform="translate(2.000000, 0.000000)">
+            <g id="编组" transform="translate(4.000000, 0.000000)" fill="url(#linearGradient-1)">
+                <g id="皇冠" transform="translate(1.000000, 1.000000)">
+                    <path d="M11.6554562,12.7448195 C11.9859208,12.7448195 12.2549716,13.0124081 12.2549716,13.3443349 C12.2549716,13.6747995 11.987383,13.9438503 11.6554562,13.9438503 L1.97840074,13.9438503 C1.64793616,13.9438503 1.37888536,13.6747995 1.37888536,13.3443349 C1.37888536,13.0138703 1.64647393,12.7448195 1.97840074,12.7448195 L11.6554562,12.7448195 Z M6.81692848,0.0073111631 C7.82733122,0.0073111631 8.64471925,0.82616143 8.64471925,1.83510194 C8.64471925,2.60046614 8.1735145,3.25644352 7.50557359,3.52856547 L10.2751086,6.62830047 L12.597134,4.97159091 C12.7301972,4.82682988 12.9305231,4.74933155 13.1381601,4.78442513 C13.3282503,4.81659425 13.4817848,4.93503509 13.5665943,5.09149398 L13.5665943,5.09149398 C13.5680565,5.09734291 13.5709809,5.10026738 13.5724432,5.10465408 C13.6543282,5.25672627 13.6645638,5.42926972 13.6119235,5.58426638 L13.6119235,5.58426638 L12.3383189,11.4522059 C12.3207721,11.5589489 12.2754428,11.653994 12.2125668,11.7314923 C12.1028994,11.8747911 11.9303559,11.9669118 11.735879,11.9669118 L11.735879,11.9669118 L2.06467246,11.9669118 C2.0442012,11.9727607 2.02372995,11.9771474 2.00325869,11.9800719 C1.71958556,12.0283255 1.44761029,11.8660177 1.34671624,11.6072025 C1.31747159,11.5399398 1.2999248,11.4668282 1.29700033,11.3893299 L1.29700033,11.3893299 L0.0263201872,5.55794619 C-0.00146223262,5.46582553 -0.00584893048,5.36785595 0.0131600936,5.27281083 C0.0555648396,5.03008021 0.247117313,4.82975434 0.503008021,4.7873496 C0.707720588,4.75371825 0.903659759,4.82682988 1.03672293,4.96574198 L1.03672293,4.96574198 L3.38945521,6.64292279 L6.16038062,3.54128752 C5.47548773,3.27733312 4.9891377,2.61266887 4.9891377,1.83510194 C4.9891377,0.82616143 5.80652574,0.0073111631 6.81692848,0.0073111631 Z" id="形状结合"></path>
+                </g>
+            </g>
+            <text font-family="DIN-Medium, DIN" font-size="10" font-weight="400" line-spacing="10" fill="#E4A883">
+                <tspan x="0" y="28">TOP3</tspan>
+            </text>
+        </g>
+    </g>
+</svg>
\ No newline at end of file

src/components/UploadImage/index.tsx

@@ -70,6 +70,14 @@ const UploadImage: React.FC<UploadImagePorpsType> = forwardRef((props, ref) => {
     </Fragment>
   );
 
+  const showFileSize = () => {
+    if(fileMaxSize >= 1024) {
+      return `${fileMaxSize / 1024} M`
+    }
+
+    return `${fileMaxSize}k`
+  }
+
   const renderUploadComponentByListType = () => {
     switch(listType) {
       case "picture-card":
@@ -90,7 +98,7 @@ const UploadImage: React.FC<UploadImagePorpsType> = forwardRef((props, ref) => {
             {
               showDesc &&
               <div className={styles.size_require}>
-                <p>支持JPG/PNG/JPEG， <br />最大不超过 {fileMaxSize}K， <br />尺寸：{size}</p>
+                <p>支持JPG/PNG/JPEG， <br />最大不超过 {showFileSize()}， <br />尺寸：{size}</p>
               </div>
             }
           </div>

src/pages/channel/channelInfo/index.tsx

@@ -75,7 +75,7 @@ const ChannelInfo: React.FC<ShopInfoPropsType> = (props) => {
         setShopId(data.shopId)
         setWorkshopPics(data.workshopPics || [])
         setHonorPics(data.honorPics || [])
-        setStoreUrl(data.storeUrl || "")
+        setStoreUrl("")
         form.setFieldsValue({
           describe: data.describe,
           customerUrl: data.customerUrl,
@@ -348,7 +348,7 @@ const ChannelInfo: React.FC<ShopInfoPropsType> = (props) => {
                 <UploadImage
                   imgUrl={""}
                   large={true}
-                  fileMaxSize={100}
+                  fileMaxSize={1024}
                   size="600x400"
                   onChange={(url) => handleAddworkshopPics(url)}
                 />
@@ -375,7 +375,7 @@ const ChannelInfo: React.FC<ShopInfoPropsType> = (props) => {
                 <UploadImage
                   imgUrl={""}
                   large={true}
-                  fileMaxSize={100}
+                  fileMaxSize={1024}
                   size="106x107"
                   onChange={(url) => handleAddhonorPics(url)}
                 />

src/pages/lxMall/commodity/index.tsx

@@ -13,9 +13,6 @@ import { store } from '@/store'
 import { PublicApi } from '@/services/api'
 import { LAYOUT_TYPE } from '@/constants'
 import { PostSearchShopEnterpriseGetCommodityListResponseDetail } from '@/services/SearchApi'
-// import bannerImg from '@/assets/imgs/banner_2.png'
-import arrowDownIcon from '@/assets/imgs/arrow_down.png'
-import arrowDownActiveIcon from '@/assets/imgs/arrow_down_active.png'
 import styles from './index.less'
 
 interface CommodityPropsType {
@@ -120,9 +117,13 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
 
   useEffect(() => {
     if (userInfo && layoutType === LAYOUT_TYPE.mall) {
-      const temp = JSON.parse(JSON.stringify(filterConfig))
+      const temp = [...filterConfig]
       temp.unshift(FILTER_TYPE.commonlyUsed)
       setFilterConfig(temp)
+    } else if(layoutType === LAYOUT_TYPE.channel || layoutType === LAYOUT_TYPE.ichannel) {
+       const temp = [...filterConfig]
+      temp.pop()
+      setFilterConfig(temp)
     }
     return (() => {
       onResetFilter()

src/pages/lxMall/commodityDetail/components/ProductDescription/components/Comment/index.less

@@ -13,12 +13,41 @@
   }
 
   .favorable_comments {
-    padding: 30px 17px;
+    padding: 24px 16px;
+    display: flex;
+    align-items: center;
 
     &_title {
       font-size: 12px;
+      margin-right: 8px;
       color: #909399;
+    }
 
+    &_item {
+      color: var(--mall_main_color);
+      font-weight: bold;
+
+      .comment_rate {
+        font-size: 15px;
+        line-height: 15px;
+        color: #FCA110 !important;
+        margin-right: 8px;
+
+        :global {
+          .ant-rate-star {
+            &:not(:last-child) {
+              margin-right: 1px;
+            }
+          }
+        }
+      }
+
+      &_split {
+        width: 1px;
+        height: 16px;
+        background-color: #EBECF0;
+        margin: 0 24px;
+      }
     }
 
     &>span {
@@ -96,7 +125,16 @@
 
         .comment_rate {
           font-size: 15px;
-
+          line-height: 15px;
+          color: #FCA110 !important;
+
+          :global {
+            .ant-rate-star {
+              &:not(:last-child) {
+                margin-right: 1px;
+              }
+            }
+          }
         }
 
         .comment_content {

src/pages/lxMall/commodityDetail/components/ProductDescription/components/Comment/index.tsx

@@ -18,7 +18,7 @@ interface CommentPropsType {
 const Comment: React.FC<CommentPropsType> = (props) => {
   const { productIds, setCount } = props
   const [current, setCurrent] = useState<number>(1)
-  const [pageSize] = useState<number>(4)
+  const [pageSize] = useState<number>(10)
   const [totalCount, setTotalCount] = useState<number>(0)
   const [summaryInfo, setSummaryInfo] = useState<GetMemberCommentMallTradeSummaryResponse>()
   const [commentList, setCommentList] = useState<GetMemberCommentMallTradeHistoryPageResponseDetail[]>([])
@@ -78,7 +78,7 @@ const Comment: React.FC<CommentPropsType> = (props) => {
 
   /**
    * 计算各种评价星级的数量
-   * @param data 
+   * @param data
    */
   const getCommentCountBySummary = (data) => {
     let goodCount = 0
@@ -146,9 +146,16 @@ const Comment: React.FC<CommentPropsType> = (props) => {
     <div id="comment" className={styles.comment}>
       <div className={styles.comment_title}>交易评价</div>
       <div className={styles.favorable_comments}>
-        <div className={styles.favorable_comments_title}>好评率</div>
-        <span>{goodRate}</span>
-        <i>%</i>
+         <div className={styles.favorable_comments_item}>
+          <span className={styles.favorable_comments_title}>满意度: </span>
+          <Rate className={styles.comment_rate} count={5} disabled value={summaryInfo?.avgStar || 0} />
+          <span>{summaryInfo?.avgStar || 0}</span>
+        </div>
+        <div className={styles.favorable_comments_item_split}></div>
+        <div className={styles.favorable_comments_item}>
+          <span className={styles.favorable_comments_title}>好评率: </span>
+          <span>{goodRate}<i>%</i></span>
+        </div>
       </div>
       <div className={styles.common_count}>
         {
@@ -178,7 +185,7 @@ const Comment: React.FC<CommentPropsType> = (props) => {
                   }
                 </div>
                 <div className={styles.comment_list_item_right}>
-                  <Rate className={styles.comment_rate} value={item.star} disabled />
+                  <Rate className={styles.comment_rate} count={5} disabled defaultValue={item.star || 0} />
                   <div className={styles.comment_content}>{item.comment}</div>
                   {
                     (item.pics && item.pics.length > 0) && <ImageViewList imgList={item.pics} />

src/pages/lxMall/commodityDetail/components/ProductDescription/components/TradeRecord/index.tsx

@@ -8,13 +8,14 @@ import styles from './index.less'
 
 interface TradeRecordPropsType {
   productIds: number[],
-  setCount: Function
+  setCount: Function,
+  storeId: number,
 }
 
 const TradeRecord: React.FC<TradeRecordPropsType> = (props) => {
-  const { productIds, setCount } = props
+  const { productIds, setCount, storeId } = props
   const [current, setCurrent] = useState<number>(1)
-  const [pageSize] = useState<number>(4)
+  const [pageSize] = useState<number>(10)
   const [totalCount, setTotalCount] = useState<number>(0)
   const [recordList, setRecordList] = useState<GetOrderTransactionRecordsListResponseDetail[]>([])
 
@@ -28,6 +29,7 @@ const TradeRecord: React.FC<TradeRecordPropsType> = (props) => {
     const param: any = {
       current,
       pageSize,
+      shopId: storeId,
       productIds: productIds.toString() // '2339'
     }
 

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

+/*
+ * @Author: your name
+ * @Date: 2021-01-18 16:40:59
+ * @LastEditTime: 2021-02-23 14:31:36
+ * @LastEditors: your name
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/lxMall/commodityDetail/components/ProductDescription/index.tsx
+ */
 import React, { useState, useEffect } from 'react'
 import { Anchor, BackTop } from 'antd'
 import Comment from './components/Comment'
@@ -14,10 +22,11 @@ const { Link } = Anchor
 interface ProductDescriptionPropsType {
   commodityDetail: GetSearchShopStoreGetCommodityDetailResponse,
   dataList: any,
+  storeId: number,
 }
 
 const ProductDescription: React.FC<ProductDescriptionPropsType> = (props) => {
-  const { commodityDetail, dataList } = props
+  const { commodityDetail, dataList, storeId } = props
   const [currentAnchor, setCurrentAnchor] = useState<string>("#introduction")
   const [productIds, setProductIds] = useState<number[]>([])
   const [tradeRecordCount, setTradeRecordCount] = useState<number>(0)
@@ -69,7 +78,7 @@ const ProductDescription: React.FC<ProductDescriptionPropsType> = (props) => {
         </BackTop>
       </Anchor>
       <Introduction commodityDetail={commodityDetail} />
-      <TradeRecord productIds={productIds} setCount={(count) => setTradeRecordCount(count)} />
+      <TradeRecord productIds={productIds} storeId={storeId} setCount={(count) => setTradeRecordCount(count)} />
       <Comment productIds={productIds} setCount={(count) => setCommentCount(count)} />
       <Recommand dataList={dataList} {...props} />
     </div>

src/pages/lxMall/commodityDetail/index.tsx

@@ -249,7 +249,7 @@ const CommodityDetail = (props) => {
           fetchCommonCategoryCommodityList(res.data.customerCategory.id, res.data.priceType)
         }
 
-        if (getAuth() && res.data?.isMemberPrice) {
+        if (getAuth() && res.data?.priceType === 1 && res.data?.isMemberPrice) {
           getMemberCredit(res.data?.memberId, res.data?.memberRoleId)
         }
       } else {
@@ -815,7 +815,8 @@ const CommodityDetail = (props) => {
       })
     })
     try {
-      tempPriceRange = tempPriceRange.sort((a, b) => a.price < b.price ? 1: -1)
+      console.log(tempPriceRange, "tempPriceRange")
+      tempPriceRange = tempPriceRange.sort((a, b) => a.min > b.max ? 1: -1)
     } catch (error) {
       console.log(error)
     }
@@ -1172,7 +1173,7 @@ const CommodityDetail = (props) => {
                   <Interested priceType={commodityDetail?.priceType} shopInfo={shopInfo} {...props} />
                 </div>
                 <div className={styles.commodity_detail_body_right}>
-                  <ProductDescription commodityDetail={commodityDetail} dataList={commonCategoryCommodityList} {...props} />
+                  <ProductDescription storeId={storeId} commodityDetail={commodityDetail} dataList={commonCategoryCommodityList} {...props} />
                 </div>
               </div>
             </div>

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

@@ -67,7 +67,7 @@
             .main_category,
             .sub_category a,
             .right_icon {
-              color: var(--mall_main_color);
+              color: var(--category_content_title_text_hover);
             }
 
             .category_type_content {

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

@@ -2,15 +2,27 @@
   width: 240px;
   background: #ffffff;
   margin-top: 20px;
-  border: 1px solid rgba(238, 238, 238, 1);
+  // border: 1px solid rgba(238, 238, 238, 1);
 
   &_title {
+    position: relative;
     font-weight: 500;
-    padding: 15px;
+    padding: 15px 12px;
+
+    &::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      margin: auto 0;
+      width: 4px;
+      height: 14px;
+      background-color: var(--mall_main_color);
+    }
   }
 
   .active_stores_list {
-    padding: 0 15px;
 
     &_item {
       display: flex;
@@ -18,13 +30,18 @@
       align-items: center;
 
       .active_stores_rank {
-        width: 22px;
+        width: 24px;
         height: 32px;
         line-height: 32px;
         font-size: 14px;
         color: #606266;
         font-weight: 500;
         margin-right: 10px;
+
+        & > img {
+          width: 24px;
+          height: 24px;
+        }
       }
 
       .active_stores_logo {
@@ -54,4 +71,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

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

@@ -10,13 +10,12 @@ import React, { useEffect, useState } from 'react'
 import { PublicApi } from '@/services/api'
 import ImageBox from '@/components/ImageBox'
 import { GetReportMallGetActiveMerchantListResponse } from '@/services/ReportApi'
+import top1Icon from '@/assets/icons/TOP1.svg'
+import top2Icon from '@/assets/icons/TOP2.svg'
+import top3Icon from '@/assets/icons/TOP3.svg'
 import styles from './index.less'
 
-interface ActiveStoresPropsType {
-
-}
-
-const ActiveStores: React.FC<ActiveStoresPropsType> = (props) => {
+const ActiveStores: React.FC = (props) => {
   const [shopList, setShopList] = useState<GetReportMallGetActiveMerchantListResponse>([])
 
   useEffect(() => {
@@ -32,6 +31,19 @@ const ActiveStores: React.FC<ActiveStoresPropsType> = (props) => {
 
   }
 
+  const renderRank = (index: number) => {
+    switch(index) {
+      case 1:
+        return <img src={top1Icon} />
+      case 2:
+        return <img src={top2Icon} />
+      case 3:
+        return <img src={top3Icon} />
+      default:
+        return `0${index}`
+    }
+  }
+
   return (
     <div className={styles.active_stores}>
       <div className={styles.active_stores_title}>
@@ -41,7 +53,7 @@ const ActiveStores: React.FC<ActiveStoresPropsType> = (props) => {
         {
           shopList && shopList.map((item, index) => (
             <div className={styles.active_stores_list_item} key={item.memberShopId}>
-              <div className={styles.active_stores_rank}>0{index+1}</div>
+              <div className={styles.active_stores_rank}>{renderRank(index+1)}</div>
               <div className={styles.active_stores_logo}>
                 <ImageBox width={36} height={36} imgUrl={item.memberLogo}  />
               </div>

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

@@ -6,7 +6,6 @@ import { LAYOUT_TYPE, FILTER_TYPE } from '@/constants'
 import { PublicApi } from '@/services/api'
 import isEmpty from 'lodash/isEmpty'
 import styles from './index.less'
-import { Layout } from '@formily/antd'
 
 const CheckboxGroup = Checkbox.Group
 

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

+/*
+ * @Author: ghua
+ * @Date: 2020-08-10 14:59:23
+ * @LastEditTime: 2021-02-22 16:14:58
+ * @LastEditors: your name
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/lxMall/components/Filter/components/FilterBox/index.tsx
+ */
 import React, { useState } from 'react'
-import { CaretDownOutlined } from '@ant-design/icons'
+import { MinusOutlined, PlusOutlined } from '@ant-design/icons'
 import '../../index.less'
 
 interface FilterBoxPropsType {
@@ -14,7 +22,10 @@ const FilterBox: React.FC<FilterBoxPropsType> = (props) => {
     <div className="filter_box">
       <div className="filter_box_header" onClick={() => setExpand(!expand)}>
         <span>{title}</span>
-        <CaretDownOutlined rotate={expand ? 0 : 180} className="filter_box_header_icon" />
+        {
+          expand ? <MinusOutlined className="filter_box_header_icon" /> : <PlusOutlined className="filter_box_header_icon" />
+        }
+
       </div>
       {
         expand && (<div className="filter_box_body">

src/pages/lxMall/components/Filter/components/NewJoin/index.less

@@ -2,11 +2,24 @@
   width: 240px;
   margin-top: 20px;
   background: #ffffff;
-  border: 1px solid rgba(238, 238, 238, 1);
+  // border: 1px solid rgba(238, 238, 238, 1);
 
   &_title {
+    position: relative;
     font-weight: 500;
-    padding: 15px;
+    padding: 15px 12px;
+
+    &::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      margin: auto 0;
+      width: 4px;
+      height: 14px;
+      background-color: var(--mall_main_color);
+    }
   }
 
   .new_join_list {
@@ -54,4 +67,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

src/pages/lxMall/components/Filter/components/UseArea/index.less

@@ -3,17 +3,46 @@
 
   .filter_usearea_list {
     display: flex;
-    flex-wrap: wrap;
+    flex-direction: column;
+    max-height: 320px;
+    overflow-y: auto;
 
     &_item {
-      // position: relative;
-      width: 25%;
-      text-align: center;
+      position: relative;
       margin-bottom: 10px;
-
       font-size: 12px;
       color: #303133;
 
+      &_title {
+        color: #909399;
+      }
+
+      &_areaList {
+        display: flex;
+        flex-wrap: wrap;
+        margin-top: 10px;
+
+        &_item {
+          width: 42px;
+          height: 16px;
+          line-height: 16px;
+          background-color: #F4F5F7;
+          margin-right: 16px;
+          margin-bottom: 12px;
+          text-align: center;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          color: #606266;
+          cursor: pointer;
+
+          &.active {
+            background-color: #DAF2E7;
+            color: #00B37A;
+          }
+        }
+      }
+
       &>.text {
         cursor: pointer;
       }
@@ -63,4 +92,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

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

@@ -3,10 +3,24 @@ import FilterBox from '../FilterBox'
 import { PublicApi } from '@/services/api'
 import { GetSearchShopEnterpriseGetAreaResponse } from '@/services/SearchApi'
 import { LAYOUT_TYPE, FILTER_TYPE } from '@/constants'
+import pinyin from 'pinyin'
 import isEmpty from 'lodash/isEmpty'
 import cx from 'classnames'
 import styles from './index.less'
 
+interface CityListType {
+  title: string,
+  data: CityItemType[]
+}
+
+interface CityItemType {
+  cityName?: string;
+  cityCode?: string;
+  provinceName?: string,
+  provinceCode?: string,
+  title?: string;
+}
+
 interface UseAreaPropsType {
   FilterStore?: any;
   layoutType?: LAYOUT_TYPE;
@@ -41,20 +55,18 @@ interface UseAreaType {
 const UseArea: React.FC<UseAreaPropsType> = (props) => {
   const { layoutType = LAYOUT_TYPE.mall, shopId, memberId } = props
   const { onFilter, filterList } = props.FilterStore
-  const [areaList, setAreaList] = useState<UseAreaType[]>([])
-  const [selectCity, setSelectCity] = useState<string[]>([])
+  const [areaList, setAreaList] = useState<CityListType[]>([])
+  const [selectCity, setSelectCity] = useState<string>()
 
   useEffect(() => {
     if (isEmpty(filterList)) {
-      setSelectCity([])
+      setSelectCity('')
     } else {
-      const initKeys = []
+      let initKeys = ''
       if (layoutType !== LAYOUT_TYPE.shopList) {
         for (const item of filterList) {
-          if (item.type === FILTER_TYPE.province) {
-            initKeys.push(item.key)
-          } else if (item.type === FILTER_TYPE.city) {
-            initKeys.push(item.key)
+          if (item.type === FILTER_TYPE.province || item.type === FILTER_TYPE.city) {
+           initKeys = item.key
           }
         }
         setSelectCity(initKeys)
@@ -100,11 +112,61 @@ const UseArea: React.FC<UseAreaPropsType> = (props) => {
     }
     getAreaFn && getAreaFn(param, { headers }).then((res) => {
       if (res.code === 1000) {
-        setAreaList(initAreaData(res.data))
+        setAreaList(initDataList(res.data))
       }
     })
   }, [layoutType])
 
+  const initDataList = (list: GetSearchShopEnterpriseGetAreaResponse) => {
+    const newList = [...list]
+    const tempCityList: CityItemType[] = []
+    // 1.根据每个城市名获取首字母添加到数据中
+    newList.forEach((listItem) => {
+      if (listItem.cityList) {
+        listItem.cityList.forEach((cityItem) => {
+          const newCityItem: CityItemType = { ...cityItem }
+          if (newCityItem.cityName) {
+            const cityNameFirstWordPinyin = pinyin(newCityItem.cityName)[0][0]
+            const letter: string = cityNameFirstWordPinyin.split('')[0].toUpperCase()
+            newCityItem.title = letter
+          }
+          tempCityList.push(newCityItem)
+        })
+      }
+    })
+    // 2. 根据首字母对城市数组进行分组
+    const newCityList: CityListType[] = []
+    tempCityList.forEach((cityItem) => {
+      if (newCityList.every((item) => item.title !== cityItem.title)) {
+        newCityList.push({
+          title: cityItem.title || "",
+          data: [cityItem],
+        })
+      } else {
+        for (let i = 0; i < newCityList.length; i += 1) {
+          const newCityItem = newCityList[i]
+          if (newCityItem.title === cityItem.title) {
+            newCityItem.data = [...newCityItem.data, cityItem]
+          }
+        }
+      }
+    })
+    // 3. 根据字母进行排序
+    const sortData = newCityList.sort((a, b) => a.title.localeCompare(b.title))
+
+    // 4. 添加省份数据
+    sortData.unshift({
+      title: "省",
+      data: list.map((dataItem) => ({
+        provinceName: dataItem.provinceName,
+        provinceCode: dataItem.provinceCode,
+      })),
+    })
+    // setCityList(sortData)
+    console.log(sortData)
+    return sortData
+  }
+
   const initAreaData = (data: GetSearchShopEnterpriseGetAreaResponse) => {
     if (data) {
       return data.map(item => {
@@ -123,60 +185,52 @@ const UseArea: React.FC<UseAreaPropsType> = (props) => {
     return []
   }
 
-  const handleSelect = (item: any, type: FILTER_TYPE) => {
-    if (type === FILTER_TYPE.province) {
-      setSelectCity([item.value])
+  const handleSelect = (item: CityItemType, type: FILTER_TYPE) => {
+    if (item.provinceCode) {
+      setSelectCity(item.provinceCode)
       if (layoutType === LAYOUT_TYPE.shopList) {
         onFilter({
           type: FILTER_TYPE.shopArea,
-          title: item.label,
-          key: item.value
+          title: item.provinceName,
+          key: item.provinceCode
         })
       } else {
         onFilter({
           type: FILTER_TYPE.province,
-          title: item.label,
-          key: item.value
+          title: item.provinceName,
+          key: item.provinceCode
         })
-        if (selectCity.length > 1 && selectCity[0] !== item.value) {
+        if (filterList.some((filterItem) => filterItem.type === FILTER_TYPE.city)) {
           onFilter({
             type: FILTER_TYPE.city,
-            title: item.label,
+            title: item.provinceName,
             key: null
           })
         }
       }
     } else {
-      setSelectCity([selectCity[0], item.value])
+      setSelectCity(item.cityCode)
       if (layoutType === LAYOUT_TYPE.shopList) {
         onFilter({
           type: FILTER_TYPE.shopArea,
-          title: item.label,
-          key: item.value
+          title: item.cityName,
+          key: item.cityCode
         })
       } else {
         onFilter({
-          type: FILTER_TYPE.province,
-          title: getProvinceText(selectCity[0]),
-          key: selectCity[0]
-        })
-        onFilter({
-          type: FILTER_TYPE.city,
-          title: item.label,
-          key: item.value
-        })
-      }
-    }
-  }
-
-  const getProvinceText = (code: string) => {
-    let result = ""
-    for (const item of areaList) {
-      if (item.value === code) {
-        result = item.label
+            type: FILTER_TYPE.city,
+            title: item.cityName,
+            key: item.cityCode
+          })
+        if (filterList.some((filterItem) => filterItem.type === FILTER_TYPE.province)) {
+          onFilter({
+            type: FILTER_TYPE.province,
+            title: item.cityName,
+            key: null
+          })
+        }
       }
     }
-    return result
   }
 
   return (
@@ -187,32 +241,23 @@ const UseArea: React.FC<UseAreaPropsType> = (props) => {
         <div className={styles.filter_usearea_list}>
           {
             areaList.map(item => (
-              <div key={item.value} className={cx(styles.filter_usearea_list_item, selectCity.includes(item.value) ? styles.active : '')}>
-                <span className={styles.text} onClick={() => handleSelect(item, FILTER_TYPE.province)}>{item.label}</span>
-                {
-                  (selectCity.includes(item.value) && !!item.children) && (
-                    <div className={styles.more_panel}>
-                      <div className={styles.sub_area_list}>
-                        {
-                          item.children.map(childItem => (
-                            <div key={childItem.value} onClick={() => handleSelect(childItem, FILTER_TYPE.city)} className={cx(styles.sub_area_list_item, selectCity.includes(childItem.value) ? styles.active : '')}>
-                              {childItem.label}
-                            </div>
-                          ))
-                        }
-                      </div>
-                      <div className={styles.sub_area_list_hidden}>
-                        {
-                          item.children && item.children.map(childItem => (
-                            <div className={styles.sub_area_list_item} key={childItem.value}>
-                              {childItem.label}
-                            </div>
-                          ))
-                        }
+              <div key={`areaItem_${item.title}`} className={cx(styles.filter_usearea_list_item)}>
+                <div className={styles.filter_usearea_list_item_title}>
+                  <span>{item.title}</span>
+                </div>
+                <div className={styles.filter_usearea_list_item_areaList}>
+                  {
+                    item.data && item.data.map((areaItem) => (
+                      <div
+                        className={cx(styles.filter_usearea_list_item_areaList_item, selectCity === (areaItem.cityCode || areaItem.provinceCode) ? styles.active : "")}
+                        key={areaItem.cityCode || areaItem.provinceCode}
+                        onClick={() => handleSelect(areaItem, FILTER_TYPE.province)}
+                      >
+                        <span title={areaItem.cityName || areaItem.provinceName}>{areaItem.cityName || areaItem.provinceName}</span>
                       </div>
-                    </div>
-                  )
-                }
+                    ))
+                  }
+                </div>
               </div>
             ))
           }

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

@@ -9,8 +9,8 @@
       position: relative;
       height: 40px;
       line-height: 40px;
-      padding-left: 15px;
-      background-color: #F4F5F7;
+      // padding-left: 15px;
+      // background-color: #F4F5F7;
       cursor: pointer;
       color: #3A3A3A;
       font-size: 14px;
@@ -25,8 +25,9 @@
         width: 12px;
         height: 12px;
         margin: auto 0;
-        color: #C0C4CC;
-        font-size: 12px;
+        color: #303133;
+        font-size: 14px;
+        font-weight: bold;
       }
     }
 

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

@@ -27,7 +27,7 @@ const Information: React.FC<InformationPropsType> = (props) => {
   /**
  * 获取所有栏目
  */
-  const fetchAllColumn = (state: boolean = false) => {
+  const fetchAllColumn = () => {
     PublicApi.getManageContentColumnAll().then(res => {
       if (res.code === 1000) {
         setAllColumn(res.data)
@@ -37,8 +37,8 @@ const Information: React.FC<InformationPropsType> = (props) => {
 
   const initLeadNewData = (leadNewsList) => {
     if (leadNewsList.length >= 2) {
-      let leftList = leadNewsList.slice(0, Math.round(leadNewsList.length / 2))
-      let rightList = leadNewsList.slice(Math.round(leadNewsList.length / 2), leadNewsList.length)
+      const leftList = leadNewsList.slice(0, Math.round(leadNewsList.length / 2))
+      const rightList = leadNewsList.slice(Math.round(leadNewsList.length / 2), leadNewsList.length)
       setLeadLeftNews(leftList)
       setLeadRightNews(rightList)
     } else {
@@ -52,7 +52,7 @@ const Information: React.FC<InformationPropsType> = (props) => {
   */
   const fetchLeadNews = async () => {
     try {
-      let data: any = await fetchNewByLabel(1)
+      const data: any = await fetchNewByLabel(1)
       data && initLeadNewData(data)
     } catch (error) {
       console.log(error)
@@ -62,7 +62,7 @@ const Information: React.FC<InformationPropsType> = (props) => {
   const renderColumns = () => {
     if (allColumn && allColumn.length > 0) {
       let labelList = allColumn.map(item => item.name)
-      let showCount = 4
+      const showCount = 4
       if (labelList.length <= showCount) {
         return labelList.join(' | ')
       } else {

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

@@ -39,7 +39,7 @@
 
         &.active {
           &>a {
-            color: @mall_main_color;
+            color: var(--mall_main_nav_hover_color);
           }
         }
       }

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

+/*
+ * @Author: ghua
+ * @Date: 2020-08-13 14:24:10
+ * @LastEditTime: 2021-02-23 09:47:36
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/lxMall/components/MainNav/index.tsx
+ */
 import React from 'react'
-import { Link } from 'umi'
 import cx from 'classnames'
 import { LAYOUT_TYPE } from '@/constants'
 import Category from '../Category'
@@ -43,7 +50,6 @@ const MainNav: React.FC<MainNavPropsType> = (props) => {
           }
         </ul>
       </div>
-
     </div>
   )
 }

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

@@ -124,11 +124,9 @@
         display: none;
         top: 48px;
         width: 214px;
-        padding: 0 10px;
-        padding-bottom: 15px;
+        padding-top: 8px;
         margin-bottom: 20px;
-        border: 1px solid rgba(245, 245, 245, 1);
-        background: linear-gradient(180deg, rgba(255, 245, 203, 1) 0%, rgba(255, 253, 244, 1) 100%);
+        background-color: #FFF;
         z-index: 8;
         left: 0;
 
@@ -136,7 +134,10 @@
           display: flex;
           align-items: center;
           justify-content: center;
-          height: 47px;
+          background: #FFF8DA;
+          height: 40px;
+          border: 1px solid rgba(245, 245, 245, 1);
+          border-bottom: none;
 
           &_split {
             width: 40px;
@@ -150,6 +151,12 @@
           }
         }
 
+        &_body {
+          padding: 16px;
+          border: 1px solid rgba(245, 245, 245, 1);
+          border-top: none;
+        }
+
         .shop_name {
           font-size: 12px;
           color: #303133;
@@ -192,15 +199,13 @@
         }
 
         .dashed_split {
-
           margin: 15px 0;
           width: 100%;
-          border-top: 1px dashed #F2C17C;
+          border-top: 1px dashed #F4F5F7;
           height: 0;
         }
 
         .shop_info_list {
-          margin-top: 10px;
 
           &_item {
             display: flex;
@@ -213,6 +218,21 @@
 
             }
 
+            .star {
+              font-size: 15px;
+              line-height: 15px;
+              margin-left: 4px;
+              color: #FCA110 !important;
+
+              :global {
+                .ant-rate-star {
+                  &:not(:last-child) {
+                    margin-right: 1px;
+                  }
+                }
+              }
+            }
+
             &>.breif {
               .star {
                 font-size: 15px;
@@ -221,7 +241,7 @@
               }
 
               .certified {
-                color: #00B37A;
+                color: #3877FF;
               }
             }
 
@@ -273,7 +293,7 @@
           margin-top: 15px;
           width: 100%;
           height: 32px;
-          background-color: #D32F2F;
+          background-color: var(--mall_main_color);
           color: #FFF;
           border: none;
           outline: none;
@@ -387,4 +407,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

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

@@ -105,11 +105,11 @@ const ShopHeader: React.FC<ShopHeaderPropsType> = (props) => {
                     <CaretDownOutlined className={styles.shop_header_info_content_icon} />
                   </div>
                   <div className={styles.shop_header_info_content_about}>
-                    <div className={styles.shop_header_info_content_about_item}>
+                    {/* <div className={styles.shop_header_info_content_about_item}>
                       <i className={styles.icon}><img src={shop_icon} /></i>
                       <span className={styles.red}>{shopInfo?.registerYears}</span>
                       <span>年</span>
-                    </div>
+                    </div> */}
                     <div className={styles.shop_header_info_content_about_item}>
                       <i className={styles.icon}><img src={credit_icon} /></i>
                       <span>{shopInfo?.creditPoint || 0}</span>
@@ -122,30 +122,36 @@ const ShopHeader: React.FC<ShopHeaderPropsType> = (props) => {
                     <div className={styles.shop_info_title_text}>会员认证</div>
                     <div className={styles.shop_info_title_split}></div>
                   </div>
-                  <div className={styles.shop_info_list}>
-                    <div className={styles.shop_info_list_item}>
-                      <div className={styles.label}>满意度：</div>
-                      <div className={styles.breif}><Rate className={styles.star} count={4} disabled defaultValue={4} /></div>
-                    </div>
-                    <div className={styles.shop_info_list_item}>
-                      <div className={styles.label}>注册资本：</div>
-                      <div className={styles.breif}>{shopInfo?.registeredCapital || ""}</div>
+                  <div className={styles.shop_info_body}>
+                    <div className={styles.shop_info_list}>
+                      <div className={styles.shop_info_list_item}>
+                        <div className={styles.label}>信誉：</div>
+                        <div className={styles.breif}>{shopInfo?.creditPoint || 0}</div>
+                      </div>
+                      <div className={styles.shop_info_list_item}>
+                        <div className={styles.label}>注册资本：</div>
+                        <div className={styles.breif}>{shopInfo?.registeredCapital || ""}</div>
+                      </div>
+                      <div className={styles.shop_info_list_item}>
+                        <div className={styles.label}>成立日期：</div>
+                        <div className={styles.breif}>{shopInfo?.establishmentDate || ""}</div>
+                      </div>
+                      <div className={styles.shop_info_list_item}>
+                        <div className={styles.label}>营业执照：</div>
+                        <div className={styles.breif}><span className={styles.certified}>{shopInfo?.businessLicence ? '[已认证]' : '[未认证]'}</span></div>
+                      </div>
+                      <div className={styles.shop_info_list_item}>
+                        <div className={styles.label}>满意度：</div>
+                        <div className={styles.breif}>{shopInfo?.avgTradeCommentStar || 0}<Rate className={styles.star} count={5} disabled defaultValue={shopInfo?.avgTradeCommentStar || 0} /></div>
+                      </div>
                     </div>
-                    <div className={styles.shop_info_list_item}>
-                      <div className={styles.label}>成立日期：</div>
-                      <div className={styles.breif}>{shopInfo?.establishmentDate || ""}</div>
+                    <div className={styles.dashed_split}></div>
+                    <div className={styles.shop_info_btn_group}>
+                      <div className={styles.shop_info_btn}><Link to={`/shop?shopId=${shopUrlParam}`}>进入店铺</Link></div>
+                      <div className={cx(styles.shop_info_btn, collectState ? styles.active : '')} onClick={() => handleCollect()}>{collectState ? '已收藏本店' : '收藏本店'}</div>
                     </div>
-                    <div className={styles.shop_info_list_item}>
-                      <div className={styles.label}>营业执照：</div>
-                      <div className={styles.breif}><span className={styles.certified}>{shopInfo?.businessLicence ? '[已认证]' : '[未认证]'}</span></div>
-                    </div>
-                  </div>
-                  <div className={styles.dashed_split}></div>
-                  <div className={styles.shop_info_btn_group}>
-                    <div className={styles.shop_info_btn}><Link to={`/shop?shopId=${shopUrlParam}`}>进入店铺</Link></div>
-                    <div className={cx(styles.shop_info_btn, collectState ? styles.active : '')} onClick={() => handleCollect()}>{collectState ? '已收藏本店' : '收藏本店'}</div>
+                    <Button loading={applyLoading} className={styles.apply_member_btn} onClick={() => applyFroVip()}>申请成为本店会员</Button>
                   </div>
-                  <Button loading={applyLoading} className={styles.apply_member_btn} onClick={() => applyFroVip()}>申请成为本店会员</Button>
                 </div>
               </div>
             </>

src/pages/lxMall/index/index.less

+
 .mall_index {
   background-color: #F4F5F7;
   padding-bottom: 52px;

src/pages/lxMall/index/index.tsx

@@ -9,6 +9,7 @@ import { Advert, FloorLine } from 'lingxi-design-ui'
 import FloorSkeleton from '../components/FloorSkeleton'
 import { LAYOUT_TYPE } from '@/constants'
 import styles from './index.less'
+import '@/theme/style/colors.less'
 
 interface MallIndexPropsType {
   SiteStore?: any;

src/pages/lxMall/pay/index.tsx

 import React, { useState, useEffect } from 'react'
+import { inject } from 'mobx-react'
 import CommonHeader from '../components/CommonHeader'
 import PointPayWay from './components/point'
 import BablancePayWay from './components/balance'
@@ -17,6 +18,7 @@ interface PayPagePropsType {
   shopInfo: any;
   mallInfo: any;
   layoutType: LAYOUT_TYPE;
+  SiteStore: any,
 }
 
 enum PayWayType {
@@ -47,7 +49,7 @@ const getPayTypeTitle = (type) => {
 }
 
 const PayPage: React.FC<PayPagePropsType> = (props) => {
-  const { shopInfo, mallInfo, layoutType } = props
+  const { shopInfo, mallInfo, layoutType, SiteStore: { currentLayoutInfo } } = props
   const [payState, setPayState] = useState<boolean>(false)
   const { orderId } = props.location.query
   const [pageTitle, setPageTitle] = useState<string>()
@@ -120,7 +122,7 @@ const PayPage: React.FC<PayPagePropsType> = (props) => {
   }
 
   const backHome = () => {
-    window.location.href = '/'
+    window.location.href = currentLayoutInfo.mallLink
   }
 
   const renderError = () => {
@@ -153,4 +155,4 @@ const PayPage: React.FC<PayPagePropsType> = (props) => {
   ) : loading ? null : renderError(): renderError()
 }
 
-export default PayPage
+export default inject("SiteStore")(PayPage)

src/pages/lxMall/payResult/index.tsx

+/*
+ * @Author: ghua
+ * @Date: 2020-11-09 18:18:52
+ * @LastEditTime: 2021-02-22 14:47:14
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/lxMall/payResult/index.tsx
+ */
 import React, { useState, useEffect } from 'react'
 import CommonHeader from '../components/CommonHeader'
 import { LAYOUT_TYPE } from '@/constants'
 import { history } from 'umi'
+import { inject } from 'mobx-react'
 import { Button, message } from 'antd'
 import cx from 'classnames'
 import paySuccessIcon from '@/assets/imgs/pay_success.png'
@@ -12,11 +21,12 @@ interface PayResultPropsType {
   shopInfo: any;
   mallInfo: any;
   layoutType: LAYOUT_TYPE;
+  SiteStore: any,
 }
 
 let timer = null
 const PayResult: React.FC<PayResultPropsType> = (props) => {
-  const { shopInfo, mallInfo, layoutType, } = props
+  const { shopInfo, mallInfo, layoutType, SiteStore: { currentLayoutInfo }} = props
   const { orderId } = props.location.query
   const [count ,setCount] = useState<number>(10)
 
@@ -36,7 +46,7 @@ const PayResult: React.FC<PayResultPropsType> = (props) => {
   }
 
   const backHome = () => {
-    window.location.href = "/"
+    window.location.href = currentLayoutInfo.mallLink
   }
 
   const goToDetail = () => {
@@ -58,9 +68,9 @@ const PayResult: React.FC<PayResultPropsType> = (props) => {
         <img className={styles.success_icon} src={paySuccessIcon} />
         <div className={styles.result_text}>支付成功！</div>
         <div className={styles.btn_group}>
-          <Button 
-            className={cx(styles.btn_item, styles.primary)} 
-            type="primary" 
+          <Button
+            className={cx(styles.btn_item, styles.primary)}
+            type="primary"
             onClick={() => goToDetail()}
           >
             去订单查看({count}s)
@@ -72,4 +82,4 @@ const PayResult: React.FC<PayResultPropsType> = (props) => {
   )
 }
 
-export default PayResult
+export default inject("SiteStore")(PayResult)

src/pages/lxMall/shopList/index.less

@@ -23,8 +23,10 @@
 
       .tool_bar {
         display: flex;
-        height: 48px;
+        height: 40px;
         width: 100%;
+        border: 1px solid #EBECF0;
+        margin-bottom: 16px;
 
 
         .tool_bar_left {
@@ -33,12 +35,25 @@
 
           .tool_bar_filter_item {
             display: flex;
+            height: 40px;
             align-items: center;
             color: #606266;
-            margin-right: 30px;
+            width: 88px;
+            justify-content: center;
             font-size: 12px;
+            border-right: 1px solid #EBECF0;
             cursor: pointer;
 
+            .arrowIcon {
+              color: #C0C4CC;
+              font-size: 12px;
+              margin-left: 4px;
+            }
+
+            .active {
+              color: var(--mall_main_color);
+            }
+
             &>.icon {
               width: 20px;
               height: 20px;
@@ -61,7 +76,7 @@
                 color: #C0C4CC;
 
                 &.active {
-                  color: #303133;
+                  color: var(--mall_main_color);
                 }
 
                 &:last-child {
@@ -78,9 +93,52 @@
           align-items: center;
           font-size: 12px;
 
+          .showTypeBox {
+            width: 40px;
+            height: 40px;
+            text-align: center;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-left: 1px solid #EBECF0;
+
+            &>.icon {
+              color: #E4E6EB;
+              font-size: 22px;
+              cursor: pointer;
+
+              &.active {
+                color: #303133;
+              }
+            }
+          }
+
+          .pageBox {
+            display: flex;
+            border-left: 1px solid #EBECF0;
+            padding: 0 8px;
+            font-size: 12px;
+            height: 40px;
+            line-height: 40px;
+            align-items: center;
+
+            &_main {
+              margin: 0 8px;
+            }
+
+            &>.pageBoxIcon {
+              color: #303133;
+              cursor: pointer;
+
+              &.disabled {
+                color: #909399;
+              }
+            }
+          }
+
           .count {
             color: #909399;
-
+            margin-right: 14px;
 
             &>label {
               color: #333300;
@@ -88,24 +146,14 @@
             }
           }
 
-          &>.icon {
-            color: #C0C4CC;
-            margin-left: 25px;
-            font-size: 22px;
-            cursor: pointer;
 
-            &.active {
-              color: #303133;
-            }
-          }
         }
       }
 
       .filter_bar {
-        margin-top: 7px;
+        margin-bottom: 16px;
         display: flex;
         align-items: center;
-        margin-bottom: 16px;
 
         .filter_bar_left {
           display: flex;
@@ -129,20 +177,29 @@
 
         .filter_bar_list {
           display: flex;
-          margin-left: 30px;
 
           .filter_bar_list_item {
-            height: 20px;
-            line-height: 20px;
-            padding: 0 5px;
+            display: flex;
+            height: 24px;
+            line-height: 24px;
             background-color: #F4F5F7;
             font-size: 12px;
             color: #303133;
             border-radius: 4px;
-            margin-right: 15px;
-            // margin-bottom: 8px;
+            margin-right: 20px;
+
+            .filter_bar_close_box {
+              width: 24px;
+              background-color: #F7F8FA;
+              border-left: 1px solid #EBECF0;
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+            }
 
             &_text {
+              flex: 1;
+              padding: 0 5px;
+
               &>b {
                 margin-left: 5px;
                 color: #D32F2F;
@@ -230,4 +287,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

src/pages/lxMall/shopList/index.tsx

@@ -172,15 +172,14 @@ const ShopList: React.FC<ShopListPropsType> = (props) => {
             {
               (filterList && filterList.length > 0 || search) && (
                 <div className={styles.filter_bar}>
-                  <div className={styles.filter_bar_left}>
-                    <div className={styles.filter_bar_left_text} onClick={handleResetFilter}>重置</div>
-                  </div>
                   <div className={styles.filter_bar_list}>
                     {
                       search && (
                         <div className={styles.filter_bar_list_item}>
                           <span className={styles.filter_bar_list_item_text}>{search}</span>
-                          <CloseOutlined className={styles.filter_bar_list_item_icon} onClick={() => handleClearSearch()} />
+                          <div className={styles.filter_bar_close_box}>
+                            <CloseOutlined className={styles.filter_bar_list_item_icon} onClick={() => handleClearSearch()} />
+                          </div>
                         </div>
                       )
                     }
@@ -188,11 +187,16 @@ const ShopList: React.FC<ShopListPropsType> = (props) => {
                       filterList.map(item => item.title && (
                         <div className={styles.filter_bar_list_item} key={item.key}>
                           <span className={styles.filter_bar_list_item_text}>{item.title}</span>
-                          <CloseOutlined className={styles.filter_bar_list_item_icon} onClick={() => handleDeleteFilterItem(item)} />
+                          <div className={styles.filter_bar_close_box}>
+                            <CloseOutlined className={styles.filter_bar_list_item_icon} onClick={() => handleDeleteFilterItem(item)} />
+                          </div>
                         </div>
                       ))
                     }
                   </div>
+                   <div className={styles.filter_bar_left}>
+                    <div className={styles.filter_bar_left_text} onClick={handleResetFilter}>重置</div>
+                  </div>
                 </div>
               )
             }

src/pages/mobileTemplate/chennelTemplateEdit/config.ts → src/pages/mobileTemplate/channelTemplateEdit/config.ts

+/*
+ * @Author: your name
+ * @Date: 2021-02-22 17:02:20
+ * @LastEditTime: 2021-02-22 17:02:21
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/mobileTemplate/channelTemplateEdit/config.ts
+ */
 import { PROPS_TYPES } from 'lingxi-editor-core'
 
 export const mallLayoutConfig = {

src/pages/mobileTemplate/chennelTemplateEdit/index.tsx → src/pages/mobileTemplate/channelTemplateEdit/index.tsx

 /*
+ * @Author: your name
+ * @Date: 2021-02-22 17:02:20
+ * @LastEditTime: 2021-02-22 17:02:20
+ * @LastEditors: your name
+ * @Description: In User Settings Edit
+ * @FilePath: /lingxi-business-paltform/src/pages/mobileTemplate/channelTemplateEdit/index.tsx
+ */
+/*
 * @Author: ghua
 * @Date: 2021-01-14 17:03:08
  * @Last Modified by: ghua

src/pages/shop/shopInfo/index.tsx

@@ -367,7 +367,7 @@ const ShopInfo: React.FC<ShopInfoPropsType> = (props) => {
                 <UploadImage
                   imgUrl={""}
                   large={true}
-                  fileMaxSize={400}
+                  fileMaxSize={1024}
                   size="600x400"
                   onChange={(url) => handleAddworkshopPics(url)}
                 />
@@ -392,7 +392,7 @@ const ShopInfo: React.FC<ShopInfoPropsType> = (props) => {
                 <UploadImage
                   imgUrl={""}
                   large={true}
-                  fileMaxSize={400}
+                  fileMaxSize={1024}
                   size="106x107"
                   onChange={(url) => handleAddhonorPics(url)}
                 />
@@ -417,7 +417,7 @@ const ShopInfo: React.FC<ShopInfoPropsType> = (props) => {
                 <UploadImage
                   imgUrl={""}
                   large={true}
-                  fileMaxSize={500}
+                  fileMaxSize={1024}
                   size="106x107"
                   onChange={(url) => handleAddPromotionPic(url)}
                 />

src/pages/user/forgetPwd.tsx

@@ -83,6 +83,8 @@ const GetBack: React.FC = () => {
                         setFieldState('account', state => {
                           state.errors = ['邮箱不存在, 请检查']
                         })
+                      } else {
+                        message.destroy()
                       }
                     })
                     return ;

src/theme/science/styles/colors.less

@@ -5,12 +5,10 @@
   --mall_main_color: #00B37A;
   --mall_main_color_opacity_2: #daf2e7;
   --mall_sub_color: #daf2e7;
-  // --mall_main_color: #D32F2F;
-  // --mall_main_color_opacity_2: rgba(211, 47, 47, .2);
-  // --mall_sub_color: rgba(211, 47, 47, 0.1);
-
+  --mall_main_nav_hover_color: #00B37A;
   --category_content_bg: #FFFFFF;
   --category_content_title_text: #303133;
+  --category_content_title_text_hover: #00B37A;
   --category_content_sub_title_text: #606266;
 
 }
@@ -19,10 +17,11 @@
 .theme-channel-science {
   font-size: 14px;
   --mall_main_color: #464552;
-  --mall_sub_color: #FFFFFF;
-
+  --mall_sub_color: #00B37F;
+  --mall_main_nav_hover_color: #00B37A;
   --category_content_bg: #464552;
   --category_content_title_text: #FFFFFF;
+  --category_content_title_text_hover: #FFFFFF;
   --category_content_sub_title_text: rgba(255, 255, 255, 0.45);
 }
 
@@ -31,10 +30,10 @@
   font-size: 14px;
   --mall_main_color: #00B37A;
   --mall_sub_color: #daf2e7;
-  // --mall_main_color: #D32F2F;
-  // --mall_sub_color: rgba(211, 47, 47, 0.1);
+  --mall_main_nav_hover_color: #00B37A;
   --nav_active_bg: #008C65;
   --category_content_bg: #FFFFFF;
   --category_content_title_text: #303133;
+  --category_content_title_text_hover: #00B37A;
   --category_content_sub_title_text: #606266;
 }