@conecli/cone-render 0.8.18 → 0.8.19-beta.0

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

@@ -1 +1 @@
-import Taro from '@tarojs/taro'
        inViewCallback
    if (isH5AndJdShopView) {
        useEffect(() => {
            const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
            !componentShowStateRef.current && dealPageScrollInfo(latestRes)
            Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
                !componentShowStateRef.current && dealPageScrollInfo(res)
            })
        }, [])
        useEffect(() => {
            if(componentShowState){
                typeof inViewCallback === 'function' && inViewCallback()
                console.log('InViewRender -- 店铺H5 展示啦!')
            }
        }, [componentShowState])
        
        const dealPageScrollInfo = (res) => {
            if (componentLazyRef.current) {
                const eleClientRect =
                    componentLazyRef.current.getBoundingClientRect()
                const getContainerHeightOffSetY = res.displayHeight + res.offSetY
                const eleOffsetTop = Math.ceil(eleClientRect.top)
                if (!componentShowStateRef.current) {
                    if (getContainerHeightOffSetY > eleOffsetTop) {
                        componentShowStateRef.current = true
                        setComponentShowState(true)
                        Taro.nextTick(() => {
                            setComponentRenderShowState(true)
                        })
                    }
                }
            }
        }
        return (
            <View
                ref={componentLazyRef}
                className={classNames(
                    lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
                    'd-app-floor-lazy-load',
                )}
                style={{
                    minHeight: `${
                        componentRenderShowState ? 'auto' : height + (typeof height === 'number'? 'px': '')
                    }`,
                    backgroundColor: componentRenderShowState
                        ? 'transparent'
                        : '#ffffff',
                }}
            >
                {componentShowState ? children : placeholder}
            </View>
        )
    } else {
        const rootDom = document.querySelector('#J_shopHomeRoot')
        const { ref, inView } = useInView({
            threshold: 0,
            triggerOnce: true,
            root: rootDom,    
            rootMargin: `0px 0px 0px 0px`,  
        })
        useEffect(() => {
            if(inView){
                typeof inViewCallback === 'function' && inViewCallback()
                console.log('InViewRender -- 其它H5 展示啦!')
            }
        }, [inView])
        return (
            <View
                ref={ref}
                style={{
                    minHeight: `${inView ? 'auto' : height + 'px'}`,
                    backgroundColor: 'transparent',
                }}
            >
                {inView ? children : placeholder}
            </View>
        )
    }
    inViewCallback: null,
+import Taro from '@tarojs/taro'
    TaroEventType,
    const {
        children,
        placeholder,
        height,
        inViewCallback
    } = props
    const [componentShowState, setComponentShowState] = useState(false)
    const [componentRenderShowState, setComponentRenderShowState] =
        useState(false)
    const componentLazyRef = useRef<HTMLElement | null>(null)
    const componentShowStateRef = useRef(false)
    if (isH5AndJdShopView) {
        useEffect(() => {
            const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
            !componentShowStateRef.current && dealPageScrollInfo(latestRes)
            Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
                !componentShowStateRef.current && dealPageScrollInfo(res)
            })
        }, [])
        useEffect(() => {
            if (componentShowState) {
                typeof inViewCallback === 'function' && inViewCallback()
                console.log('InViewRender -- 店铺H5 展示啦!')
            }
        }, [componentShowState])
        
        const dealPageScrollInfo = (res) => {
            if (componentLazyRef.current) {
                const eleClientRect =
                    componentLazyRef.current.getBoundingClientRect()
                const getContainerHeightOffSetY = res.displayHeight + res.offSetY
                const eleOffsetTop = Math.ceil(eleClientRect.top)
                if (!componentShowStateRef.current) {
                    if (getContainerHeightOffSetY > eleOffsetTop) {
                        componentShowStateRef.current = true
                        setComponentShowState(true)
                        Taro.nextTick(() => {
                            setComponentRenderShowState(true)
                        })
                    }
                }
            }
        }
        return (
            <View
                ref={componentLazyRef}
                className={classNames(
                    lazyLayoutLoadStyle['d-app-floor-lazy-layout-load'],
                    'd-app-floor-lazy-load',
                )}
                style={{
                    minHeight: `${componentRenderShowState ? 'auto' : height + (typeof height === 'number' ? 'px' : '')
                        }`,
                    backgroundColor: componentRenderShowState
                        ? 'transparent'
                        : '#ffffff',
                }}
            >
                {componentShowState ? children : placeholder}
            </View>
        )
    } else {
        const rootDom = document.querySelector('#J_shopHomeRoot')
        const { ref, inView } = useInView({
            threshold: 0,
            triggerOnce: true,
            root: rootDom || null,    
            rootMargin: `0px 0px 0px 0px`,  
        })
        useEffect(() => {
            if (inView) {
                typeof inViewCallback === 'function' && inViewCallback()
                console.log('InViewRender -- 其它H5 展示啦!')
            }
        }, [inView])
        return (
            <View
                ref={ref}
                style={{
                    minHeight: `${inView ? 'auto' : height + 'px'}`,
                    backgroundColor: 'transparent',
                }}
            >
                {inView ? children : placeholder}
            </View>
        )
    }
    children: null, 
    placeholder: null, 
    height: 1, 
    className: '',
    lazyNodeClassName: '',
    inViewCallback: null,

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

