@lingxiteam/ebe-utils 0.2.3 → 0.2.5

package/lib/h5public/src/components/factory/src/DynamicTable/hooks/useFormatCell.ts

@@ -1,14 +1,6 @@
 import type { FuncExpExeCuteType } from '../../utils/hooks/useFuncExpExecute';
 import type { ContentClick, FuncCode } from '../types/contentStyle';
-import {
-  CUSTOM,
-  DOWNLOAD_FILE,
-  OPEN_MODAL,
-  PAGE_JUMP,
-  PREVIEW_FILE,
-  ROUTE_PUSH,
-  ROUTE_REPLACE,
-} from '../utils/constant';
+import { CUSTOM, DOWNLOAD_FILE, OPEN_MODAL, PAGE_JUMP, PREVIEW_FILE, ROUTE_PUSH, ROUTE_REPLACE } from '../utils/constant';
 
 interface useFormatCellProps extends ContentClick {
   appId: string;
@@ -61,23 +53,15 @@ const useFormatCell = (props: useFormatCellProps) => {
     return content;
   };
 
-  const handlePageJump = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
+  const handlePageJump = async (row: any, rowId: string | number, rowIndex: number) => {
     if (page) {
       const { pagePath, searchParams = {} } = page;
       const newSearchParams: any = {};
-      Object.keys(searchParams).forEach((key) => {
+      Object.keys(searchParams).forEach(key => {
         if (typeof searchParams[key] === 'string') {
           let exp = searchParams[key];
           exp = exp.replace(/(^%)|(%$)/g, '');
-          searchParams[key] = (
-            row: any,
-            rowId: string | number,
-            index: number,
-          ) =>
+          searchParams[key] = (row: any, rowId: string | number, index: number) =>
             engineApis?.sandBoxSafeRun(exp, {
               row,
               rowId,
@@ -96,11 +80,9 @@ const useFormatCell = (props: useFormatCellProps) => {
       });
 
       let newPath = pagePath || '';
-      Object.keys(newSearchParams).forEach((key) => {
+      Object.keys(newSearchParams).forEach(key => {
         if (!newPath.includes(`${key}=`)) {
-          newPath += `${newPath.includes('?') ? '&' : '?'}${key}=${
-            newSearchParams[key]
-          }`;
+          newPath += `${newPath.includes('?') ? '&' : '?'}${key}=${newSearchParams[key]}`;
         }
       });
 
@@ -121,15 +103,11 @@ const useFormatCell = (props: useFormatCellProps) => {
     }
   };
 
-  const handleOpenModal = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
+  const handleOpenModal = async (row: any, rowId: string | number, rowIndex: number) => {
     if (modal) {
       const { pageId, compStates = {} } = modal;
 
-      Object.keys(compStates).forEach((key) => {
+      Object.keys(compStates).forEach(key => {
         if (typeof compStates[key] === 'string') {
           let exp = compStates[key];
           exp = exp.replace(/(^%)|(%$)/g, '');
@@ -223,8 +201,7 @@ const useFormatCell = (props: useFormatCellProps) => {
 
     if (typeof engineApis?.BannerModal?.open === 'function') {
       // 弹窗预览
-      realFileIds =
-        typeof realFileIds === 'string' ? [realFileIds] : realFileIds;
+      realFileIds = typeof realFileIds === 'string' ? [realFileIds] : realFileIds;
       engineApis.BannerModal.open({
         fileId: realFileIds,
         // viewMode: previewType,
@@ -236,11 +213,7 @@ const useFormatCell = (props: useFormatCellProps) => {
     }
   };
 
-  const onCellClick = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
+  const onCellClick = async (row: any, rowId: string | number, rowIndex: number) => {
     switch (clickType) {
       case PAGE_JUMP:
         handlePageJump(row, rowId, rowIndex);

package/lib/h5public/src/components/factory/src/DynamicTable/hooks/useFormatCell.tsx

@@ -0,0 +1,277 @@
+import Qs from 'qs';
+import { createId } from '../../utils';
+import CustomModule from '../../utils/CustomModule';
+import type { FuncExpExeCuteType } from '../../utils/hooks/useFuncExpExecute';
+import type { ContentClick, FuncCode } from '../types/contentStyle';
+import { CUSTOM, DOWNLOAD_FILE, OPEN_MODAL, PAGE_JUMP, PREVIEW_FILE, ROUTE_PUSH, ROUTE_REPLACE } from '../utils/constant';
+
+interface useFormatCellProps extends ContentClick {
+  appId: string;
+  pageId: string;
+  modalHeight?: number;
+  modalWidth?: number;
+  funcExpExecute?: FuncExpExeCuteType;
+  engineApis: any;
+  $$componentItemId: string;
+}
+
+const useFormatCell = (props: useFormatCellProps) => {
+  const {
+    funcExpExecute,
+    engineApis,
+    appId,
+    pageId,
+    content,
+    clickType,
+    page,
+    modal,
+    openType,
+    fileIds,
+    filename,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    previewType,
+    downloadUrl,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    modalHeight,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    modalWidth,
+    $$componentItemId,
+  } = props;
+
+  const realAppId = appId;
+  const realPageId = pageId;
+
+  const handleCellContent = (row: any, rowIndex: number, rowText?: any) => {
+    if ((content as FuncCode)?.jsx) {
+      return (
+        <div>
+          <CustomModule
+            code={(content as FuncCode)?.code}
+            sandBoxLoadModule={engineApis.sandBoxLoadModule}
+            compProps={{ text: rowText, item: row, index: rowIndex }}
+            errorInfo={{
+              id: $$componentItemId,
+            }}
+          />
+        </div>
+      );
+    }
+    if ((content as FuncCode)?.code && funcExpExecute) {
+      return funcExpExecute((content as FuncCode).code, [
+        {
+          key: 'row',
+          value: row,
+        },
+        {
+          key: 'index',
+          value: rowIndex,
+        },
+      ]);
+    }
+
+    return content;
+  };
+
+  // 获取页面-url参数/路由数据 弹窗-组件状态
+  const getParams = (params: any = {}, row: any, rowId: string | number, rowIndex: number) => {
+    const newParams: any = {};
+    Object.keys(params).forEach(key => {
+      if (typeof params[key] === 'string') {
+        const exp = params[key];
+        params[key] = (row: any, rowId: string | number, index: number) =>
+          engineApis?.sandBoxSafeRun(exp, {
+            row,
+            rowId,
+            index,
+          });
+        newParams[key] = exp;
+      }
+
+      if (typeof params[key] === 'function') {
+        try {
+          newParams[key] = params[key](row, rowId, rowIndex);
+        } catch (e) {
+          console.error(e);
+        }
+      }
+    });
+    return newParams;
+  };
+
+  const handlePageJump = async (row: any, rowId: string | number, rowIndex: number) => {
+    if (page) {
+      const { pagePath, searchParams = {}, routerData = {} } = page;
+      const newSearchParams: any = getParams(searchParams, row, rowId, rowIndex);
+      const newRouteData: any = getParams(routerData, row, rowId, rowIndex);
+
+      const _k = createId();
+      newSearchParams._k = _k;
+      if (Object.keys(newRouteData).length > 0) {
+        window.sessionStorage.setItem(`${_k}`, JSON.stringify(newRouteData));
+      }
+
+      if (!newSearchParams.appId) {
+        newSearchParams.appId = realAppId;
+      }
+
+      const newPath = pagePath || '';
+
+      switch (openType) {
+        case ROUTE_PUSH:
+          if (typeof engineApis?.historyPush === 'function') {
+            engineApis.historyPush(newPath, {
+              search: Qs.stringify(newSearchParams),
+              state: newRouteData,
+            });
+          }
+          break;
+        case ROUTE_REPLACE:
+          if (typeof engineApis?.historyReplace === 'function') {
+            engineApis.historyReplace(newPath, {
+              search: Qs.stringify(newSearchParams),
+              state: newRouteData,
+            });
+          }
+          break;
+        default:
+          break;
+      }
+    }
+  };
+
+  const handleOpenModal = async (row: any, rowId: string | number, rowIndex: number) => {
+    if (modal) {
+      const { pageId, compStates = {} } = modal;
+
+      const newCompStates: any = getParams(compStates, row, rowId, rowIndex);
+
+      if (engineApis?.openModal) {
+        engineApis.openModal({
+          pageId,
+          params: newCompStates,
+        });
+      }
+    }
+  };
+
+  const handleDownloadFile = async (row: any, rowIndex: number) => {
+    if (typeof engineApis?.batchDownloadFileByIds === 'function') {
+      try {
+        let realFilename = filename;
+        let realFileIds = fileIds;
+
+        if ((filename as FuncCode)?.code && funcExpExecute) {
+          realFilename = funcExpExecute((filename as FuncCode).code, [
+            {
+              key: 'row',
+              value: row,
+            },
+            {
+              key: 'index',
+              value: rowIndex,
+            },
+          ]);
+        }
+
+        if ((fileIds as FuncCode)?.code && funcExpExecute) {
+          realFileIds = funcExpExecute((fileIds as FuncCode).code, [
+            {
+              key: 'row',
+              value: row,
+            },
+            {
+              key: 'index',
+              value: rowIndex,
+            },
+          ]);
+        }
+
+        realFileIds = Array.isArray(realFileIds) ? realFileIds[0] : realFileIds;
+
+        engineApis.batchDownloadFileByIds({
+          fileIds: realFileIds,
+          newFileName: realFilename,
+          onError: (errorMessage: string) => {
+            // message.error(errorMessage);
+          },
+        });
+      } catch (e) {
+        console.error(e);
+      }
+    }
+  };
+
+  const handlePreviewFile = async (row: any, rowIndex: number) => {
+    let realFileIds: any = fileIds;
+    if ((fileIds as FuncCode)?.code && funcExpExecute) {
+      realFileIds = funcExpExecute((fileIds as FuncCode).code, [
+        {
+          key: 'row',
+          value: row,
+        },
+        {
+          key: 'index',
+          value: rowIndex,
+        },
+      ]);
+    }
+
+    if (typeof engineApis?.BannerModal?.open === 'function') {
+      // 弹窗预览
+      realFileIds = typeof realFileIds === 'string' ? [realFileIds] : realFileIds;
+      engineApis.BannerModal.open({
+        fileId: realFileIds,
+        // viewMode: previewType,
+        // modalHeight,
+        pageId: realPageId,
+        appId: realAppId,
+        // modalWidth,
+      });
+    }
+  };
+
+  const onCellClick = async (row: any, rowId: string | number, rowIndex: number) => {
+    switch (clickType) {
+      case PAGE_JUMP:
+        handlePageJump(row, rowId, rowIndex);
+        break;
+      case OPEN_MODAL:
+        handleOpenModal(row, rowId, rowIndex);
+        break;
+      case DOWNLOAD_FILE:
+        handleDownloadFile(row, rowIndex);
+        break;
+      case PREVIEW_FILE:
+        handlePreviewFile(row, rowIndex);
+        break;
+      case CUSTOM:
+        // eslint-disable-next-line no-case-declarations
+        let realDownloadUrl: any = downloadUrl;
+
+        if ((downloadUrl as FuncCode)?.code && funcExpExecute) {
+          realDownloadUrl = funcExpExecute((downloadUrl as FuncCode).code, [
+            {
+              key: 'row',
+              value: row,
+            },
+            {
+              key: 'index',
+              value: rowIndex,
+            },
+          ]);
+        }
+
+        window.open(realDownloadUrl, openType);
+        break;
+      default:
+        break;
+    }
+  };
+
+  return {
+    onCellClick,
+    handleCellContent,
+  };
+};
+
+export default useFormatCell;

package/lib/h5public/src/components/factory/src/DynamicTable/index.less

@@ -9,6 +9,19 @@
   background-color: #FFFFFF;
   overflow: hidden;
 
+  .table-row-merge {
+    &-left {
+      justify-content: flex-start !important;
+    }
+
+    &-center {
+      justify-content: center !important;
+    }
+    &-right {
+      justify-content: flex-end !important;
+    }
+  }
+
   .table-header {
     padding: 8 * @hd 0;
     font-size: @font-size-base;
@@ -117,9 +130,10 @@
       .customer-cell-common;
       height: 20 * @hd;
       line-height: 18 * @hd;
-      padding: 0 5 * @hd;
+      padding: 0 8 * @hd;
       border: 1 * @hd solid transparent;
       border-radius: 1000 * @hd;
+      font-size: 11.5 * @hd;
     }
   }
 
@@ -134,7 +148,8 @@
       height: 20 * @hd;
       line-height: 20 * @hd;
       border-radius: 2 * @hd;
-      padding: 0 5 * @hd;
+      padding: 0 8 * @hd;
+      font-size: 11.5 * @hd;
     }
   }
 
@@ -197,6 +212,13 @@
     }
   }
 
+  .ag-header-cell .ag-header-cell-comp-wrapper {
+    flex: 1;
+    .ag-custom-header-cell {
+      width: 100%;
+    }
+  }
+
   .ag-body-horizontal-scroll {
     height: 0 !important;
     min-height: 0 !important;
@@ -308,5 +330,6 @@
     .common-span-cell;
     border-bottom: 1 * @hd solid #EFEFEF;
   }
+  
 
 }

package/lib/h5public/src/components/factory/src/DynamicTable/index.tsx

@@ -3,9 +3,7 @@ import React, { useEffect, useImperativeHandle, useState } from 'react';
 import DynamicTableLoader from './loader';
 import { MyDynamicTableProps } from './Table';
 
-function useSync<S>(
-  initialValue: S,
-): [S, React.Dispatch<React.SetStateAction<S>>] {
+function useSync<S>(initialValue: S): [S, React.Dispatch<React.SetStateAction<S>>] {
   const [state, setState] = useState(initialValue);
   useEffect(() => {
     setState(initialValue);

package/lib/h5public/src/components/factory/src/DynamicTable/loader.ts

@@ -3,15 +3,9 @@ import Loadable from 'react-loadable';
 import { LoadingComponennt } from '../utils/LoaderHelper';
 import { MyDynamicTableProps } from './Table';
 
-const DynamicTableLoader = Loadable<
-  MyDynamicTableProps,
-  React.ComponentType<MyDynamicTableProps>
->({
+const DynamicTableLoader = Loadable<MyDynamicTableProps, React.ComponentType<MyDynamicTableProps>>({
   // eslint-disable-next-line func-call-spacing
-  loader: async () =>
-    (await import(
-      /* webpackChunkName: 'factory-DynamicTable' */ './Table'
-    )) as unknown as React.ComponentType<any>,
+  loader: async () => (await import(/* webpackChunkName: 'factory-DynamicTable' */ './Table')) as unknown as React.ComponentType<any>,
   loading: LoadingComponennt,
 });
 

package/lib/h5public/src/components/factory/src/DynamicTable/types/contentStyle.d.ts

@@ -3,6 +3,7 @@ interface Page {
   pagePath: string;
   currentPageVersionId: string;
   searchParams?: any;
+  routerData?: any;
 }
 interface Modal {
   pageId: string;
@@ -14,6 +15,7 @@ interface Modal {
 export interface FuncCode {
   code: string;
   originCode: string;
+  jsx?: any;
 }
 
 type DataBindType = FuncCode | string | undefined;

package/lib/h5public/src/components/factory/src/DynamicTable/utils/constant.ts

@@ -70,5 +70,4 @@ export const PREVIEW_NEW_TAB = 'newTab';
 export const ROUTE_PUSH = 'push';
 export const ROUTE_REPLACE = 'replace';
 
-export const EDIT_COMPONENT_STOP_PROPAGATION_CLS =
-  'table-edit-component-stop-propagation';
+export const EDIT_COMPONENT_STOP_PROPAGATION_CLS = 'table-edit-component-stop-propagation';

package/lib/h5public/src/components/factory/src/Grid/index.tsx

@@ -45,21 +45,15 @@ const MyGrid = LingxiForwardRef<any, MyGridProps>((props, ref) => {
     }));
   }, [data, aliasIcon, aliasText, gridData]);
 
-  const configCarouselDataIcon = (
-    data: DataItem[],
-    labelKey = aliasText,
-    labelValue = aliasIcon,
-  ) => {
+  const configCarouselDataIcon = (data: DataItem[], labelKey = aliasText, labelValue = aliasIcon) => {
     if (Array.isArray(data)) {
       const { getAppFileUrlByFileCode } = getEngineApis();
       setDataSource(
-        data.map((it) => ({
+        data.map(it => ({
           ...it,
-          icon: (it[labelValue] || '').startsWith('http')
-            ? it[labelValue]
-            : getAppFileUrlByFileCode(it.icon),
+          icon: (it[labelValue] || '').startsWith('http') ? it[labelValue] : getAppFileUrlByFileCode(it.icon),
           text: it[labelKey],
-        })),
+        }))
       );
     }
   };
@@ -68,16 +62,8 @@ const MyGrid = LingxiForwardRef<any, MyGridProps>((props, ref) => {
     setData: (data: any[]) => {
       configCarouselDataIcon(data);
     },
-    setDataWithLabelAndValue: (params: {
-      dataSource: any[];
-      labelKey: string;
-      valueKey: string;
-    }) => {
-      configCarouselDataIcon(
-        params.dataSource,
-        params.labelKey,
-        params.valueKey,
-      );
+    setDataWithLabelAndValue: (params: { dataSource: any[]; labelKey: string; valueKey: string }) => {
+      configCarouselDataIcon(params.dataSource, params.labelKey, params.valueKey);
     },
   }));
   useDeepCompareEffect(() => {

package/lib/h5public/src/components/factory/src/GroupColumn/GroupColumn.tsx

@@ -7,28 +7,10 @@ import { useJsonToParse } from '../utils/hooks/useJsonToParse';
 import { MyGroupColumnProps } from './PropsType';
 
 const MyGroupColumn: LingXiFC<MyGroupColumnProps> = (props, ref) => {
-  const {
-    colors: iColors = '',
-    visible = true,
-    $$componentItem,
-    getEngineApis,
-    style,
-    refData,
-    ...restProps
-  } = props;
-  const {
-    xFontSize,
-    xColor,
-    guideTextFontSize,
-    guideTextColor,
-    yFontSize,
-    yColor,
-  } = props?.style;
+  const { colors: iColors = '', visible = true, $$componentItem, getEngineApis, style, refData, ...restProps } = props;
+  const { xFontSize, xColor, guideTextFontSize, guideTextColor, yFontSize, yColor } = props?.style;
   const finalStyle = useHiddenStyle(visible, style);
-  const [
-    { data: myData = [], legendParams: myLegendParams = [], x },
-    setState,
-  ] = useAsyncState({
+  const [{ data: myData = [], legendParams: myLegendParams = [], x }, setState] = useAsyncState({
     data: props.data,
     legendParams: props.legendParams,
     x: props.x,
@@ -42,7 +24,7 @@ const MyGroupColumn: LingXiFC<MyGroupColumnProps> = (props, ref) => {
       data.map((i: any) => {
         if (i.constructor === Object) {
           const newObj = {} as any;
-          Object.keys(i).forEach((key) => {
+          Object.keys(i).forEach(key => {
             newObj[key] = i[key];
             if (!isNaN(parseInt(i[key], 10))) {
               newObj[key] = parseInt(i[key], 10);
@@ -52,7 +34,7 @@ const MyGroupColumn: LingXiFC<MyGroupColumnProps> = (props, ref) => {
         }
         return i;
       }),
-    [JSON.stringify(data)],
+    [JSON.stringify(data)]
   );
   // 通过字符串截取 获得真正的Color
   const colors = useMemo(() => {

package/lib/h5public/src/components/factory/src/GroupColumn/loader.tsx

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