@conecli/cone-render 0.8.20 → 0.8.21-shop-beta.3

package/dist/components/base/LazyLoadImage/index.h5.tsx

@@ -1 +1 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react'
    const [componentShowState, setComponentShowState] = useState(false)
    const componentLazyRef = useRef<HTMLElement | null>(null)
    const componentShowStateRef = useRef(false)
    useEffect(() => {
        const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
        !componentShowStateRef.current && dealPageScrollInfo(latestRes)
        Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
            !componentShowStateRef.current && dealPageScrollInfo(res)
        })
    
    if (typeof displayHeight === 'undefined' || typeof offSetY === 'undefined') return
            <View
                ref={componentLazyRef}
                className={classNames(
                    imageStyle['d-app-lazy-image'],
                    {
                        [imageStyle['d-lazy-sku-image']]: isSkuImage,
                    },
                    {
                        [imageStyle['d-hide-image-error']]: imageErrState,
                    },
                    {
                        [imageStyle['d-load-completed']]: loadSuccess,
                    },
                    {
                        'd-imag-rendering-crisp-edges':
                            !taroJdBaseInfo.info.pageInfo.isVipShop &&
                            imagRenderingSet,
                    },
                    'J_html5ImageBg',
                    className,
                )}
                style={{
                    ...style,
                    ...changeStyleIncludeWidthAndHeightAndBgColor(),
            >
                {(componentShowState || lazyLoad === false) && <img
                    src={getQualityImage(
                        imgSrc,
                        taroJdBaseInfo.info.pageInfo.isVipShop
                            ? NetWorkTypeQuality['perfect']
                            : NetWorkTypeQuality[getNetWorkType],
                    )}
                    onLoad={imageLoad.bind(this, imgSrc)}
                    onError={imageError}
                />}
            </View>
        ) : (
            <Image
                style={{
                    ...style,
                    ...changeStyleIncludeWidthAndHeightAndBgColor(),
                }}
                className={classNames(
                    imageStyle['d-lazy-image'],
                    {
                        [imageStyle['d-lazy-sku-image']]: isSkuImage,
                    },
                    {
                        [imageStyle['d-hide-image-error']]: imageErrState,
                    },
                    {
                        [imageStyle['d-load-completed']]: loadSuccess,
                    },
                    {
                        'd-imag-rendering-crisp-edges': imagRenderingSet,
                    },
                    className,
                )}
                src={getQualityImage(
                    imgSrc,
                    NetWorkTypeQuality[getNetWorkType],
                )}
                lazyLoad={lazyLoad}
                onError={imageError}
                onLoad={imageLoad.bind(this, imgSrc)}
                {...otherOption}
            />
        )
+import React, { useCallback, useEffect, useRef, useState } from 'react'
  const [componentShowState, setComponentShowState] = useState(false)
    const componentLazyRef = useRef<HTMLElement | null>(null)
    const componentShowStateRef = useRef(false)
  const needShowHighVersion = isH5AndJdShopViewH5Scroll && !(global.info.queryInfo?.downgraded && global.info.queryInfo.downgraded === "true")
    useEffect(() => {
        if(needShowHighVersion) return
        const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
        !componentShowStateRef.current && dealPageScrollInfo(latestRes)
        Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
            !componentShowStateRef.current && dealPageScrollInfo(res)
        })
    
    if (typeof displayHeight === 'undefined' || typeof offSetY === 'undefined') return
            <View
                ref={ componentLazyRef }
                className={classNames(
                    imageStyle['d-app-lazy-image'],
                    {
                        [imageStyle['d-lazy-sku-image']]: isSkuImage,
                    },
                    {
                        [imageStyle['d-hide-image-error']]: imageErrState,
                    },
                    {
                        [imageStyle['d-load-completed']]: loadSuccess,
                    },
                    {
                        'd-imag-rendering-crisp-edges':
                            !taroJdBaseInfo.info.pageInfo.isVipShop &&
                            imagRenderingSet,
                    },
                    'J_html5ImageBg',
                    className,
                )}
                style={{
                    ...style,
                    ...changeStyleIncludeWidthAndHeightAndBgColor(),
            >
                {(componentShowState || lazyLoad === false) && <img
                    src={getQualityImage(
                        imgSrc,
                        taroJdBaseInfo.info.pageInfo.isVipShop
                            ? NetWorkTypeQuality['perfect']
                            : NetWorkTypeQuality[getNetWorkType],
                    )}
                    onLoad={imageLoad.bind(this, imgSrc)}
                    onError={imageError}
                />}
            </View>
        ) : (
            <Image
                style={{
                    ...style,
                    ...changeStyleIncludeWidthAndHeightAndBgColor(),
                }}
                className={classNames(
                    imageStyle['d-lazy-image'],
                    {
                        [imageStyle['d-lazy-sku-image']]: isSkuImage,
                    },
                    {
                        [imageStyle['d-hide-image-error']]: imageErrState,
                    },
                    {
                        [imageStyle['d-load-completed']]: loadSuccess,
                    },
                    {
                        'd-imag-rendering-crisp-edges': imagRenderingSet,
                    },
                    className,
                )}
                src={getQualityImage(
                    imgSrc,
                    NetWorkTypeQuality[getNetWorkType],
                )}
                lazyLoad={isChartH5 ? false : lazyLoad}
                onError={imageError}
                onLoad={imageLoad.bind(this, imgSrc)}
                {...otherOption}
            />
        )

package/dist/components/base/NetworkDataError/const.ts

@@ -1 +1 @@
-import { NETWORK_DATA_TYPE } from '../../../common/const'
+import { NETWORK_DATA_TYPE } from '../../../common/const'
  [NETWORK_DATA_TYPE.NO_NET_WORK]: '网络连接已断开',
  [NETWORK_DATA_TYPE.DATA_ERROR]: '数据加载失败',
  [NETWORK_DATA_TYPE.NO_DATA]: '你访问的内容飞到太空了', 
  [NETWORK_DATA_TYPE.RISK]: '活动太火爆',
  [NETWORK_DATA_TYPE.NO_NET_WORK]: '请检查您的网络设置',
  [NETWORK_DATA_TYPE.DATA_ERROR]: '请稍后重试',
  [NETWORK_DATA_TYPE.NO_DATA]: '', 
  [NETWORK_DATA_TYPE.RISK]: '页面加载失败，请稍后再试',
  NETWORK_DATA_TYPE.NO_NET_WORK,
  NETWORK_DATA_TYPE.DATA_ERROR,
  NETWORK_DATA_TYPE.NO_DATA,
  NETWORK_DATA_TYPE.RISK,
  No_Data_Bmall:'no-data-bmall',

package/dist/components/base/NetworkDataError/index.module.scss

@@ -30,6 +30,7 @@
 		height: 320px;
 		background-size: contain;
 		background-repeat: no-repeat;
+    margin: 0 auto;
 	}
 
 	.d-no-network {
@@ -40,7 +41,9 @@
 	.d-data-error {
 		background-image: url('https://m.360buyimg.com/imagetools/jfs/t1/106708/34/36128/37234/64896f52Fed1530e0/7b403e068aae316c.png');
 	}
-
+  .d-risk {
+    background-image: url('https://m.360buyimg.com/imagetools/jfs/t1/106708/34/36128/37234/64896f52Fed1530e0/7b403e068aae316c.png');
+  }
 	.d-no-data {
 		background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/190994/19/325/42717/6088fed0Ec4b502d5/0e8de7593fb0d06c.png');
 	}
@@ -50,6 +53,9 @@
 	.d-no-network-err-tip {
 		background-image: url('https://img14.360buyimg.com/imagetools/jfs/t1/146556/1/17745/7493/5fd1e62dE86e86669/96f5c91befa8e991.png');
 	}
+  .d-no-data-bmall {
+    background-image: url('https://img12.360buyimg.com/imagetools/jfs/t1/217798/34/32933/150484/64ccadf3Fde1a93bf/9b1b8929a9631469.png');
+  }
 	
 	.d-opt-btn {
         display: flex;

package/dist/components/base/NetworkDataError/index.tsx

@@ -1 +1 @@
-import { Button, View } from '@tarojs/components'
    NetWorkErrorSubTip,
        subMessage,
    backgroundColorWhite,
    const useErrorTip = message != '' ? message : NetWorkErrorTip[netWorkDataType]
    const useErrorSubTip = subMessage? subMessage: NetWorkErrorSubTip[netWorkDataType]
    const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
    const maxHeight = latestRes.displayHeight || 546   
            style={{maxHeight}}
                {useErrorSubTip? <View className={netWorkErrorStyle['d-error-sub-tip']}>{useErrorSubTip}</View>: null}
                        <Button
                            onClick={refershInitData}
                            className={classNames(
                                netWorkErrorStyle['d-opt-btn'],
                                'd-button-no-border',
                            )}
                            plain
                            size="mini"
                        >
                            重新加载
                        </Button>
                    )}
    subMessage: '',
+import { Button, View } from '@tarojs/components'
    NetWorkErrorSubTip,
        subMessage,
    backgroundColorWhite,
    const useErrorTip = message != '' ? message : NetWorkErrorTip[netWorkDataType]
    const useErrorSubTip = subMessage? subMessage: NetWorkErrorSubTip[netWorkDataType]
    const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
    const maxHeight = latestRes.displayHeight || 546   
            style={{maxHeight: isMemberPage ? '100vh' : maxHeight}}
                {useErrorSubTip? <View className={netWorkErrorStyle['d-error-sub-tip']}>{useErrorSubTip}</View>: null}
                        <Button
                            onClick={refershInitData}
                            className={classNames(
                                netWorkErrorStyle['d-opt-btn'],
                                'd-button-no-border',
                            )}
                            plain
                            size="mini"
                        >
                            重新加载
                        </Button>
                    )}
    subMessage: '',

