vap1 0.4.2 → 0.4.4

package/_mixin.scss

@@ -0,0 +1,89 @@
+@use "sass:math";
+@use "sass:map";
+@use 'sass:list';
+@use "sass:string";
+
+/**
+* 本文件提供一些常用的 sass 工具。
+    目前仅提供一个 @mixin : field-width : Table Column 列宽度稳定器。
+    支持 3-4 个参数 ($font-setting, $field-name, $min, $max)
+*/
+
+/***
+    宽度设置说明：
+    正常（紧凑皮肤系列）版本，每个 汉字 12px 每个数字约 7.2px , 每个英文字母约 7.8px
+    暗色系皮肤 +1px
+    说明，以最小字数 = MIN(标题，内容)，例如，标题为 ”性别“，内容只可能是 一个字，时，以两个字为最小字数
+*/
+
+@function classNames($fileds) {
+    $clazz: '';
+
+    @each $field in $fileds {
+        $clazz: "#{$clazz},.table-col-#{$field}"
+    }
+
+    @return string.slice($clazz, 2);
+
+}
+
+
+@function columnBaseWidth($font, $count) {
+    $charWidth: map.get($font, "char");
+    $letterWidth: map.get($font, "letter");
+    $numberWidth: map.get($font, "number");
+    $paddingWidth: map.get($font, "padding");
+
+    $charCount: 0;
+    $letterCount: 0;
+    $numberCount: 0;
+
+    @if map-has-key($count , "char") {
+        $charCount: map.get($count, "char");
+    }
+
+    @if map-has-key($count , "letter") {
+        $letterCount: map.get($count, "letter");
+    }
+
+    @if map-has-key($count , "number") {
+        $numberCount: map.get($count, "number");
+    }
+
+    @return ($charCount * $charWidth)+($numberCount * $numberWidth)+($letterCount * $letterWidth)+$paddingWidth;
+}
+
+@function columnDefine($count) {
+    @if type-of($count)=='map' {
+        @return $count;
+    }
+    @return (char :$count, number: 0, letter :0)
+}
+
+
+@mixin field-width($font, $field, $min, $max : null) {
+    $clazz : "";
+    $minWidth : columnBaseWidth($font, columnDefine($min));
+
+    @if type-of($field)=="list" {
+        $clazz : classNames($field);
+    }
+
+    @else {
+        $clazz: ".table-col-#{$field}";
+    }
+
+    #{$clazz} {
+        min-width: math.ceil($minWidth + 6px);
+
+        @if type-of($max) !='null' {
+            max-width: columnBaseWidth($font, columnDefine($max));
+        }
+
+        &.c-table-col-has-sorter {
+            min-width: math.ceil($minWidth + 18px);
+        }
+    }
+
+}
+

package/components/Box/Box.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { MutableRefObject } from 'react';
+import type { MutableRefObject, ReactNode, CSSProperties } from 'react';
 import type { SelectBarProps } from './SelectBar';
 import type { SearchBarProps } from '../SearchBar';
 import type { ActButton } from '../SearchBar/ActionButtons';
