@conecli/cone-render 0.10.1-beta.4 → 0.10.1-beta.5

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

@@ -1 +1 @@
-import React, {useEffect, useRef} from 'react'
  const { title, openAppParams, style, hasCommonHeader = true, hasDownloadTips = true, headerParams } = props
  const headerRef:any = useRef(null)
  useEffect(() => {
    hasCommonHeader && initCommonHeader()
    hasDownloadTips && initDownloadAppLayerConfigData()
  }, [])
  const scrollEventFunc = () => {
    const stickyTop = headerRef.current?.getBoundingClientRect()?.top || 0;
    const rootScrollEleNode = document.querySelector('#J_shopHomeRoot')
    if (rootScrollEleNode && rootScrollEleNode.scrollTop > stickyTop) {
      headerRef.current.classList.add('d-mobile-header-sticky');
    } else {
      headerRef.current.classList.remove('d-mobile-header-sticky');
    }
  }
  useEffect(() => {
    if(!headerRef.current) return
    const rootScrollEleNode = document.querySelector('#J_shopHomeRoot')
    rootScrollEleNode && rootScrollEleNode.addEventListener('scroll', scrollEventFunc);
    return () => {
      rootScrollEleNode && rootScrollEleNode.removeEventListener('scroll', scrollEventFunc)
    }
  },[])
  const initCommonHeader = () => {
    if (window?.MCommonHeaderBottom) {
      const mchb = new MCommonHeaderBottom()
      const headerArg = {
        moduleName: 'shop',
        hrederId: 'm_common_header',
        title,
        stype: 1,
        onClickJdkey: function () {
          console.log('==>m_common_header jdkey click.')
        },
        ...headerParams
      }
      mchb.header(headerArg)
    }
  }
  const initDownloadAppLayerConfigData = () => {
    const getEle = document.getElementById('m_common_tip')
    getEle &&
      window.$ &&
      window.$.downloadAppLayerConfigData &&
      window.$.downloadAppLayerConfigData({
        tipId: 'm_common_tip',
        M_sourceFrom: 'jshop',
        bottom: 74,
        onClickTipX: () => {
          Taro.eventCenter.trigger(
            TaroEventType.DOWN_LOAD_APP_CLOSE_CHANGE,
            true,
          )
        },
        downloadAppPlugIn: {
          M_sourceFrom: 'jshop',
          openAppBtnId: 'download_openapp',
          downAppURl: '//conecli.com/downloadApp/download.html?channel=jd-m',
          inteneUrl: 'openapp.jdmobile://virtual?',
          inteneUrlParams: {
            category: 'jump',
            des: 'jshopMain',
            shopId: `${global.info.queryInfo.shopId || ''}`,
            venderId: `${global.info.queryInfo.venderId || ''}`,
            sourceType: global.info.queryInfo?.sourceType || 'M-H5',
            sourceValue: global.info.queryInfo?.sourceValue || 'Mshop',
            ...openAppParams,
          },
        },
      })
  }
  return !isWxMiniH5View && !isJdApp ? (
    <View
      className={mobileCommonHeaderStyle['d-mobile-header-layout']}
      style={style}
      ref={headerRef}
    >
      <View
        id="m_common_tip"
        className={mobileCommonHeaderStyle['d-mobile-common-tip']}
      />
      {hasCommonHeader && (
        <View
          id="m_common_header"
          className={mobileCommonHeaderStyle['d-mobile-common-header']}
        />
      )}
    </View>
  ) : null
  title: '店铺',
  openAppParams: {},
