@lingxiteam/ebe-utils 0.0.10 → 0.0.11

package/lib/pcpublic/src/components/pcfactory/src/Table/hooks/useColumns.tsx

@@ -29,10 +29,12 @@ import HeaderCellTitle from '../HeaderCell/HeaderCellTitle';
 import {
   compareFn,
   handleExpandColumn,
+  handleMergeHeader,
   handleMultiLevelHeader,
   handleRecursiveParseColumns,
   treeRootName,
 } from '../utils';
+import { getOrSaveData } from '../utils/indexedDBHelper';
 
 const ACTION_COL_KEY = '_actions';
 
@@ -97,10 +99,16 @@ const useColumns = (props: any) => {
     getLocale,
     onTableCellClick,
     getRealIndexById,
+    showCustom,
   } = props;
 
   const actionsMap: any = actionsMapFn(getLocale);
 
+  const { customEngineApi, getUserInfo } = engineApis || {};
+
+  const { userId = '' } = getUserInfo?.() || {};
+  const fatherBOFramerId = customEngineApi?.getFatherComId?.();
+
   // const api = getApis();
 
   const tableRef = useRef<any>();
@@ -393,7 +401,7 @@ const useColumns = (props: any) => {
           index,
           i,
           btnList,
-          undefined,
+          isPopover,
           btnList?.slice(i),
         );
       }
@@ -536,6 +544,9 @@ const useColumns = (props: any) => {
                 }
                 trigger="click"
                 placement="topRight"
+                getPopupContainer={(triggerNode: HTMLElement) =>
+                  triggerNode?.parentNode as HTMLElement
+                }
               >
                 <Button
                   type="link"
@@ -737,11 +748,12 @@ const useColumns = (props: any) => {
                 };
               }
 
+              // 动态列标记一下，合计行需要根据key处理
+              realCol.dynamicOriginKey = realCol.key;
               // key增强，拼接index，防止重复
               realCol.key = `${realCol.key}_${index}`;
-
               // 移除动态列标识字段，和动态列数据源字段
-              delete realCol.type;
+              // delete realCol.type;
               delete realCol.dataSource;
               return realCol;
             });
