@lingxiteam/ebe-utils 0.3.11 → 0.3.12

package/lib/public/src/components/pcfactory/src/Swiper/index.tsx

@@ -1,184 +0,0 @@
-import { Icon as LegacyIcon } from '@lingxiteam/icons';
-import { LingxiForwardRef } from '@lingxiteam/types';
-import { Carousel } from 'antd';
-import classnames from 'classnames';
-import React, { useEffect, useImperativeHandle, useRef } from 'react';
-
-export interface MySwiperProps {
-  /** 数据源 */
-  data?: any[];
-  itemType?: string;
-  itemValue?: string;
-  itemLink?: string;
-
-  /** 录播时间 */
-  autoplay?: boolean;
-
-  /** 方向 */
-  dotPosition?: 'top' | 'bottom' | 'left' | 'right';
-
-  /** 是否显示面板指示点 */
-  dots?: boolean;
-
-  /** 自定义样式 */
-  style?: React.CSSProperties;
-  beforeChange?: (from: number, to: number) => void;
-  afterChange?: (current: number) => void;
-  visible?: any;
-  current?: number;
-  doNext?: any;
-  doPrev?: any;
-  className?: string;
-  slidesToShow?: number;
-  slidesToScroll?: number;
-  arrows?: boolean;
-  arrowsDisplay?: any;
-}
-const Swiper = LingxiForwardRef<any, MySwiperProps>((props, ref) => {
-  const {
-    visible = true,
-    current,
-    doNext,
-    doPrev,
-    data = [],
-    itemType = 'type',
-    itemValue = 'value',
-    itemLink = 'link',
-    style,
-    className,
-    slidesToShow = 1,
-    slidesToScroll = 1,
-    dotPosition,
-    arrows,
-    arrowsDisplay,
-    getEngineApis,
-    ...restProps
-  } = props;
-  const { historyPush } = getEngineApis();
-  // @ts-ignore
-  const { subclassName, width, height, ...restStyle } = style;
-  const iscross = dotPosition === 'top' || dotPosition === 'bottom'; // 横向的
-  // 自适应高度
-  useEffect(() => {
-    const c = document.getElementsByClassName('ued-swiper-wrap')[0];
-    const cHeight = c?.clientHeight;
-    if (cHeight) {
-      (
-        document.getElementsByClassName('slick-slider')[0] as any
-      ).style.height = `${cHeight}px`;
-    }
-  }, []);
-
-  const carouselRef = useRef<any>();
-
-  useImperativeHandle(ref, () => ({
-    prev() {
-      carouselRef?.current?.prev();
-    },
-    next() {
-      carouselRef?.current?.next();
-    },
-    goTo(current: number) {
-      if (current) {
-        if (current - 1 < 0) {
-          return;
-        }
-        // 从1开始
-        carouselRef?.current?.goTo(current - 1);
-      }
-    },
-  }));
-
-  const renderItem = (item: any) => {
-    const value = item[itemValue];
-    const link = item[itemLink];
-
-    const divStyle = {
-      background: `url('${value}') center no-repeat`,
-      backgroundSize: 'cover',
-      height,
-    };
-    return (
-      <div
-        style={divStyle}
-        onClick={() => {
-          switch (itemType) {
-            case 'link':
-              window.open(link, '_blank');
-              break;
-            case 'route': // 跳转路由
-              historyPush?.(link);
-              break;
-            case 'img': // TODO
-            case 'video': // TODO
-            default:
-              break;
-          }
-        }}
-      />
-    );
-  };
-
-  const smallerThan200 = () => {
-    return height && height.indexOf('px') > -1 && +height.split('px')[0] <= 200;
-  };
-
-  return visible ? (
-    <div
-      className={classnames('ued-swiper-wrap', className)}
-      style={{ ...restStyle, width, height }}
-    >
-      {arrows && (
-        <div
-          className={classnames(
-            'ued-swiper-icon',
-            iscross ? 'left' : 'up',
-            arrowsDisplay,
-            smallerThan200() ? 'small' : '',
-          )}
-          onClick={() => {
-            if (carouselRef.current) {
-              carouselRef?.current?.prev();
-            }
-          }}
-        >
-          <LegacyIcon type={iscross ? 'left' : 'up'} />
-        </div>
-      )}
-      <Carousel
-        ref={carouselRef}
-        {...restProps}
-        slidesToShow={Number(slidesToShow)}
-        slidesToScroll={Number(slidesToScroll)}
-        dotPosition={dotPosition}
-      >
-        {Array.isArray(data)
-          ? data.map((item, index) => (
-              <div key={index} className={subclassName}>
-                {renderItem(item)}
-              </div>
-            ))
-          : null}
-      </Carousel>
-      {arrows && (
-        <div
-          className={classnames(
-            'ued-swiper-icon',
-            iscross ? 'right' : 'down',
-            arrowsDisplay,
-            smallerThan200() ? 'small' : '',
-          )}
-          onClick={() => {
-            if (carouselRef.current) {
-              carouselRef?.current?.next();
-            }
-          }}
-        >
-          <LegacyIcon type={iscross ? 'right' : 'down'} />
-        </div>
-      )}
-    </div>
-  ) : null;
-});
-
-export default Swiper;