+import React, {useEffect, useRef} from 'react'
  const { title, openAppParams, style, hasCommonHeader = true, hasDownloadTips = true, headerParams } = props
  const headerRef:any = useRef(null)
  useEffect(() => {
    hasCommonHeader && initCommonHeader()
    hasDownloadTips && initDownloadAppLayerConfigData()
  }, [])
  const isScrolledToTop = () => {
    return window.scrollY !== undefined ? window.scrollY === 0 :
      document.documentElement.scrollTop === 0 || document.body.scrollTop === 0;
  }
  const scrollEventFunc = () => {
    if(!headerRef.current) return
    const stickyTop = headerRef.current?.getBoundingClientRect()?.top || 0;
    if(Math.trunc(stickyTop) <= 0 && !isScrolledToTop()) {
      console.log('scroll 添加class',Math.trunc(stickyTop), isScrolledToTop())
      headerRef.current.classList.add('d-mobile-header-sticky');
    }else {
      console.log('scroll 移除class',Math.trunc(stickyTop), isScrolledToTop())
      headerRef.current.classList.remove('d-mobile-header-sticky');
    }
  }
  useEffect(() => {
    Taro.eventCenter.on(TaroEventType.PAGE_SCROLL,() => {
      scrollEventFunc()
    })
  },[])
  const initCommonHeader = () => {
    if (window?.MCommonHeaderBottom) {
      const mchb = new MCommonHeaderBottom()
      const headerArg = {
        moduleName: 'shop',
        hrederId: 'm_common_header',
        title,
        stype: 1,
        onClickJdkey: function () {
          console.log('==>m_common_header jdkey click.')
        },
        ...headerParams
      }
      mchb.header(headerArg)
    }
  }
  const initDownloadAppLayerConfigData = () => {
    const getEle = document.getElementById('m_common_tip')
    getEle &&
      window.$ &&
      window.$.downloadAppLayerConfigData &&
      window.$.downloadAppLayerConfigData({
        tipId: 'm_common_tip',
        M_sourceFrom: 'jshop',
        bottom: 74,
        onClickTipX: () => {
          Taro.eventCenter.trigger(
            TaroEventType.DOWN_LOAD_APP_CLOSE_CHANGE,
            true,
          )
        },
        downloadAppPlugIn: {
          M_sourceFrom: 'jshop',
          openAppBtnId: 'download_openapp',
          downAppURl: '//conecli.com/downloadApp/download.html?channel=jd-m',
          inteneUrl: 'openapp.jdmobile://virtual?',
          inteneUrlParams: {
            category: 'jump',
            des: 'jshopMain',
            shopId: `${global.info.queryInfo.shopId || ''}`,
            venderId: `${global.info.queryInfo.venderId || ''}`,
            sourceType: global.info.queryInfo?.sourceType || 'M-H5',
            sourceValue: global.info.queryInfo?.sourceValue || 'Mshop',
            ...openAppParams,
          },
        },
      })
  }
  return !isWxMiniH5View && !isJdApp ? (
    <View
      className={mobileCommonHeaderStyle['d-mobile-header-layout']}
      style={style}
      ref={headerRef}
    >
      <View
        id="m_common_tip"
        className={mobileCommonHeaderStyle['d-mobile-common-tip']}
      />
      {hasCommonHeader && (
        <View
          id="m_common_header"
          className={mobileCommonHeaderStyle['d-mobile-common-header']}
        />
      )}
    </View>
  ) : null
  title: '店铺',
  openAppParams: {},

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

@@ -89,3 +89,6 @@
 	min-height: 500px;
 	background: #f2f2f2;
 }
+.d-shop-network-no-position {
+    position: static;
+}

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

@@ -1 +1 @@
-import { Button, View } from "@tarojs/components";
  NetWorkErrorList,
  NetWorkErrorTip,
  NetWorkErrorSubTip,
  NetWorkShowType,
  NetWork_Image_Type,
  const {
    className,
    message,
    subMessage,
    btnLabel,
    backgroundColorWhite,
    netWorkDataType,
    netWorkShowType,
    netWorkImageType,
    refreshCallBackFn,
    viewMaxHeight,
  } = props;
  const refershInitData = useCallback(() => {
    refreshCallBackFn && refreshCallBackFn(true);
  }, []);
  const useErrorTip =
    message != "" ? message : NetWorkErrorTip[netWorkDataType];
  const useErrorSubTip = subMessage
    ? subMessage
    : NetWorkErrorSubTip[netWorkDataType];
  const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {};
  const maxHeight = latestRes.displayHeight || 546; 
  return NetWorkErrorList.includes(netWorkDataType as NETWORK_DATA_TYPE) ? (
    <View
      style={{
        maxHeight:
          viewMaxHeight !== ""
            ? viewMaxHeight
            : isMemberPage || isAppStowShop
            ? "100vh"
            : maxHeight,
      }}
      className={classNames(
        netWorkErrorStyle["d-shop-network"],
        {
          [netWorkErrorStyle["d-shop-network-white"]]: backgroundColorWhite,
        },
        {
          [netWorkErrorStyle["d-shop-network-part"]]:
          netWorkShowType === NetWorkShowType.PART,
        },
        {
          [netWorkErrorStyle["d-network-jd-shop-view"]]: isH5AndJdShopView,
        },
        "flexible-center-box",
        className
      )}
    >
      <View
        className={classNames(
          netWorkErrorStyle["d-error-content"],
          "d-error-content"
        )}
      >
        <View
          className={classNames(
            netWorkErrorStyle["d-error-type"],
            netWorkErrorStyle[`d-${netWorkDataType}`],
            netWorkErrorStyle[`d-${netWorkImageType}`],
            "d-error-type"
          )}
        />
        <View
          className={classNames(
            netWorkErrorStyle["d-error-tip"],
            "d-error-tip"
          )}
        >
          {useErrorTip}
        </View>
        {useErrorSubTip ? (
          <View
            className={classNames(
              netWorkErrorStyle["d-error-sub-tip"],
              "d-error-sub-tip"
            )}
          >
            {useErrorSubTip}
          </View>
        ) : null}
        <View className={"flexible-horizontal-center-box"}>
          {refreshCallBackFn && (
            <Button
              onClick={refershInitData}
              className={classNames(
                netWorkErrorStyle["d-opt-btn"],
                "d-button-no-border",
                "d-opt-btn"
              )}
              plain
              size="mini"
            >
              {btnLabel}
            </Button>
          )}
        </View>
      </View>
    </View>
  ) : null;
  className: "",
  message: "",
  subMessage: "",
  btnLabel: "重新加载",
  backgroundColorWhite: false, 
  netWorkDataType: NETWORK_DATA_TYPE.NORMAL,
  netWorkImageType: NetWork_Image_Type.No_Data_Default_Tip,
  netWorkShowType: NetWorkShowType.FULL,
  refreshCallBackFn: null,
  viewMaxHeight: "",