@@ -78,7 +78,7 @@ export type BoxProps = {
     /**
      * 自定义 className
     */
-    style?: React.CSSProperties;
+    style?: CSSProperties;
     /**
      * 展示模式
     */
@@ -94,7 +94,7 @@ export type BoxProps = {
     /**
      * 操作区域
     */
-    actionBar?: (ActButton[]) | React.ReactNode;
+    actionBar?: (ActButton[]) | ReactNode;
     /**
      * 分页区域
     */

package/components/Box/Box.js

@@ -94,36 +94,45 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
     var rootRef = (0, react_1.useRef)(null);
     var contextRef = (0, react_1.useRef)(null);
     var selectRef = (0, react_1.useRef)(null);
-    var className = ['c-box'];
-    if (props.nobg)
-        className.push('c-box-nobg');
-    var style = __assign({}, props.style);
-    className.push(props.mode ? ('c-box-' + props.mode) : 'c-box-common');
-    if (props.mode == 'inner') {
-        if (rootRef.current == null) {
-            // style.height = 0;
-            style.display = 'none';
-        }
-        else {
-            var container = utils_1.PageUtil.getParentByClassName(rootRef.current.parentElement, 'c-box');
-            style.height = Math.floor(container.parentElement.getBoundingClientRect().height);
-        }
-    }
-    else if (props.mode == 'fixed') {
-        if (app != null) {
-            style.height = app.theme.contentHeight;
+    var mode = (0, react_1.useMemo)(function () {
+        return props.mode || 'common';
+    }, [props.mode]);
+    var className = (0, react_1.useMemo)(function () {
+        var clazz = ['c-box'];
+        clazz.push('c-box-nobg');
+        clazz.push('c-box-' + mode);
+        if (props.className)
+            clazz.push(props.className);
+        return clazz.join(' ');
+    }, [props.className, props.nobg, mode]);
+    var style = (0, react_1.useMemo)(function () {
+        var css = __assign({}, props.style);
+        if (mode == 'inner') {
+            if (rootRef.current == null) {
+                css.display = 'none';
+            }
+            else {
+                var container = utils_1.PageUtil.getParentByClassName(rootRef.current.parentElement, 'c-box');
+                css.height = Math.floor(container.parentElement.getBoundingClientRect().height);
+            }
         }
-        else {
-            style.height = '100%';
+        else if (mode == 'fixed') {
+            if (app != null) {
+                css.height = app.theme.contentHeight;
+            }
+            else {
+                css.height = '100%';
+            }
         }
-    }
+        return css;
+    }, [props.style, mode, state === null || state === void 0 ? void 0 : state.height]);
     (0, react_1.useEffect)(function () {
         if (state && state.height && contextRef && contextRef.current) {
             contextRef.current.style.height = (state.height + 'px');
         }
     }, [state === null || state === void 0 ? void 0 : state.height]);
-    var resize = function () {
-        if (props.mode == undefined || props.mode == 'common' || app == null) {
+    var resize = (0, react_1.useCallback)(function () {
+        if (mode == 'common' || app == null) {
             if (state === null)
                 setState({});
             return;
@@ -134,7 +143,7 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
             return;
         document.body.classList.add('v-resizing');
         var total = el.getBoundingClientRect().height;
-        if (props.mode == 'inner') {
+        if (mode == 'inner') {
             total = el.parentElement.parentElement.getBoundingClientRect().height;
         }
         var children = el.children;
@@ -147,15 +156,15 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
                 total -= child.getBoundingClientRect().height;
             }
         }
-        setState({ height: Math.floor(total) });
         document.body.classList.remove('v-resizing');
-    };
-    (0, react_1.useEffect)(function () { setTimeout(resize, 2); }, [app === null || app === void 0 ? void 0 : app.theme.contentHeight]);
-    (0, react_1.useImperativeHandle)(ref, function () { return ({ resize: resize }); }, []);
+        setState({ height: Math.floor(total) });
+    }, [mode]);
+    (0, react_1.useEffect)(function () { setTimeout(resize, 120); }, [app === null || app === void 0 ? void 0 : app.theme.contentHeight]); // 1.5 版本：延时 120ms
+    (0, react_1.useImperativeHandle)(ref, function () { return ({ resize: resize }); }, [mode]);
     (0, react_1.useLayoutEffect)(function () {
         setTimeout(resize, 5);
     }, []);
-    return react_1.default.createElement(Layout_1.Layout, { id: domId, className: utils_1.StringUtil.className(className, props.className), style: style, ref: _layoutRef },
+    return react_1.default.createElement(Layout_1.Layout, { id: domId, className: className, style: style, ref: _layoutRef },
         props.selectBar && (0, _register_1.getSelectBar)(props.selectBar.type) != null && react_1.default.createElement(SelectBar_1.SelectBar, __assign({}, props.selectBar, { ref: props.selectBar.selectRef ? props.selectBar.selectRef : selectRef, onSelect: function () {
                 var args = [];
                 for (var _a = 0; _a < arguments.length; _a++) {
@@ -178,7 +187,7 @@ exports.Box = (0, react_1.forwardRef)(function (props, ref) {
             } },
             (props.searchBar ||
                 (props.actionBar && ((lodash_1.default.isArray(props.actionBar) && props.actionBar.length > 0)
-                    || (!lodash_1.default.isArray(props.actionBar) && react_1.default.isValidElement(props.actionBar))))) && react_1.default.createElement(SearchBar_1.SearchBar, __assign({}, props.searchBar, { default: props.default, className: HEIGHT_OMIT, onExpand: function (isExpand) {
+                    || (!lodash_1.default.isArray(props.actionBar) && (0, react_1.isValidElement)(props.actionBar))))) && react_1.default.createElement(SearchBar_1.SearchBar, __assign({}, props.searchBar, { default: props.default, className: HEIGHT_OMIT, onExpand: function (isExpand) {
                     resize();
                     if (lodash_1.default.isFunction(props.searchBar.onExpand)) {
                         props.searchBar.onExpand(isExpand);

package/components/Box/SelectBar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentType } from 'react';
+import type { ComponentType, MutableRefObject, ReactNode } from 'react';
 import type { Key, BaseItem, PlainObject } from '../../basetype';
 import type { STreeProps } from '../Trees/STree';
 import type { DTreeProps } from '../Trees/DTree';
@@ -21,7 +21,7 @@ type SelectBarAction = BaseItem & {
     /**
      * 如需二次确定，传提示消息
     */
-    confirm?: React.ReactNode;
+    confirm?: ReactNode;
 };
 type _BoxSelectBarProps = BaseItem & {
     /**
@@ -63,7 +63,7 @@ type _BoxSelectBarProps = BaseItem & {
     /**
      * 选择区映射，用于一些特殊场景
     */
-    selectRef?: React.MutableRefObject<any>;
+    selectRef?: MutableRefObject<any>;
 };
 /**
  * 说明： 内置 stree/dtree/ftree 三种树类型，和 list 类型

package/components/Lists/SList.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
+import type { FC, CSSProperties, ReactNode } from 'react';
 import type { PlainObject, Key } from '../../basetype';
-import type { ReactNode } from 'react';
 import type { IconProps } from '../_adapt/Icon';
 type ItemRenderFunction = (record: PlainObject, searchValue?: string) => ReactNode;
 export type SListProps = {
-    style?: React.CSSProperties;
+    style?: CSSProperties;
     className?: string;
     /**
      * key 字段，默认为ID
@@ -38,7 +37,7 @@ export type SListProps = {
      *
     */
     renders?: {
-        icon?: (record: PlainObject, searchValue?: string) => IconProps | string | React.ReactNode;
+        icon?: (record: PlainObject, searchValue?: string) => IconProps | string | ReactNode;
         title: ItemRenderFunction;
         value?: ItemRenderFunction;
         action?: ItemRenderFunction;
@@ -56,5 +55,5 @@ export type SListProps = {
     */
     mustSelect?: true | ((list: PlainObject[]) => PlainObject);
 };
-export declare const SList: React.FC<SListProps>;
+export declare const SList: FC<SListProps>;
 export {};

package/components/Lists/SList.js

@@ -78,7 +78,7 @@ var ItemIcon = function (props) {
         }
         return react_1.default.createElement(Icon_1.Icon, __assign({}, props_1));
     }
-    if (react_1.default.isValidElement(value)) {
+    if ((0, react_1.isValidElement)(value)) {
         return value;
     }
     return utils_1.Const.NONE;
@@ -113,7 +113,6 @@ var buildRenderByField = function (props) {
             valueField && react_1.default.createElement("span", { className: 'v-select-list-item-value' }, item[valueField]));
     };
 };
-// export const SList: React.FC<SListPorps> = memo((props) => {
 exports.SList = (0, react_1.memo)(function (props) {
     var searchValue = props.searchValue, onSelect = props.onSelect, keyField = props.keyField;
     var _a = __read((0, react_1.useState)((lodash_1.default.has(props, 'list') && lodash_1.default.isArray(props.list)) ? props.list : []), 2), list = _a[0], setList = _a[1];

package/components/SearchBar/ActionButtons.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FC, ReactNode } from 'react';
 import type { ButtonType } from '../_adapt/_Antd5';
 import type { ButtonProps } from '../_adapt/Button';
 import type { ButtonSize } from 'antd/es/button';
@@ -6,7 +6,7 @@ export type ActButton = {
     /**
      * Icon 图标
     */
-    icon?: string | React.ReactNode;
+    icon?: string | ReactNode;
     /**
      * 按钮样式类型
     */
@@ -26,7 +26,7 @@ export type ActButton = {
     /**
      * 提示信息
     */
-    confirm?: string | ((props?: any) => string | React.ReactNode);
+    confirm?: string | ((props?: any) => string | ReactNode);
     /**
      * 自定义的按钮属性
     */
@@ -44,7 +44,7 @@ export type ActButton = {
     */
     children?: ActButton[];
 };
-export declare const ActionButtons: React.FC<{
+export declare const ActionButtons: FC<{
     buttons: (ActButton | null | false)[];
     size?: ButtonSize;
 }>;

package/components/SearchBar/ActionButtons.js

@@ -10,6 +10,29 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __values = (this && this.__values) || function(o) {
     var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
     if (m) return m.call(o);
@@ -26,7 +49,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ActionButtons = void 0;
-var react_1 = __importDefault(require("react"));
+var react_1 = __importStar(require("react"));
 var lodash_1 = __importDefault(require("lodash"));
 var Popconfirm_1 = require("../_adapt/Popconfirm");
 var Icon_1 = require("../_adapt/Icon");
@@ -96,7 +119,7 @@ var ActionButtons = function (props) {
     var e_1, _a;
     var _b;
     if (((_b = props.buttons) === null || _b === void 0 ? void 0 : _b.length) <= 0)
-        return react_1.default.createElement(react_1.default.Fragment, null);
+        return utils_1.Const.NONE;
     var groups = [[]];
     try {
         for (var _c = __values(props.buttons), _d = _c.next(); !_d.done; _d = _c.next()) {
@@ -124,6 +147,6 @@ var ActionButtons = function (props) {
     var groupProps = {};
     if (props.size)
         groupProps.size = props.size;
-    return react_1.default.createElement(react_1.default.Fragment, null, groups.map(function (group, gi) { return react_1.default.createElement(Button_1.Button.Group, __assign({ key: gi }, groupProps), group.map(function (btn, bi) { return react_1.default.createElement(ActionButton, __assign({ key: bi }, btn)); })); }));
+    return react_1.default.createElement(react_1.Fragment, null, groups.map(function (group, gi) { return react_1.default.createElement(Button_1.Button.Group, __assign({ key: gi }, groupProps), group.map(function (btn, bi) { return react_1.default.createElement(ActionButton, __assign({ key: bi }, btn)); })); }));
 };
 exports.ActionButtons = ActionButtons;

package/components/SearchBar/ByField.d.ts

@@ -1,5 +1,5 @@
-import type { SearchBarByFieldProps } from './index';
 import type { FC, RefAttributes, ForwardRefExoticComponent } from 'react';
+import type { SearchBarByFieldProps } from './index';
 /**
  * 仅内容使用
 */

package/components/SearchBar/ByField.js

@@ -191,7 +191,7 @@ exports.InnerSearchBarByField = (0, react_1.forwardRef)(function (props, ref) {
     var btnRender = function (rowSize, isExpand) {
         if (props.hideAction || isExpand || isAwaysExpand)
             return utils_1.Const.NONE;
-        return react_1.default.createElement(react_1.default.Fragment, null,
+        return react_1.default.createElement(react_1.Fragment, null,
             react_1.default.createElement(Button_1.Button, { disabled: props.disabled, icon: 'search', type: "primary", onClick: function (e) { return utils_1.PageUtil.stopEvent(e, search); } }),
             react_1.default.createElement(Button_1.Button, { disabled: props.disabled, icon: 'redo', onClick: function (e) { return utils_1.PageUtil.stopEvent(e, clear); } }),
             rowSize > 1 && !utils_1.GLOBAL.CONFIG.SEARCHBAR.USE_MODAL && react_1.default.createElement(Button_1.Button, { disabled: props.disabled, icon: 'filter', onClick: function (e) { return utils_1.PageUtil.stopEvent(e, function () { return setIsExpand(true); }); } }),
@@ -234,7 +234,7 @@ exports.InnerSearchBarByField = (0, react_1.forwardRef)(function (props, ref) {
     }, [layout.rows]);
     if (layout == null)
         return react_1.default.createElement("div", { className: 'c-searchbar-fields' });
-    return react_1.default.createElement("div", { className: 'c-searchbar-fields', style: fieldsStyle }, layout.rows.length && react_1.default.createElement(react_1.default.Fragment, null,
+    return react_1.default.createElement("div", { className: 'c-searchbar-fields', style: fieldsStyle }, layout.rows.length && react_1.default.createElement(react_1.Fragment, null,
         layout.isOutSide ? react_1.default.createElement("div", { className: "c-searchbar-outgroup c-searchbar-fixgroup" },
             rowRender(layout.rows[0]),
             btnRender(layout.rows.length, isExpand)) : react_1.default.createElement(antd_1.Input.Group, { compact: true, className: "c-searchbar-fixgroup" },

package/components/SearchBar/ByKeyword.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import type { FC } from 'react';
 import type { SearchBarProps } from './index';
-export declare const SearchBarByKeyword: React.FC<SearchBarProps>;
+export declare const SearchBarByKeyword: FC<SearchBarProps>;

package/components/SearchBar/ByKeyword.js

@@ -81,9 +81,9 @@ var SearchBarByKeyword = function (props) {
     }, [open]);
     var suffixProps = {};
     if (props.fields && props.fields.length) {
-        suffixProps.suffix = react_1.default.createElement(react_1.default.Fragment, null,
+        suffixProps.suffix = react_1.default.createElement(react_1.Fragment, null,
             react_1.default.createElement("span", { ref: spanRef, onClick: function () { return setOpen(true); }, style: { pointerEvents: props.disabled ? 'none' : 'unset' }, className: 'vicon vicon-menu', title: utils_1.i18n.txt(_i18n_1.V.INPUT_SEARCH_ADVANCE) }, "\u00A0"),
-            react_1.default.createElement(Popover_1.Popover, { open: open, onOpenChange: setOpen, trigger: "click", placement: "bottom", content: react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(Popover_1.Popover, { open: open, onOpenChange: setOpen, trigger: "click", placement: "bottom", content: react_1.default.createElement(react_1.Fragment, null,
                     react_1.default.createElement("h3", null, utils_1.i18n.txt(_i18n_1.V.INPUT_SEARCH_ADVANCE)),
                     react_1.default.createElement("div", { className: 'c-searchbar' },
                         react_1.default.createElement(ByField_1.InnerSearchBarByField, __assign({}, props, { ref: barRef, __innerExpand: true, __innerOutside: true, __innnerPopup: true, onSearch: function (param) {

package/components/SearchBar/SearchField.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
 import { SearchFieldComponent } from './_register';
+import type { FC } from 'react';
 import type { Field } from './index';
-export type FieldInput = React.FC<{
+export type FieldInput = FC<{
     SearchField: SearchFieldComponent;
     disabled: boolean;
     field: Field;

package/components/SearchBar/index.js

@@ -31,7 +31,7 @@ var _SearchBar = function (props) {
                 react_1.default.createElement(ByKeyword_1.SearchBarByKeyword, __assign({}, props)),
                 react_1.default.createElement("div", { className: 'c-searchbar-actions' }, props.children));
         if (!lodash_1.default.has(props, 'children'))
-            return react_1.default.createElement(react_1.default.Fragment, null);
+            return utils_1.Const.NONE;
         return react_1.default.createElement("div", { className: utils_1.StringUtil.className(clazz, props.className) },
             react_1.default.createElement("div", { className: 'c-searchbar-fields' }),
             react_1.default.createElement("div", { className: 'c-searchbar-actions' }, props.children));

package/components/Tables/Components/ActionBar.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
+import type { FC, MutableRefObject } from 'react';
 import type { Key, PlainObject } from '../../../basetype';
 import type { ActButton } from '../../SearchBar/ActionButtons';
-import type { MutableRefObject } from 'react';
 export type TableAction = (ids?: Key[], objs?: PlainObject[], param?: PlainObject) => void;
 /**
  * VTable Button 区域点击后的方法，支持三个参数
@@ -32,7 +31,7 @@ type TableActionBar = {
     queryParam: PlainObject;
     selectedRef: MutableRefObject<SelectFunction>;
 };
-export declare const ActionBar: React.FC<TableActionBar>;
+export declare const ActionBar: FC<TableActionBar>;
 /**
  * 通用添加按钮
 */

package/components/Tables/Components/Actions.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FC, ReactNode } from 'react';
 import type { TableColumn } from '../index';
 import type { BaseItem } from '../../../basetype';
 /**
@@ -38,10 +38,10 @@ export type CustomAcitonProps = ActionPorps & {
     /**
      * 自定义操作的二次确认提示
     */
-    confrim?: React.ReactNode;
+    confrim?: ReactNode;
 };
-export declare const INFO: React.FC<ActionPorps>;
-export declare const EDIT: React.FC<ActionPorps>;
-export declare const DELETE: React.FC<ActionPorps>;
-export declare const ACTION: React.FC<CustomAcitonProps>;
-export declare const COL_OPERACTION: (props: TableColumn | ((value: any, record: any, index: number) => React.ReactNode)) => TableColumn;
+export declare const INFO: FC<ActionPorps>;
+export declare const EDIT: FC<ActionPorps>;
+export declare const DELETE: FC<ActionPorps>;
+export declare const ACTION: FC<CustomAcitonProps>;
+export declare const COL_OPERACTION: (props: TableColumn | ((value: any, record: any, index: number) => ReactNode)) => TableColumn;

package/components/Tables/Components/Actions.js

@@ -28,7 +28,7 @@ var DEFAULT_CLASS = {
 };
 var INFO = function (props) {
     if (props.roleCode && !utils_1.PageUtil.hasRole(props.roleCode))
-        return react_1.default.createElement(react_1.default.Fragment, null);
+        return utils_1.Const.NONE;
     var title = utils_1.i18n.getText(props.ik, props.title, _i18n_1.V.BTN_INFO);
     return react_1.default.createElement("span", { className: DEFAULT_CLASS.INFO, onClick: function (evt) { return utils_1.PageUtil.stopEvent(evt, props.onClick); }, title: "".concat(title, " ").concat(props.name || '') },
         react_1.default.createElement(Icon_1.Icon, { type: 'search' }),
@@ -37,7 +37,7 @@ var INFO = function (props) {
 exports.INFO = INFO;
 var EDIT = function (props) {
     if (props.roleCode && !utils_1.PageUtil.hasRole(props.roleCode))
-        return react_1.default.createElement(react_1.default.Fragment, null);
+        return utils_1.Const.NONE;
     var title = utils_1.i18n.getText(props.ik, props.title, _i18n_1.V.ACT_UPDATE);
     return react_1.default.createElement("span", { className: DEFAULT_CLASS.EDIT, onClick: function (evt) { return utils_1.PageUtil.stopEvent(evt, props.onClick); }, title: "".concat(title, " ").concat(props.name || '') },
         react_1.default.createElement(Icon_1.Icon, { type: 'edit' }),
@@ -46,7 +46,7 @@ var EDIT = function (props) {
 exports.EDIT = EDIT;
 var DELETE = function (props) {
     if (props.roleCode && !utils_1.PageUtil.hasRole(props.roleCode))
-        return react_1.default.createElement(react_1.default.Fragment, null);
+        return utils_1.Const.NONE;
     var title = utils_1.i18n.getText(props.ik, props.title, _i18n_1.V.ACT_DELETE);
     var popTitle = utils_1.i18n.txt(_i18n_1.V.ACT_DELETE_CONFIRM, props.name || '');
     return react_1.default.createElement(Popconfirm_1.Popconfirm, { onConfirm: function (e) { return utils_1.PageUtil.stopEvent(e, function () { return props.onClick(); }); }, placement: "right", title: react_1.default.createElement("span", null, popTitle), overlayClassName: 'c-table-action-confirm' },
@@ -57,7 +57,7 @@ var DELETE = function (props) {
 exports.DELETE = DELETE;
 var ACTION = function (props) {
     if (props.roleCode && !utils_1.PageUtil.hasRole(props.roleCode))
-        return react_1.default.createElement(react_1.default.Fragment, null);
+        return utils_1.Const.NONE;
     var title = utils_1.i18n.getText(props.ik, props.title);
     var className = lodash_1.default.has(DEFAULT_CLASS, props.type) ? DEFAULT_CLASS[props.type] : DEFAULT_CLASS.EDIT;
     if (!lodash_1.default.has(props, 'confrim')) {

package/components/Tables/Components/index.d.ts

@@ -1,14 +1,14 @@
-/// <reference types="react" />
+import type { FC, ReactNode } from 'react';
 import type { TableColumn } from '../index';
 import type { ActionPorps, CustomAcitonProps } from './Actions';
 import type { TableAction, TableActionButton } from './ActionBar';
 export declare const defineTable: (table: TableDefined) => void;
 export type TableDefined = {
-    INFO: React.FC<ActionPorps>;
-    EDIT: React.FC<ActionPorps>;
-    DELETE: React.FC<ActionPorps>;
-    ACTION: React.FC<CustomAcitonProps>;
-    COL_OPERACTION: (props: TableColumn | ((value: any, record: any, index: number) => React.ReactNode)) => TableColumn;
+    INFO: FC<ActionPorps>;
+    EDIT: FC<ActionPorps>;
+    DELETE: FC<ActionPorps>;
+    ACTION: FC<CustomAcitonProps>;
+    COL_OPERACTION: (props: TableColumn | ((value: any, record: any, index: number) => ReactNode)) => TableColumn;
     BUTTON_ADD: (onClick: TableAction, props?: Partial<TableActionButton>) => TableActionButton;
     BUTTON_DELETE: (onClick: TableAction, props?: Partial<TableActionButton>) => TableActionButton;
     BUTTON_IMPORT: (onClick: TableAction, props?: Partial<TableActionButton>) => TableActionButton;

package/components/Tables/TopTable.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FC } from 'react';
 import type { BaseTableProps, TableColumn } from './index';
 import type { PlainObject } from '../../basetype';
 import type { ListModel } from '../../hooks/_list';
@@ -22,4 +22,4 @@ export type TopTableProps = Omit<BaseTableProps, 'mode' | 'columns' | 'select' |
     onRowSelect?: (row: PlainObject) => void;
     columns: TableColumn[];
 };
-export declare const TopTable: React.FC<TopTableProps>;
+export declare const TopTable: FC<TopTableProps>;

package/components/Tables/TopTable.js

@@ -90,25 +90,7 @@ var TopTable = function (props) {
     var _c = __read((0, react_1.useState)(undefined), 2), scroll = _c[0], setScroll = _c[1];
     var _d = __read((0, react_1.useState)(null), 2), selected = _d[0], setSelected = _d[1];
     (0, react_1.useEffect)(function () {
-        var cols = [];
-        if (props.showIndex !== false) {
-            cols.push((0, Util_1.getIdxColumn)({ current: 0 }, props.showIndex, true));
-        }
-        props.columns.map(function (col) {
-            if (col.roleCode) {
-                if (!utils_1.PageUtil.hasRole(col.roleCode)) {
-                    return;
-                }
-            }
-            if (col.ik) {
-                var title = utils_1.i18n.txt(col.ik);
-                cols.push(__assign(__assign({}, col), { title: title == '' ? col.title : title }));
-            }
-            else {
-                cols.push(col);
-            }
-        });
-        setColumns(cols);
+        setColumns((0, Util_1.convertColumns)(props, { ref: { current: 0 }, isRank: true }));
     }, [props.columns]);
     var onRowSelect = (0, react_1.useCallback)(function (data) {
         if (selected == null || data[rowKey] != selected[rowKey]) {
@@ -127,6 +109,9 @@ var TopTable = function (props) {
             return;
         clearTimeout(resizePid.current);
         resizePid.current = setTimeout(function () {
+            if (tableRef.current == null)
+                return;
+            clearTimeout(resizePid.current);
             var thead = (0, VTable_1.getHeightByTagName)(tableRef.current, 'thead') || 40;
             tableRef.current.style.display = 'none';
             var height = tableRef.current.parentElement.getBoundingClientRect().height;
@@ -164,6 +149,7 @@ var TopTable = function (props) {
             }
         }); };
     }
+    console.log(scroll);
     return react_1.default.createElement("div", { ref: tableRef, className: 'c-table-top-container' },
         react_1.default.createElement(Table_1.Table, __assign({}, tableProps, props, { rowClassName: function (record, i) {
                 var clazz = [];

package/components/Tables/TopTableModal.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
+import type { FC } from 'react';
 import type { ModalProps } from '../_adapt/Modal';
 import type { TopTableProps } from './TopTable';
 export type TopTableModalProps = TopTableProps & ModalProps;
-export declare const TopTableModal: React.FC<TopTableModalProps>;
+export declare const TopTableModal: FC<TopTableModalProps>;

package/components/Tables/TopTableModal.js

@@ -25,7 +25,7 @@ var TOP_TABLE_PROPERTIES = [
 var TopTableModal = function (props) {
     var modalProps = lodash_1.default.omit(props, TOP_TABLE_PROPERTIES);
     var tableProps = lodash_1.default.pick(props, TOP_TABLE_PROPERTIES);
-    return react_1.default.createElement(Modal_1.Modal, __assign({}, modalProps),
+    return react_1.default.createElement(Modal_1.Modal, __assign({ footer: null }, modalProps),
         react_1.default.createElement(TopTable_1.TopTable, __assign({}, tableProps)));
 };
 exports.TopTableModal = TopTableModal;

package/components/Tables/Util.d.ts

@@ -1,3 +1,7 @@
 import type { MutableRefObject } from 'react';
+import type { BaseTableProps } from './index';
 import type { ColumnProps } from 'antd/es/table/interface';
-export declare const getIdxColumn: (ref: MutableRefObject<number>, showIndex?: string, isRank?: boolean) => ColumnProps<any>;
+export declare const convertColumns: (props: BaseTableProps, rank: {
+    ref: MutableRefObject<number>;
+    isRank?: boolean;
+}) => ColumnProps<any>[];