package/dist/components/base/Price/Base/index.module.scss

@@ -0,0 +1,136 @@
+
+:global {
+  .d-mini-price {
+    position: relative;
+    color: #f23030;
+    display: inline-block;
+    font-family: 'JDZhengHT-Regular';
+
+    &-sym {
+      font-size: 22px;
+    }
+
+    .int-txt {
+      font-size: 36px;
+    }
+    .off-shelf {
+      color: rgb(162, 164, 172);
+    }
+
+    .dec-txt {
+      font-size: 22px;
+    }
+
+    .sym-sup {
+      vertical-align: top;
+    }
+
+    .dec-sup {
+      vertical-align: top;
+    }
+
+    &.del {
+      .sym-sub,
+      .int-txt,
+      .dec-txt {
+        font-size: 22px;
+        color: #2e2e2e;
+        text-decoration: line-through;
+      }
+    }
+    &.d-plus-price,
+    &.d-sams-price,
+    &.d-sfp-price,
+    &.d-member-price {
+      &:after {
+        content: '';
+        display: inline-block;
+        margin-left: 5px;
+        width: 58px;
+        height: 20px;
+        background-repeat: no-repeat;
+        background-size: contain;
+      }
+    }
+    &.d-price-label {
+      &:after {
+        // 价格后面追加显示文案例如“到手价”的默认样式
+        content: attr(data-after);
+        font-size: 20px;
+        color: #ffffff;
+        margin-left: 8px;
+      }
+    }
+    &.d-plus-price {
+      .int-txt,
+      .sym-sub,
+      .dec-txt {
+        font-size: 24px;
+        color: #232326;
+      }
+      &:after {
+        background-image: url('../../../../assets/plus-icon.png');
+      }
+    }
+    &.d-sams-price {
+      .int-txt,
+      .sym-sub,
+      .dec-txt {
+        font-size: 24px;
+        color: #1a68bc;
+      }
+      &:after {
+        background-image: url('../../../../assets/jsbundles_jdreactshopactivitytab_images_samprice.png');
+      }
+    }
+    &.d-sfp-price {
+      .int-txt,
+      .sym-sub,
+      .dec-txt {
+        font-size: 24px;
+        color: #714aff;
+      }
+      &:after {
+        background-image: url('../../../../assets/fans_price@2x.png');
+      }
+    }
+    &.d-member-price {
+      .int-txt,
+      .sym-sub,
+      .dec-txt {
+        font-size: 24px;
+        color: #f3c416;
+      }
+      // 默认v1会员
+      &:after {
+        background-image: url('https://m.360buyimg.com/cc/jfs/t1/132940/18/11320/4920/5f770610E07069747/92f14ae503ca8b7b.png');
+      }
+      // v1 会员
+      &.d-member-price-tab_214 {
+        &:after {
+          background-image: url('https://m.360buyimg.com/cc/jfs/t1/132940/18/11320/4920/5f770610E07069747/92f14ae503ca8b7b.png');
+        }
+      }
+      &.d-member-price-tab_215 {
+        &:after {
+          background-image: url('https://m.360buyimg.com/cc/jfs/t1/135428/5/11263/5100/5f770623E87b73485/a3624a844f220489.png');
+        }
+      }
+      &.d-member-price-tab_216 {
+        &:after {
+          background-image: url('https://m.360buyimg.com/cc/jfs/t1/142590/8/9888/5220/5f770639E992a10a9/1decbf1689dd500c.png');
+        }
+      }
+      &.d-member-price-tab_217 {
+        &:after {
+          background-image: url('https://m.360buyimg.com/cc/jfs/t1/128048/23/13979/5063/5f77064aE56b826d7/5e07702ee673629d.png');
+        }
+      }
+      &.d-member-price-tab_218 {
+        &:after {
+          background-image: url('https://m.360buyimg.com/cc/jfs/t1/117816/19/19334/5167/5f77065eEbd592fb5/75091c85ca7d0895.png');
+        }
+      }
+    }
+  }
+}

