@vtx/components 4.0.0-beta.52 → 4.0.0-beta.54

package/es/vtx-datagrid/index.js

@@ -154,7 +154,7 @@ function VtxTable(props) {
     var resizeObserver = new ResizeObserver(function () {
       calculateHeight();
     });
-    if (autoFit && rootDomRef.current) {
+    if (autoFit && rootDomRef.current && scrollY) {
       resizeObserver.observe(rootDomRef.current, {
         box: 'border-box'
       });
@@ -164,7 +164,7 @@ function VtxTable(props) {
         resizeObserver.disconnect();
       }
     };
-  }, [autoFit, tableSize]);
+  }, [autoFit, tableSize, scrollY]);
   useLayoutEffect(function () {
     if (autoFit) {
       calculateHeight();
@@ -369,8 +369,11 @@ function VtxTable(props) {
         x: 'max-content'
       }, scroll),
       pagination: getPagination(rest.pagination),
-      style: {
-        height: "calc(100% - ".concat(toolbarHeight.current + alertHeight.current, "px)")
+      xs: true,
+      styles: {
+        root: {
+          height: "calc(100% - ".concat(toolbarHeight.current + alertHeight.current, "px)")
+        }
       },
       locale: _objectSpread({
         emptyText: /*#__PURE__*/_jsx(Empty, {

package/es/vtx-datagrid/style/index.js

@@ -26,21 +26,32 @@ var genVtxStyle = function genVtxStyle(token) {
   }, '.ant-table', _defineProperty({
     // height: '100%',
     flex: 1
-  }, '.ant-table-container', _defineProperty(_defineProperty({}, '.ant-table-body', {
+  }, '.ant-table-container', _defineProperty(_defineProperty({
+    height: '100%',
+    borderInlineStart: "none"
+  }, '.ant-table-body', {
     scrollbarWidth: "thin"
   }), '.ant-table-content', _defineProperty({
-    // height: '100%',
+    height: '100%',
     scrollbarWidth: "thin"
   }, 'table', {
     // height: '100%',
     minWidth: "calc(100% - 1px) !important"
   })))))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
     '>tr>th': {
-      background: token.colorBgContainer
+      background: token.colorBgContainer,
+      '&:first-child': {
+        borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+      }
     }
   })), '.ant-table-cell', {
     // minWidth: 10,
   }), '.ant-table-tbody', {
+    '>tr>td': {
+      '&:first-child': {
+        borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+      }
+    },
     '>tr.ant-table-placeholder': {
       position: 'absolute',
       top: "auto",
@@ -68,10 +79,13 @@ var genVtxStyle = function genVtxStyle(token) {
         }
       }
     }
-  })), '.ant-pagination', _defineProperty({}, '.ant-pagination-item', {
+  })), '.ant-pagination', _defineProperty({
+    margin: "var(--ant-margin) 0 0 0"
+  }, '.ant-pagination-item', {
     borderRadius: token.borderRadiusSM
   })))), "".concat(componentCls, "-fit"), {
-    height: '100%'
+    height: '100%',
+    minHeight: 200
   }), "".concat(componentCls, "-noFit"), {}), "".concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
     borderColor: 'transparent'
   }, '.ant-table-thead', {
@@ -126,10 +140,14 @@ var genVtxStyle = function genVtxStyle(token) {
     '>tr>th': {
       background: token.colorBgContainer
     }
-  }))), "".concat(componentCls, "-no-data"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({}, '.ant-table-content', _defineProperty({
+  }))), "".concat(componentCls, "-no-data"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({
+    borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+  }, '.ant-table-content', _defineProperty({
     borderRight: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)",
     borderBottom: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
-  }, 'table', {})))))))), "".concat(componentCls, "-no-data").concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({}, '.ant-table-content', {
+  }, 'table', {})))))))), "".concat(componentCls, "-no-data").concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({
+    borderInlineStart: "none"
+  }, '.ant-table-content', {
     borderRight: "none",
     borderBottom: "none"
   })))))));

package/es/vtx-import/index.js

@@ -11,7 +11,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useRef, useEffect, useContext } from 'react';
-import { message, Button } from 'antd';
+import { message, Button, Tooltip } from 'antd';
 import PropTypes from 'prop-types';
 import useSet from "../utils/useSet";
 import VtxImportResult from "./result";
