@lingxiteam/ebe-utils 0.6.2 → 0.6.3

package/lib/public/src/components/pcfactory/src/Table/hooks/useRowEdit.ts

@@ -1,302 +0,0 @@
-import { useState } from 'react';
-import { EDIT_COMPONENT_STOP_PROPAGATION_CLS } from '../constant';
-import {
-  deleteTempRowProperties,
-  EMPTY_ROW_TEMP_KEY_ATTR,
-  LATEST_EMPTY_ROW_FLAG_ATTR,
-} from '../utils';
-
-const useRowEdit = (props: any) => {
-  const {
-    funcExpExecute,
-    outerDataSource,
-    innerDataSource,
-    setInnerDataSource,
-    currentRowKey,
-    selectedRows,
-    onRowSelected,
-
-    dataSourceFromDataSourceConfig,
-    editMode,
-    rowEditableRule,
-
-    onRowEdit,
-    onRowDetail,
-    onRowDelete,
-    onRowClick,
-    onRowDoubleClick,
-    onBeforeInlineEdit,
-    onBeforeInlineSave,
-  } = props;
-
-  const [nowInlineEditKey, setNowInlineEditKey] = useState<string | null>();
-  const [nowEditingData, setNowEditingData] = useState<any | null>();
-
-  const onRowSaveClick = (row: any, index: number | null, isForce: any) => {
-    // 保存行内编辑行方法
-    // 这个同时处理用于自带的行内编辑保存按钮，和指令的强制保存的情况
-    // isForce:来源于事件动作的“saveInlineRow”指令的保存，这种保存不需要触发beforeSaveInlineRow回调
-    if (!nowInlineEditKey) {
-      return;
-    }
-
-    // 如果存在保存前回调，那么认为用户希望手动控制保存
-    // 这个时候只有isForce强制保存可以保存【也不会触发该回调】
-    if (!isForce && onBeforeInlineSave) {
-      // nowEditingData:当前保存行数据
-      // rowId:当前行Id
-      // index:当前行索引
-      // 添加传参，使方法配置更灵活
-      onBeforeInlineSave(nowEditingData, row[currentRowKey], index);
-      return;
-    }
-
-    const trow: any = innerDataSource.find(
-      (i: any) => i[currentRowKey] === nowInlineEditKey,
-    );
-    Object.assign(trow, nowEditingData);
-    deleteTempRowProperties(trow);
-
-    // 单行保存编辑时，需要将修改后的值同步到绑定的数据源
-    const syncPropsDataSourceRow = props.dataSource?.find(
-      (r: any) => r[currentRowKey] === nowInlineEditKey,
-    );
-    Object.assign(syncPropsDataSourceRow, nowEditingData);
-    deleteTempRowProperties(syncPropsDataSourceRow);
-
-    setInnerDataSource([...innerDataSource]);
-
-    setNowInlineEditKey(null);
-    setNowEditingData(null);
-
-    editInlineRow(null);
-  };
-
-  const editInlineRow = (
-    editkey: React.SetStateAction<string | null | undefined>,
-  ) => {
-    // 开始行内编辑行方法
-    if (editkey === undefined) {
-      return;
-    }
-
-    const trow: any = innerDataSource.find(
-      (i: any) => i[currentRowKey] === editkey,
-    );
-    if (onBeforeInlineEdit) {
-      // 如果有这个回调，先触发这个回调
-      // 预留坑：如果要判断该行不允许编辑之类的，可以在这里做准备
-      onBeforeInlineEdit(trow);
-    }
-
-    if (trow) {
-      setNowEditingData({ ...trow });
-    }
-
-    setNowInlineEditKey(editkey);
-  };
-
-  const onRowCancelClick = (row: any) => {
-    setNowEditingData(null);
-    setNowInlineEditKey(null);
-    // 取消编辑的时候，如果当前行是刚刚新增的空白行，则过滤当前行
-    const isLatestCreationTempRow =
-      row?.[LATEST_EMPTY_ROW_FLAG_ATTR] && row?.[EMPTY_ROW_TEMP_KEY_ATTR];
-    setInnerDataSource(
-      innerDataSource.filter((i: any) =>
-        isLatestCreationTempRow
-          ? row?.[EMPTY_ROW_TEMP_KEY_ATTR] !== i?.[EMPTY_ROW_TEMP_KEY_ATTR]
-          : true,
-      ),
-    );
-
-    // 同样的，需要移除选中数据中的当前行
-    if (isLatestCreationTempRow) {
-      onRowSelected(
-        selectedRows.filter(
-          (r: any) => row?.[currentRowKey] !== r?.[currentRowKey],
-        ),
-        false,
-      );
-    }
-
-    // 倘若绑定了数据源，需要通过引用的方式，移除对应的临时数据
-    if (isLatestCreationTempRow && dataSourceFromDataSourceConfig) {
-      const targetIndex = innerDataSource.findIndex(
-        (i: any) =>
-          row?.[EMPTY_ROW_TEMP_KEY_ATTR] === i?.[EMPTY_ROW_TEMP_KEY_ATTR],
-      );
-      (outerDataSource as any)?.splice(targetIndex, 1);
-    }
-  };
-
-  const onRowDeleteClick = (row: any, index: number | null) => {
-    if (typeof onRowDelete === 'function') {
-      if (row?._createrow) {
-        let ds = [...innerDataSource];
-        ds = ds.filter((i, idx) => idx !== index);
-        setInnerDataSource(ds);
-      }
-      onRowDelete(currentRowKey ? row[currentRowKey] : row, row, index);
-    }
-  };
-
-  const onRowEditClick = (row: any, index: number | null) => {
-    if (typeof onRowEdit === 'function') {
-      if (nowInlineEditKey) {
-        // 未保存上一行，编辑其他行时，看作取消编辑上一行，并过滤空白行
-        setInnerDataSource(innerDataSource.filter((i: any) => !i._emptyrow));
-      }
-      onRowEdit(currentRowKey ? row[currentRowKey] : row, row, index);
-    }
-  };
-
-  const onRowDetailClick = (row: any, index: number | null) => {
-    if (typeof onRowDetail === 'function') {
-      onRowDetail(currentRowKey ? row[currentRowKey] : row, row, index);
-    }
-  };
-
-  const onRowAttrValsChange = (
-    row: any,
-    attr: string,
-    newAttrVal: any,
-    otherAttrVals: any,
-  ) => {
-    if (editMode === 'multiple') {
-      const editRow = innerDataSource.find(
-        (r: any) => r[currentRowKey] === row[currentRowKey],
-      );
-      // 整表编辑时，需要将修改后的值同步到绑定的数据源
-      const syncPropsDataSourceRow = outerDataSource?.find(
-        (r: any) => r[currentRowKey] === row[currentRowKey],
-      );
-
-      editRow[attr] = newAttrVal;
-      syncPropsDataSourceRow[attr] = newAttrVal;
-
-      Object.keys(otherAttrVals).forEach((op) => {
-        editRow[op] = otherAttrVals[op];
-        syncPropsDataSourceRow[op] = otherAttrVals[op];
-      });
-      setInnerDataSource([...innerDataSource]);
-      return;
-    }
-
-    nowEditingData[attr] = newAttrVal;
-    Object.keys(otherAttrVals).forEach((op) => {
-      nowEditingData[op] = otherAttrVals[op];
-    });
-    setNowEditingData({ ...nowEditingData });
-  };
-
-  const onRowClickHandle = (event: any, record: any, index?: number) => {
-    let target = event.target as HTMLBaseElement;
-    const curentTarget = event.currentTarget as HTMLTableRowElement;
-
-    // 当处于编辑状态时，需要过滤来自编辑控件内部触发的 click
-    while (target?.className !== curentTarget?.className) {
-      if (
-        typeof target?.className === 'string' &&
-        target.className.includes(EDIT_COMPONENT_STOP_PROPAGATION_CLS)
-      ) {
-        return true;
-      }
-      target = target.parentNode as HTMLBaseElement;
-    }
-
-    if (onRowClick) {
-      onRowClick(currentRowKey ? record[currentRowKey] : record, record, index);
-      return true;
-    }
-
-    return false;
-  };
-
-  const onRowDoubleClickHandle = (event: any, record: any, index?: number) => {
-    if (onRowDoubleClick) {
-      let target = event.target as HTMLBaseElement;
-      const curentTarget = event.currentTarget as HTMLTableRowElement;
-
-      // 当处于编辑状态时，需要过滤来自编辑控件内部触发的 doubleclick
-      let stopDoubleClick = false;
-      while (target?.className !== curentTarget?.className) {
-        if (
-          typeof target?.className === 'string' &&
-          target.className.includes(EDIT_COMPONENT_STOP_PROPAGATION_CLS)
-        ) {
-          stopDoubleClick = true;
-          break;
-        }
-        target = target.parentNode as HTMLBaseElement;
-      }
-
-      if (!stopDoubleClick) {
-        onRowDoubleClick(
-          currentRowKey ? record[currentRowKey] : record,
-          record,
-          index,
-        );
-      }
-    }
-  };
-
-  /**
-   * 判断表格可编辑时，里面是否可以操作
-   * @param row 某行数据对象
-   * @param index 某行所处当前页行索引
-   * @returns
-   */
-  const handleIsRowEditableCanUse = (row: any, index?: number) => {
-    // 存量：配置态生成的DSL是包含的完整代码的对象
-    if (funcExpExecute && rowEditableRule?.code) {
-      return funcExpExecute(rowEditableRule.code, [
-        {
-          key: 'row',
-          value: row,
-        },
-        {
-          key: 'index',
-          value: index,
-        },
-      ]);
-    }
-    if (funcExpExecute && rowEditableRule) {
-      /**
-       * 新版：配置态生成的DSL就是一个$$包含函数的表达式
-       * 但会经过预处理移除 $$
-       */
-      return funcExpExecute(rowEditableRule, [
-        {
-          key: 'row',
-          value: row,
-        },
-        {
-          key: 'index',
-          value: index,
-        },
-      ]);
-    }
-
-    return true;
-  };
-
-  return {
-    nowInlineEditKey,
-    nowEditingData,
-    editInlineRow,
-    setNowEditingData,
-    setNowInlineEditKey,
-    onRowAttrValsChange,
-    onRowSaveClick,
-    onRowCancelClick,
-    onRowDeleteClick,
-    onRowEditClick,
-    onRowDetailClick,
-    onRowClick: onRowClickHandle,
-    onRowDoubleClick: onRowDoubleClickHandle,
-    handleIsRowEditableCanUse,
-  };
-};
-
-export default useRowEdit;

