@lingxiteam/ebe-utils 0.0.1

package/lib/public/src/utils/ModalManager/Modal/index.tsx

@@ -0,0 +1,96 @@
+import { PageComent, RootProps } from '@/components/common/Pageview';
+import { Modal } from 'antd';
+import classnames from 'classnames';
+import { forwardRef, useEffect, useRef, useState } from 'react';
+import './index.less';
+const DM = forwardRef((props: any) => {
+  const {
+    pagePath,
+    onCancel,
+    onOk,
+    params,
+    className,
+    lcdpParentRenderId,
+    ...restProp
+  } = props;
+  const [mProps, setMDProps] = useState<any>({
+    title: '',
+  });
+  const mRef = useRef<any>();
+  // 设置弹窗抽屉属性
+  useEffect(() => {
+    const pageInst = RootProps[pagePath || ''] || {};
+    const mdProps: any = {
+      title: pageInst.modalTitle || pageInst.pageName,
+      width:
+        pageInst.width === 'custom'
+          ? pageInst.customWidth || 624
+          : pageInst.width,
+      height:
+        pageInst.width === 'custom'
+          ? pageInst.customHeight || 'auto'
+          : pageInst.height,
+      okText: pageInst.okText,
+      cancelText: pageInst.cancelText,
+      placement: pageInst.placement || 'right',
+      maskClosable: pageInst.closeOnClickOverlay !== false,
+    };
+    if (pageInst.footer === 0) {
+      mdProps.footer = null;
+    }
+    setMDProps(mdProps);
+  }, [pagePath]);
+  return (
+    <>
+      <Modal
+        {...mProps}
+        {...restProp}
+        maskClosable={mProps?.maskClosable}
+        destroyOnClose
+        className={classnames(className, 'ued-modal-wrap')}
+        onOk={() => {
+          console.log('里面会回调 props.onOK');
+          console.log(mRef);
+          if (mRef.current && typeof mRef.current.onOk === 'function') {
+            mRef.current.onOk(); // 这里面会回调 props.onOK
+          }
+        }}
+        onCancel={() => {
+          let cancelResult;
+          if (mRef.current && typeof mRef.current.onCancel === 'function') {
+            // 返回false阻止默认窗口关闭动作
+            cancelResult = mRef.current.onCancel();
+          }
+
+          // onCancel为内置取消处理函数，用于关闭弹窗
+          if (cancelResult !== false && onCancel) {
+            onCancel();
+          }
+        }}
+      >
+        <div
+          style={
+            mProps.height
+              ? {
+                  height: mProps.height,
+                  overflow: 'auto',
+                }
+              : {
+                  overflowX: 'auto',
+                }
+          }
+        >
+          <PageComent
+            pageSrc={pagePath}
+            state={params}
+            ref={mRef}
+            onOk={onOk}
+            lcdpParentRenderId={lcdpParentRenderId}
+            closeModal={onCancel}
+          />
+        </div>
+      </Modal>
+    </>
+  );
+});
+export default DM;

package/lib/public/src/utils/ModalManager/index.tsx

