@lingxiteam/ebe-utils 0.0.10 → 0.0.11

package/lib/pcpublic/src/components/pcfactory/src/Table/types/headerCell.d.ts

@@ -0,0 +1,37 @@
+import type { EngineApisType } from '@lingxiteam/types';
+import type { ResizeCallbackData } from 'react-resizable';
+
+export type HeaderCellProps = React.HTMLAttributes<any> & {
+  onResize: (
+    e: React.SyntheticEvent<Element>,
+    data: ResizeCallbackData,
+  ) => void;
+  width: number;
+  isFlexColumn?: boolean;
+};
+
+export interface Code {
+  code: any;
+  originCode: string;
+}
+
+export interface Tip {
+  type: string;
+  icon: any;
+  iconPlacement?: string;
+  content: string | Code;
+  placement?: string;
+}
+
+export interface HeaderCellTitleProps {
+  size?: string;
+  column: {
+    title?: string;
+    titleLineNum?: number;
+    titleTip?: Tip;
+  };
+  mode?: 'editor' | 'engine';
+  funcExpExecute?: FuncExpExeCuteType;
+  sandBoxSafeRun?: any;
+  engineApis?: EngineApisType;
+}

package/lib/pcpublic/src/components/pcfactory/src/Table/types/prop.d.ts