package/lib/public/src/components/pcfactory/src/Switch/index.tsx

@@ -1,219 +0,0 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
-import { Switch as AntdSwitch } from 'antd';
-import { useCallback, useMemo, useState } from 'react';
-import CommIcon from '../Icon';
-import { handleIsValidIconCfg } from '../Icon/hooks';
-import { FormFields, useCommonImperativeHandle, useForm } from '../utils';
-import { getFieldsProps } from '../utils/formUtils/FormFields';
-
-export interface SwitchProps {
-  value?: any;
-  visible?: any;
-  onChange?: any;
-  onValueRelease?: any;
-  defaultChecked?: boolean;
-  getCompPropMapState?: any;
-  compId?: any;
-  name?: any;
-  fieldName?: any;
-  required?: any;
-  hidden?: any;
-  regexp?: any;
-  message?: any;
-  label?: any;
-  labelCol?: any;
-  wrapperCol?: any;
-  selfSpan?: any;
-  colSpan?: any;
-  style?: any;
-  showWrapperContainer: boolean;
-  wrapperContainer: any;
-  titleTip?: any;
-  tipIcon?: any;
-  tipLocation?: any;
-  tipContent?: any;
-  tipPlacement?: any;
-  colon?: boolean;
-  switchStyle?: string;
-  checkedChildren?: string;
-  unCheckedChildren?: string;
-  checkedChildrenIcon?: any;
-  unCheckedChildrenIcon?: any;
-  size?: any;
-  isFormChild?: boolean | undefined;
-  rules?: any[];
-  tipSize?: string; // 文字提示
-  tipWidth?: string; // 提示自定义的宽度
-  tipHeight?: string; // 提示自定义的高度
-  getEngineApis?: any;
-}
-
-const Switch = LingxiForwardRef<any, SwitchProps>((props, ref) => {
-  const {
-    value,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    visible = true,
-    onChange,
-    unCheckedChildrenIcon,
-    checkedChildrenIcon,
-    onValueRelease,
-    defaultChecked,
-    getCompPropMapState,
-    compId,
-    name,
-    fieldName: rawFieldName,
-    hidden,
-    switchStyle = '',
-    regexp,
-    message,
-    label,
-    labelCol,
-    wrapperCol,
-    selfSpan,
-    colSpan,
-    showWrapperContainer,
-    wrapperContainer: WrapperContainer,
-    titleTip,
-    tipIcon,
-    tipLocation,
-    tipContent,
-    tipPlacement,
-    isFormChild,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    rules: externalRules = [],
-    tipSize,
-    tipWidth,
-    tipHeight,
-    getEngineApis,
-    ...restProps
-  } = props;
-
-  const customStyle = restProps.style || {};
-  const { margin, display, visibility, ...restCusStyles } = customStyle;
-
-  const [loading, setLoading] = useState(false);
-
-  const { inForm } = useForm();
-  const { disabled, required, formFieldsRef, finalRules } =
-    useCommonImperativeHandle(ref, props, {
-      setLoading: (_loading: boolean) => {
-        setLoading(_loading);
-      },
-    });
-
-  // 渲染开关开启/关闭文案或图标
-  const renderSwitchStyle = useCallback(
-    (type: string) => {
-      if (switchStyle) {
-        let Comp = null;
-        if (switchStyle === 'font') {
-          Comp = (props as any)[type];
-        } else if (switchStyle === 'icon') {
-          const iconInfo = (props as any)[`${type}Icon`];
-          if (handleIsValidIconCfg(iconInfo)) {
-            Comp = (
-              <CommIcon
-                icon={iconInfo}
-                getEngineApis={getEngineApis}
-                $$componentItem={props?.$$componentItem}
-                className=""
-              />
-            );
-          }
-        }
-        if (Comp) {
-          return props.size === 'small' ? (
-            <div
-              className="ued-switch-children"
-              ref={(r) => {
-                if (r) {
-                  // 小号时把内容缩小80%
-                  const clientInfo = r.getBoundingClientRect();
-                  const { width = 0 } = clientInfo || {};
-                  const margin = `-${width / 4}px`;
-                  if (value) {
-                    r.style.marginLeft = margin;
-                    r.style.marginRight = '0';
-                  } else {
-                    r.style.marginLeft = '0';
-                    r.style.marginRight = margin;
-                  }
-                }
-              }}
-            >
-              {Comp}
-            </div>
-          ) : (
-            Comp
-          );
-        }
-        return undefined;
-      }
-      return undefined;
-    },
-    [
-      switchStyle,
-      props.checkedChildren,
-      props.unCheckedChildren,
-      props.size,
-      unCheckedChildrenIcon,
-      checkedChildrenIcon,
-      value,
-    ],
-  );
-
-  const checkedChildrenComp = useMemo(
-    () => renderSwitchStyle('checkedChildren'),
-    [renderSwitchStyle],
-  );
-  const unCheckedChildrenComp = useMemo(
-    () => renderSwitchStyle('unCheckedChildren'),
-    [renderSwitchStyle],
-  );
-
-  return (
-    <FormFields
-      {...getFieldsProps(props)}
-      disabled={disabled}
-      required={required}
-      ref={formFieldsRef}
-      defaultValue={props.defaultChecked}
-      rules={finalRules}
-      handleFormValue={(val) => {
-        if (val !== undefined) {
-          if (typeof val === 'string') {
-            if (val === 'true') {
-              return true;
-            }
-            return true;
-          }
-        }
-        return val;
-      }}
-    >
-      <AntdSwitch
-        {...restProps}
-        loading={loading}
-        checkedChildren={checkedChildrenComp}
-        unCheckedChildren={unCheckedChildrenComp}
-        defaultChecked={!!defaultChecked}
-        style={inForm ? restCusStyles : props.style}
-        // eslint-disable-next-line no-nested-ternary
-        checked={
-          typeof value === 'string'
-            ? value.toLowerCase() === 'false'
-              ? false
-              : !!value
-            : !!value
-        }
-        onChange={(e: any) => {
-          if (onChange) {
-            onChange(e);
-          }
-        }}
-      />
-    </FormFields>
-  );
-});
-
-export default Switch;