+import { Button, View } from '@tarojs/components'
  NetWorkErrorList,
  NetWorkErrorTip,
  NetWorkErrorSubTip,
  NetWorkShowType,
  NetWork_Image_Type,
  const {
    className = '',
    message = '',
    subMessage = '',
    btnLabel = '重新加载',
    backgroundColorWhite = false, 
    netWorkDataType = NETWORK_DATA_TYPE.NORMAL,
    netWorkImageType = NetWork_Image_Type.No_Data_Default_Tip,
    netWorkShowType = NetWorkShowType.FULL,
    refreshCallBackFn = null,
    viewMaxHeight = '',
    noPosition = false, 
  } = props
  const refershInitData = useCallback(() => {
    refreshCallBackFn && refreshCallBackFn(true)
  }, [])
  const useErrorTip = message != '' ? message : NetWorkErrorTip[netWorkDataType]
  const useErrorSubTip = subMessage
    ? subMessage
    : NetWorkErrorSubTip[netWorkDataType]
  const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {}
  const maxHeight = latestRes.displayHeight || 546 
  return NetWorkErrorList.includes(netWorkDataType as NETWORK_DATA_TYPE) ? (
    <View
      style={{
        maxHeight:
          viewMaxHeight !== ''
            ? viewMaxHeight
            : isMemberPage || isAppStowShop
            ? '100vh'
            : maxHeight,
      }}
      className={classNames(
        netWorkErrorStyle['d-shop-network'],
        {
          [netWorkErrorStyle['d-shop-network-white']]: backgroundColorWhite,
        },
        {
          [netWorkErrorStyle['d-shop-network-part']]:
            netWorkShowType === NetWorkShowType.PART,
        },
        {
          [netWorkErrorStyle['d-network-jd-shop-view']]: isH5AndJdShopView,
        },
        {
          [netWorkErrorStyle['d-shop-network-no-position']]: noPosition,
        },
        'flexible-center-box',
        className,
      )}
    >
      <View
        className={classNames(
          netWorkErrorStyle['d-error-content'],
          'd-error-content',
        )}
      >
        <View
          className={classNames(
            netWorkErrorStyle['d-error-type'],
            netWorkErrorStyle[`d-${netWorkDataType}`],
            netWorkErrorStyle[`d-${netWorkImageType}`],
            'd-error-type',
          )}
        />
        <View
          className={classNames(
            netWorkErrorStyle['d-error-tip'],
            'd-error-tip',
          )}
        >
          {useErrorTip}
        </View>
        {useErrorSubTip ? (
          <View
            className={classNames(
              netWorkErrorStyle['d-error-sub-tip'],
              'd-error-sub-tip',
            )}
          >
            {useErrorSubTip}
          </View>
        ) : null}
        <View className={'flexible-horizontal-center-box'}>
          {refreshCallBackFn && (
            <Button
              onClick={refershInitData}
              className={classNames(
                netWorkErrorStyle['d-opt-btn'],
                'd-button-no-border',
                'd-opt-btn',
              )}
              plain
              size="mini"
            >
              {btnLabel}
            </Button>
          )}
        </View>
      </View>
    </View>
  ) : null

