@conecli/cone-render 0.8.19 → 0.8.20-beta.2

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

@@ -1,81 +1,140 @@
 
 .d-shop-network {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: #e5e5e5;
-	&.d-shop-network-white {
-		background-color: #fff;
-	}
-	.d-error-content {
-		text-align: center;
-	}
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: #e5e5e5;
+  &.d-shop-network-white {
+    background-color: #fff;
+  }
+  .d-error-content {
+    text-align: center;
+    &.d-new-style-content {
+      .d-data-error,
+      .d-no-data,
+      .d-no-data-tip-1,
+      .d-no-data-tip-2 {
+        width: 240px;
+        height: 240px;
+        background: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png')
+          0 0 /240px 240px no-repeat;
+      }
+      .d-data-error-tip {
+        padding-bottom: 24px;
+        line-height: 38px;
+        font-size: 32px;
+        font-weight: 600;
+        color: #1a1a1a;
+      }
+      .d-data-error-sub-tip {
+        margin: 0;
+        font-size: 24px;
+        color: #505259;
+      }
+      .d-no-data-tip {
+        line-height: 44px;
+        font-size: 24px;
+        font-weight: normal;
+        color: #505259;
+      }
+      .d-no-data-sub-tip {
+        margin: 0;
+        font-weight: normal;
+        color: #505259;
+      }
+      .d-opt-btn {
+        width: 160px;
+        height: 64px;
+        line-height: 64px;
+        font-size: 28px;
+        color: #1a1a1a;
+        border-radius: 12px;
+        border: none;
+        
+        &:after{
+          border: 1PX solid #C2C4CC;
+        }
+      }
+    }
+  }
 
-	.d-error-tip {
-		font-size: 28px;
-        font-weight: bold;
-		line-height: 28px;
-		color: #8C8C8C;
-	}
-    .d-error-sub-tip {
-        margin-top: 16px;
-		font-size: 24px;
-		line-height: 24px;
-		color: #8C8C8C;
-	}
-	.d-error-type {
-		width: 320px;
-		height: 320px;
-		background-size: contain;
-		background-repeat: no-repeat;
-	}
+  .d-error-tip {
+    font-size: 28px;
+    font-weight: bold;
+    line-height: 28px;
+    color: #1a1a1a;
+  }
+  .d-error-sub-tip {
+    margin-top: 16px;
+    font-size: 24px;
+    line-height: 24px;
+    color: #8c8c8c;
+  }
+  .d-error-type {
+    width: 320px;
+    height: 320px;
+    background-size: contain;
+    background-repeat: no-repeat;
+    margin: 0 auto;
+  }
 
-	.d-no-network {
-		// background-image: url('https://m.360buyimg.com/imagetools/jfs/t1/219405/34/29129/32963/64892a0eF2c068392/86c3fcf9d980ff10.png');
-        background-image: url('../../../assets/networkError.png');
-	}
+  .d-no-network {
+    // background-image: url('https://m.360buyimg.com/imagetools/jfs/t1/219405/34/29129/32963/64892a0eF2c068392/86c3fcf9d980ff10.png');
+    background-image: url('../../../assets/networkError.png');
+  }
 
-	.d-data-error {
-		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');
-	}
-	.d-no-data-tip-1 {
-		background-image: url('https://img14.360buyimg.com/imagetools/jfs/t1/152550/40/8432/21643/5fc9cae0E5391a506/523da679188ff687.png');
-	}
-	.d-no-network-err-tip {
-		background-image: url('https://img14.360buyimg.com/imagetools/jfs/t1/146556/1/17745/7493/5fd1e62dE86e86669/96f5c91befa8e991.png');
-	}
-	
-	.d-opt-btn {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        width: 144px;
-		height: 56px;
-        margin-top: 32px;
-		padding: 0;
-		font-size: 24px;
-		color: #fa2c19;
-		border: 1PX solid #fa2c19;
-		box-sizing: border-box;
-		border-radius: 48px;
-		&:active {
-			opacity: 0.8;
-		}
-	}
+  .d-data-error {
+    background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png');
+  }
+  .d-risk {
+    background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png');
+  }
+  .d-no-data {
+    background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png');
+  }
+  .d-no-data-tip-1 {
+    background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png');
+  }
+  .d-no-data-tip-2 {
+    background-image: url('https://img11.360buyimg.com/imagetools/jfs/t1/256437/5/21857/22576/67b438adFed8a2665/7df7277fec7e3e8e.png');
+  }
+  .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;
+    justify-content: center;
+    align-items: center;
+    width: 144px;
+    height: 56px;
+    margin-top: 32px;
+    padding: 0;
+    font-size: 24px;
+    color: #fa2c19;
+    border: 1px solid #fa2c19;
+    box-sizing: border-box;
+    border-radius: 48px;
+    &:active {
+      opacity: 0.8;
+    }
+  }
 }
 
 .d-network-jd-shop-view {
-	min-height: 500px;
+  min-height: 500px;
 }
 
 .d-shop-network-part {
-	position: absolute;
-	min-height: 500px;
-	background: #f2f2f2;
+  position: absolute;
+  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'
    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';
  NetWorkErrorList,
  NetWorkErrorTip,
  NetWorkErrorSubTip,
  NetWorkShowType,
  NetWork_Image_Type,
  NetWorkStyleType,
  const {
    className = '',
    message = '',
    subMessage = '',
    btnLabel = global?.languageJsonData?.reload || '重新加载',
    backgroundColorWhite = false, 
    netWorkDataType = NETWORK_DATA_TYPE.NORMAL,
    netWorkShowType = NetWorkShowType.FULL,
    netWorkImageType = NetWork_Image_Type.No_Data_Default_Tip,
    netWorkStyleType = NetWorkStyleType.OLD,
    refreshCallBackFn = null,
    viewMaxHeight = '',
    noPosition = false, 
  } = props;
  const refershInitData = useCallback(() => {
    refreshCallBackFn && refreshCallBackFn(true);
  }, []);
  const useErrorTip = message != '' ? message : NetWorkErrorTip[netWorkDataType];
  const useErrorSubTip = subMessage
    ? subMessage
    : message != ''
      ? ''
      : NetWorkErrorSubTip[netWorkDataType];
  const latestRes = latestFromNativeMsgStorage[TaroEventType.PAGE_SCROLL] || {};
  const onePlusOneBottomPlaceHeight = global.info?.sysInfo?.onePlusOneBottomPlaceHeight
    ? global.info?.sysInfo?.onePlusOneBottomPlaceHeight + 20
    : 0;
  const maxHeight = latestRes.displayHeight || onePlusOneBottomPlaceHeight + 546; 
  return NetWorkErrorList.includes(netWorkDataType as NETWORK_DATA_TYPE) ? (
    <View
      style={{
        maxHeight: viewMaxHeight !== '' ? viewMaxHeight : isMemberPage ? '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'],
          netWorkErrorStyle[`d-${netWorkStyleType}-style-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'],
            netWorkErrorStyle[`d-${netWorkDataType}-tip`],
            'd-error-tip',
          )}
        >
          {useErrorTip}
        </View>
        {useErrorSubTip ? (
          <View
            className={classNames(
              netWorkErrorStyle['d-error-sub-tip'],
              netWorkErrorStyle[`d-${netWorkDataType}-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/base/Price/Base/index.module.scss

@@ -0,0 +1,148 @@
+
+:global {
+  .d-mini-price {
+    --after-ele-color: '';
+    position: relative;
+    color: #f23030;
+    display: inline-block;
+    font-family: 'JDZhengHT-Regular';
+    &.d-font-v2 {
+      font-family: 'JDZhengHeiV2-Regular';
+    }
+    &.d-font-v2-bold {
+      font-family: 'JDZhengHeiV2-Bold';
+    }
+
+    &-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-price-text-clor {
+      &:after {
+        color: var(--after-ele-color) !important;
+      }
+    }
+    &.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, { useEffect, useRef } from 'react';
  let value = `${initValue}`;
  if (!cnPriceTextList.includes(value)) {
    if (value && !/^[0123456789-]*$/.test(value.substring(0, 1))) {
      symbol = value.substring(0, 1); 
      value = value.substring(1); 
    }
    if (/^\d+(\.\d+)?[eE][+-]?\d+$/.test(value)) {
      sgmCustomReport({
        code: getSgmCustomCode(`${SgmCustomCode.PRICE_RENDER}_basePrice`),
        msg: {
          price: value,
          originalPrice: initValue,
          msg: '当前价格为科学计数数据，上报关注该价格',
        },
      });
    }
    if (!decToIntegerState) {
      value = parseFloat(value).toFixed(decLength);
    } else {
      if (value.indexOf('.') !== -1) {
        value = parseFloat(value).toFixed(decLength);
        value = `${value}`.replace(/0+$/, '');
      }
    }
    if (value === 'NaN') {
      sgmCustomReport({
        code: getSgmCustomCode(`${SgmCustomCode.PRICE_RENDER}_basePrice`),
        msg: {
          price: value,
          originalPrice: initValue,
          msg: '价格转换异常，兜底展示暂无报价',
        },
      });
      value = '暂无报价';
    }
  }
  const [intVal, decimalVal] = `${value}`.split('.');
  return {
    currencySymbol: !cnPriceTextList.includes(intVal) ? symbol : '',
    intVal,
    decimalVal,
  };
  const {
    prefixCls,
    symPos,
    symbol,
    decPos,
    status,
    className,
    style,
    symClassName,
    intClassName,
    decClassName,
    noPriceClassName,
    value,
    decLength,
    decToIntegerState,
    isPlusPrice,
    isSamsPrice,
    isMemberPrice,
    isSfpPrice,
    memberPriceIcon,
    isShowPriceLabel,
    priceLabelText,
    priceTextColor,
    useFontV2 = false,
    useFontV2Bold = false,
  } = props;
  const cRef = useRef<any>(null);
  useEffect(() => {
    if (isShowPriceLabel && priceTextColor && cRef.current) {
      cRef.current?.style?.setProperty('--after-ele-color', priceTextColor);
    }
  }, [isShowPriceLabel, priceTextColor]);
  const cls = classNames(
    className ? `${className}` : '',
    prefixCls,
    {
      'd-font-v2': useFontV2,
      'd-font-v2-bold': useFontV2Bold,
    },
    'd-imag-rendering-crisp-edges',
    {
      del: status === 'del',
    },
    {
      'd-plus-price': isPlusPrice,
    },
    {
      'd-sams-price': isSamsPrice,
    },
    {
      'd-sfp-price': isSfpPrice,
    },
    {
      'd-member-price': isMemberPrice,
    },
    {
      [`d-member-price-${memberPriceIcon}`]: memberPriceIcon,
    },
    {
      'd-price-label': isShowPriceLabel,
    },
    {
      'd-price-text-clor': isShowPriceLabel && priceTextColor,
    },
  );
  const symCls = classNames(symClassName ? `${symClassName}` : '', {
    'sym-sub': symPos === 'sub',
    'sym-sup': symPos === 'sup',
  });
  const intCls = classNames(intClassName ? `${intClassName}` : '');
  const decCls = classNames(decClassName ? `${decClassName}` : '', {
    'dec-sub': decPos === 'sub',
    'dec-sup': decPos === 'sup',
  });
  const noPriceCls = classNames(noPriceClassName ? `${noPriceClassName}` : '');
  const { currencySymbol, intVal, decimalVal } = dealPrice(
    value,
    decLength,
    symbol,
    decToIntegerState,
  );
  return (
    <View
      ref={cRef}
      className={cls}
      style={style}
      data-after={isShowPriceLabel ? priceLabelText : ''}
    >
      {intVal === '-1' ? (
        <Text className={`${prefixCls}-txt int-txt off-shelf ${noPriceCls}`}>{`暂无报价`}</Text>
      ) : (
        <>
          <Text className={`${prefixCls}-sym ${symCls}`}>{currencySymbol}</Text>
          <Text className={`${prefixCls}-txt int-txt ${intCls}`}>{intVal}</Text>
          {!!decimalVal && (
            <Text className={`${prefixCls}-txt dec-txt ${decCls}`}>.{decimalVal}</Text>
          )}
        </>
      )}
    </View>
  );
  prefixCls: 'd-mini-price',
  style: {},
  status: '', 
  symbol: '¥',
  symPos: 'sub',
  decLength: 2,
  decPos: 'sub',
  decToIntegerState: false, 
  isPlusPrice: false, 
  isShowPriceLabel: false, 
  priceLabelText: '到手价', 
  priceTextColor: '', 
  useFontV2: false, 
  useFontV2Bold: false,