package/lib/public/src/components/pcfactory/src/TabPane/index.tsx

@@ -1,145 +0,0 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
-import { Badge } from 'antd';
-import React, { useCallback, useImperativeHandle } from 'react';
-import { useListenProps } from '../utils';
-import { useDeepCompareEffect } from '../utils/ahooks';
-import CustomModule from '../utils/CustomModule';
-import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
-import { useLocale } from '../utils/hooks/useLocale';
-
-export interface MyTabPaneProps {
-  value: string;
-  visible: boolean;
-  style: React.CSSProperties;
-  [key: string]: any;
-}
-
-const MyTabPane = LingxiForwardRef<any, MyTabPaneProps>((props, ref) => {
-  const {
-    value,
-    children,
-    style,
-    getEngineApis,
-    $$componentItem,
-    uploadChannelProps,
-    visited, // 当前组件在Tabs下，是否已经被渲染过
-    currentIndex,
-    ...restProps
-  } = props;
-
-  const [badge, setBadge] = useListenProps(props.badge);
-  const [title, setTitle] = useListenProps(props.tab);
-
-  /**
-   * visible 表示用户是否设置了隐藏
-   */
-  const [visible, setVisible] = useListenProps(
-    typeof props.visible === 'undefined' ? true : props.visible,
-  );
-
-  const { sandBoxSafeRun, sandBoxLoadModule } = getEngineApis();
-  const { getLocale } = useLocale(getEngineApis());
-
-  const funcExpExecute = useFuncExpExecute(sandBoxSafeRun, getLocale);
-
-  const getTab = useCallback(() => {
-    if (currentIndex !== -1) {
-      const { badgeRendering } = props;
-      let _tab = title;
-      if (badge !== '' && badge !== null && badge !== undefined) {
-        // 自定义渲染函数
-        if (typeof badgeRendering === 'object' && badgeRendering.jsx) {
-          // FIXME: funcExpExecute给属性传递的item应该是一个错误的数据，给自定义渲染组件传递没有转化的dsl没有任何意义。
-          const item = {
-            badge,
-            tab: props.tab,
-          };
-          _tab = (
-            <div style={{ position: 'relative', display: 'flex' }}>
-              {title}
-              <CustomModule
-                sandBoxLoadModule={sandBoxLoadModule}
-                errorInfo={{ id: $$componentItem.id }}
-                code={badgeRendering.targetVal}
-                compProps={{ text: badge, item, index: currentIndex }}
-              />
-            </div>
-          );
-        } else if (badgeRendering) {
-          _tab = (
-            <div
-              style={{ position: 'relative', display: 'flex' }}
-              // eslint-disable-next-line react/no-danger
-              dangerouslySetInnerHTML={{
-                __html: `${title}${funcExpExecute(badgeRendering, [
-                  {
-                    key: 'text',
-                    value: badge,
-                  },
-                  {
-                    key: 'row',
-                    value: props,
-                  },
-                  {
-                    key: 'index',
-                    value: currentIndex,
-                  },
-                ])}`,
-              }}
-            />
-          );
-        } else {
-          _tab = (
-            <div style={{ position: 'relative' }}>
-              {title}
-              <Badge
-                count={badge}
-                overflowCount={999}
-                style={{ position: 'absolute', top: '-20px', right: '-20px' }}
-              />
-            </div>
-          );
-        }
-      }
-      return _tab;
-    }
-    return undefined;
-  }, [currentIndex, props, badge]);
-
-  useDeepCompareEffect(() => {
-    if (uploadChannelProps) {
-      uploadChannelProps({
-        ...restProps,
-        tab: getTab(),
-        'data-extends': {
-          setBadge,
-          setTitle,
-          setVisible,
-        },
-        visible,
-      });
-    }
-  }, [getTab, visible, restProps, currentIndex, badge]);
-
-  useImperativeHandle(ref, () => ({
-    // 设置角标
-    setBadge(data: any) {
-      setBadge(data);
-    },
-  }));
-
-  /**
-   * Tabs下的组件还没渲染完成时，子组件应该禁止渲染，手动实现按需加载问题
-   */
-  if (!visited || !visible) {
-    return null;
-  }
-
-  return (
-    <div style={style} className="ued-tabs-tabpane-content">
-      {children}
-    </div>
-  );
-});
-
-export default MyTabPane;