@@ -0,0 +1,278 @@
+import { getSafePage } from '@/components/common/Pageview';
+import DrawerMap from '@/components/drawer';
+import ModalMap from '@/components/modal';
+import React, { useImperativeHandle, useMemo, useRef, useState } from 'react';
+
+interface ModalManagerProps {
+  parseNodeBefore?: any;
+}
+
+/**
+ * 打开弹窗入参
+ */
+export interface OpenModalProps {
+  /**
+   * 页面路径
+   */
+
+  pagePath: string;
+  /**
+   * 弹窗的state（组件状态）
+   */
+  params?: Record<string, any>;
+  /**
+   * 父页面的容器ID，是页面的上下文中的renderId
+   */
+  lcdpParentRenderId: string;
+  onOk: (...arg0: any[]) => void;
+  onCancel: (...arg0: any[]) => void;
+}
+export interface ModalManagerHooks {
+  /**
+   * 弹窗打开
+   * @param data
+   */
+  openModal: (data: OpenModalProps) => void;
+  /**
+   * pc端抽屉打开
+   * @param data
+   */
+  openDrawer?: (data: OpenDrawerProps) => void;
+  /**
+   * 弹窗关闭
+   * @param instId
+   * @param pagePath
+   */
+  closeModal: (instId?: string, pagePath?: string) => void;
+  /**
+   * pc端抽屉关闭
+   * @param instId
+   * @param pagePath
+   */
+  closeDrawer?: (instId?: string, pagePath?: string) => void;
+  /**
+   * PC端弹窗/抽屉设置属性
+   * @param param0
+   */
+  setStatue?: ({
+    modalInstId,
+    pagePath,
+    type,
+    propsName,
+    propsValue,
+  }: {
+    modalInstId?: string;
+    pagePath?: string;
+    type: 'model' | 'drawer';
+    propsName: string;
+    propsValue: any;
+  }) => void;
+}
+export declare type OpenDrawerProps = OpenModalProps;
+/**
+ * 弹窗管理器
+ * 每一个动态渲染页面需要引入一个弹窗管理器组件【只应引入一个】，他会暴露出ref供动态渲染页面使用
+ * @module ModalManager
+ */
+const ModalManager = React.forwardRef<ModalManagerHooks, ModalManagerProps>(
+  (props, ref) => {
+    const [ModalData, setModalData] = useState<any[]>([]);
+    const [DrawerData, setDrawerData] = useState<any[]>([]);
+    const [idSerial, setIdSerial] = useState<number>(0);
+    const refModalData = useRef<any[]>([]);
+    const refDrawerData = useRef<any[]>([]);
+
+    /**
+     *  兼容lcdapi.router
+     */
+    // lcdpApi.setRefs('ModalManager', ref);
+
+    // 解决取不到最新值
+    useMemo(() => {
+      refModalData.current = ModalData;
+      refDrawerData.current = DrawerData;
+    }, [ModalData, DrawerData]);
+    const open = ({
+      pagePath,
+      onOk,
+      onCancel,
+      params,
+      lcdpParentRenderId,
+      type,
+    }: any) => {
+      const instData = type === 'Modal' ? ModalData : DrawerData;
+      const instMethod = type === 'Modal' ? setModalData : setDrawerData;
+      if (!pagePath) {
+        console.error('弹窗操作失败：缺少页面实例ID或页面路径');
+        return;
+      }
+      const targetObj = instData.find(
+        (i) => i.pagePath && i.pagePath === pagePath,
+      );
+      if (targetObj) {
+        // 这个pagePath已经存在一个弹窗，改为打开它
+        targetObj.visible = true;
+        targetObj.params = params;
+        targetObj.onOk = onOk;
+        targetObj.lcdpParentRenderId = lcdpParentRenderId;
+        // targetObj.onCancel = onCancel;
+        instMethod([...instData]);
+      } else {
+        const modalInstId = `D${type}_${idSerial}`;
+        instMethod([
+          ...instData,
+          {
+            modalInstId,
+            pagePath,
+            visible: true,
+            onOk,
+            params,
+            lcdpParentRenderId,
+            onCancel: (() => () => {
+              let cancelResult;
+              if (onCancel) {
+                cancelResult = onCancel();
+              }
+              // cancelResult: 用于今后使用，如果onCancel返回false，表示取消关闭操作，不能关闭
+              if (cancelResult === false) {
+                return;
+              }
+              _close(modalInstId, null, type);
+            })(),
+          },
+        ]);
+        setIdSerial(idSerial + 1);
+      }
+    };
+    const _close = (modalInstId: any, pagePath?: any, type = 'Modal') => {
+      const instData =
+        type === 'Modal' ? refModalData.current : refDrawerData.current;
+      const instMethod = type === 'Modal' ? setModalData : setDrawerData;
+      if (modalInstId) {
+        const targetIndex = instData.findIndex(
+          (i) => i.modalInstId === modalInstId,
+        );
+        if (targetIndex !== -1) {
+          instData[targetIndex].visible = false;
+          instMethod([...instData]);
+        }
+      } else if (pagePath) {
+        instData
+          .filter((i) => i.pagePath === pagePath)
+          .forEach((i) => {
+            i.visible = false;
+          });
+        instMethod([...instData]);
+      }
+      if (!modalInstId && !pagePath) {
+        instData.forEach((i) => {
+          i.visible = false;
+        });
+        instMethod([...instData]);
+      }
+    };
+
+    // 更改弹窗属性值
+    const setStatue = ({
+      modalInstId,
+      pagePath,
+      type = 'model',
+      propsName,
+      propsValue,
+    }: {
+      modalInstId?: string;
+      pagePath?: string;
+      type: 'model' | 'drawer';
+      propsName: string;
+      propsValue: any;
+    }) => {
+      const instData =
+        type === 'model' ? refModalData.current : refDrawerData.current;
+      const instMethod = type === 'model' ? setModalData : setDrawerData;
+      if (modalInstId) {
+        const targetIndex = instData.findIndex(
+          (i: any) => i.modalInstId === modalInstId,
+        );
+        if (targetIndex !== -1) {
+          instData[targetIndex][propsName] = propsValue;
+          instMethod([...instData]);
+        }
+      } else if (pagePath) {
+        instData
+          .filter((i: any) => i.pagePath === pagePath)
+          .forEach((i: any) => {
+            i[propsName] = propsValue;
+          });
+        instMethod([...instData]);
+      }
+    };
+    useImperativeHandle<any, ModalManagerHooks>(ref, () => ({
+      /**
+       * 打开一个弹窗
+       * @param {Object} pageOptions
+       * @param {string|number} pageOptions.pagePath - 要打开的页面的pagePath
+       * @param {Object} pageOptions.params - 要传入给打开页面的数据
+       * @param {Object} pageOptions.onOk - 该弹窗确认回调
+       * @param {Object} pageOptions.onCancel - 该弹窗关闭回调
+       * @return {number} 此次生成的实例ID
+       */
+      openModal: (pageOptions: OpenModalProps) =>
+        open({
+          ...pageOptions,
+          type: 'Modal',
+        }),
+      /**
+       * 打开一个弹窗
+       * @param {Object} pageOptions
+       * @param {string|number} pageOptions.pagePath - 要打开的页面的pagePath
+       * @param {Object} pageOptions.params - 要传入给打开页面的数据
+       * @param {Object} pageOptions.onOk - 该弹窗确认回调
+       * @param {Object} pageOptions.onCancel - 该弹窗关闭回调
+       * @return {number} 此次生成的实例ID
+       */
+      openDrawer: (pageOptions: OpenDrawerProps) =>
+        open({
+          ...pageOptions,
+          type: 'Drawer',
+        }),
+      /**
+       * 关闭一个弹窗，不传参的话则是关闭所有弹窗
+       * @param {number} [modalInstId] - 要关闭的弹窗的实例ID
+       * @param {string|number} [pagePath] 该弹窗的pagePath，如果传入了pagePath，在ModalInstId为null时则为关闭所有对应pagePath的弹窗实例
+       */
+      closeModal: (instId, pagePath) => _close(instId, pagePath, 'Modal'),
+      /**
+       * 关闭一个推拉门，不传参的话则是关闭所有推拉门
+       * @param {number} [modalInstId] - 要关闭的推拉门的实例ID
+       * @param {string|number} [pagePath] 该弹窗的pagePath，如果传入了pagePath，在ModalInstId为null时则为关闭所有对应pagePath的弹窗实例
+       */
+      closeDrawer: (instId, pagePath) => _close(instId, pagePath, 'Drawer'),
+      /**
+       * 更改推拉门/弹窗属性 如弹窗标题
+       */
+      setStatue,
+    }));
+    console.log(ModalData);
+    const renderModalOrDrawer = (data: any[], map: any) => {
+      return data.map((m) => {
+        const Page = getSafePage(m.pagePath, map);
+        return (
+          <Page
+            {...m}
+            pageSrc={m.pagePath}
+            state={m.params}
+            lcdpParentRenderId={m.lcdpParentRenderId}
+            closeModal={m.onCancel}
+          />
+        );
+      });
+    };
+    return (
+      <div>
+        {renderModalOrDrawer(ModalData, ModalMap)}
+        {renderModalOrDrawer(DrawerData, DrawerMap)}
+      </div>
+    );
+  },
+);
+export default ModalManager;