@@ -0,0 +1,301 @@
+import type { TableProps } from 'antd/lib/table';
+import type { MyTableEventTypes } from './event';
+
+export type SummaryConfig = {
+  /**
+   * 不合计|单列|多列
+   */
+  type: 'none' | 'single' | 'multi';
+
+  /**
+   * 总结行名称
+   */
+  name?: string;
+
+  /**
+   * 单列合并值
+   */
+  col?: Array<ColItem>;
+
+  /**
+   * 多列合并
+   */
+  group?: Array<ColItem>;
+
+  /**
+   * 保留几位小数
+   */
+  decimal?: number;
+
+  /**
+   * 背景色
+   */
+  background?: string;
+};
+export interface TableBasePropTypes extends TableProps<any> {
+  className?: string;
+  style?: React.CSSProperties;
+
+  /**
+   * 数据源
+   */
+  dataSource: [];
+
+  /**
+   * 标识是否绑定了数据源
+   */
+  dataSourceFromDataSourceConfig?: string;
+
+  /**
+   * 刷新数据源时，是否开启加载中效果
+   */
+  dataSourceLoading?: boolean;
+
+  /**
+   * 行主键来源类型
+   */
+  rowKeyType?: 'rowKeyType' | 'auto';
+
+  /**
+   * 行主键来源类型为指定字段时，字段名
+   */
+  rowKey?: string;
+
+  /**
+   * 尺寸
+   */
+  size?: 'default' | 'middle' | 'small';
+
+  /**
+   * 边框类型
+   */
+  borded?: 'segmentation' | 'zebra' | 'border';
+
+  /**
+   * 是否显示
+   */
+  visible?: boolean;
+
+  /**
+   * 是否开启可拖拽列宽
+   */
+  isFlexColumn?: boolean;
+
+  /**
+   *
+   */
+  scroll?: false | { x: number; y: number };
+
+  /**
+   * 适应方式
+   */
+  adjustModel?: 'auto' | 'fill';
+
+  /**
+   * 内容列配置
+   */
+  columns: any[];
+
+  /**
+   * 单元格样式配置
+   */
+  colorFormatInfo?: any[];
+
+  /**
+   * 这是啥呢？
+   * @deprecated 是否废弃？
+   */
+  pageState?: any;
+
+  /**
+   * 运行时所属应用id
+   * @deprecated 将要废弃或已废弃，统一从 $$componentItem 获取
+   */
+  appId?: string;
+
+  /**
+   * 运行时所属页面id
+   * @deprecated 将要废弃或已废弃，统一从 $$componentItem 获取
+   */
+  pageId?: string;
+
+  /**
+   * 引擎能力
+   */
+  getEngineApis?: () => EngineApisType;
+
+  /**
+   * 组件运行时引擎透露信息
+   */
+  $$componentItem: ComponentItemType;
+
+  /**
+   * 总结合计行
+   */
+  summaryTotal?: SummaryConfig;
+}
+
+export interface TablePaginationPropTypes {
+  /**
+   * 是否开启分页
+   */
+  page?: boolean;
+
+  /**
+   * 分页开启后，当前页
+   */
+  current?: number;
+
+  /**
+   * 分页开启后，每页条数
+   */
+  pageSize?: number;
+
+  /**
+   * 分页开启后，是否显示总条数
+   */
+  showTotal?: boolean;
+
+  /**
+   * 分页开启后，总条数值
+   */
+  total?: number;
+
+  /**
+   * 分页开启后，是否显示每页条数选择
+   */
+  showSizeChanger?: boolean;
+
+  /**
+   * 分页开启后，每页条数可选值配置
+   */
+  pageSizeOptions?: string;
+
+  /**
+   * 分页开启后，是否显示快速跳转分页
+   */
+  showQuickJumper?: boolean;
+}
+
+export interface TableEditPropTypes {
+  /**
+   * 编辑模式
+   */
+  editMode?: 'single' | 'multiple';
+
+  /**
+   * 行编辑是否禁用判断
+   */
+  rowEditableRule?: any;
+
+  /**
+   * 操作列内置按钮的配置
+   */
+  rowActions?: any[];
+
+  /**
+   * 操作列扩展按钮的配置
+   */
+  extend?: any[];
+
+  /**
+   * 操作列展示按钮的最大数量
+   */
+  extendNum?: number;
+
+  /**
+   * 是否固定操作列
+   */
+  fixedAction?: boolean;
+
+  /**
+   * 是否隐藏操作列
+   */
+  hiddenAction?: boolean;
+
+  /**
+   * 操作列固定宽度
+   */
+  actionWidth?: number;
+}
+
+export interface TableRowExpandPropTypes {
+  /**
+   * 是否可以行展开规则
+   */
+  rowExpandable?: any;
+
+  /**
+   * 是否全部展开所有行
+   */
+  defaultExpandAllRows?: boolean;
+
+  /**
+   * 是否点击行展开
+   */
+  expandRowByClick?: boolean;
+
+  /**
+   * 默认展开行，例如："[\"1\"]"
+   */
+  defaultExpandedRowKeys?: string;
+
+  /**
+   * 展开图标的位置的基准列
+   */
+  expandIconPositionRef?: { title: string; dataIndex?: string };
+
+  /**
+   * 展开图标位于基准列的方向位置
+   */
+  expandIconPosition?: 'left' | 'right';
+
+  /**
+   * 处于展开时，显示的图标配置
+   */
+  expandCloseIcon?: any;
+
+  /**
+   * 处于收缩时，显示的图标配置
+   */
+  expandOpenIcon?: any;
+
+  /**
+   * 行展开的扩展内容（业务组件）配置
+   */
+  expandComponents?: any[];
+}
+
+export interface TableRowSelectPropType {
+  /**
+   * 选择模式
+   */
+  rowSelection?:
+    | false
+    | {
+        type: 'radio' | 'checkbox';
+      };
+
+  /**
+   * 可选表格行选择是否禁用判断
+   */
+  rowSelectionDisabled?: any;
+
+  /**
+   * 父子联动选择
+   */
+  checkLoosed?: boolean;
+}
+
+export type MyTableProps = TableBasePropTypes &
+  TablePaginationPropTypes &
+  TableEditPropTypes &
+  TableRowExpandPropTypes &
+  TableRowSelectPropType &
+  MyTableEventTypes;
+
+export type LevelItem<T> = {
+  __parent__?: LevelItem<T>;
+  __key__: string | number;
+  __children__?: LevelItem<T>[];
+} & T;

package/lib/pcpublic/src/components/pcfactory/src/Table/utils/index.ts

@@ -2,12 +2,18 @@ import { Table } from 'antd';
 import { LevelItem } from '../types/prop';
 // 以下逻辑调整时需同步到packages/editor/src/Input/TableColorGroup/utils.ts
 export const treeRootName = 'tree-root';
+export const hiddenHeaderCellClass = 'ued-table-hidden-head-cell';
 export type SingleRowInfo = {
   [rowIndex: number]: {
     rowIdAndTitleColMap: any;
     nextRowsChildren: any;
   };
 };