package/dist/components/base/Price/Base/index.tsx

@@ -0,0 +1 @@
+import React from 'react'
  priceLabelText: "到手价" 

package/dist/components/base/Price/Double/index.module.scss

@@ -0,0 +1,158 @@
+.wrap {
+  overflow: hidden;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: baseline;
+  line-height: 0; // 这个是保障不同平台（IOS、Android），不同font-size下多个行内元素文案底部还能对齐的基石
+}
+.childStyle {
+  transform: translateY(50%);
+}
+.bigStyle {
+  color: #fa2c19;
+}
+
+.bigNoPrice {
+  font-family: PingFang SC;
+}
+.bigNoPriceXL {
+  font-size: 48px;
+}
+.bigNoPriceL {
+  font-size: 42px;
+}
+.bigNoPriceM {
+  font-size: 36px;
+}
+.bigNoPriceS {
+  font-size: 30px;
+}
+.bigNoPriceXS {
+  font-size: 24px;
+}
+
+.bigSymbol {
+  font-family: JDZhengHT-Regular;
+}
+.bigSymbolXL {
+  font-size: 28px;
+}
+.bigSymbolL {
+  font-size: 26px;
+}
+.bigSymbolM {
+  font-size: 24px;
+}
+.bigSymbolS {
+  font-size: 22px;
+}
+.bigSymbolXS {
+  font-size: 20px;
+}
+
+.bigInteger {
+  font-family: JDZhengHT-Regular;
+}
+.bigIntegerXL {
+  font-size: 52px;
+}
+.bigIntegerL {
+  font-size: 46px;
+}
+.bigIntegerM {
+  font-size: 40px;
+}
+.bigIntegerS {
+  font-size: 34px;
+}
+.bigIntegerXS {
+  font-size: 28px;
+}
+
+.bigDecimal {
+  font-family: JDZhengHT-Regular;
+}
+
+.bigDecimalXL {
+  font-size: 28px;
+}
+.bigDecimalL {
+  font-size: 26px;
+}
+.bigDecimalM {
+  font-size: 24px;
+}
+.bigDecimalS {
+  font-size: 22px;
+}
+.bigDecimalXS {
+  font-size: 20px;
+}
+
+.priceDesc {
+  margin-left: 4px;
+  font-family: PingFang SC;
+}
+.priceDescXL {
+  font-size: 28px;
+}
+.priceDescL {
+  font-size: 26px;
+}
+.priceDescM {
+  font-size: 24px;
+}
+.priceDescS {
+  font-size: 22px;
+}
+.priceDescXS {
+  font-size: 20px;
+}
+
+.missPriceDesc {
+}
+.smallStyle {
+  color: #8c8c8c;
+}
+
+.smallPrice {
+  font-family: JDZhengHT-Regular;
+}
+.smallPriceXL {
+  font-size: 28px;
+}
+.smallPriceL {
+  font-size: 26px;
+}
+.smallPriceM {
+  font-size: 24px;
+}
+.smallPriceS {
+  font-size: 22px;
+}
+.smallPriceXS {
+  font-size: 20px;
+}
+
+.rightMargin {
+  margin-right: 16px;
+}
+.plusStyle {
+  color: #1c4b8c;
+}
+.fansStyle {
+  color: #8450e5;
+}
+.samStyle {
+  color: #3981e5;
+}
+.studentStyle {
+  color: #30bf26;
+}
+.yhdStyle {
+  color: #674431;
+}
+.memberStyle {
+  color: #f6b303;
+}