@@ -1 +1 @@
-export const NetWorkTypeQuality = {
+export const NetWorkTypeQuality = {

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)
        })
    
        
            <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)
    useEffect(() => {
        const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
        !componentShowStateRef.current && dealPageScrollInfo(latestRes)
        Taro.eventCenter.on(TaroEventType.PAGE_SCROLL, (res) => {
            !componentShowStateRef.current && dealPageScrollInfo(res)
        })
    
            <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}
            />
        )

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

@@ -52,6 +52,15 @@
 				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,

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

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

package/dist/interface/component.ts

@@ -1 +1 @@
-import React from 'react'
    containerIndex?: number
    containerData?: any
    shopTotalInfo?: any
    selectContainerFn?: Function
    selectContainerId?: string
    placeHolderPreContainerId?: string
    children?: any
    style?: {
      [key: string]: any
    };
    layoutLeftRightMargin?: number
  }
+import React from 'react'
    customErrorIsvFloorModule?: React.ReactElement | undefined
    containerIndex?: number
    containerData?: any
    shopTotalInfo?: any
    selectContainerFn?: Function
    selectContainerId?: string
    placeHolderPreContainerId?: string
    children?: any
    style?: {
      [key: string]: any
    };
    layoutLeftRightMargin?: number
  }

package/dist/jumpEventReport/base.ts

@@ -1 +1 @@
-import Taro from '@tarojs/taro'
+import Taro from '@tarojs/taro'

package/dist/jumpEventReport/const.ts

@@ -1 +1 @@
-import { isH5 } from '../utils'
+import { isH5 } from '../utils'

package/dist/jumpEventReport/index.ts

@@ -1 +1 @@
-import Taro from '@tarojs/taro'
+import Taro from '@tarojs/taro'

package/dist/jumpEventReport/index.weapp.ts

@@ -1 +1 @@
-import Taro from '@tarojs/taro'
        console.log('京购商详页跳转：', this.jumpMiniPath.detail)
            if(global){
                if(global.miniAppLogInstance){
                }else{
                    console.log('global.miniAppLogInstance为空！')
                }
            }else{
                console.log('global为空！')
            }
+import Taro from '@tarojs/taro'
        console.log('京购商详页跳转：', this.jumpMiniPath.detail)
            if(global){
                if(global.miniAppLogInstance){
                }else{
                    console.log('global.miniAppLogInstance为空！')
                }
            }else{
                console.log('global为空！')
            }

package/dist/jumpEventReport/jdJumpJdApp.ts

@@ -1 +1 @@
-import Taro from '@tarojs/taro'
+import Taro from '@tarojs/taro'

package/dist/jumpEventReport/web.base.ts

@@ -1 +1 @@
-import global from '../common'
+import global from '../common'

package/dist/jumpEventReport/web.jd.ts

@@ -1 +1 @@
-import { JdJumpJdApp } from './jdJumpJdApp'
+import { JdJumpJdApp } from './jdJumpJdApp'

package/dist/jumpEventReport/web.wxapp.ts

@@ -1 +1 @@
-import global from '../common'
        console.log('window.shopGlobalSwitch:', JSON.stringify(window.shopGlobalSwitch))
                console.log('进入了 isH5AndJingGouMini && this.isH5OpenToWxapp 的if')
                        this.jingGouMiniState = true
                        window.isJingGouMiniViewState = true
                        console.log('进入了 iwx?.miniProgram then ')
                        global.info.isJingGouMiniViewState = true
                        if (location.pathname == '/shop/home') {
                            const getQueryData = parseQueryUrlString(
                                location.search,
                            )
                            this.jdJumpToShopHome({
                                ...getQueryData,
                                type: 'redirectTo',
                            })
                        }
                console.log('进入了 isH5AndJingGouMini && this.isH5OpenToWxapp 的esle')
            }
+import global from '../common'
        console.log('window.shopGlobalSwitch:', JSON.stringify(window.shopGlobalSwitch))
                console.log('进入了 isH5AndJingGouMini && this.isH5OpenToWxapp 的if')
                        this.jingGouMiniState = true
                        window.isJingGouMiniViewState = true
                        console.log('进入了 iwx?.miniProgram then 但是没有继续跳转的逻辑 ')
                        global.info.isJingGouMiniViewState = true
                console.log('进入了 isH5AndJingGouMini && this.isH5OpenToWxapp 的esle')
            }