@lingxiteam/ebe-utils 0.3.11 → 0.3.13

package/lib/public/src/components/pcfactory/src/TreeTable/hooks/useCMDAction.ts

@@ -1,82 +0,0 @@
-import { useImperativeHandle } from 'react';
-import { useCommonCMDAction } from '../../Table/hooks';
-
-const useCMDAction = (props: any) => {
-  const {
-    ref,
-    currentRowKey,
-    childrenColumnName,
-    innerDataSource,
-    setInnerDataSource,
-    setOuterDataSource,
-    setChildrenColumnName,
-    setMode,
-  } = props;
-
-  const { loading, colServiceData } = useCommonCMDAction(props);
-
-  useImperativeHandle(ref, () => ({
-    /**
-     * 加载树形表格数据（加载完之后，表格就脱离了数据源的控制了）
-     */
-    reloadTreeTableData: (data: {
-      dataSource: any[];
-      childrenKey: string;
-      childrenSync: boolean;
-    }) => {
-      /**
-       * 注意，不是直接使用 setInnerDataSource
-       * 而是通过 setOuterDataSource 间接驱动 -> setInnerDataSource
-       * 因为需要对数据进行初始化
-       */
-      setOuterDataSource(data?.dataSource || []);
-      setChildrenColumnName(data?.childrenKey);
-      setMode(data?.childrenSync ? 'sync' : 'all');
-    },
-
-    /**
-     * 加载子节点数据
-     * 理论上，只更新内部数据
-     */
-    reloadTreeTableChildData: (data: {
-      children: any[];
-      expandRowKey: string;
-    }) => {
-      const { children, expandRowKey } = data;
-
-      // 异步加载限制为 children
-      const realChildrenColumnName = childrenColumnName || 'children';
-
-      const findChild = (data: any[]) => {
-        if (Array.isArray(data)) {
-          for (let i = 0; i < data.length; i += 1) {
-            const row = data[i];
-            if (row?.[currentRowKey] === expandRowKey) {
-              // 没有数据才加载
-              if (!row?.[realChildrenColumnName]?.length) {
-                row[realChildrenColumnName] = children;
-                row.isLeaf = children?.length === 0;
-              }
-              break;
-            }
-
-            if (Array.isArray(row?.[realChildrenColumnName])) {
-              findChild(row[realChildrenColumnName]);
-            }
-          }
-        }
-      };
-
-      findChild(innerDataSource);
-      // 触发一下表格刷新
-      setInnerDataSource([...innerDataSource]);
-    },
-  }));
-
-  return {
-    loading,
-    colServiceData,
-  };
-};
-
-export default useCMDAction;

package/lib/public/src/components/pcfactory/src/TreeTable/hooks/useExpandable.tsx

@@ -1,61 +0,0 @@
-import { useEffect, useState } from 'react';
-import { useExpandable as useTableExpandable } from '../../Table/hooks';
-
-const useExpandable = (props: any) => {
-  const { setInnerDataSource } = props;
-
-  const useTableExpandableReturn = useTableExpandable(props);
-  const { childrenColumnName, expandable } = useTableExpandableReturn;
-
-  const [mode, setMode] = useState('all');
-
-  const realExpandable = { ...expandable };
-  realExpandable.expandIcon = (props: any) => {
-    const { record } = props;
-
-    // 当 record.isLeaf 为空时，先强制设置为非叶子节点
-    let isLeaf = record?.isLeaf ?? false;
-
-    // 当 record.isLeaf 为空时，需要区分当前数据属于什么场景
-    if (record?.isLeaf === undefined) {
-      if (mode !== 'sync') {
-        if (
-          record?.[childrenColumnName] === null ||
-          record?.[childrenColumnName] === undefined ||
-          !(childrenColumnName in record) ||
-          (Array.isArray(record?.[childrenColumnName]) &&
-            record?.[childrenColumnName]?.length === 0)
-        ) {
-          // 为非异步场景，且没有下级数据，则修正为叶子节点
-          isLeaf = true;
-        }
-      }
-    }
-
-    return expandable?.expandIcon({
-      ...props,
-      isLeaf,
-    });
-  };
-
-  useEffect(() => {
-    // 当模式为异步时，
-    if (mode === 'sync') {
-      // 为第一层节点加上 children，否则展开图标显示异常，会显示在复选框同一列
-      setInnerDataSource((originDataSource: any) => {
-        return originDataSource.map((r: any) => {
-          r[childrenColumnName] = [];
-          return r;
-        });
-      });
-    }
-  }, [mode]);
-
-  return {
-    ...useTableExpandableReturn,
-    setMode,
-    expandable: realExpandable,
-  };
-};
-
-export default useExpandable;

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