package/lib/public/src/utils/Security/clientCapabilities.ts

@@ -0,0 +1,19 @@
+export const isBrowser =
+  typeof window !== 'undefined' && typeof window.document !== 'undefined';
+export const isNode =
+  typeof process !== 'undefined' &&
+  typeof process.versions !== 'undefined' &&
+  typeof process.versions.node !== 'undefined';
+export const isWXminiProgram = !isBrowser && typeof wx === 'object';
+
+const capabilities = (function () {
+  return {
+    cookie: isBrowser && navigator.cookieEnabled,
+    fetch: typeof fetch === 'function',
+    xhr: typeof XMLHttpRequest === 'function',
+    wxRequest: isWXminiProgram && typeof wx.request === 'function',
+    localStorage: typeof localStorage === 'object',
+  };
+})();
+
+export default capabilities;

package/lib/public/src/utils/Security/config.ts

@@ -0,0 +1,89 @@
+import merge from 'merge';
+import capabilities, { isBrowser } from './clientCapabilities';
+import {
+  aesKey,
+  desKey,
+  rsaPrivKey,
+  rsaPublicKey,
+  securityHeaderKey,
+  signHeaderKey,
+  signKey,
+  signSaltKey,
+} from './const';
+import type { configType } from './types';
+import { MODE } from './types';
+import CookieUtil from './utils/cookie';
+
+let isInit: boolean = false;
+
+// 在浏览器模式下，通过平台env/info.js写入配置数据
+const defaultMode = () =>
+  (isBrowser && (window as any).lxSecurityMode) || MODE.SIGN_WITH_TIME;
+const defaultSignSaltKey = () =>
+  (isBrowser && (window as any).lxDataSaltCode) || signSaltKey;
+const countTimeDeviation = () =>
+  isBrowser && (window as any).lxServerTime
+    ? Date.now() - (window as any).lxServerTime
+    : 0;
+
+export const createDefaultConfig = (): configType => ({
+  // 安全模式
+  mode: defaultMode(),
+
+  requester: ['xhr', 'fetch', 'wxRequest'],
+  // 签名&加密配置
+  sign: {
+    key: signKey,
+    saltKey: defaultSignSaltKey(),
+    saltValue: isBrowser
+      ? () => CookieUtil.get(config.sign?.saltKey as string)
+      : '',
+    valueKeyName: signHeaderKey,
+  },
+  aes: {
+    key: aesKey,
+  },
+  des: {
+    key: desKey,
+  },
+  rsa: {
+    privKey: rsaPrivKey,
+    publicKey: rsaPublicKey,
+  },
+
+  // 服务器与客户端时间偏差
+  timeDeviation: countTimeDeviation(),
+
+  // 服务器时间
+  serverTime: null,
+
+  // 通过请求头传递给后端安全类型的字段
+  securityHeaderKey,
+
+  debug: capabilities.localStorage
+    ? localStorage.getItem('lxDebug') === 'true'
+    : false,
+});
+
+const config: configType = {};
+
+const setConfig = (newConfig: configType = {}): void => {
+  // 只更新服务器时间时，重新计算时间偏差
+  if (
+    newConfig.serverTime &&
+    newConfig.serverTime !== config.serverTime &&
+    !newConfig.timeDeviation
+  ) {
+    newConfig.timeDeviation =
+      Date.now() - Number(new Date(newConfig.serverTime));
+  }
+  if (!isInit) {
+    isInit = true;
+    merge.recursive(config, createDefaultConfig(), newConfig);
+  } else {
+    merge.recursive(config, newConfig);
+  }
+};
+
+export default config;
+export { setConfig };