package/dist/components/base/Price/Double/index.tsx

@@ -0,0 +1 @@
+import React from 'react';
    const result = String(strPrice).match(/(-?\d+)\.?(\d+)?/);
    if(result && Number(result[0]) > 0){
        return {
            integerPrice: result[1],
            decimalPrice: (result[2] || '').replace(/0+$/, '')  
        }
    }else{
        return null;
    }
    const {
        jdPrice,    
        finalPrice, 
        priceText = '',   
        priceType, 
        hitUserIdentity = false,    
        isAuctionWare,  
        fallbackRender = null, 
        className = null,   
        style = {}, 
        childrenClassName = null,   
        bigNoPriceClassName = null, 
        bigSymbolClassName = null, 
        bigIntegerClassName = null, 
        bigDecimalClassName = null, 
        priceDescClassName = null, 
        smallPriceClassName = null, 
        lineNumber = 1,  
        size = 'M'  
    } = props
    const especialHitStyleType = {
        7: 'plusStyle',
        9: 'samStyle'
    }
    const especialMissStyleType = {
        7: 'plusStyle',
        8: 'fansStyle',
        9: 'samStyle',
        10: 'studentStyle',
        12: 'yhdStyle',
        13: 'memberStyle'
    }
    const isNoPrice = priceType === 4 
    const isUseFinalPriceAsBigPrice = [1, 2, 6, 14, 16, 17, 18].includes(priceType)    
    const isEquivalentHit = isUseFinalPriceAsBigPrice || hitUserIdentity    
    const bigPriceObj = getDeconstructPrice(isEquivalentHit? finalPrice: jdPrice)
    if(isAuctionWare || (!isNoPrice && bigPriceObj === null)){
        return fallbackRender
    }
    const {integerPrice, decimalPrice = ''} = bigPriceObj || {}
    const isOnlyShowBigPrice = priceType === 3    
    const isHideSmallPrice = priceType === 14   
    const smallPrice = isEquivalentHit? jdPrice: finalPrice 
    const isPriceDescInFront = isEquivalentHit  
    const hitColorStyle = isEquivalentHit? styles[especialHitStyleType[priceType]]: null    
    const missColorStyle = isEquivalentHit? null: styles[especialMissStyleType[priceType]]    
    const isBigPriceHasDecimal = decimalPrice !== '' && !/^0+$/.test(decimalPrice)    
    const sizeLineHeight = {
        'XS': 28,
        'S': 34,
        'M': 40,
        'L': 46,
        'XL': 52
    }
    const lineHeight = Taro.pxTransform(sizeLineHeight[size] * 1.25)
    const wrapHeight = Taro.pxTransform(sizeLineHeight[size] * 1.25 * lineNumber)
    const computedHeightStyle = {
        height: wrapHeight
    }
    const itemCommonStyle = {
        height: lineHeight
    }
    const needSizeStyles = ['bigNoPrice', 'bigSymbol', 'bigInteger', 'bigDecimal', 'priceDesc', 'smallPrice']
    const sizeStyles = needSizeStyles.reduce((acc, cur) => {
        acc[cur] = styles[cur + size]
        return acc
    }, {})
    const noPriceShowText = priceText || (/^[\u4e00-\u9fa5]+$/.test(jdPrice)? jdPrice: '')  
    return (
        <View className={classNames(styles.wrap, className)} style={{...computedHeightStyle, ...style}}>
            {isNoPrice?
                <Text className={classNames(styles.childStyle, styles.bigStyle, styles.bigNoPrice, sizeStyles['bigNoPrice'], childrenClassName, bigNoPriceClassName)} style={{...itemCommonStyle}}>{noPriceShowText}</Text>
                :
                [
                    <Text className={classNames(styles.childStyle, styles.bigStyle, styles.bigSymbol, sizeStyles['bigSymbol'], hitColorStyle, childrenClassName, bigSymbolClassName)} key="bigSymbol" style={{...itemCommonStyle}}>¥</Text>,
                    <Text className={classNames(styles.childStyle, styles.bigStyle, styles.bigInteger, sizeStyles['bigInteger'], hitColorStyle, !isOnlyShowBigPrice && !isBigPriceHasDecimal && !isPriceDescInFront ? styles.rightMargin : null, childrenClassName, bigIntegerClassName)} key="bigInteger" style={{...itemCommonStyle}}>{integerPrice}</Text>,
                    isBigPriceHasDecimal?
                        <Text className={classNames(styles.childStyle, styles.bigStyle, styles.bigDecimal, sizeStyles['bigDecimal'], hitColorStyle, isPriceDescInFront ? null : styles.rightMargin, childrenClassName, bigDecimalClassName)} key="bigDecimal" style={{...itemCommonStyle}}>.{decimalPrice}</Text>
                        :
                        null
                    ,
                    !isOnlyShowBigPrice && [
                        isPriceDescInFront && <Text className={classNames(styles.childStyle, styles.priceDesc, sizeStyles['priceDesc'], styles.bigStyle, hitColorStyle, isPriceDescInFront ? styles.rightMargin : null, childrenClassName, priceDescClassName)} key="descFront" style={{...itemCommonStyle}}>{priceText}</Text>,
                        smallPrice && !isHideSmallPrice ? <Text className={classNames(styles.childStyle, styles.smallPrice, sizeStyles['smallPrice'], styles.smallStyle, missColorStyle, childrenClassName, smallPriceClassName)} key="smallPrice" style={{...itemCommonStyle}}>¥{smallPrice}</Text> : null,
                        !isPriceDescInFront && <Text className={classNames(styles.childStyle, styles.priceDesc, sizeStyles['priceDesc'], styles.smallStyle, styles.missPriceDesc, missColorStyle, childrenClassName, priceDescClassName)} key="descBack" style={{...itemCommonStyle}}>{priceText}</Text>
                    ]
                ]
            }
        </View>
    )

package/dist/components/base/Price/index.tsx

@@ -1 +1 @@
-import React from 'react'
  priceLabelText: "到手价" 
+import React from 'react'
        <BasePrice {...props}/>
        :
        <DoublePrice {...props} />

package/dist/components/decorate/DecorateFloorModule/index.tsx

@@ -1 +1 @@
-import { View } from '@tarojs/components'
    selectContainerId,
    placeHolderPreContainerId,
    containerData,
    children,
    style,
    shopTotalInfo,
  } = props;
    return children ? children : null;
  }, [containerData, shopTotalInfo]);
+import { View } from '@tarojs/components'
    selectContainerId,
    placeHolderPreContainerId,
    containerData,
    children,
    style,
    shopTotalInfo,
  } = props;
    return children ? children : null;
  }, [containerData, shopTotalInfo]);
      data-container-empty={containerData?.floors?.[0]?.configEmpty || 'false'}