@lingxiteam/ebe-utils 0.5.11 → 0.6.1

package/lib/pcpublic/src/components/pcfactory/src/TreeTable/TreeTable.tsx

@@ -24,6 +24,10 @@ import EmptyComp from '../utils/Empty';
 import { useLocale } from '../utils/hooks/useLocale';
 import { useCreation } from '../utils/ahooks';
 import useBackgroundStyle from '../View/useBackgroundStyle';
+import { TableContextProvider } from '../Table/hooks/useTableContext';
+import useLevelTable from '../Table/hooks/useLevelTable';
+import MyBodyRow from '../Table/BodyRow';
+
 
 type WrapperTableProps = ReturnType<typeof useCommon>
 & ReturnType<typeof useCMDAction>
@@ -118,7 +122,8 @@ const TreeTable = React.forwardRef<any, Omit<MyTableProps, keyof WrapperTablePro
     columnWidth,
     setColumnWidth,
     initLoadColWidth,
-    fixedAction,
+    customCols,
+    hasLevelData,
   } = useColumns({
     ...props,
     sandBoxSafeRun,
@@ -145,12 +150,14 @@ const TreeTable = React.forwardRef<any, Omit<MyTableProps, keyof WrapperTablePro
     tableWrapRef,
     initTableWrapWidthRef,
     getTableWrapWidth,
+    scrollClassName,
   } = useScroll({
     ...props,
     initLoadColWidth,
     finalcolumns,
     columnWidth,
     setColumnWidth,
+    sortDataSource: innerDataSource,
   });
 
   const superSelectTranslationMapRef: any = useRef(); // 防止state更新不及时，导致翻译无法获取翻译数据
@@ -186,78 +193,84 @@ const TreeTable = React.forwardRef<any, Omit<MyTableProps, keyof WrapperTablePro
     return tmpStyle;
   }, [columnWidth, backgroundStyle]);
 
+  const InnerHeaderCell = useMemo(() => {
+    return (info: any) => <HeaderCell
+      {...info}
+      tableData={innerDataSource}
+      childrenColumnName={realExpandable.childrenColumnName}
+    />;
+  }, [innerDataSource, realExpandable.childrenColumnName]);
+
+  const { levelTableColSpanMap } = useLevelTable({ visibleColumns: customCols, hasLevelData });
+
   return visible ? (
-    <div
+    <TableContextProvider loading={loading} levelTableColSpanMap={levelTableColSpanMap}>
+      <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}
-      />
-      <Form form={form}>
-        <Table
-          locale={{
-            emptyText: <EmptyComp dataState={dataState} getLocale={getLocale} />,
-          }}
-          ref={tableRef}
-          bordered={isBordered}
-          className={innerClassName}
-          style={innerTableStyle}
-          components={{
-            body: {
-              cell: BodyCell,
-            },
-            header: {
-              cell: (info: any) => <HeaderCell
-                {...info}
-                tableData={innerDataSource}
-                childrenColumnName={realExpandable.childrenColumnName}
-              />,
-            },
-          }}
-          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}
+        data-compid={(props as any)?.['data-compid']}
+        style={finalStyles}
+        className={classnames(
+          'ued-table-wrap',
+          className,
+          scrollClassName
+        )}
+        ref={tableWrapRef}
+      >
+        <TableHead
+          {...restProps} // 涉及到不确定的事件，所以要这么传
+          source="engine"
+          columns={[]}
+          sandBoxSafeRun={sandBoxSafeRun}
+          engineApis={engineApis}
         />