@@ -1,273 +0,0 @@
-/* eslint-disable no-nested-ternary */
-/* eslint-disable eqeqeq */
-/* eslint-disable array-callback-return */
-/* eslint-disable no-param-reassign */
-/* eslint-disable no-underscore-dangle */
-import { Form, Table } from 'antd';
-import classnames from 'classnames';
-import React, { useMemo, useRef } from 'react';
-import BodyCell from '../Table/BodyCell';
-import HeaderCell from '../Table/HeaderCell';
-import {
-  useColumns,
-  useCommon,
-  useDataSource,
-  useRowEdit,
-  useScroll,
-  useSelection,
-} from '../Table/hooks';
-import TableHead from '../Table/TableHead';
-import type { MyTableProps } from '../Table/types/prop';
-import { customLocale } from '../utils/Empty/customLocale';
-import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
-import { useLocale } from '../utils/hooks/useLocale';
-import { useCMDAction, useExpandable } from './hooks';
-
-const components = {
-  body: {
-    cell: BodyCell,
-  },
-  header: {
-    cell: HeaderCell,
-  },
-};
-
-const TreeTable = React.forwardRef<any, MyTableProps>((props, ref) => {
-  const {
-    dataSource: boundDataSource,
-    visible = true,
-    style: styles,
-    className,
-    onChange,
-    $$componentItem,
-    getEngineApis,
-    ...restProps
-  } = props;
-
-  const { uid: compId } = $$componentItem;
-  const [form] = Form.useForm();
-
-  const engineApis = getEngineApis?.();
-  const { sandBoxSafeRun } = engineApis || {};
-
-  const { getLocale } = useLocale(engineApis);
-
-  const funcExpExecute = useFuncExpExecute(sandBoxSafeRun as any, getLocale);
-
-  const appId = props?.appId || $$componentItem?.appId;
-  const pageId = props?.pageId || $$componentItem?.pageId;
-
-  const { currentRowKey, isBordered, innerClassName } = useCommon(props);
-
-  const {
-    innerDataSource,
-    setInnerDataSource,
-    outerDataSource,
-    setOuterDataSource,
-    currentPageDataSource,
-  } = useDataSource({
-    ...props,
-    compId,
-    currentRowKey,
-    boundDataSource,
-  });
-
-  const {
-    rowSelection,
-    selectedRows,
-    selectedRowKeys,
-    setSelectedRows,
-    setSelectedRowKeys,
-    setSelectedRowsRule,
-    onRowSelected,
-    onRowSelectClick,
-  } = useSelection({
-    ...props,
-    innerDataSource,
-    currentRowKey,
-    currentPageDataSource,
-    funcExpExecute,
-  });
-
-  const {
-    onRowDeleteClick,
-    onRowEditClick,
-    onRowDetailClick,
-    onRowClick,
-    onRowDoubleClick,
-  } = useRowEdit({
-    ...props,
-    funcExpExecute,
-    innerDataSource,
-    outerDataSource,
-    setInnerDataSource,
-    currentRowKey,
-    selectedRows,
-    onRowSelected,
-  });
-
-  const {
-    expandable: realExpandable,
-    childrenColumnName,
-    setChildrenColumnName,
-    setMode,
-  } = useExpandable({
-    ...props,
-    innerDataSource,
-    setInnerDataSource,
-    currentRowKey,
-    sandBoxSafeRun,
-    funcExpExecute,
-    engineApis,
-    isTree: true,
-  });
-
-  const { loading, colServiceData } = useCMDAction({
-    ref,
-    currentRowKey,
-    childrenColumnName,
-    innerDataSource,
-    setInnerDataSource,
-    setOuterDataSource,
-    selectedRows,
-    selectedRowKeys,
-    setSelectedRows,
-    setSelectedRowKeys,
-    setSelectedRowsRule,
-    setChildrenColumnName,
-    onRowSelected,
-    setMode,
-  });
-
-  const {
-    tableRef,
-    finalcolumns,
-    columnWidth,
-    setColumnWidth,
-    initLoadColWidth,
-    fixedAction,
-  } = useColumns({
-    ...props,
-    sandBoxSafeRun,
-    funcExpExecute,
-    engineApis,
-    form,
-    appId,
-    pageId,
-    compId,
-    innerDataSource,
-    currentRowKey,
-    colServiceData,
-    onRowDetailClick,
-    onRowDeleteClick,
-    onRowEditClick,
-    loading,
-    rowSelection,
-    getLocale,
-  });
-
-  const { scroll, tableWrapRef, initTableWrapWidthRef, getTableWrapWidth } =
-    useScroll({
-      ...props,
-      initLoadColWidth,
-      finalcolumns,
-      columnWidth,
-      setColumnWidth,
-    });
-
-  const superSelectTranslationMapRef: any = useRef(); // 防止state更新不及时，导致翻译无法获取翻译数据
-  if (!superSelectTranslationMapRef.current) {
-    superSelectTranslationMapRef.current = {};
-  }
-
-  const innerTableStyle: any = {};
-  if (styles?.overflowY) {
-    // 通过自定义样式给表格设置y轴滚动时， 认为希望只有表格滚动，但分页栏固定在底部
-    innerTableStyle.overflowY = styles.overflowY;
-  }
-
-  const handleTableChange = (
-    newPagination: any,
-    newFilters: any,
-    newSorter: any,
-    newExtra: any,
-  ) => {
-    if (typeof onChange === 'function') {
-      onChange(newPagination, newFilters, newSorter, newExtra);
-    }
-  };
-
-  // 表格宽度需要根据列宽度赋值
-  const finalStyles = useMemo(() => {
-    const tmpStyle = { ...styles };
-    const tableWidth = getTableWrapWidth();
-    if (tableWrapRef.current && tableWidth) {
-      const realTableWidth =
-        tableWidth >= initTableWrapWidthRef.current - 10
-          ? initTableWrapWidthRef.current - 9
-          : tableWidth;
-      tmpStyle.width = `${realTableWidth}px`;
-    }
-    return tmpStyle;
-  }, [columnWidth]);
-
-  return visible ? (
-    <Form form={form}>
-      <div
-        // appId={appId} // TODO:先注释，不知道什么场景用到
-        // pageId={pageId} // TODO:先注释，不知道什么场景用到
-        data-compid={(props as any)?.['data-compid']}
-        style={finalStyles}
-        className={classnames('ued-table-wrap', className)}
-        ref={tableWrapRef}
-      >
-        <TableHead
-          {...restProps} // 涉及到不确定的事件，所以要这么传
-          source="engine"
-          columns={[]}
-          sandBoxSafeRun={sandBoxSafeRun}
-          engineApis={engineApis}
-        />
-        <Table
-          locale={customLocale}
-          ref={tableRef}
-          bordered={isBordered}
-          className={innerClassName}
-          style={innerTableStyle}
-          components={components}
-          columns={finalcolumns.map((item, index) => {
-            // 固定列最后一项宽度根据本身计算返回
-            if (fixedAction && finalcolumns.length - 1 === index) {
-              return item;
-            }
-            item.width = columnWidth[index] || item.width;
-            return item;
-          })}
-          rowKey={currentRowKey}
-          scroll={scroll}
-          onChange={handleTableChange}
-          onRow={(record, index?: number) => {
-            return {
-              onClick: (event) => {
-                const hasOnRowClick = onRowClick(event, record, index);
-                !hasOnRowClick && onRowSelectClick(record, index);
-              }, // 点击行
-              onDoubleClick: (event) => {
-                onRowDoubleClick(event, record, index);
-              },
-              onContextMenu: (event) => {},
-              onMouseEnter: (event) => {}, // 鼠标移入行
-              onMouseLeave: (event) => {},
-            };
-          }}
-          rowSelection={rowSelection}
-          dataSource={innerDataSource}
-          expandable={realExpandable}
-          pagination={false}
-        />
-      </div>
-    </Form>
-  ) : null;
-});
-
-export default TreeTable;