package/lib/public/src/utils/Security/const.ts

@@ -0,0 +1,129 @@
+// 不建议使用环境变量，后期通一通过config来配置
+// 兼容非node环境构建(如：小程序)
+if (typeof process === 'undefined') {
+  // eslint-disable-next-line no-global-assign
+  process = { env: {} } as any;
+}
+
+const defaultAESKey = [
+  'd',
+  '8',
+  '6',
+  'd',
+  '7',
+  'b',
+  'a',
+  'b',
+  '3',
+  'd',
+  '6',
+  'a',
+  'c',
+  '0',
+  '1',
+  'a',
+].join('');
+const defaultDESKey = ['9', '1', 'T', 'H', 'R', 'A', 'B', 'Y'].join('');
+const defaultSignHeaderKey = 'X-SIGN';
+
+export const lxKey = [
+  'd',
+  '8',
+  '6',
+  'd',
+  '7',
+  'b',
+  'a',
+  'b',
+  '3',
+  'd',
+  '6',
+  'a',
+  'c',
+  '0',
+  'I',
+  'a',
+].join('');
+
+export const securityHeaderKey = 'XA-TYPE';
+
+export const signSaltKey =
+  process.env.LING_XI_USER_KEY_IN_COOKIE || 'X-LX-N-ID';
+
+export const signKey =
+  process.env.LING_XI_HTTP_SIGN_KEY ||
+  [
+    'z',
+    'r',
+    'T',
+    '5',
+    'b',
+    'i',
+    '2',
+    'e',
+    's',
+    'c',
+    'X',
+    'i',
+    'l',
+    'a',
+    'H',
+    '1',
+    'f',
+    's',
+    '6',
+    '5',
+    '3',
+    'u',
+    'Z',
+    'i',
+    'H',
+    '9',
+    'R',
+    'W',
+    'f',
+    'z',
+    'C',
+    'S',
+  ].join('');
+
+export const signHeaderKey =
+  process.env.LINGXI_HTTP_SIGN_HEADER_KEY ||
+  process.env.REACT_APP_HTTP_SIGN_HEADER_KEY ||
+  process.env.UMI_APP_HTTP_SIGN_HEADER_KEY ||
+  process.env.FISHX_APP_HTTP_SIGN_HEADER_KEY ||
+  defaultSignHeaderKey;
+
+export const rsaPublicKey =
+  process.env.LINGXI_HTTP_RSA_PUBLIC_KEY ||
+  process.env.REACT_APP_HTTP_RSA_PUBLIC_KEY ||
+  process.env.UMI_APP_HTTP_RSA_PUBLIC_KEY ||
+  process.env.FISHX_APP_HTTP_RSA_PUBLIC_KEY;
+
+export const rsaPrivKey =
+  process.env.LINGXI_HTTP_RSA_PRIV_KEY ||
+  process.env.REACT_APP_HTTP_RSA_PRIV_KEY ||
+  process.env.UMI_APP_HTTP_RSA_PRIV_KEY ||
+  process.env.FISHX_APP_HTTP_RSA_PRIV_KEY;
+
+export const aesKey =
+  process.env.LINGXI_HTTP_AES_KEY ||
+  process.env.REACT_APP_HTTP_AES_KEY ||
+  process.env.UMI_APP_HTTP_AES_KEY ||
+  process.env.FISHX_APP_HTTP_AES_KEY ||
+  defaultAESKey;
+
+export const desKey =
+  process.env.LINGXI_HTTP_DES_KEY ||
+  process.env.REACT_APP_HTTP_DES_KEY ||
+  process.env.UMI_APP_HTTP_DES_KEY ||
+  process.env.FISHX_APP_HTTP_DES_KEY ||
+  defaultDESKey;
+
+export default {
+  signKey,
+  rsaPublicKey,
+  rsaPrivKey,
+  aesKey,
+  desKey,
+};