package/lib/public/src/components/pcfactory/src/Table/hooks/useRowMerge.ts

@@ -1,93 +0,0 @@
-import { useMemo } from 'react';
-
-const useRowMerge = (props: any) => {
-  const { sortDataSource, columns, nowInlineEditKey, currentRowKey } = props;
-
-  // 记录所有设置了行合并的列
-  const rowSpanColMap = useMemo(() => {
-    const map: any = {};
-    columns.forEach((c: any) => {
-      if (c.isRowSpan) {
-        map[c.dataIndex] = true;
-      }
-    });
-    return map;
-  }, [columns]);
-
-  /**
-   * 表格数据、行合并信息以及行合并后最后一个td格子的样式
-   * 表格原数据不设置多余变量，请求外系统服务时多余参数可能会导致报错
-   */
-  const [rowSpanMap, rowClassMap] = useMemo(() => {
-    const tableRowSpan = new WeakMap();
-    const tableRowClass = new WeakMap();
-    // 记录负责合并行的主行
-    const recursiveSet = (arr: any[]) => {
-      const parentSpanRowsMap: any = {};
-      const newData = (arr || []).map((d, i) => {
-        const newD = d;
-
-        const __rowSpan: any = {};
-        const __rowClass: any = {};
-
-        if (newD?.children?.length > 0) {
-          newD.children = recursiveSet(newD.children);
-        }
-        // 正在编辑的或者有子节点的不算入合并行计算中
-        if (
-          (nowInlineEditKey &&
-            currentRowKey &&
-            nowInlineEditKey === d[currentRowKey]) ||
-          newD?.children?.length > 0
-        ) {
-          return newD;
-        }
-        Object.keys(rowSpanColMap).forEach((rowIndex) => {
-          __rowSpan[rowIndex] = 1;
-          if (!parentSpanRowsMap[rowIndex]) {
-            parentSpanRowsMap[rowIndex] = {
-              preIndex: i,
-              row: newD,
-            };
-          } else {
-            const { preIndex, row } = parentSpanRowsMap[rowIndex];
-            // 当且仅当相邻行内容相同时才进行合并，否则把之前的主行换成当前行
-            if (preIndex === i - 1 && row[rowIndex] === newD[rowIndex]) {
-              const curRowSpan = tableRowSpan.get(row);
-              curRowSpan[rowIndex] += 1;
-              // 合并当前行
-              __rowSpan[rowIndex] = 0;
-              if (i === arr.length - 1) {
-                // 只设置最后一个td格的样式，防止边框表格时出现重复的边线
-                __rowClass[rowIndex] = 'last-td';
-              }
-            } else {
-              parentSpanRowsMap[rowIndex].row = newD;
-            }
-            parentSpanRowsMap[rowIndex].preIndex = i;
-          }
-        });
-
-        tableRowSpan.set(newD, __rowSpan);
-        tableRowClass.set(newD, __rowClass);
-
-        return newD;
-      });
-      return newData;
-    };
-    recursiveSet(sortDataSource);
-    // // loading没有数据的时候模拟3个数据
-    // if(loading && d?.length === 0) {
-    //   d = [{}, {}, {}];
-    // }
-    return [tableRowSpan, tableRowClass];
-  }, [sortDataSource, rowSpanColMap, nowInlineEditKey, currentRowKey]);
-
-  return {
-    rowSpanColMap,
-    rowSpanMap,
-    rowClassMap,
-  };
-};
-
-export default useRowMerge;