@@ -72,7 +72,8 @@ function VtxImport(props) {
       currentIndex: 0,
       chunkId: '',
       chunks: [],
-      operation: props.operation || intl.getMessage('import.operation', '导入')
+      operation: props.operation || intl.getMessage('import.operation', '导入'),
+      fileName: ''
     }),
     _useSet2 = _slicedToArray(_useSet, 2),
     state = _useSet2[0],
@@ -418,19 +419,80 @@ function VtxImport(props) {
       startUpload();
     }
   }, [state.chunkId]);
+  var truncateFileName = function truncateFileName(fileName) {
+    var maxLength = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 28;
+    if (fileName.length <= maxLength) return fileName;
+    var extIndex = fileName.lastIndexOf('.');
+    var ext = extIndex !== -1 ? fileName.slice(extIndex) : '';
+    var name = extIndex !== -1 ? fileName.slice(0, extIndex) : fileName;
+    var availableLength = maxLength - ext.length - 3; // 3 是 "..."
+    if (availableLength <= 0) return "...".concat(ext);
+    var startLength = Math.ceil(availableLength / 2);
+    var endLength = Math.floor(availableLength / 2);
+    var start = name.slice(0, startLength);
+    var end = name.slice(-endLength);
+    return "".concat(start, "...").concat(end).concat(ext);
+  };
+
+  // 处理文件选择变化
+  var handleFileChange = function handleFileChange(event) {
+    var _event$target$files;
+    var file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
+    if (file) {
+      setState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          fileName: truncateFileName(file.name)
+        });
+      });
+      // 这里可以添加文件上传或其他处理逻辑
+      // 例如：uploadFile(file);
+    } else {
+      setState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          fileName: ''
+        });
+      });
+    }
+  };
+  var handleSelectFile = function handleSelectFile() {
+    var _fileInputRef$current3;
+    (_fileInputRef$current3 = fileInputRef.current) === null || _fileInputRef$current3 === void 0 || _fileInputRef$current3.click();
+  };
   return wrapSSR( /*#__PURE__*/_jsxs(VtxModal, _objectSpread(_objectSpread({}, modalProps), {}, {
-    children: [props.children, /*#__PURE__*/_jsx("form", {
+    children: [props.children, /*#__PURE__*/_jsxs("form", {
       encType: "multipart/form-data",
       method: "post",
       target: "tmp",
       action: uploadURL,
       ref: formRef,
-      children: /*#__PURE__*/_jsx("input", {
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: "".concat(prefixCls, "-btn"),
+        children: [/*#__PURE__*/_jsx(Button, {
+          onClick: handleSelectFile,
+          children: /*#__PURE__*/_jsx("span", {
+            className: "".concat(prefixCls, "-label"),
+            children: intl.getMessage('import.selectFile', '选择文件')
+          })
+        }), state.fileName ? /*#__PURE__*/_jsx(Tooltip, {
+          title: state.fileName,
+          children: /*#__PURE__*/_jsx("div", {
+            className: "".concat(prefixCls, "-file-name"),
+            children: state.fileName
+          })
+        }) : /*#__PURE__*/_jsx("div", {
+          className: "".concat(prefixCls, "-file-name"),
+          children: intl.getMessage('import.noFileSelected', '未选择任何文件')
+        })]
+      }), /*#__PURE__*/_jsx("input", {
         type: "file",
         name: state.fileKey,
         accept: state.accept,
-        ref: fileInputRef
-      })
+        ref: fileInputRef,
+        style: {
+          display: 'none'
+        },
+        onChange: handleFileChange
+      })]
     }), /*#__PURE__*/_jsx("iframe", {
       name: "tmp",
       style: {

package/es/vtx-import/style/index.js

@@ -7,7 +7,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { useStyle as useAntdStyle } from "../../vtx-provider";
 var genVtxImportStyle = function genVtxImportStyle(token) {
   var componentCls = token.componentCls;
-  return _defineProperty({}, componentCls, {
+  return _defineProperty({}, componentCls, _defineProperty({
     '.ant-modal-container': {
       padding: 0,
       '.ant-modal-header': {
@@ -17,7 +17,12 @@ var genVtxImportStyle = function genVtxImportStyle(token) {
         padding: 20
       }
     }
-  });
+  }, '&-btn', {
+    display: 'flex',
+    justifyContent: 'flex-start',
+    alignItems: 'center',
+    gap: 8
+  }));
 };
 export function useStyle(prefixCls) {
   return useAntdStyle('VtxImport', function (token) {

package/es/vtx-page-layout/style/index.js

@@ -96,7 +96,7 @@ var genVtxStyle = function genVtxStyle(token) {
     '&-wrap': _objectSpread(_objectSpread({}, absolute()), {}, {
       backgroundColor: token.colorBgContainer,
       borderRadius: token.borderRadiusLG,
-      padding: '0 20px'
+      padding: '0 20px 20px 20px'
     }),
     '&-card': {
       background: token.colorBgContainer,

package/es/vtx-provider/locale/en_US.js

@@ -125,6 +125,8 @@ export default {
     operation: 'Import',
     error: 'Upload failed',
     success: 'Upload successful',
+    selectFile: 'Click to select file',
+    noFileSelected: "No file selected",
     downloadTemplate: 'Download template',
     pleaseSelectFile: 'Please select the file to upload',
     upload: 'Upload',

package/es/vtx-provider/locale/zh_CN.js

@@ -124,6 +124,8 @@ export default {
     operation: '导入',
     error: '上传失败',
     success: '上传成功',
+    selectFile: '选择文件',
+    noFileSelected: "未选择任何文件",
     downloadTemplate: '下载模板',
     pleaseSelectFile: '请选择需要上传的文件',
     upload: '上传',

package/es/vtx-select/style/index.js

@@ -4,7 +4,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-import { over } from '@umijs/utils/compiled/lodash';
 import { useStyle as useAntdStyle } from "../../vtx-provider";
 var genVtxSelectStyle = function genVtxSelectStyle(token) {
   var componentCls = token.componentCls;

package/lib/vtx-datagrid/index.js

@@ -164,7 +164,7 @@ function VtxTable(props) {
     var resizeObserver = new ResizeObserver(function () {
       calculateHeight();
     });
-    if (autoFit && rootDomRef.current) {
+    if (autoFit && rootDomRef.current && scrollY) {
       resizeObserver.observe(rootDomRef.current, {
         box: 'border-box'
       });
@@ -174,7 +174,7 @@ function VtxTable(props) {
         resizeObserver.disconnect();
       }
     };
-  }, [autoFit, tableSize]);
+  }, [autoFit, tableSize, scrollY]);
   (0, _react.useLayoutEffect)(function () {
     if (autoFit) {
       calculateHeight();
@@ -379,8 +379,11 @@ function VtxTable(props) {
         x: 'max-content'
       }, scroll),
       pagination: getPagination(rest.pagination),
-      style: {
-        height: "calc(100% - ".concat(toolbarHeight.current + alertHeight.current, "px)")
+      xs: true,
+      styles: {
+        root: {
+          height: "calc(100% - ".concat(toolbarHeight.current + alertHeight.current, "px)")
+        }
       },
       locale: _objectSpread({
         emptyText: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Empty, {

package/lib/vtx-datagrid/style/index.js

@@ -32,21 +32,32 @@ var genVtxStyle = function genVtxStyle(token) {
   }, '.ant-table', _defineProperty({
     // height: '100%',
     flex: 1
-  }, '.ant-table-container', _defineProperty(_defineProperty({}, '.ant-table-body', {
+  }, '.ant-table-container', _defineProperty(_defineProperty({
+    height: '100%',
+    borderInlineStart: "none"
+  }, '.ant-table-body', {
     scrollbarWidth: "thin"
   }), '.ant-table-content', _defineProperty({
-    // height: '100%',
+    height: '100%',
     scrollbarWidth: "thin"
   }, 'table', {
     // height: '100%',
     minWidth: "calc(100% - 1px) !important"
   })))))), '.ant-table', _defineProperty(_defineProperty(_defineProperty({}, '.ant-table-header', _defineProperty({}, '.ant-table-thead', {
     '>tr>th': {
-      background: token.colorBgContainer
+      background: token.colorBgContainer,
+      '&:first-child': {
+        borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+      }
     }
   })), '.ant-table-cell', {
     // minWidth: 10,
   }), '.ant-table-tbody', {
+    '>tr>td': {
+      '&:first-child': {
+        borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+      }
+    },
     '>tr.ant-table-placeholder': {
       position: 'absolute',
       top: "auto",
@@ -74,10 +85,13 @@ var genVtxStyle = function genVtxStyle(token) {
         }
       }
     }
-  })), '.ant-pagination', _defineProperty({}, '.ant-pagination-item', {
+  })), '.ant-pagination', _defineProperty({
+    margin: "var(--ant-margin) 0 0 0"
+  }, '.ant-pagination-item', {
     borderRadius: token.borderRadiusSM
   })))), "".concat(componentCls, "-fit"), {
-    height: '100%'
+    height: '100%',
+    minHeight: 200
   }), "".concat(componentCls, "-noFit"), {}), "".concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, "".concat(antCls, "-table"), _defineProperty({}, '>.ant-table-container', _defineProperty(_defineProperty({
     borderColor: 'transparent'
   }, '.ant-table-thead', {
@@ -132,10 +146,14 @@ var genVtxStyle = function genVtxStyle(token) {
     '>tr>th': {
       background: token.colorBgContainer
     }
-  }))), "".concat(componentCls, "-no-data"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({}, '.ant-table-content', _defineProperty({
+  }))), "".concat(componentCls, "-no-data"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({
+    borderInlineStart: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
+  }, '.ant-table-content', _defineProperty({
     borderRight: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)",
     borderBottom: "var(--ant-line-width) var(--ant-line-type) var(--ant-table-border-color)"
-  }, 'table', {})))))))), "".concat(componentCls, "-no-data").concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({}, '.ant-table-content', {
+  }, 'table', {})))))))), "".concat(componentCls, "-no-data").concat(componentCls, "-no-border"), _defineProperty({}, "".concat(antCls, "-table-wrapper"), _defineProperty({}, '.ant-spin', _defineProperty({}, '.ant-spin-container', _defineProperty({}, '.ant-table', _defineProperty({}, '.ant-table-container', _defineProperty({
+    borderInlineStart: "none"
+  }, '.ant-table-content', {
     borderRight: "none",
     borderBottom: "none"
   })))))));