+// 获取分组名称，为空的向下补全
+const findGroupName = (groupList: string[], startIndex: number) => {
+  const list = groupList.slice(startIndex);
+  return list.find((g) => !!g) || '';
+};
 export const handleMultiLevelHeader = (leftTree: any, column: any) => {
   const { fixed = '' } = column;
   let { group } = column;
@@ -23,8 +29,8 @@ export const handleMultiLevelHeader = (leftTree: any, column: any) => {
   }
 
   // 过滤掉空的配置
-  group = group.filter((g: any) => g);
-  // 保留一个空配置，以进入构造
+  // group = group.filter((g: any) => g);
+  // // 保留一个空配置，以进入构造
   group = group.length === 0 ? [''] : group;
 
   const groupLen = group.length;
@@ -67,7 +73,7 @@ export const handleMultiLevelHeader = (leftTree: any, column: any) => {
       }
 
       const rightTreeCurrLevelLast: any = {
-        title: group[rightLevel - 1] || '', // 为空的话，强制设置为 ''
+        title: findGroupName(group, rightLevel - 1), // 为空的话，强制设置为 ''
         // 当前层为第一层时，将parent指向左树的根节点，为后续合并做准备
         parent: tempRightTree.title === treeRootName ? leftTree : tempRightTree,
         //
@@ -106,47 +112,91 @@ export const handleMultiLevelHeader = (leftTree: any, column: any) => {
     }
 
     // 遍历右树（i 表示右树的层级）：
-    for (let i = 0; i <= groupLen + 1; i += 1) {
+    for (let i = 0; i <= groupLen; i += 1) {
       const leftTreeLast = leftTreeLevelMap[i]; // 左树第i层的最后一个
       const current = rightTreeLevelMap[i]; // 右树第 i 层的最后一个（唯一一个）
-
-      // 当前层相同组名相同
-      if (
+      if (i === 0) {
+        if (!leftTreeLast.children) {
+          leftTreeLast.children = [];
+        }
+        leftTreeLast.children.push(...(current?.children || []));
+      } else if (
+        current &&
         current?.title === leftTreeLast?.title &&
-        // 如果是第一层，还要额外比对列固定配置是否相同
-        i === 1
-          ? current?.fixed === leftTreeLast?.fixed
-          : true
+        current?.fixed === leftTreeLast?.fixed
       ) {
-        // 需要进一步比较下一层组名是否相同
-        const currentNext = rightTreeLevelMap[i + 1];
-        const leftTreeNextLast = leftTreeLevelMap[i + 1]; // 左树第i层的最后一个
+        current.colSpanStart = leftTreeLast?.colSpanStart || leftTreeLast;
+        const colSpan = current?.colSpanStart?.colSpan || 1;
+        current.colSpanStart.colSpan = colSpan + 1;
+        // 被合并的单元格隐藏
+        current.className = hiddenHeaderCellClass;
+      }
+      if (current) {
+        current.colSpan = 1;
+      }
+    }
+  }
+};
 
-        // 如果相同 且 右树下一层非最后一层(即，有 children)，则continue，直接进行下一层处理
+// 合并上下相同的分组
+export const handleMergeHeader = <
+  T extends {
+    title?: string;
+    className?: string;
+    children?: T[];
+    colSpan?: number;
+  },
+>(
+  columns?: Array<T>,
+) => {
+  const getRowSpan = (col: T) => {
+    let span = 1;
+    const newCol = { ...col };
+    let current: T | null = newCol;
+    while (current !== null) {
+      if (current?.children?.length === 1) {
+        const next: T = current.children?.[0];
         if (
-          currentNext?.title === leftTreeNextLast?.title &&
-          currentNext?.children &&
-          Array.isArray(currentNext?.children)
+          next.title === col?.title &&
+          col?.title &&
+          next.className !== hiddenHeaderCellClass &&
+          col?.colSpan === next?.colSpan
         ) {
-          // eslint-disable-next-line no-continue
-          continue;
+          // 分组名一致，上下合并
+          span += 1;
+          next.className = hiddenHeaderCellClass;
+          current = next;
         } else {
-          // 如果不相同，则直接将右树的下一层接入左树的下一层
-          if (leftTreeLast?.children) {
-            leftTreeLast.children.push(...current.children);
-          } else {
-            leftTreeLast.children = [...current.children];
-          }
-          // 退出循环，等待合并下一列右树
           break;
         }
       } else {
-        // 当前层组名不同，则直接将右树，并入左树
-        leftTreeLast.parent.children.push(current);
         break;
       }
     }
-  }
+    return {
+      ...newCol,
+      rowSpan: span,
+    };
+  };
+  const recursive = (cols: T[]) => {
+    return cols.map((col) => {
+      if (col?.title) {
+        const { rowSpan } = getRowSpan(col);
+        if (rowSpan > 1) {
+          return {
+            ...col,
+            rowSpan,
+            // 重置一下子级，将相同的分组上下合并
+          };
+        }
+      }
+      if (col.children) {
+        col.children = recursive(col.children);
+      }
+      return col;
+    });
+  };
+  return recursive(columns || []);
 };
 
 export const handleExpandColumn = ({
@@ -198,7 +248,9 @@ export const EMPTY_ROW_TEMP_KEY_ATTR = '_lxTempKey';
 export const LATEST_EMPTY_ROW_FLAG_ATTR = '_latestCreation';
 
 export const deleteTempRowProperties = (row: any) => {
-  delete row?.[LATEST_EMPTY_ROW_FLAG_ATTR];
+  if (row) {
+    delete row[LATEST_EMPTY_ROW_FLAG_ATTR];
+  }
 };
 
 export const createEmptyRow = () => ({

package/lib/pcpublic/src/components/pcfactory/src/Table/utils/indexedDBHelper.ts

@@ -0,0 +1,119 @@
+export interface DataProps {
+  userId: string;
+  appId: string;
+  compId: string;
+  order?: any[];
+  selected?: any[];
+  save: boolean;
+}
+
+// 定义正则表达式
+const PATTERN = /[^?]+/;
+const DBNAME = 'TABLE_CUSTOM';
+const isIE = !!((window as any).ActiveXObject || 'ActiveXObject' in window);
+
+const getOrSaveData = (actionData: DataProps) => {
+  return new Promise((resolve) => {
+    const pagePatch =
+      window.location.hash?.match(PATTERN)?.[0]?.replace(/^#\//, '') || '';
+    const pageKey = `${actionData.appId}_${pagePatch}_${actionData.userId}`;
+    //  兼容浏览器
+    const indexedDB =
+      window.indexedDB ||
+      (window as any).mozIndexedDB ||
+      (window as any).webkitIndexedDB ||
+      (window as any).msIndexedDB;
+
+    if (indexedDB) {
+      let version = new Date().getTime();
+      if (isIE) {
+        // ie上版本号最多支持9位数，做下兼容，取时间戳中间9位
+        version = parseInt(version.toString().substring(2, 11), 10);
+      }
+      // 打开数据库，若没有则会创建
+      const request = indexedDB.open(DBNAME, version);
+      // 数据库打开成功回调
+      request.onsuccess = (event: any) => {
+        // console.log('打开数据库成功');
+        const db = event.target.result; // 数据库对象
+        const transaction = db.transaction([pageKey], 'readwrite');
+        const objectStore = transaction.objectStore(pageKey);
+        // 保存数据
+        if (actionData.save) {
+          const actionPut = objectStore.put({
+            ORDER: actionData.order,
+            SELECTED: actionData.selected,
+            id: actionData.compId,
+          });
+          actionPut.onsuccess = (e: any) => {
+            // console.log('数组插入成功');
+            db.close();
+          };
+          actionPut.onerror = () => {
+            db.close();
+          };
+        } else {
+          // 读取数据
+          const action = objectStore.get(actionData.compId);
+          action.onsuccess = (e: any) => {
+            // 获取对象成功
+            resolve(e.target.result);
+            db.close();
+          };
+          action.onerror = () => {
+            resolve({});
+            db.close();
+          };
+        }
+      };
+      // 数据库打开失败的回调
+      request.onerror = (event) => {
+        console.log('indexedDB数据库打开报错:', event);
+        resolve({});
+      };
+      request.onupgradeneeded = (event: any) => {
+        const db = event.target.result; // 数据库对象
+        if (db.objectStoreNames?.length > 100) {
+          db.deleteObjectStore(db.objectStoreNames[0]);
+        }
+        if (!db.objectStoreNames.contains(pageKey)) {
+          db.createObjectStore(pageKey, { keyPath: 'id' });
+        }
+      };
+    } else {
+      // 不支持indexDB,就用localStorage存储
+      const allData: any = JSON.parse(
+        window.localStorage.getItem(DBNAME) || '{}',
+      );
+      if (actionData.save) {
+        // 超过100个就删掉一些
+        let allKeys = Object.keys(allData);
+        if (allKeys.length > 100) {
+          delete allData[allKeys[0]];
+        }
+        allKeys = Object.keys(allData);
+        if (allKeys.includes(pageKey)) {
+          const data: any = allData[pageKey];
+          data[actionData.compId] = {
+            ORDER: actionData.order,
+            SELECTED: actionData.selected,
+          };
+        } else {
+          allData[pageKey] = {
+            [actionData.compId]: {
+              ORDER: actionData.order,
+              SELECTED: actionData.selected,
+            },
+          };
+        }
+        window.localStorage.setItem(DBNAME, JSON.stringify(allData));
+      } else if (allData?.[pageKey]?.[actionData.compId]) {
+        resolve(allData[pageKey][actionData.compId]);
+      } else {
+        resolve({});
+      }
+    }
+  });
+};
+
+export { getOrSaveData };

package/lib/pcpublic/src/components/pcfactory/src/Transfer/index.tsx

@@ -13,7 +13,7 @@ import {
   useListenProps,
 } from '../utils';
 import CustomModule from '../utils/CustomModule';
-import { customLocale } from '../utils/Empty/customLocale';
+import EmptyComp from '../utils/Empty';
 import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
 import { useLocale } from '../utils/hooks/useLocale';
 
@@ -131,7 +131,8 @@ const MyTransfer = LingxiForwardRef<any, MyTransferProps>((props, ref) => {
     ...restProps
   } = props;
 
-  const { sandBoxSafeRun, sandBoxLoadModule } = getEngineApis() || {};
+  const { sandBoxSafeRun, sandBoxLoadModule, dataState } =
+    getEngineApis() || {};
 
   const { getLocale, lang } = useLocale(getEngineApis());
 
@@ -548,7 +549,11 @@ const MyTransfer = LingxiForwardRef<any, MyTransferProps>((props, ref) => {
           }
           return (
             <Table
-              locale={customLocale}
+              locale={{
+                emptyText: (
+                  <EmptyComp dataState={dataState} getLocale={getLocale} />
+                ),
+              }}
               columns={finalColumns}
               dataSource={currentDataSource}
               rowKey={`${uid}`}

package/lib/pcpublic/src/components/pcfactory/src/Tree/index.tsx

@@ -224,9 +224,12 @@ const MyTree = LingxiForwardRef<any, MyTreeProps>((props, ref) => {
     setSelectAll(_flag: boolean) {
       setIsSelectAll(_flag);
     },
-    setSelectedKeys(keys: any[]) {
+    setSelectedKeys(keys: any[] | string) {
       if (Array.isArray(keys)) {
         setSelectedKeys(keys);
+      } else {
+        // 兼容浩鲸E之前版本设置选中数据
+        setSelectedKeys([keys]);
       }
     },
     setRightMenuData(rightInfo: any) {

package/lib/pcpublic/src/components/pcfactory/src/TreeSelect/index.tsx

@@ -9,6 +9,8 @@ import {
   useCommonImperativeHandle,
   useListenProps,
 } from '../utils';
+import EmptyComp from '../utils/Empty';
+import { useLocale } from '../utils/hooks/useLocale';
 import { flattenTreeData, renderCommonList } from '../utils/renderReadOnly';
 
 const { TreeNode } = TreeSelect;
@@ -136,7 +138,7 @@ const MyTreeSelect = LingxiForwardRef<any, MyTreeSelectProps>((props, ref) => {
 
   const engineApis = getEngineApis?.() || {};
 
-  const { onlySyncValue } = engineApis;
+  const { onlySyncValue, dataState } = engineApis;
 
   // 加载数据字段映射
   const [treeService, setTreeService] = useListenProps(props.treeService);
@@ -153,6 +155,8 @@ const MyTreeSelect = LingxiForwardRef<any, MyTreeSelectProps>((props, ref) => {
   // 用来记录当前展开的key，节点展开事件中以获取展开的节点
   const [expandedKeys, setExpandedKeys] = useState<any[]>([]);
 
+  const { getLocale } = useLocale(engineApis);
+
   const { formFieldsRef, required, readOnly, disabled, finalRules } =
     useCommonImperativeHandle(ref, props, {
       get dataSource() {
@@ -610,6 +614,13 @@ const MyTreeSelect = LingxiForwardRef<any, MyTreeSelectProps>((props, ref) => {
           }
           resetSelectAll();
         }}
+        notFoundContent={
+          <EmptyComp
+            getLocale={getLocale}
+            dataState={dataState}
+            clsName="pcfactory-empty-small"
+          />
+        }
         onTreeExpand={(keys) => {
           setExpandedKeys(keys);
           // 展开的时候触发