@@ -900,7 +912,7 @@ const useColumns = (props: any) => {
    * customCols：左右固定列 + 已选的、自定义顺序的列
    * customizableCols：可自定义(显隐、顺序)的列
    */
-  const [customCols, customizableCols] = useMemo(() => {
+  const [customCols, customizableCols, groupMark] = useMemo(() => {
     const fixedLeft: any[] = [];
     const fixedRight: any[] = [];
     let newColumns = [...columns];
@@ -915,6 +927,8 @@ const useColumns = (props: any) => {
     const colMap: any = {};
     // 记录重新调整列内容后之前没有的列
     const extendCols: any[] = [];
+    // 记录每层分组的数量
+    const group = new Map<number, number>();
     columns.forEach((c: any, i: number) => {
       try {
         let isHidden;
@@ -943,6 +957,17 @@ const useColumns = (props: any) => {
             extendCols.push(newCol);
           }
         }
+        if (!isHidden && newCol?.group) {
+          newCol.group.forEach((c: string, gi: number) => {
+            if (!group.has(gi)) {
+              group.set(gi, 0);
+            }
+            const len = group.get(gi) || 0;
+            if (c) {
+              group.set(gi, len + 1);
+            }
+          });
+        }
       } catch (e) {
         console.log(e);
       }
@@ -962,7 +987,7 @@ const useColumns = (props: any) => {
     );
     // 固定列与自定义列拼接在一起组成最终展示列
     customCols = fixedLeft.concat(customCols).concat(fixedRight);
-    return [customCols, customizableCols];
+    return [customCols, customizableCols, group];
   }, [columns, colCustomOrder, customSelectedCols]);
 
   const actionRowFlag = useRef<boolean>(false);
@@ -1112,7 +1137,7 @@ const useColumns = (props: any) => {
 
   const finalcolumns: any[] = useMemo(() => {
     const newColumns = [...customCols];
-    const finalCols: ColumnProps<any>[] = [];
+    let finalCols: ColumnProps<any>[] = [];
 
     // 用于表格头分组的数据结构：左树根节点，为第0层
     const leftTree: any = {
@@ -1517,6 +1542,13 @@ const useColumns = (props: any) => {
         );
       }
 
+      if (c?.group) {
+        // 过滤掉整层为空的分组
+        c.group = c.group.filter(
+          (_: string, gi: number) => groupMark.get(gi) !== 0,
+        );
+      }
+
       // 处理分组逻辑
       handleMultiLevelHeader(leftTree, newColumns[i]);
     });
@@ -1528,6 +1560,8 @@ const useColumns = (props: any) => {
       finalCols.push(...newColumns);
     }
 
+    finalCols = handleMergeHeader(finalCols as any[]) || finalCols;
+
     if (
       !hiddenAction &&
       ((rowActions && rowActions.length) || (extend && extend.length))
@@ -1759,7 +1793,6 @@ const useColumns = (props: any) => {
       setTimeout(() => {
         const thList =
           tableRef?.current?.querySelectorAll('colgroup')?.[1]?.children || [];
-
         for (let i = 0; i < thList.length; i += 1) {
           const rowWidth = thList[i].offsetWidth;
           columnWidth[i] = rowWidth;
@@ -1776,40 +1809,64 @@ const useColumns = (props: any) => {
 
   // 将自定义列地相关操作记录到sessionStorage中，刷新时保留
   useEffect(() => {
+    // 需要开启自定义列才进行存储
     if (
       compId &&
-      (colCustomOrder?.length > 0 || customSelectedCols !== undefined)
+      (colCustomOrder?.length > 0 || customSelectedCols !== undefined) &&
+      showCustom?.hasCustom
     ) {
-      const tableStr: string =
-        window.sessionStorage.getItem('TABLE_CUSTOM') || '{}';
-      try {
-        const tableInfo = JSON.parse(tableStr);
-        if (!tableInfo[compId]) {
-          tableInfo[compId] = {};
-        }
-        const target = tableInfo[compId];
-        target.ORDER = colCustomOrder;
-        target.SELECTED = customSelectedCols;
-        const newRes = JSON.stringify(tableInfo);
-        if (tableStr !== newRes) {
-          window.sessionStorage.setItem('TABLE_CUSTOM', newRes);
-        }
-      } catch (e) {
-        //
-      }
+      // const tableStr: string = window.sessionStorage.getItem('TABLE_CUSTOM') || '{}';
+      // try {
+      //   const tableInfo = JSON.parse(tableStr);
+      //   if (!tableInfo[compId]) {
+      //     tableInfo[compId] = {};
+      //   }
+      //   const target = tableInfo[compId];
+      //   target.ORDER = colCustomOrder;
+      //   target.SELECTED = customSelectedCols;
+      //   const newRes = JSON.stringify(tableInfo);
+      //   if (tableStr !== newRes) {
+      //     window.sessionStorage.setItem('TABLE_CUSTOM', newRes);
+      //   }
+      // } catch (e) {
+      //   //
+      // }
+
+      // 修改数据的存储方法
+      getOrSaveData({
+        appId: props?.appId || props?.$$componentItem?.appId || '',
+        userId,
+        compId: fatherBOFramerId
+          ? `${fatherBOFramerId}-${props.$$componentItem?.uid}`
+          : props.$$componentItem?.uid,
+        save: true,
+        order: colCustomOrder,
+        selected: customSelectedCols,
+      });
     }
-  }, [colCustomOrder, customSelectedCols, compId]);
+  }, [colCustomOrder, customSelectedCols, compId, showCustom]);
 
   useEffect(() => {
-    if (compId) {
-      const tableStr: string =
-        window.sessionStorage.getItem('TABLE_CUSTOM') || '{}';
-      const tableInfo = JSON.parse(tableStr);
-      const { ORDER = [], SELECTED } = tableInfo[compId] || {};
-      setColCustomOrder(ORDER);
-      setCustomSelectedCols(SELECTED);
+    if (compId && showCustom?.hasCustom) {
+      // const tableStr: string = window.sessionStorage.getItem('TABLE_CUSTOM') || '{}';
+      // const tableInfo = JSON.parse(tableStr);
+      // const { ORDER = [], SELECTED } = tableInfo[compId] || {};
+      // setColCustomOrder(ORDER);
+      // setCustomSelectedCols(SELECTED);
+      getOrSaveData({
+        appId: props?.appId || props?.$$componentItem?.appId || '',
+        userId,
+        compId: fatherBOFramerId
+          ? `${fatherBOFramerId}-${props.$$componentItem?.uid}`
+          : props.$$componentItem?.uid,
+        save: false,
+      }).then((result: any) => {
+        const { ORDER = [], SELECTED } = result || {};
+        setColCustomOrder(ORDER);
+        setCustomSelectedCols(SELECTED);
+      });
     }
-  }, [compId]);
+  }, [compId, showCustom]);
 
   useEffect(() => {
     const newColumns = [...columns];

package/lib/pcpublic/src/components/pcfactory/src/Table/hooks/useSelection.ts

@@ -254,17 +254,28 @@ const useSelection = <T extends { [key: string]: unknown }>(
   const onRowSelectClick = (record: any, index?: number) => {
     // 行禁用，不允许界面选中
     if (rowSelection && !handleIsRowSelectDisabled(record, index)) {
-      if (selectedRowKeys.includes(record[currentRowKey])) {
-        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-        rowSelection.type === 'radio'
-          ? onRowSelected([record], true)
-          : onRowSelected(triggerSingleSelection(selectedRows, record), true);
-      } else {
-        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-        rowSelection.type === 'radio'
-          ? onRowSelected([record], true)
-          : onRowSelected(triggerSingleSelection(selectedRows, record), true);
-      }
+      // 下面if else代码一样？？
+      // if (selectedRowKeys.includes(record[currentRowKey])) {
+      //   // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+      //   rowSelection.type === 'radio'
+      //     ? onRowSelected([record], true)
+      //     : onRowSelected(
+      //       triggerSingleSelection(selectedRows, record),
+      //       true,
+      //     );
+      // } else {
+      //   // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+      //   rowSelection.type === 'radio'
+      //     ? onRowSelected([record], true)
+      //     : onRowSelected(
+      //       triggerSingleSelection(selectedRows, record),
+      //       true,
+      //     );
+      // }
+
+      rowSelection.type === 'radio'
+        ? onRowSelected([record], true)
+        : onRowSelected(triggerSingleSelection(selectedRows, record), true);
     }
   };
 

package/lib/pcpublic/src/components/pcfactory/src/Table/hooks/useSummaryCol.ts

@@ -17,7 +17,12 @@ export type ColItem = {
 export type Column = {
   key?: string;
   dataIndex: string;
-  type?: string;
+  type?: 'orderCol' | 'dynamicCol';
+
+  /**
+   * 动态列原始key
+   */
+  dynamicOriginKey?: string;
   fixed?: TableColumnProps<any>['fixed'];
   align?: TableColumnProps<any>['align'];
   children?: Array<Column>;
@@ -29,7 +34,10 @@ export interface SummaryProps<T> {
 }
 const useSummaryCol = <T>(props: SummaryProps<T>) => {
   const { summaryConfig, dataSource, columns } = props;
-  const { summaryType, summaryGroup } = useMemo(() => {
+  const { summaryType, summaryGroup } = useMemo<{
+    summaryType: SummaryConfig['type'];
+    summaryGroup: SummaryConfig['group'];
+  }>(() => {
     if (!summaryConfig) {
       return {
         summaryType: 'none',
@@ -44,6 +52,24 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
     };
   }, [summaryConfig]);
 
+  // 真实的字段columns
+  const fieldColumns = useMemo(() => {
+    const colList: typeof columns = [];
+    const recursive = (arr: typeof columns) => {
+      if (Array.isArray(arr)) {
+        arr.forEach((c) => {
+          if (c?.children?.length) {
+            recursive(c.children);
+          } else {
+            colList.push(c);
+          }
+        });
+      }
+    };
+    recursive(columns);
+    return colList;
+  }, [columns]);
+
   const summaryColIndexMap = useMemo(() => {
     const map = new Map<
       string,
@@ -80,6 +106,7 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
       colSpan?: number;
       dataIndexList?: string[];
       operateType?: ColItem['operateType'];
+      type?: Column['type'];
       prev?: {
         index: number;
         fixed?: TableColumnProps<T>['fixed'];
@@ -88,8 +115,19 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
     }> = [];
     // 标记当前已经记录的总结列
     const currentSummaryColMap: Record<number, (typeof col)[number]> = {};
-    columns?.forEach((c, i) => {
-      if (i === 0 && c.type === 'orderCol' && summaryConfig?.name) {
+    fieldColumns?.forEach((c, i) => {
+      const { key, dataIndex, dynamicOriginKey, type } = c;
+      let matchKey = key;
+      if (type === 'dynamicCol' && dynamicOriginKey) {
+        matchKey = dynamicOriginKey;
+      }
+      const summaryCol = summaryColIndexMap.get(matchKey || '');
+      // 首列是序号列或者是没有参与合并的，用于展示合并文案
+      if (
+        i === 0 &&
+        (type === 'orderCol' || !summaryCol) &&
+        summaryConfig?.name
+      ) {
         col.push({
           title: summaryConfig?.name,
           align: c.align,
@@ -99,9 +137,8 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
           title: '',
           dataIndexList: [],
           align: c.align,
+          type,
         };
-        const { key, dataIndex } = c;
-        const summaryCol = summaryColIndexMap.get(key || '');
         if (summaryCol) {
           const { index, operateType } = summaryCol;
           if (currentSummaryColMap[index]) {
@@ -109,9 +146,15 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
             if (
               prevItem?.prev &&
               i === prevItem?.prev?.index + 1 &&
-              prevItem?.prev?.fixed === c?.fixed
+              prevItem?.prev?.fixed === c?.fixed &&
+              !(
+                summaryType === 'single' &&
+                type === 'dynamicCol' &&
+                type === prevItem?.type
+              )
             ) {
               // 勾选列是相邻的，则允许合并
+              // 单列合计时，需排除动态列情况
               item = prevItem;
             } else {
               // 单独一列
@@ -180,7 +223,7 @@ const useSummaryCol = <T>(props: SummaryProps<T>) => {
     dataSource,
     summaryConfig?.name,
     summaryConfig?.decimal,
-    columns,
+    fieldColumns,
     summaryColIndexMap,
   ]);
   return {

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

@@ -5,10 +5,10 @@
 /* eslint-disable no-underscore-dangle */
 import { Form, Table } from 'antd';
 import classnames from 'classnames';
-import React, { useRef } from 'react';
+import React, { useMemo, useRef } from 'react';
 import { PrintContainer, usePrintMode } from '../utils';
 import { useCreation } from '../utils/ahooks';
-import { customLocale } from '../utils/Empty/customLocale';
+import EmptyComp from '../utils/Empty';
 import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
 import { useLocale } from '../utils/hooks/useLocale';
 import BodyCell from './BodyCell';
@@ -76,7 +76,7 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
   const [form] = Form.useForm();
 
   const engineApis = getEngineApis?.();
-  const { sandBoxSafeRun, renderBusiComponent } = engineApis || {};
+  const { sandBoxSafeRun, renderBusiComponent, dataState } = engineApis || {};
 
   const { getLocale } = useLocale(engineApis || {});
 
@@ -396,6 +396,11 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
     'data-compid': (props as any)?.['data-compid'],
   };
 
+  const isEmptyLoading = useMemo(
+    () => loading && sortDataSource?.length === 0,
+    [loading, sortDataSource],
+  );
+
   return visible ? (
     <Form form={form}>
       <div
@@ -416,7 +421,11 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
         <Table
           // {...restProps} // TODO: 不要这么透传，需要什么传什么，先注释，之后缺什么再补
           {...tableProps}
-          locale={customLocale}
+          locale={{
+            emptyText: (
+              <EmptyComp dataState={dataState} getLocale={getLocale} />
+            ),
+          }}
           ref={tableRef}
           // loading={loading}
           bordered={isBordered}
@@ -461,9 +470,10 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
             };
           }}
           rowSelection={rowSelection}
-          dataSource={sortDataSource}
+          // loading没有数据的时候模拟3个数据,当数据为空时依然展示骨架屏
+          dataSource={isEmptyLoading ? [{}, {}, {}] : sortDataSource}
           expandable={realExpandable}
-          pagination={page && pagination}
+          pagination={isEmptyLoading ? false : page && pagination}
           summary={(pageData: any[]) => (
             <Table.Summary fixed={!!props?.scroll}>
               <TableSummaryRow
@@ -471,6 +481,7 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
                 dataSource={pageData as any[]}
                 summary={props.summary}
                 summaryConfig={props?.summaryTotal}
+                selectionType={rowSelection?.type}
               />
             </Table.Summary>
           )}
@@ -515,6 +526,17 @@ const MyTable = React.forwardRef<any, MyTableProps>((props, ref) => {
             }
             expandable={realExpandable}
             pagination={false}
+            summary={(pageData: readonly any[]) => (
+              <Table.Summary fixed={!!props?.scroll}>
+                <TableSummaryRow
+                  columns={finalcolumns}
+                  dataSource={pageData as any[]}
+                  summary={props.summary}
+                  summaryConfig={props?.summaryTotal}
+                  selectionType={rowSelection?.type}
+                />
+              </Table.Summary>
+            )}
           />
         </PrintContainer>
       )}

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

@@ -0,0 +1,22 @@
+import type { FuncExpExeCuteType } from '../../utils/hooks/useFuncExpExecute';
+
+export interface MyBodyCellProps {
+  editable: boolean;
+  isExtend: boolean;
+  dataIndex: string | number;
+  row: any;
+  rowId: string | number;
+  rowIndex: number;
+  children: any;
+  colorFormatInfo: any[];
+  isCustomRendering: boolean;
+  style?: any;
+  mode?: string;
+  funcExpExecute?: FuncExpExeCuteType;
+  engineApis?: any;
+  onTableCellClick?: (
+    row: Record<string, any>,
+    cell: any,
+    cellId: string | number,
+  ) => void;
+}

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

@@ -0,0 +1,41 @@
+interface Page {
+  pageId: string;
+  pagePath: string;
+  currentPageVersionId: string;
+  searchParams?: any;
+}
+interface Modal {
+  pageId: string;
+  pagePath: string;
+  currentPageVersionId: string;
+  compStates?: any;
+}
+
+export interface FuncCode {
+  code: string;
+  originCode: string;
+}
+
+type DataBindType = FuncCode | string | undefined;
+
+export interface ContentClick {
+  content?: DataBindType;
+  clickType?: string;
+  page?: Page;
+  modal?: Modal;
+  openType?: string;
+  fileIds?: DataBindType;
+  filename?: DataBindType;
+  previewType?: string;
+  downloadUrl?: DataBindType;
+}
+
+export interface ContentStyle extends ContentClick {
+  formatStyle: number;
+  contentType: string;
+  fontColor: string;
+  borderColor: string;
+  backgroundColor: string;
+  modalWidth?: number;
+  modalHeight?: number;
+}

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

@@ -0,0 +1,129 @@
+export interface TableBaseEventTypes {
+  /**
+   * 点击表格头排序图标时触发
+   * @param ascendCol
+   * @param descendCol
+   * @returns
+   */
+  onSortChange?: (ascendCol?: string, descendCol?: string) => void;
+
+  /**
+   * 选中行变化时触发
+   * @param key
+   * @param row
+   * @returns
+   */
+  onSelectChange?: (key: string, row: any) => void;
+
+  /**
+   * 头部按钮点击事件
+   */
+  onHeadClickBtn1?: (e: any) => void;
+  onHeadClickBtn2?: (e: any) => void;
+  onHeadClickBtn3?: (e: any) => void;
+  onHeadClickBtn4?: (e: any) => void;
+  onHeadClickBtn5?: (e: any) => void;
+
+  /**
+   * 以下都是废弃的吧？
+   * @deprecated
+   */
+  getEditVisible?: (e: any) => void | any;
+  getDeleteVisible?: (e: any) => void | any;
+  getDetailVisible?: (e: any) => void | any;
+}
+
+export interface TableRowExpandEventTypes {
+  /**
+   * 点击展开/收缩时触发
+   * @param expanded
+   * @param record
+   * @returns
+   */
+  onExpand?: (expanded: boolean, record: any) => void;
+
+  /**
+   * 展开行变换回调
+   * @param expandedRowKeys
+   * @returns
+   */
+  onExpandedRowsChange?: (expandedRowKeys: any[]) => void;
+}
+
+export interface TableEditEventTypes {
+  /**
+   * 点击内置的编辑按钮时触发
+   * @param key
+   * @param row
+   * @param index
+   * @returns
+   */
+  onRowEdit?: (key: string, row: any, index: number | null) => void;
+
+  /**
+   * 点击内置的详情按钮时触发
+   * @param key
+   * @param row
+   * @param index
+   * @returns
+   */
+  onRowDetail?: (key: string, row: any, index: number | null) => void;
+
+  /**
+   * 点击内置的删除按钮时触发
+   * @param key
+   * @param row
+   * @param index
+   * @returns
+   */
+  onRowDelete?: (key: string, row: any, index: number | null) => void;
+
+  /**
+   * 点击行时触发
+   * @param key
+   * @param row
+   * @param index
+   * @returns
+   */
+  onRowClick?: (key: any, row: any, index: any) => void;
+
+  /**
+   * 双击行时触发
+   * @param key
+   * @param row
+   * @param index
+   * @returns
+   */
+  onRowDoubleClick?: (key: string, row: any, index: number) => void;
+
+  /**
+   * 开始行内编辑
+   * @param e
+   * @returns
+   */
+  onBeforeInlineEdit?: (e: any) => void;
+
+  /**
+   * 保存行内编辑时触发
+   * @param data
+   * @param id
+   * @param index
+   * @returns
+   */
+  onBeforeInlineSave?: (data: any, id: any, index: number | null) => void;
+}
+
+export interface TablePaginationEventTypes {
+  /**
+   * 页码改变回调时触发
+   * @param page
+   * @param size
+   * @returns
+   */
+  onPageChange?: (page: React.SetStateAction<number>, size: number) => void;
+}
+
+export type MyTableEventTypes = TableBaseEventTypes &
+  TableRowExpandEventTypes &
+  TableEditEventTypes &
+  TablePaginationEventTypes;