package/lib/public/src/components/pcfactory/src/Table/hooks/useScroll.ts

@@ -1,120 +0,0 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
-
-const useScroll = (props: any) => {
-  const {
-    initLoadColWidth,
-    finalcolumns,
-    columnWidth,
-    adjustModel,
-    scroll: tableScroll,
-  } = props;
-
-  const tableWrapRef = useRef<any>();
-  const initTableWrapWidthRef = useRef<any>();
-  const preTablePosition = useRef<any>(); // 缓存上次计算位置的表格位置
-  const [tableScrollY, setTableScrollY] = useState(0);
-
-  /**
-   * 适配 scroll，主要是 scroll.x
-   * antd 4.x 在设置横向滚动时，表格宽度最好大于列宽度（如果有设置的话）总和，否则会出现列被挤压的情况
-   */
-  const realScroll = useMemo(() => {
-    if (
-      tableScroll &&
-      typeof tableScroll === 'object' &&
-      !Array.isArray(tableScroll)
-    ) {
-      if (finalcolumns && finalcolumns.length) {
-        const colWidths = finalcolumns.reduce(
-          // 没有配置宽度的，计算时，默认给一个缺省值100
-          (prev: any, next: any) => Number(prev) + Number(next.width || 100),
-          [0],
-        );
-        const tableScrollX = tableScroll.x || 0;
-
-        return {
-          ...tableScroll,
-          x: colWidths > tableScrollX ? colWidths : tableScrollX,
-        };
-      }
-
-      return tableScroll;
-    }
-    return {};
-  }, [finalcolumns, tableScroll]);
-
-  const getTableWrapWidth = () => {
-    return columnWidth.reduce((acc: number, width: number) => acc + width, 0);
-  };
-
-  const computedTablePosition = () => {
-    if (tableWrapRef.current && !tableScroll?.y && adjustModel === 'fill') {
-      // 当前表格所在位置
-      const tableWrapPosition =
-        tableWrapRef?.current?.getClientRects?.()?.[0] || {};
-      // 表格位置超过屏幕 1/2不自适应
-      if (tableWrapPosition.y <= window.innerHeight / 2) {
-        const tableHeight = window.innerHeight - tableWrapPosition.y;
-        // 分页高度
-        let paginationHeight = 0;
-        let tableHeaderHeight = 0;
-        const paginationRef = tableWrapRef?.current?.querySelector?.(
-          '.pcfactory-pagination',
-        );
-        const theadRef = tableWrapRef?.current?.querySelector?.('thead');
-        if (paginationRef && paginationRef.offsetHeight) {
-          paginationHeight = paginationRef.offsetHeight;
-        }
-        if (theadRef && theadRef.offsetHeight) {
-          tableHeaderHeight = theadRef.offsetHeight;
-        }
-        // 表格内容区域高度
-        const tableContainerHeight = tableHeight - paginationHeight - 50;
-        const tableScrollHeight = tableContainerHeight - tableHeaderHeight;
-        // 表格区域设置固定高度 填充剩余页面
-        tableWrapRef.current.querySelector(
-          '.pcfactory-table',
-        ).style.height = `${tableContainerHeight}px`;
-        setTableScrollY(tableScrollHeight);
-        // 保存当前表格位置
-        preTablePosition.current = tableWrapPosition.y;
-      }
-    }
-  };
-
-  useEffect(() => {
-    const top = (tableWrapRef?.current?.getClientRects?.()?.[0] || {}).y;
-    // 位置变化了
-    if (preTablePosition.current && preTablePosition.current !== top) {
-      computedTablePosition();
-    }
-  });
-
-  useEffect(() => {
-    if (tableWrapRef.current) {
-      initTableWrapWidthRef.current = tableWrapRef.current.offsetWidth;
-      computedTablePosition();
-    }
-  }, [tableWrapRef.current]);
-
-  const scroll: any = initLoadColWidth
-    ? { ...tableScroll, x: getTableWrapWidth() }
-    : realScroll;
-  if (
-    tableWrapRef.current &&
-    !tableScroll?.y &&
-    adjustModel === 'fill' &&
-    tableScrollY > 0
-  ) {
-    scroll.y = tableScrollY;
-  }
-
-  return {
-    scroll,
-    tableWrapRef,
-    initTableWrapWidthRef,
-    getTableWrapWidth,
-  };
-};
-
-export default useScroll;