feat:渠道商城商品接口对接

src/components/UploadImage/index.less

@@ -32,8 +32,8 @@
     }
 
     &>img {
-      height: 100%;
-      width: auto;
+      width: 100%;
+      height: auto;
       display: block;
       margin: 0 auto;
     }

src/pages/channel/channelInfo/index.tsx

@@ -224,13 +224,13 @@ const ChannelInfo: React.FC<ShopInfoPropsType> = (props) => {
     if (mallItem.environment === 1) {
       switch (mallItem.type) {
         case 3:
-          result = `${siteUrl}/channelmall?id=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
+          result = `${siteUrl}/channelmall?channelId=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
           break
         case 4:
-          result = `${siteUrl}/channelmall?id=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
+          result = `${siteUrl}/channelmall?channelId=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
           break
         case 5:
-          result = `${siteUrl}/channelmall/pointsMall?id=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
+          result = `${siteUrl}/channelmall/pointsMall?channelId=${btoa(JSON.stringify({ shopId: shopInfo.shopId, memberId: shopInfo.memberId }))}`
           break
         default:
           result = ""

src/pages/lxMall/channel/index.tsx

@@ -106,7 +106,7 @@ const ChannelIndex: React.FC<ChannelIndexPropsType> = (props) => {
       let categoryDetail: any = await fetchCategoryById(item.id)
       result.push(
         <ShopFloorLine
-          linkUrl={`/channelmall/commodity?id=${shopUrlParam}&categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.name))}`}
+          linkUrl={`/channelmall/commodity?channelId=${shopUrlParam}&categoryId=${item.id}&categoryName=${btoa(encodeURIComponent(item.name))}`}
           anchor={`floorline_${item.id}`}
           key={item.id}
           title={item.name}
@@ -114,11 +114,11 @@ const ChannelIndex: React.FC<ChannelIndexPropsType> = (props) => {
           <ShopFloorLine.Category
             categoryAdvertPicUrl={categoryDetail.categoryAdvertPicUrl}
             categoryList={categoryDetail.categoryBOList}
-            linkUrl={`/channelmall/commodity?id=${shopUrlParam}`}
+            linkUrl={`/channelmall/commodity?channelId=${shopUrlParam}`}
           />
           <ShopFloorLine.Goods
             goodsList={categoryDetail.goodsBOList}
-            linkUrl={`/channelmall/commodity/detail?id=${shopUrlParam}`}
+            linkUrl={`/channelmall/commodity/detail?channelId=${shopUrlParam}`}
           />
         </ShopFloorLine>
       )

src/pages/lxMall/commodity/index.tsx

@@ -23,6 +23,7 @@ interface CommodityPropsType {
   layoutType: LAYOUT_TYPE,
   memberId: number;
   shopId: number;
+
 }
 
 interface filterQuery {
@@ -39,6 +40,7 @@ interface filterQuery {
   Max?: number;
   priceType?: number;
   storeId?: number;
+  channelMemberId?: number;
 }
 
 const Commodity: React.FC<CommodityPropsType> = (props) => {
@@ -49,7 +51,7 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
   const [confirmLoading, setConfirmLoading] = useState<boolean>(false)
   const [commonlyUsedName, setCommonlyUsedName] = useState<string>("")
   const { filterList, filterUpdate, filterParam, onDeleteFilterItem, onResetFilter, onFilter, onFilterParamChange, saveCommonlyUsedFilter } = FilterStore
-  const { layoutType, shopId } = props
+  const { layoutType, shopId, memberId } = props
   const { query: { categoryId, categoryName, brandId, brandName } } = props.location
   const [loading, setLoading] = useState<boolean>(true)
   const [showType, setShowType] = useState<number>(1) // 展示方式：1：矩阵排列； 2:列表排列
@@ -117,7 +119,8 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
         getFn = PublicApi.getSearchShopStoreGetCommodityList
         break
       case LAYOUT_TYPE.channel:
-        getFn = PublicApi.getSearchShopStoreGetCommodityList
+        param.channelMemberId = memberId
+        getFn = PublicApi.getSearchShopChannelGetCommodityList
         break
     }
 

src/pages/lxMall/commodity/list.tsx

@@ -50,7 +50,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
           {
             commodityList.map((item, index) => (
               <div key={`commodity_list_item_${index}`} className={cx(styles.commodity_list_item, styles.row)}>
-                <a href={`/${layoutType === LAYOUT_TYPE.channel ? 'channelmall' : 'shop'}/commodity/detail?id=${item.id}&type=${item.priceType}&shopId=${btoa(JSON.stringify({ shopId: item.storeId, memberId: item.memberId }))}`} target="_blank">
+                <a href={`/${layoutType === LAYOUT_TYPE.channel ? 'channelmall' : 'shop'}/commodity/detail?id=${item.id}&type=${item.priceType}&${layoutType === LAYOUT_TYPE.channel ? 'channelId' : 'shopId'}=${btoa(JSON.stringify({ shopId: item.storeId, memberId: item.memberId }))}`} target="_blank">
                   <div className={styles.goods_img}>
                     {
                       item.mainPic ? <img src={item.mainPic} /> : <Skeleton.Image style={{ width: 220, height: 220 }} />

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

@@ -14,11 +14,12 @@ interface CategoryPropsType {
   layoutType?: LAYOUT_TYPE;
   type?: LAYOUT_TYPE;
   shopId?: number;
+  memberId?: number;
   shopUrlParam?: string;
 }
 
 const Category: React.FC<CategoryPropsType> = (props) => {
-  const { type, shopId, shopUrlParam } = props
+  const { type, shopId, memberId, shopUrlParam } = props
   const { mallTemplateId } = props.SiteStore
   const { fetchCategoryList, categoryList } = props.CategoryStore
 
@@ -41,7 +42,11 @@ const Category: React.FC<CategoryPropsType> = (props) => {
         }
         break
       case LAYOUT_TYPE.channel:
-
+        if (memberId) {
+          params.channelMemberId = memberId
+          getCategoryFn = PublicApi.getSearchShopChannelGetCustomerCategoryTree
+          fetchCategoryList(getCategoryFn, params, type)
+        }
         break
       default:
         break

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

@@ -9,11 +9,12 @@ import url from '*.svg'
 interface BrandPropsType {
   FilterStore?: any;
   layoutType?: LAYOUT_TYPE,
-  shopId?: number
+  shopId?: number,
+  memberId?: number;
 }
 
 const Brand: React.FC<BrandPropsType> = (props) => {
-  const { layoutType = LAYOUT_TYPE.mall, shopId } = props
+  const { layoutType = LAYOUT_TYPE.mall, shopId, memberId } = props
   const { onFilter, filterList } = props.FilterStore
   const [brandList, setBrandList] = useState<GetSearchShopEnterpriseGetBrandResponse>([])
 
@@ -29,8 +30,8 @@ const Brand: React.FC<BrandPropsType> = (props) => {
         getBrandFn = PublicApi.getSearchShopStoreGetBrand
         break
       case LAYOUT_TYPE.channel:
-        param.storeId = shopId
-        getBrandFn = PublicApi.getSearchShopStoreGetBrand
+        param.channelMemberId = memberId
+        getBrandFn = PublicApi.getSearchShopChannelGetBrand
         break
     }
     getBrandFn(param).then((res) => {

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

@@ -13,11 +13,12 @@ interface CategoryPropsType {
   FilterStore?: any;
   layoutType?: LAYOUT_TYPE
   shopId?: number;
+  memberId?: number;
   showAttr?: boolean
 }
 
 const Category: React.FC<CategoryPropsType> = (props) => {
-  const { layoutType = LAYOUT_TYPE.mall, shopId, showAttr = false } = props
+  const { layoutType = LAYOUT_TYPE.mall, shopId, memberId, showAttr = false } = props
   const { onFilter, filterList } = props.FilterStore
   const [selectedKeys, setSelectedKeys] = useState<string[]>([])
   const [expandedKeys, setExpandedKeys] = useState<string[]>([])
@@ -55,8 +56,8 @@ const Category: React.FC<CategoryPropsType> = (props) => {
         getCategoryListFn = PublicApi.getSearchShopStoreGetCustomerCategoryTree
         break
       case LAYOUT_TYPE.channel:
-        param.storeId = shopId
-        getCategoryListFn = PublicApi.getSearchShopStoreGetCustomerCategoryTree
+        param.channelMemberId = memberId
+        getCategoryListFn = PublicApi.getSearchShopChannelGetCustomerCategoryTree
         break
       case LAYOUT_TYPE.scoreMall:
         getCategoryListFn = PublicApi.getSearchShopScoreGetCategoryTree

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

@@ -11,6 +11,7 @@ interface UseAreaPropsType {
   FilterStore?: any;
   layoutType?: LAYOUT_TYPE;
   shopId?: number;
+  memberId?: number;
 }
 
 
@@ -39,7 +40,7 @@ interface useAreaType {
 }
 
 const UseArea: React.FC<UseAreaPropsType> = (props) => {
-  const { layoutType = LAYOUT_TYPE.mall, shopId } = props
+  const { layoutType = LAYOUT_TYPE.mall, shopId, memberId } = props
   const { onFilter, filterList } = props.FilterStore
   const [areaList, setAreaList] = useState<useAreaType[]>([])
   const [selectCity, setSelectCity] = useState<string[]>([])
@@ -72,8 +73,8 @@ const UseArea: React.FC<UseAreaPropsType> = (props) => {
         getAreaFn = PublicApi.getSearchShopStoreGetArea
         break
       case LAYOUT_TYPE.channel:
-        param.storeId = shopId
-        getAreaFn = PublicApi.getSearchShopStoreGetArea
+        param.channelMemberId = memberId
+        getAreaFn = PublicApi.getSearchShopChannelGetArea
         break
     }
 

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

@@ -11,17 +11,18 @@ interface MainNavPropsType {
   type: LAYOUT_TYPE,
   shopId?: number,
   shopUrlParam?: string;
+  memberId?: number
 }
 
 const MainNav: React.FC<MainNavPropsType> = (props) => {
-  const { menuData, pathname, type, shopId, shopUrlParam } = props
+  const { menuData, pathname, type, shopId, memberId, shopUrlParam } = props
 
   const getNavLink = (item) => {
     switch (type) {
       case LAYOUT_TYPE.shop:
         return `${item.path}?shopId=${shopUrlParam}`
       case LAYOUT_TYPE.channel:
-        return `${item.path}?id=${shopUrlParam}`
+        return `${item.path}?channelId=${shopUrlParam}`
       default:
         return item.path
     }
@@ -30,7 +31,7 @@ const MainNav: React.FC<MainNavPropsType> = (props) => {
   return (
     <div className={cx(styles.main_nav, type === LAYOUT_TYPE.shop ? styles.shop : "")}>
       <div className={styles.main_nav_container}>
-        <Category type={type} shopId={shopId} shopUrlParam={shopUrlParam} />
+        <Category type={type} shopId={shopId} memberId={memberId} shopUrlParam={shopUrlParam} />
         <ul className={styles.nav}>
           {
             menuData && menuData.map(item => !item.hide && (

src/pages/lxMall/layouts/LXChannelLayout.tsx

@@ -28,7 +28,7 @@ interface LXMallLayoutPropsType {
 const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
   const { children, location } = props
   const [templateName] = useState<string>('theme-channel-science')
-  const { id } = location.query
+  const { channelId } = location.query
   const [shopInfo, setShopInfo] = useState<GetTemplateChannelFindChannelResponse>()
   const [query, setQuery] = useState<any>({})
 
@@ -42,7 +42,7 @@ const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
   const menuRouter = getMenuRouter(menuData, location.pathname)
 
   useEffect(() => {
-    let queryParam = id ? atob(id) : undefined
+    let queryParam = channelId ? atob(channelId) : undefined
     queryParam = queryParam ? JSON.parse(queryParam) : {}
     setQuery(queryParam)
   }, [])
@@ -68,7 +68,7 @@ const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
   useEffect(() => {
     let body = document.getElementsByTagName('body')[0];
     if (shopInfo) {
-      body.className = shopInfo.fileName ? `theme-shop-${shopInfo.fileName}` : templateName;
+      body.className = shopInfo.fileName ? `theme-channel-${shopInfo.fileName}` : templateName;
     } else {
       body.className = templateName
     }
@@ -81,8 +81,8 @@ const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
         {
           !menuRouter?.hideHeader && (
             <>
-              <ChannelHeader id={query.shopId} shopUrlParam={id} shopInfo={shopInfo} />
-              <MainNav menuData={menuData} pathname={location.pathname} type={LAYOUT_TYPE.channel} shopId={query.shopId} shopUrlParam={id} />
+              <ChannelHeader id={query.shopId} shopUrlParam={channelId} shopInfo={shopInfo} />
+              <MainNav menuData={menuData} pathname={location.pathname} type={LAYOUT_TYPE.channel} memberId={query.memberId} shopId={query.shopId} shopUrlParam={channelId} />
             </>
           )
         }
@@ -93,7 +93,7 @@ const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
                 layoutType: LAYOUT_TYPE.channel,
                 shopId: query.shopId,
                 memberId: query.memberId,
-                shopUrlParam: id,
+                shopUrlParam: channelId,
                 shopInfo
               },
             );
@@ -101,7 +101,7 @@ const LXChannelLayout: React.FC<LXMallLayoutPropsType> = (props) => {
         }
       </div>
       <Footer />
-      <SideNav type={LAYOUT_TYPE.channel} shopUrlParam={id} />
+      <SideNav type={LAYOUT_TYPE.channel} shopUrlParam={channelId} />
     </div>
   )
 }