package/dist/components/decorate/DecorateFloorModule/index.module.scss

@@ -11,7 +11,18 @@
     display: none;
   }
 }
+.d-container-item-cover {
+  &:first-child {
+    z-index: 99;
+    top: 22px;
+    // top: 21px;
+    width: 98.5%;
+    left: 6px;
+	}
 
+ width: 100%;
+ position: absolute;
+}
 .d-container-item{
   &.d-container-item-active {
 		:global {

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

@@ -1 +1 @@
-import { View } from '@tarojs/components'
  const {
    selectContainerId,
    placeHolderPreContainerId,
    containerData,
    children,
    style,
    shopTotalInfo,
    urlQueryData
  } = props;
  const { isTrusteeship = false } = urlQueryData || {}
  const selectContainerState = selectContainerId == containerData?.containerId
  const ChildrenComponent = useCallback(() => {
    return children ? children : null;
  }, [containerData, shopTotalInfo]);
  const isHideFloor = isTrusteeship && containerData?.floors?.[0]?.status === -1
  return (
    <View
      className={classNames(
        decorateModuleStyle[isTrusteeship ? 'd-container-item-trusteeship' : 'd-container-item'],
        'J_container',
        {
          [decorateModuleStyle['d-container-item-active']]:
            selectContainerState,
        },
        {
          J_floorItemActive: selectContainerState,
        },
        {
          [decorateModuleStyle['d-container-item-hide']]:
            isHideFloor,
        }
      )}
      id={`J_container_${containerData?.containerId}`}
      data-container-id={containerData?.containerId}
      data-container-type={containerData?.typeCode}
      data-container-cn={containerData?.typeCn}
      data-container-floorFlag={containerData?.extInfo?.floorFlag || ''}
      data-container-moduleInstanceType={containerData?.extInfo?.moduleInstanceType || ''}
      data-container-position={containerData?.containerPosition}
      data-container-alias={
        containerData?.containerAlias
          ? containerData?.containerAlias
          : ''
      }
      data-container-empty={containerData?.floors?.[0]?.configEmpty || 'false'}
      style={
        containerData?.typeCode !== ContainerShopHeaderType ? style : {}
      }
    >
      <input
        type="hidden"
        value={`container_${containerData?.containerId}`}
      />
      <ChildrenComponent />
      <PlaceHolder
        placeHolderPreContainerId={placeHolderPreContainerId}
        containerId={containerData?.containerId}
      />
    </View>
  )
+import { View } from '@tarojs/components'
  const {
    selectContainerId,
    placeHolderPreContainerId,
    containerData,
    children,
    style,
    shopTotalInfo,
    urlQueryData,
    containerIndex = -1,
    luxuryFixed = false
  } = props;
  const { isTrusteeship = false } = urlQueryData || {}
  const selectContainerState = selectContainerId == containerData?.containerId
  const ChildrenComponent = useCallback(() => {
    return children ? children : null;
  }, [containerData, shopTotalInfo]);
  const isHideFloor = isTrusteeship && containerData?.floors?.[0]?.status === -1
  return (
    <View
      className={classNames(
        decorateModuleStyle[isTrusteeship ? 'd-container-item-trusteeship' : 'd-container-item'],
        'J_container',
        {
          [decorateModuleStyle['d-container-item-active']]:
            selectContainerState,
        },
        {
          J_floorItemActive: selectContainerState,
        },
        {
          [decorateModuleStyle['d-container-item-hide']]:
            isHideFloor,
        },
        {
          [decorateModuleStyle['d-container-item-cover']]:
          containerIndex === 0 && luxuryFixed && !isTrusteeship,
        },
      )}
      id={`J_container_${containerData?.containerId}`}
      data-container-id={containerData?.containerId}
      data-container-type={containerData?.typeCode}
      data-container-cn={containerData?.typeCn}
      data-container-floorFlag={containerData?.extInfo?.floorFlag || ''}
      data-container-moduleInstanceType={containerData?.extInfo?.moduleInstanceType || ''}
      data-container-position={containerData?.containerPosition}
      data-container-alias={
        containerData?.containerAlias
          ? containerData?.containerAlias
          : ''
      }
      data-container-empty={containerData?.floors?.[0]?.configEmpty || 'false'}
      style={
        containerData?.typeCode !== ContainerShopHeaderType ? style : {}
      }
    >
      <input
        type="hidden"
        value={`container_${containerData?.containerId}`}
      />
      <ChildrenComponent />
      <PlaceHolder
        placeHolderPreContainerId={placeHolderPreContainerId}
        containerId={containerData?.containerId}
        {...(selectContainerId === "luxuryHeader-isUpperHalf" && { isShowPlaceHolder: false })}
      />
    </View>
  )

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

@@ -1 +1 @@
-import { View, Text } from '@tarojs/components'
  '//img11.360buyimg.com/imagetools/jfs/t1/141506/22/31698/7923/637b6db9E2af80265/10e76e2c31e0e356.png'
  const {
    moduleType,
    configEmpty,
    previewUri = null,
    uid,
    moduleFlag,
    moduleName,
  } = props.floorData
  let previewUrl = previewUri
  const newModuleFloorTypeList = [100, 101, 100000, 99999]
  const isNewFloorState = newModuleFloorTypeList.includes(moduleType)
  if ((moduleType == 99999 || moduleType == 101) && !previewUri) {
    previewUrl = decorateModulePrevDefaultUrl
  }
  const loadImageErr = e => {
    e.target.src = decorateModulePrevDefaultUrl
  }
  if (moduleFlag && TRUSTEESHIP_MODULE_FLAG_LIST.indexOf(moduleFlag) !== -1)
    return null
  return isNewFloorState && configEmpty && previewUrl ? (
    <View
      className={emptyModuleStyle['d-empty-module']}
      data-floor-uid={uid}
      data-floor-type={moduleFlag}
      data-floor-modulename={moduleName}
    >
      {}
      {}
      {}
      {}
      {}
      {}
      {}
      <View className={classNames(emptyModuleStyle['d-empty-img'])}>
        <img
          width={355}
          className={classNames('J_floorEmptyDataImg')}
          src={previewUrl}
          onError={loadImageErr.bind(this)}
        />
      </View>
    </View>
  ) : (
    <View
      className={classNames(
        emptyModuleStyle['d-empty-module'],
        emptyModuleStyle['d-empty-text-warp'],
      )}
      data-floor-uid={uid}
      data-floor-type={moduleFlag}
      data-floor-modulename={moduleName}
    >
      <Text className={emptyModuleStyle['d-empty-text']}>
        该楼层还未配置数据
      </Text>
    </View>
  )
+import { View, Text } from '@tarojs/components'
  '//img11.360buyimg.com/imagetools/jfs/t1/141506/22/31698/7923/637b6db9E2af80265/10e76e2c31e0e356.png'
  '//img14.360buyimg.com/imagetools/jfs/t1/247708/11/19310/58975/66ecefa4Fe36ade02/370c18c961aceef1.png'
  const {
    moduleType,
    configEmpty,
    previewUri = null,
    uid,
    moduleFlag,
    moduleName,
  } = props.floorData
  const { luxuryFixed = false } = props
  let previewUrl = previewUri
  const newModuleFloorTypeList = [100, 101, 100000, 99999]
  const isNewFloorState = newModuleFloorTypeList.includes(moduleType)
  if ((moduleType == 99999 || moduleType == 101) && !previewUri) {
    previewUrl = luxuryFixed ? luxuryDecorateModulePrevDefaultUrl : decorateModulePrevDefaultUrl
  }
  const loadImageErr = e => {
    e.target.src = decorateModulePrevDefaultUrl
  }
  if (moduleFlag && TRUSTEESHIP_MODULE_FLAG_LIST.indexOf(moduleFlag) !== -1)
    return null
  return isNewFloorState && configEmpty && previewUrl ? (
    <View
      className={emptyModuleStyle['d-empty-module']}
      data-floor-uid={uid}
      data-floor-type={moduleFlag}
      data-floor-modulename={moduleName}
    >
      {}
      {}
      {}
      {}
      {}
      {}
      {}
      <View className={classNames(emptyModuleStyle['d-empty-img'])}>
        <img
          width={luxuryFixed ? 375 : 355}
          className={classNames('J_floorEmptyDataImg')}
          src={previewUrl}
          onError={loadImageErr.bind(this)}
        />
      </View>
    </View>
  ) : (
    <View
      className={classNames(
        emptyModuleStyle['d-empty-module'],
        emptyModuleStyle['d-empty-text-warp'],
      )}
      data-floor-uid={uid}
      data-floor-type={moduleFlag}
      data-floor-modulename={moduleName}
    >
      <Text className={emptyModuleStyle['d-empty-text']}>
        该楼层还未配置数据
      </Text>
    </View>
  )