-      </Form>
-    </div>
+        <Form form={form}>
+          <Table
+            locale={{
+              emptyText: <EmptyComp dataState={dataState} getLocale={getLocale} />,
+            }}
+            ref={tableRef}
+            bordered={isBordered}
+            className={innerClassName}
+            style={innerTableStyle}
+            components={{
+              body: {
+                cell: BodyCell,
+                row: MyBodyRow,
+              },
+              header: {
+                cell: InnerHeaderCell,
+              },
+            }}
+            columns={finalcolumns}
+            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) => { },
+                // 配置了点击事件后，点击行后需要有激活状态
+                clickActive: typeof onRowClick === 'function',
+              });
+            }}
+            rowSelection={rowSelection}
+            dataSource={innerDataSource}
+            expandable={realExpandable}
+            pagination={false}
+            size={restProps.size as any}
+          />
+        </Form>
+      </div>
+    </TableContextProvider>
   ) : null;
 });
 

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

@@ -5,6 +5,7 @@ import { useFuncExpExecute } from '../utils/hooks/useFuncExpExecute';
 import { useLocale } from '../utils/hooks/useLocale';
 import { useCMDAction, useExpandable } from './hooks';
 import TableLoader from './loader';
+import { useCreation } from '../utils/ahooks';
 import IdleContainer from '../utils/IdleContainer';
 
 const Table = LingxiForwardRef<unknown, any>((props, ref) => {
@@ -42,12 +43,30 @@ const Table = LingxiForwardRef<unknown, any>((props, ref) => {
     currentPageDataSource,
   } = dataSourceProps;
 
+  // 根据id获取真实的下标，避免过滤和排序后影响下标
+  const { getRealIndexById } = useCreation(() => {
+    const indexMap = new Map<string | number, number>();
+    return {
+      getRealIndexById: (id: string | number) => {
+        if (indexMap.has(id)) {
+          return indexMap.get(id);
+        }
+        const index = (innerDataSource || []).findIndex((c: any) => c[currentRowKey] === id);
+        if (index !== -1) {
+          indexMap.set(id, index);
+        }
+        return index;
+      },
+    };
+  }, [innerDataSource, currentRowKey]);
+
   const selectionProps = useSelection({
     ...props,
     innerDataSource,
     currentRowKey,
     currentPageDataSource,
     funcExpExecute,
+    getRealIndexById,
   });
   const {
     selectedRows,

package/lib/pcpublic/src/components/pcfactory/src/Upload/Upload.tsx

@@ -1,13 +1,13 @@
-import { InboxOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons';
-import { LingxiForwardRef } from '@lingxiteam/types';
+import { InboxOutlined, PlusOutlined, UploadOutlined } from '@lingxiteam/icons';
 import { Button, message, Modal, Radio, Upload } from 'antd';
+import React, { forwardRef, useEffect, useMemo, useState, useRef } from 'react';
 import type { UploadProps } from 'antd/lib/upload';
-import React, { forwardRef, useEffect, useMemo, useRef, useState } from 'react';
+import { createRandomStr, getAfterString } from '../utils/common';
+import renderReadOnly from '../utils/renderReadOnly';
 import DownloadProgress from '../StdUpload/DownloadProgress';
 import { FormFields, getFieldsProps } from '../utils';
-import { createRandomStr, getAfterString } from '../utils/common';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import { useLocale } from '../utils/hooks/useLocale';
-import renderReadOnly from '../utils/renderReadOnly';
 
 const { Dragger } = Upload;
 
@@ -92,7 +92,9 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
   };
 
   const [fileList, setFileList] = useState<any[]>([]);
-  const [showUploadList, setShowUploadList] = useState<any>(props.showUploadList === false ? false : defaultShowUploadList); // showUploadList 默认为null
+  const [showUploadList, setShowUploadList] = useState<any>(
+    props.showUploadList === false ? false : defaultShowUploadList,
+  ); // showUploadList 默认为null
   const [forbidden] = useState(null);
   const [storeArr, setStoreArr] = useState<any[]>([]);
   const [optionalVisible, setOptionalVisible] = useState<boolean>(false);
@@ -103,9 +105,9 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
   const progressRef = useRef<any>({});
   const handleRemoveCallback = useRef<any>();
 
-  const handleRemove = async (file: { uid: any }, isRefresh?: any) => {
+  const handleRemove = async (file: { uid: any; }, isRefresh?: any) => {
     if (singleFileMode || isRefresh) {
-      const restFileList = fileList.filter(f => f.uid !== file.uid);
+      const restFileList = fileList.filter((f) => f.uid !== file.uid);
       setFileList(restFileList);
       if (singleFileMode) {
         restFileList.length === 0 ? onChange(null) : onChange(restFileList);
@@ -114,6 +116,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
   };
   handleRemoveCallback.current = handleRemove;
 
+
   const previewFile = async (fileId: any) => {
     if (typeof engineApis?.BannerModal?.open === 'function') {
       let fileIndex: number = 0;
@@ -123,7 +126,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
         if (resultObject?.fileId === fileId) {
           fileIndex = i;
         }
-        return {
+        return ({
           appId,
           fileId: resultObject?.fileId,
           pageId: props.pageId,
@@ -140,7 +143,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
             ...f,
             ...resultObject,
           },
-        };
+        });
       });
       engineApis.BannerModal.open({
         fileIndex,
@@ -156,13 +159,19 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
   };
 
   // 文件名为全路径时，拆分出实际文件名
-  const handleFileName = (_fileName: string) => (_fileName ? _fileName.split('\\').pop() : _fileName);
+  const handleFileName = (_fileName: string) =>
+    _fileName ? _fileName.split('\\').pop() : _fileName;
 
   useEffect(() => {
     if (value && value !== '[]' && value !== '[null]' && value !== '[{}]' && value !== undefined) {
       try {
         let fileName = null;
-        if (singleFileMode && value && Number(value).toString() !== 'NaN' && !storeArr.includes(`${value}`)) {
+        if (
+          singleFileMode &&
+          value &&
+          Number(value).toString() !== 'NaN' &&
+          !storeArr.includes(`${value}`)
+        ) {
           engineApis?.service?.qryDownloadFileInfo({ fileId: value }).then((res: any) => {
             setStoreArr([...storeArr, `${value}`]);
             fileName = res?.fileName;
@@ -183,7 +192,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
             downloadable
               ? setFileList(singleList)
               : setFileList(
-                singleList.map(f => {
+                singleList.map((f) => {
                   const { response, uid, name, status } = f;
                   return {
                     response,
@@ -191,7 +200,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
                     name,
                     status,
                   };
-                })
+                }),
               );
           });
         } else {
@@ -204,7 +213,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
           }
           if (list && Array.isArray(list) && list.length > 0 && list[0]) {
             let isDone = true;
-            const newFileList = list.map(li => {
+            const newFileList = list.map((li) => {
               if (!li) {
                 isDone = false;
                 return false;
@@ -234,7 +243,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
                       name,
                       status,
                     };
-                  })
+                  }),
                 );
             }
           }
@@ -259,7 +268,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
           };
         }
         return undefined;
-      })
+      }),
     );
     if (getSimpleFileList) {
       getSimpleFileList(simpleFileList);
@@ -309,7 +318,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
               name,
               status,
             };
-          })
+          }),
         );
 
       if (files[0] && files[0].status !== 'uploading') {
@@ -333,7 +342,9 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
 
   const getDownloadName = (suffix: any, file: any) => {
     const suf = suffix || getAfterString(file.name, '.') || '';
-    return fileNameEncode ? `${createRandomStr(20).toUpperCase()}.${suf}` : file.name.replace(/\.\w+$/, `.${suf}`);
+    return fileNameEncode
+      ? `${createRandomStr(20).toUpperCase()}.${suf}`
+      : file.name.replace(/\.\w+$/, `.${suf}`);
   };
 
   // 支持图片、pdf直接下载
@@ -367,7 +378,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
       // 添加自定义头部(在info.js写入)
       const { lxRequestHeaders } = window as any;
       if (lxRequestHeaders) {
-        Object.keys(lxRequestHeaders).forEach(header => {
+        Object.keys(lxRequestHeaders).forEach((header) => {
           xhr.setRequestHeader(header, lxRequestHeaders[header]); // 设置请求头参数
         });
       }
@@ -389,7 +400,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
       // 下载进度条
       xhr.onprogress = (event: any) => {
         if (event.lengthComputable) {
-          progressRef.current?.[file.fileId]?.setPercent(Math.round((event.loaded * 100) / event.total));
+          progressRef.current?.[file.fileId]?.setPercent(Math.round(event.loaded * 100 / event.total));
         }
       };
       xhr.ontimeout = () => {
@@ -442,7 +453,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
           'X-B-AUTH': '1',
           'X-B-TARGET-ID': props.pageId,
         },
-      }).then(response => response.json());
+      }).then((response) => response.json());
       if (res.resultCode === '-1' || res.resultCode === -1) {
         setShowUploadList(false);
         return false;
@@ -455,11 +466,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
     if (numberLimit) {
       const { length } = fileList;
       if (length >= numberLimit) {
-        message.warn(
-          getLocale?.('Upload.fileLimit', {
-            num: singleFileMode ? 1 : numberLimit,
-          })
-        );
+        message.warn(getLocale?.('Upload.fileLimit', { num: singleFileMode ? 1 : numberLimit }));
         return false;
       }
       if (singleFileMode && length > 0) {
@@ -477,19 +484,13 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
     // eslint-disable-next-line @typescript-eslint/no-shadow
     beforeUpload: (file: any, fileList: any) => handleBeforeUpload(file, fileList),
     fileList,
-    onRemove: (file: { uid: any }) => handleRemove(file),
+    onRemove: (file: { uid: any; }) => handleRemove(file),
     onChange: (e: any) => handleOnChange(e),
     showUploadList: {
       ...showUploadList,
       downloadIcon: (file: any) => {
         if (downloadProVisible[file.fileId]) {
-          return (
-            <DownloadProgress
-              ref={(r: any) => {
-                progressRef.current[file.fileId] = r;
-              }}
-            />
-          );
+          return <DownloadProgress ref={(r: any) => { progressRef.current[file.fileId] = r; }} />;
         }
         return null;
       },
@@ -508,18 +509,22 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
     return renderReadOnly('--');
   }
 
+  // @ts-ignore
+  const combineHeaders = Object.assign({}, commonConfig.headers, restProps.headers);
+
   return (
     <>
       {draggable ? (
-        <Dragger {...restProps} {...commonConfig}>
+        <Dragger {...restProps} {...commonConfig} headers={combineHeaders}>
           <p className="ant-upload-drag-icon">
-            <InboxOutlined rev="" />
+            <InboxOutlined />
           </p>
           <p className="ant-upload-text">{getLocale?.('Upload.uploadPlaceholder')}</p>
         </Dragger>
       ) : (
         <div className={disabled || readOnly ? `${UPLOAD_WRAPPER_CLASSNAME}-hidden` : ''}>
-          <Upload {...restProps} {...commonConfig}>
+          {/** antd 在4.21.7的时候修复表单设置禁用支持了Upload，导致showUploadList的下载按钮也被禁用，导致禁用后无法下载附件，因为新版本的组件StdUpload 通过自定义了itemRender避免了这个问题，旧版本就不做修改，先默认都不禁用处理 */}
+          <Upload {...restProps} {...commonConfig} disabled={false} headers={combineHeaders}>
             {children}
           </Upload>
         </div>
@@ -535,7 +540,7 @@ const FormUpload: React.FC<FormUploadProps> = forwardRef((props, ref) => {
           </Button>
         }
       >
-        <Radio.Group onChange={e => setdDownloadWay(e.target.value)} value={downloadWay}>
+        <Radio.Group onChange={(e) => setdDownloadWay(e.target.value)} value={downloadWay}>
           <Radio value="1">{getLocale?.('Upload.origin')}</Radio>
           <Radio value="2">{getLocale?.('Upload.waterMark')}</Radio>
         </Radio.Group>
@@ -572,11 +577,11 @@ export interface MyUploadProps {
   wrapperContainer: any;
   colon?: boolean;
   isFormChild?: boolean | undefined;
-  uploadProps: any; // 懒加载入参
-  formFieldsRef: any; // 懒加载入参
-  disabled: boolean; // 懒加载入参
-  readOnly: boolean; // 懒加载入参
-  required: boolean; // 懒加载入参
+  uploadProps: any;// 懒加载入参
+  formFieldsRef: any;// 懒加载入参
+  disabled: boolean;// 懒加载入参
+  readOnly: boolean;// 懒加载入参
+  required: boolean;// 懒加载入参
 }
 
 const MyUpload = LingxiForwardRef<any, MyUploadProps>((props, ref) => {
@@ -656,7 +661,7 @@ const MyUpload = LingxiForwardRef<any, MyUploadProps>((props, ref) => {
       readOnly={readOnly}
       rules={finalRules}
       ignoreReadOnlyFlag
-      handleFormValue={val => {
+      handleFormValue={(val) => {
         if (val !== undefined) {
           return props?.singleFileMode ? val : val || [];
         }
@@ -685,7 +690,7 @@ const MyUpload = LingxiForwardRef<any, MyUploadProps>((props, ref) => {
           //   form.setFieldsValue({ [fieldName]: v });
           // }
         }}
-        onChange={e => {
+        onChange={(e) => {
           if (onChange) {
             onChange(e);
           }
@@ -695,18 +700,17 @@ const MyUpload = LingxiForwardRef<any, MyUploadProps>((props, ref) => {
       >
         {listType === 'picture-card' ? (
           <div>
-            <PlusOutlined rev="" />
+            <PlusOutlined />
             <div>{uploadText}</div>
           </div>
         ) : (
           <Button>
-            <UploadOutlined rev="" />
+            <UploadOutlined />
             {uploadText}
           </Button>
         )}
       </FormUpload>
-    </FormFields>
-  );
+    </FormFields>);
 });
 
 export default MyUpload;

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

@@ -1,5 +1,5 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
 import React, { useState } from 'react';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import { useCommonImperativeHandle } from '../utils';
 import UploadLoader from './loader';
 import type { MyUploadProps } from './Upload';
@@ -12,9 +12,14 @@ const Upload = LingxiForwardRef<unknown, any>((props, ref) => {
       setUploadProps(_props);
     },
   });
-  return (
-    <UploadLoader {...props} uploadProps={uploadProps} disabled={disabled} readOnly={readOnly} required={required} formFieldsRef={formFieldsRef} />
-  );
+  return <UploadLoader
+    {...props}
+    uploadProps={uploadProps}
+    disabled={disabled}
+    readOnly={readOnly}
+    required={required}
+    formFieldsRef={formFieldsRef}
+  />;
 });
 
 export default Upload;

package/lib/pcpublic/src/components/pcfactory/src/Upload/loader.tsx

@@ -3,7 +3,7 @@ import { LoadingComponennt } from '../utils/LoaderHelper';
 
 const UploadLoader = Loadable({
   // eslint-disable-next-line func-call-spacing
-  loader: async () => (await import(/* webpackChunkName: 'factory-Upload' */ './Upload')) as unknown as React.ComponentType<any>,
+  loader: async () => (await import /* webpackChunkName: 'factory-Upload' */('./Upload')) as unknown as React.ComponentType<any>,
   loading: LoadingComponennt,
 });
 

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

@@ -1,10 +1,11 @@
 import React from 'react';
 
-export interface VerticalViewProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+export interface VerticalViewProps
+  extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
   visible?: boolean;
 }
 
-const VerticalView: React.FC<VerticalViewProps> = props => {
+const VerticalView: React.FC<VerticalViewProps> = (props) => {
   const { children, style, className, visible = true } = props;
 
   return visible ? (