package/lib/vtx-import/index.js

@@ -81,7 +81,8 @@ function VtxImport(props) {
       currentIndex: 0,
       chunkId: '',
       chunks: [],
-      operation: props.operation || intl.getMessage('import.operation', '导入')
+      operation: props.operation || intl.getMessage('import.operation', '导入'),
+      fileName: ''
     }),
     _useSet2 = _slicedToArray(_useSet, 2),
     state = _useSet2[0],
@@ -427,19 +428,80 @@ function VtxImport(props) {
       startUpload();
     }
   }, [state.chunkId]);
+  var truncateFileName = function truncateFileName(fileName) {
+    var maxLength = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 28;
+    if (fileName.length <= maxLength) return fileName;
+    var extIndex = fileName.lastIndexOf('.');
+    var ext = extIndex !== -1 ? fileName.slice(extIndex) : '';
+    var name = extIndex !== -1 ? fileName.slice(0, extIndex) : fileName;
+    var availableLength = maxLength - ext.length - 3; // 3 是 "..."
+    if (availableLength <= 0) return "...".concat(ext);
+    var startLength = Math.ceil(availableLength / 2);
+    var endLength = Math.floor(availableLength / 2);
+    var start = name.slice(0, startLength);
+    var end = name.slice(-endLength);
+    return "".concat(start, "...").concat(end).concat(ext);
+  };
+
+  // 处理文件选择变化
+  var handleFileChange = function handleFileChange(event) {
+    var _event$target$files;
+    var file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
+    if (file) {
+      setState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          fileName: truncateFileName(file.name)
+        });
+      });
+      // 这里可以添加文件上传或其他处理逻辑
+      // 例如：uploadFile(file);
+    } else {
+      setState(function (prev) {
+        return _objectSpread(_objectSpread({}, prev), {}, {
+          fileName: ''
+        });
+      });
+    }
+  };
+  var handleSelectFile = function handleSelectFile() {
+    var _fileInputRef$current3;
+    (_fileInputRef$current3 = fileInputRef.current) === null || _fileInputRef$current3 === void 0 || _fileInputRef$current3.click();
+  };
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_vtxModal.default, _objectSpread(_objectSpread({}, modalProps), {}, {
-    children: [props.children, /*#__PURE__*/(0, _jsxRuntime.jsx)("form", {
+    children: [props.children, /*#__PURE__*/(0, _jsxRuntime.jsxs)("form", {
       encType: "multipart/form-data",
       method: "post",
       target: "tmp",
       action: uploadURL,
       ref: formRef,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "".concat(prefixCls, "-btn"),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Button, {
+          onClick: handleSelectFile,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "".concat(prefixCls, "-label"),
+            children: intl.getMessage('import.selectFile', '选择文件')
+          })
+        }), state.fileName ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tooltip, {
+          title: state.fileName,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "".concat(prefixCls, "-file-name"),
+            children: state.fileName
+          })
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "".concat(prefixCls, "-file-name"),
+          children: intl.getMessage('import.noFileSelected', '未选择任何文件')
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
         type: "file",
         name: state.fileKey,
         accept: state.accept,
-        ref: fileInputRef
-      })
+        ref: fileInputRef,
+        style: {
+          display: 'none'
+        },
+        onChange: handleFileChange
+      })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("iframe", {
       name: "tmp",
       style: {

package/lib/vtx-import/style/index.js

@@ -13,7 +13,7 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var genVtxImportStyle = function genVtxImportStyle(token) {
   var componentCls = token.componentCls;
-  return _defineProperty({}, componentCls, {
+  return _defineProperty({}, componentCls, _defineProperty({
     '.ant-modal-container': {
       padding: 0,
       '.ant-modal-header': {
@@ -23,7 +23,12 @@ var genVtxImportStyle = function genVtxImportStyle(token) {
         padding: 20
       }
     }
-  });
+  }, '&-btn', {
+    display: 'flex',
+    justifyContent: 'flex-start',
+    alignItems: 'center',
+    gap: 8
+  }));
 };
 function useStyle(prefixCls) {
   return (0, _vtxProvider.useStyle)('VtxImport', function (token) {

package/lib/vtx-page-layout/style/index.js

@@ -103,7 +103,7 @@ var genVtxStyle = function genVtxStyle(token) {
     '&-wrap': _objectSpread(_objectSpread({}, absolute()), {}, {
       backgroundColor: token.colorBgContainer,
       borderRadius: token.borderRadiusLG,
-      padding: '0 20px'
+      padding: '0 20px 20px 20px'
     }),
     '&-card': {
       background: token.colorBgContainer,

package/lib/vtx-provider/locale/en_US.js

@@ -131,6 +131,8 @@ var _default = exports.default = {
     operation: 'Import',
     error: 'Upload failed',
     success: 'Upload successful',
+    selectFile: 'Click to select file',
+    noFileSelected: "No file selected",
     downloadTemplate: 'Download template',
     pleaseSelectFile: 'Please select the file to upload',
     upload: 'Upload',

package/lib/vtx-provider/locale/zh_CN.js

@@ -130,6 +130,8 @@ var _default = exports.default = {
     operation: '导入',
     error: '上传失败',
     success: '上传成功',
+    selectFile: '选择文件',
+    noFileSelected: "未选择任何文件",
     downloadTemplate: '下载模板',
     pleaseSelectFile: '请选择需要上传的文件',
     upload: '上传',

package/lib/vtx-select/style/index.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useStyle = useStyle;
-var _lodash = require("@umijs/utils/compiled/lodash");
 var _vtxProvider = require("../../vtx-provider");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vtx/components",
-  "version": "4.0.0-beta.52",
+  "version": "4.0.0-beta.54",
   "description": "React components for Vortex",
   "keywords": [
     "react",
@@ -12,6 +12,34 @@
     "es"
   ],
   "main": "lib/index.js",
+  "scripts": {
+    "start": "dumi dev",
+    "compile": "father build",
+    "build": "father build",
+    "bootstrap": "node ./scripts/bootstrap.mjs",
+    "changelog": "node ./scripts/changelogs.mjs",
+    "checkPublish": "npm run sync:tnpm && node ./scripts/checkPublish.mjs && npm run sync:tnpm",
+    "deploy": "cross-env SITE_DEPLOY='TRUE' npm run site && gh-pages -d ./dist",
+    "dumi": "cross-env SITE_DEPLOY='TRUE' dumi build",
+    "docs": "node ./scripts/docs.mjs",
+    "docs:dev": "pnpm docs dev",
+    "docs:build": "pnpm docs build",
+    "docs:preview": "pnpm docs preview",
+    "docs:create": "pnpm docs create",
+    "docs:check": "pnpm docs check",
+    "lint": "eslint --cache --ext .js,.jsx,.ts,.tsx  --fix ./ && npm run tsc",
+    "prettier": "prettier --write \"**/**.{js,jsx,tsx,ts,less,md,yaml,json}\" --log-level warn",
+    "createRelease": "node ./scripts/createRelease.mjs",
+    "site": "npm run build && cross-env SITE_DEPLOY='TRUE' dumi build",
+    "sync:tnpm": "node -e 'import(\"./scripts/syncTNPM.mjs\").then(m => m.default())'",
+    "test": "cross-env TZ=UTC vitest run",
+    "test:coverage": "cross-env TZ=UTC TEST_LOG=none vitest run --coverage",
+    "test:ui": "cross-env TZ=UTC vitest --ui",
+    "test:update": "cross-env TZ=UTC  vitest -u",
+    "tsc": "tsc --noEmit",
+    "publish:beta": "npm publish --tag beta",
+    "update:deps": "pnpm up --latest"
+  },
   "homepage": "https://git.cloudhw.cn:3443/front-end/react-components.git",
   "bugs": "https://git.cloudhw.cn:3443/front-end/react-components/-/issues",
   "repository": {
@@ -200,39 +228,12 @@
     "@vtx/utils": "^1.0.25"
   },
   "peerDependenciesName": "声明宿主依赖",
+  "packageManager": "pnpm@9.6.0",
   "publishConfig": {
     "access": "public"
   },
   "gitHooks": {
     "pre-commit": "pretty-quick --staged",
     "commit-msg": "fabric verify-commit"
-  },
-  "scripts": {
-    "start": "dumi dev",
-    "compile": "father build",
-    "build": "father build",
-    "bootstrap": "node ./scripts/bootstrap.mjs",
-    "changelog": "node ./scripts/changelogs.mjs",
-    "checkPublish": "npm run sync:tnpm && node ./scripts/checkPublish.mjs && npm run sync:tnpm",
-    "deploy": "cross-env SITE_DEPLOY='TRUE' npm run site && gh-pages -d ./dist",
-    "dumi": "cross-env SITE_DEPLOY='TRUE' dumi build",
-    "docs": "node ./scripts/docs.mjs",
-    "docs:dev": "pnpm docs dev",
-    "docs:build": "pnpm docs build",
-    "docs:preview": "pnpm docs preview",
-    "docs:create": "pnpm docs create",
-    "docs:check": "pnpm docs check",
-    "lint": "eslint --cache --ext .js,.jsx,.ts,.tsx  --fix ./ && npm run tsc",
-    "prettier": "prettier --write \"**/**.{js,jsx,tsx,ts,less,md,yaml,json}\" --log-level warn",
-    "createRelease": "node ./scripts/createRelease.mjs",
-    "site": "npm run build && cross-env SITE_DEPLOY='TRUE' dumi build",
-    "sync:tnpm": "node -e 'import(\"./scripts/syncTNPM.mjs\").then(m => m.default())'",
-    "test": "cross-env TZ=UTC vitest run",
-    "test:coverage": "cross-env TZ=UTC TEST_LOG=none vitest run --coverage",
-    "test:ui": "cross-env TZ=UTC vitest --ui",
-    "test:update": "cross-env TZ=UTC  vitest -u",
-    "tsc": "tsc --noEmit",
-    "publish:beta": "npm publish --tag beta",
-    "update:deps": "pnpm up --latest"
   }
 }