package/lib/public/src/utils/Security/encipher/aes.ts

@@ -0,0 +1,52 @@
+import CryptoJS from 'crypto-js';
+import type { fnAESDecryptType, fnAESEncryptType } from '../types';
+
+/**
+ * 默认AES加密处理函数
+ * @param content 待加密内容
+ * @param aesKey 密钥
+ * @param handle 自定义加密函数
+ * @returns 加密后内容
+ */
+export const AESEncrypt = (
+  content: string,
+  aesKey: string,
+  handle?: fnAESEncryptType,
+) => {
+  if (typeof handle === 'function') {
+    return handle(content, aesKey, CryptoJS);
+  }
+  const key = CryptoJS.enc.Utf8.parse(aesKey);
+  const ciphertext = CryptoJS.enc.Utf8.parse(content);
+  const encrypted = CryptoJS.AES.encrypt(ciphertext, key, {
+    mode: CryptoJS.mode.ECB,
+    padding: CryptoJS.pad.Pkcs7,
+  });
+  return encrypted.toString();
+};
+
+/**
+ * 默认AES解密处理函数
+ * @param content 待解密内容
+ * @param aesKey 密钥
+ * @param handle 自定义解密函数
+ * @returns 解密后内容
+ */
+export const AESDecrypt = (
+  content: string,
+  aesKey: string,
+  handle?: fnAESDecryptType,
+) => {
+  if (typeof handle === 'function') {
+    return handle(content, aesKey, CryptoJS);
+  }
+  const key = CryptoJS.enc.Utf8.parse(aesKey);
+  const ciphertext = CryptoJS.enc.Base64.stringify(
+    CryptoJS.enc.Base64.parse(content),
+  );
+  const encrypted = CryptoJS.AES.decrypt(ciphertext, key, {
+    mode: CryptoJS.mode.ECB,
+    padding: CryptoJS.pad.Pkcs7,
+  });
+  return encrypted.toString(CryptoJS.enc.Utf8);
+};