@zat-design/sisyphus-react 3.2.2 → 3.3.0-beta.2

package/lib/ProTreeModal/components/Trigger.js

@@ -7,25 +7,51 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _antd = require("antd");
 var _icons = require("@ant-design/icons");
 var _reactSvg = require("react-svg");
+var _ahooks = require("ahooks");
 var _locale = _interopRequireWildcard(require("../../locale"));
 var _view = _interopRequireDefault(require("../../assets/view.svg"));
 function Trigger(props) {
-  var _locale$ProTreeModal, _locale$ProTreeModal2, _locale$ProTreeModal3;
-  var checkedValues = props.checkedValues,
-    handleClick = props.handleClick,
-    handleClearAll = props.handleClearAll,
-    value = props.value,
-    checkAll = props.checkAll,
+  var _locale$ProTreeModal2, _locale$ProTreeModal3;
+  var value = props.value,
     disabled = props.disabled,
     isView = props.isView,
-    triggerStyle = props.triggerStyle;
-  return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [isView ? (0, _jsxRuntime.jsxs)("div", {
+    triggerStyle = props.triggerStyle,
+    appoint = props.appoint,
+    allValue = props.allValue,
+    checkAll = props.checkAll,
+    checkedValues = props.checkedValues,
+    handleClick = props.handleClick,
+    handleClearAll = props.handleClearAll,
+    appointChange = props.appointChange;
+  var _useSetState = (0, _ahooks.useSetState)({
+      mode: 'appoint'
+    }),
+    _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
+    state = _useSetState2[0],
+    setState = _useSetState2[1];
+  (0, _react.useEffect)(function () {
+    if (checkAll && appoint) {
+      setState({
+        mode: 'all'
+      });
+    }
+  }, [checkAll]);
+  var onIconClick = function onIconClick() {
+    if (appoint && state.mode === 'all') {
+      return;
+    }
+    handleClick();
+  };
+  if (isView) {
+    var _locale$ProTreeModal;
+    return (0, _jsxRuntime.jsxs)("div", {
       className: "pro-tree-modal-isView",
       children: [(0, _jsxRuntime.jsx)("div", {
         children: checkedValues.length === 0 ? '-' : checkAll ? _locale.default === null || _locale.default === void 0 ? void 0 : _locale.default.ProTreeModal.checkAll : (0, _locale.formatMessage)(_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProTreeModal = _locale.default.ProTreeModal) === null || _locale$ProTreeModal === void 0 ? void 0 : _locale$ProTreeModal.checkNumber, {
@@ -36,11 +62,44 @@ function Trigger(props) {
         children: (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
           className: "viewSvg",
           src: _view.default,
-          onClick: handleClick
+          onClick: onIconClick
         })
       })]
-    }) : (0, _jsxRuntime.jsx)(_antd.Input, {
-      className: (0, _classnames.default)(disabled ? 'trigger-no-hover' : ''),
+    });
+  }
+  var onAppointChange = function onAppointChange(value) {
+    setState({
+      mode: value
+    });
+    if (value === 'all') {
+      appointChange === null || appointChange === void 0 ? void 0 : appointChange(true);
+    } else {
+      appointChange === null || appointChange === void 0 ? void 0 : appointChange(false);
+    }
+  };
+  var TriggerComponent = function TriggerComponent(props) {
+    if (appoint) {
+      return (0, _jsxRuntime.jsxs)(_antd.Space.Compact, {
+        block: true,
+        children: [(0, _jsxRuntime.jsxs)(_antd.Select, {
+          defaultValue: "appoint",
+          value: state.mode,
+          onChange: onAppointChange,
+          children: [(0, _jsxRuntime.jsx)(_antd.Select.Option, {
+            value: "all",
+            children: "\u5168\u90E8"
+          }), (0, _jsxRuntime.jsx)(_antd.Select.Option, {
+            value: "appoint",
+            children: "\u6307\u5B9A"
+          })]
+        }), props.children]
+      });
+    }
+    return props.children;
+  };
+  return (0, _jsxRuntime.jsx)(TriggerComponent, {
+    children: (0, _jsxRuntime.jsx)(_antd.Input, {
+      className: (0, _classnames.default)(disabled ? 'trigger-no-hover' : '', appoint ? 'pro-tree-modal-input-appoint' : ''),
       onClick: handleClick,
       value: checkedValues.length === 0 ? null : checkAll ? _locale.default === null || _locale.default === void 0 ? void 0 : _locale.default.ProTreeModal.checkAll : (0, _locale.formatMessage)(_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProTreeModal2 = _locale.default.ProTreeModal) === null || _locale$ProTreeModal2 === void 0 ? void 0 : _locale$ProTreeModal2.checkNumber, {
         num: checkedValues.length
@@ -55,16 +114,13 @@ function Trigger(props) {
         }), (0, _jsxRuntime.jsx)(_reactSvg.ReactSVG, {
           className: "viewSvg",
           src: _view.default,
-          onClick: handleClick
+          onClick: onIconClick
         })]
       }),
       placeholder: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProTreeModal3 = _locale.default.ProTreeModal) === null || _locale$ProTreeModal3 === void 0 ? void 0 : _locale$ProTreeModal3.select,
-      disabled: disabled,
+      disabled: disabled || appoint && value === allValue,
       style: (0, _objectSpread2.default)({}, triggerStyle)
-    }), (0, _jsxRuntime.jsx)(_antd.Input, {
-      type: "hidden",
-      value: value
-    })]
+    })
   });
 }
 var _default = exports.default = Trigger;

package/lib/ProTreeModal/index.js

@@ -58,6 +58,7 @@ var ProTreeModal = function ProTreeModal(props) {
     max = props.max,
     draggable = props.draggable,
     span = props.span,
+    appoint = props.appoint,
     _props$fieldNames = props.fieldNames,
     fieldNames = _props$fieldNames === void 0 ? {
       label: 'label',
@@ -78,6 +79,7 @@ var ProTreeModal = function ProTreeModal(props) {
   var _useSetState = (0, _ahooks.useSetState)({
       open: false,
       checkedValues: [],
+      beforeClearAllValues: [],
       treeData: [],
       treeViewData: [],
       originalTreeData: [],
@@ -264,6 +266,7 @@ var ProTreeModal = function ProTreeModal(props) {
     }) : [];
     setState({
       checkedValues: _checkedValues,
+      beforeClearAllValues: state.checkedValues,
       treeViewData: [],
       checkAll: false
     });
@@ -272,9 +275,18 @@ var ProTreeModal = function ProTreeModal(props) {
    * Drawer close
    */
   var handleClose = function handleClose() {
-    setState({
-      open: false
-    });
+    var _state$beforeClearAll;
+    if ((_state$beforeClearAll = state.beforeClearAllValues) === null || _state$beforeClearAll === void 0 ? void 0 : _state$beforeClearAll.length) {
+      setState({
+        open: false,
+        checkedValues: state.beforeClearAllValues,
+        beforeClearAllValues: []
+      });
+    } else {
+      setState({
+        open: false
+      });
+    }
     openChange === null || openChange === void 0 ? void 0 : openChange(false);
   };
   /**
@@ -459,6 +471,23 @@ var ProTreeModal = function ProTreeModal(props) {
       });
     }
   };
+  /**
+   * 指定模式下的操作
+   * @param appoint
+   */
+  var appointChange = function appointChange(appoint) {
+    if (appoint) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(allValue);
+      setState({
+        checkAll: true
+      });
+    } else {
+      onChange === null || onChange === void 0 ? void 0 : onChange([]);
+      setState({
+        checkAll: false
+      });
+    }
+  };
   /**
    * Trigger the container opened by Drawer
    * default example and you can customize trigger={<Button>打开</Button>}
@@ -474,12 +503,15 @@ var ProTreeModal = function ProTreeModal(props) {
     return (0, _jsxRuntime.jsx)(_components.Trigger, {
       checkedValues: state.checkedValues,
       value: value,
-      handleClick: handleClick,
-      handleClearAll: handleClearAll,
       checkAll: state.checkAll,
       triggerStyle: style,
       disabled: disabled,
-      isView: isView
+      isView: isView,
+      appoint: appoint,
+      allValue: allValue,
+      handleClick: handleClick,
+      handleClearAll: handleClearAll,
+      appointChange: appointChange
     });
   }, [state.checkedValues, state.checkAll, style, disabled, isView]);
   /**

package/lib/ProTreeModal/propsType.d.ts

@@ -21,6 +21,7 @@ export interface FieldNamesType {
     value: string;
     children?: string;
 }
+export type TreeModalMode = 'tree' | 'list' | 'Cascader' | 'Tree' | 'List';
 export interface ProTreeModalProps {
     /** value */
     value?: AllValueType | string[];
@@ -30,8 +31,10 @@ export interface ProTreeModalProps {
     open?: boolean;
     /** 列表时候一行放几个 */
     span?: number;
-    /** 展示类型、默认list 列表展示形式 */
-    mode?: 'tree' | 'list' | 'Cascader' | 'Tree' | 'List';
+    /** 展示类型、默认list 列表展示形式、appoint 指定模式展示形式会不一样 */
+    mode?: TreeModalMode;
+    /** 是否开启指定模式 */
+    appoint?: boolean;
     /** 开启后、提交给后端 [{ label:xx, value: ""}] 形式  */
     labelInValue?: boolean;
     /** 查看模式、同 disabled 一样 */

package/lib/ProTreeModal/style/index.less

@@ -1,4 +1,7 @@
-.pro-tree-modal-container .ant-modal-content .ant-modal-body {
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
+.pro-tree-modal-container .@{ant-prefix}-modal-content .@{ant-prefix}-modal-body {
   max-height: 498px;
 }
 
@@ -13,16 +16,16 @@
     height        : 482px;
     margin-bottom : calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
 
-    .ant-tree-checkbox {
+    .@{ant-prefix}-tree-checkbox {
       margin-top: 2px;
     }
 
-    .ant-tree-switcher {
+    .@{ant-prefix}-tree-switcher {
       width      : 20px;
       line-height: 20px;
     }
 
-    .ant-tree-treenode {
+    .@{ant-prefix}-tree-treenode {
       width         : 100%;
       padding       : 0;
       padding-bottom: var(--zaui-font-size-sm, 12px);
@@ -31,12 +34,12 @@
       line-height   : 20px;
     }
 
-    .ant-tree-node-content-wrapper {
+    .@{ant-prefix}-tree-node-content-wrapper {
       min-height : 20px;
       line-height: 20px;
     }
 
-    .ant-tree-node-content-wrapper {
+    .@{ant-prefix}-tree-node-content-wrapper {
       width: 100%;
     }
   }
@@ -113,7 +116,7 @@
       color: #616161;
     }
 
-    .ant-btn-link {
+    .@{ant-prefix}-btn-link {
       padding: 0;
     }
   }
@@ -223,7 +226,7 @@
       margin-top: 0;
     }
 
-    .ant-tag {
+    .@{ant-prefix}-tag {
       display        : flex;
       align-items    : center;
       justify-content: space-between;

package/lib/ProTreeSelect/index.js

@@ -17,7 +17,7 @@ var _react = require("react");
 var _lodash = require("lodash");
 var _ProConfigProvider = require("../ProConfigProvider");
 var _Container = _interopRequireDefault(require("../ProForm/components/Container"));
-var _excluded = ["disabled", "code", "dataSource", "defaultDisableValue", "onChange", "useRequest", "transformResponse", "fieldNames", "tooltip", "showSearch", "filterTreeNode", "treeNodeFilterProp", "treeDefaultExpandAll", "treeCheckable", "onSearch", "otherProps", "width", "dropdownStyle", "popupClassName", "style", "allowClear", "listHeight", "showCodeName", "className"],
+var _excluded = ["disabled", "code", "dataSource", "defaultDisableValue", "onChange", "useRequest", "transformResponse", "fieldNames", "tooltip", "showSearch", "filterTreeNode", "treeNodeFilterProp", "defaultExpandAll", "expandedKeys", "treeCheckable", "onSearch", "otherProps", "width", "dropdownStyle", "popupClassName", "style", "allowClear", "listHeight", "showCodeName", "className"],
   _excluded2 = ["children"];
 var SHOW_PARENT = _antd.TreeSelect.SHOW_PARENT;
 var ProTreeSelect = exports.ProTreeSelect = function ProTreeSelect(props, ref) {
@@ -51,8 +51,9 @@ var ProTreeSelect = exports.ProTreeSelect = function ProTreeSelect(props, ref) {
     filterTreeNode = props.filterTreeNode,
     _props$treeNodeFilter = props.treeNodeFilterProp,
     treeNodeFilterProp = _props$treeNodeFilter === void 0 ? 'label' : _props$treeNodeFilter,
-    _props$treeDefaultExp = props.treeDefaultExpandAll,
-    treeDefaultExpandAll = _props$treeDefaultExp === void 0 ? true : _props$treeDefaultExp,
+    _props$defaultExpandA = props.defaultExpandAll,
+    defaultExpandAll = _props$defaultExpandA === void 0 ? true : _props$defaultExpandA,
+    expandedKeys = props.expandedKeys,
     _props$treeCheckable = props.treeCheckable,
     treeCheckable = _props$treeCheckable === void 0 ? true : _props$treeCheckable,
     _onSearch = props.onSearch,
@@ -477,7 +478,8 @@ var ProTreeSelect = exports.ProTreeSelect = function ProTreeSelect(props, ref) {
     disabled: disabled,
     showSearch: showSearch,
     // filterTreeNode: filterTreeNodeEvent,
-    treeDefaultExpandAll: treeDefaultExpandAll,
+    treeDefaultExpandAll: defaultExpandAll,
+    treeExpandedKeys: expandedKeys,
     treeCheckable: treeCheckable,
     showCheckedStrategy: SHOW_PARENT,
     value: value,

package/lib/ProTreeSelect/propsType.d.ts

@@ -69,6 +69,8 @@ export interface PropTreeSelectProps extends Omit<TreeSelectProps, 'onSearch'> {
         service: Service<any, any>;
         options?: Options<any, any>;
     };
+    defaultExpandAll?: boolean;
+    expandedKeys?: any[];
 }
 export interface ProSelectAction {
     /** 获取发生请求的 useRequest 的 ref */

package/lib/ProTreeSelect/style/index.less

@@ -1,13 +1,16 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
 .pro-tree-select{
-    .ant-select-selector{
+    .@{ant-prefix}-select-selector{
         // 单选树选择结果框里title不用待后缀
         .check-mark-icon{
             display: none;
         }
     }
-    .ant-select.ant-select-single.ant-select-show-arrow:not(.ant-select-show-search){
-        &.ant-select-open{
-            .ant-select-arrow{
+    .@{ant-prefix}-select.@{ant-prefix}-select-single.@{ant-prefix}-select-show-arrow:not(.@{ant-prefix}-select-show-search){
+        &.@{ant-prefix}-select-open{
+            .@{ant-prefix}-select-arrow{
                 transition: transform 300ms ease-in-out;
                 transform: rotate(180deg);
             }
@@ -15,20 +18,20 @@
     }
 }
 .pro-tree-select-drop-down-container{
-    &.ant-select-dropdown{
+    &.@{ant-prefix}-select-dropdown{
         .highlight-search-text{
             color: @zaui-brand;
         }
-        .ant-select-tree-list-holder-inner{
+        .@{ant-prefix}-select-tree-list-holder-inner{
             position: relative!important;
         }
-        &.ant-tree-select-dropdown{
+        &.@{ant-prefix}-tree-select-dropdown{
             width: auto!important;
             padding: 0px;
         }
         &.singal-tree,&.checkable-tree{
-            .ant-select-tree{
-                .ant-select-tree-treenode{
+            .@{ant-prefix}-select-tree{
+                .@{ant-prefix}-select-tree-treenode{
                     padding-top: var(--zaui-space-size-xs);
                     padding-bottom: var(--zaui-space-size-xs);
                 }
@@ -39,8 +42,8 @@
         }
         // 单选
         &.signal-tree{
-            .ant-select-tree{
-                .ant-select-tree-treenode{
+            .@{ant-prefix}-select-tree{
+                .@{ant-prefix}-select-tree-treenode{
                     position: relative;
                     padding-right: 50px;
                     padding-left: 7px;
@@ -56,19 +59,19 @@
                         background-color: @zaui-brand;
                         opacity: 0.1;
                     }
-                    &.ant-select-tree-treenode-selected:after{
+                    &.@{ant-prefix}-select-tree-treenode-selected:after{
                         display: block;
                     }
                 }
-                .ant-select-tree-node-content-wrapper{
+                .@{ant-prefix}-select-tree-node-content-wrapper{
                     background-color: transparent;
-                    &.ant-select-tree-node-selected{
+                    &.@{ant-prefix}-select-tree-node-selected{
                         .check-mark-icon{
                             display: block;
                         }
                     }
                 }
-                .ant-select-tree-treenode:hover{
+                .@{ant-prefix}-select-tree-treenode:hover{
                     background-color: #f5f5f5;
                 }
                 .check-option-text{
@@ -84,20 +87,20 @@
         }
         // 复选
         &.checkable-tree{
-            .ant-select-tree{
-                .ant-select-tree-treenode{
+            .@{ant-prefix}-select-tree{
+                .@{ant-prefix}-select-tree-treenode{
                     padding-left: 7px;
                 }
-                .ant-select-tree-treenode:hover{
+                .@{ant-prefix}-select-tree-treenode:hover{
                     background-color: #f5f5f5;
                 }
-                .ant-select-tree-node-content-wrapper{
+                .@{ant-prefix}-select-tree-node-content-wrapper{
                     padding-right: var(--zaui-space-size-md);
                 }
-                .ant-select-tree-node-content-wrapper:hover{
+                .@{ant-prefix}-select-tree-node-content-wrapper:hover{
                     background-color: transparent;
                 }
-                .ant-select-tree-checkbox{
+                .@{ant-prefix}-select-tree-checkbox{
                     margin-top: var(--zaui-space-size-xs);
                     align-self: stretch;
                 }
@@ -105,7 +108,7 @@
         }
         // 数据小于10条
         &.ten-count-tree-node{
-            .ant-select-tree-switcher-noop{
+            .@{ant-prefix}-select-tree-switcher-noop{
                 width: var(--zaui-space-size-xs);
             }
         }

package/lib/ProUpload/components/DragRender.js

@@ -17,7 +17,7 @@ var _DraggableUploadListItem = require("./DraggableUploadListItem");
 var _locale = _interopRequireDefault(require("../../locale"));
 var Dragger = _antd.Upload.Dragger;
 var DragRender = function DragRender(props) {
-  var _locale$ProUpload3, _locale$ProUpload4, _locale$ProUpload5;
+  var _locale$ProUpload3, _locale$ProUpload4, _locale$ProUpload5, _locale$ProUpload6;
   var isView = props.isView,
     baseUploadProps = props.baseUploadProps,
     disabled = props.disabled,
@@ -138,13 +138,16 @@ var DragRender = function DragRender(props) {
               children: [(0, _jsxRuntime.jsx)("i", {
                 className: "icon-upload",
                 children: (0, _jsxRuntime.jsx)(_icons.CloudUploadOutlined, {})
-              }), (0, _jsxRuntime.jsx)("p", {
+              }), (0, _jsxRuntime.jsxs)("p", {
                 className: "dragger-txt",
-                children: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload3 = _locale.default.ProUpload) === null || _locale$ProUpload3 === void 0 ? void 0 : _locale$ProUpload3.draggerTips
+                children: [_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload3 = _locale.default.ProUpload) === null || _locale$ProUpload3 === void 0 ? void 0 : _locale$ProUpload3.draggerTips, (0, _jsxRuntime.jsxs)("span", {
+                  className: "click-txt",
+                  children: [_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload4 = _locale.default.ProUpload) === null || _locale$ProUpload4 === void 0 ? void 0 : _locale$ProUpload4.draggerBtnTxt, " "]
+                })]
               })]
             }), (0, _jsxRuntime.jsxs)("p", {
               className: "file-ext",
-              children: [_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload4 = _locale.default.ProUpload) === null || _locale$ProUpload4 === void 0 ? void 0 : _locale$ProUpload4.draggerFileExt, "\uFF1A", extExt.length > 0 ? extExt.join('、') : "".concat(_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload5 = _locale.default.ProUpload) === null || _locale$ProUpload5 === void 0 ? void 0 : _locale$ProUpload5.draggerLimitless)]
+              children: [_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload5 = _locale.default.ProUpload) === null || _locale$ProUpload5 === void 0 ? void 0 : _locale$ProUpload5.draggerFileExt, "\uFF1A", extExt.length > 0 ? extExt.join('、') : "".concat(_locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProUpload6 = _locale.default.ProUpload) === null || _locale$ProUpload6 === void 0 ? void 0 : _locale$ProUpload6.draggerLimitless)]
             })]
           }), (0, _jsxRuntime.jsx)("div", {
             className: "dragger-file-show",

package/lib/ProUpload/components/ImageRender.js

@@ -27,7 +27,7 @@ var _locale = _interopRequireDefault(require("../../locale"));
  * @Author: wangshengqiang
  * @Date: 2023-07-27 20:13:07
  * @LastEditors: wangshengqiang
- * @LastEditTime: 2023-11-07 19:01:07
+ * @LastEditTime: 2023-11-15 17:57:53
  * @Description: 图片类型
  *
  */
@@ -250,8 +250,12 @@ var ImageRender = function ImageRender(props) {
     }), (0, _jsxRuntime.jsx)(_antd.Modal, {
       title: previewImg === null || previewImg === void 0 ? void 0 : previewImg.name,
       width: "600",
+      style: {
+        width: '400px'
+      },
       open: !!(previewImg === null || previewImg === void 0 ? void 0 : previewImg.url),
       // showType="Modal"
+      wrapClassName: "proupload-modal-preview",
       onCancel: handlePreviewCancel,
       footer: false,
       children: (0, _jsxRuntime.jsx)("img", {

package/lib/ProUpload/index.js

@@ -15,6 +15,7 @@ var _antd = require("antd");
 var _lodash = require("lodash");
 var _core = require("@dnd-kit/core");
 var _sortable = require("@dnd-kit/sortable");
+var _ProConfigProvider = require("../ProConfigProvider");
 var _DragRender = _interopRequireDefault(require("./components/DragRender"));
 var _ButtonRender = _interopRequireDefault(require("./components/ButtonRender"));
 var _ImageRender = _interopRequireDefault(require("./components/ImageRender"));
@@ -24,7 +25,7 @@ var _excluded = ["value", "size", "action", "maxCount", "headerRender", "footerR
 /*
  * @Author: wangshengqiang
  * @Date: 2023-02-03 14:18:59
- * @LastEditTime: 2023-11-07 18:49:49
+ * @LastEditTime: 2023-11-14 18:32:13
  * @LastEditors: wangshengqiang
  * @Description: 上传控件
  */
@@ -79,6 +80,9 @@ var ProUpload = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       distance: 10
     }
   });
+  var _ref = (0, _ProConfigProvider.useProConfig)('ProUpload') || {},
+    headers = _ref.headers;
+  residueProps.headers = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, headers), residueProps.headers);
   var extExt = accept ? accept.split(',').map(function (i) {
     return i.toLocaleUpperCase();
   }) : [];
@@ -146,9 +150,9 @@ var ProUpload = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
    * @description: 文件列表变化
    * @return {*}
    */
-  var handleFileChange = function handleFileChange(_ref) {
-    var file = _ref.file,
-      fileList = _ref.fileList;
+  var handleFileChange = function handleFileChange(_ref2) {
+    var file = _ref2.file,
+      fileList = _ref2.fileList;
     if (!file.status && action && !ref) {
       var nFileList = fileList.filter(function (f) {
         return f.uid !== file.uid;
@@ -217,9 +221,9 @@ var ProUpload = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }
     return footerRender;
   };
-  var onDragEnd = function onDragEnd(_ref2) {
-    var active = _ref2.active,
-      over = _ref2.over;
+  var onDragEnd = function onDragEnd(_ref3) {
+    var active = _ref3.active,
+      over = _ref3.over;
     if (active.id !== (over === null || over === void 0 ? void 0 : over.id)) {
       setFileList(function (prev) {
         var activeIndex = prev.findIndex(function (i) {

package/lib/ProUpload/style/index.less

@@ -1,3 +1,6 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
 .pro-upload {
   // display: inline-flex;
 
@@ -8,7 +11,7 @@
       border-radius: var(--zaui-border-radius, 4px);
       padding      : var(--zaui-space-size-sm, 8px);
 
-      .ant-upload.ant-upload-drag {
+      .@{ant-prefix}-upload.@{ant-prefix}-upload-drag {
         background-color: var(--zaui-base-bg, #fff);
       }
 
@@ -158,8 +161,8 @@
     position: relative;
     display : inline-flex;
 
-    .ant-upload-list-picture-card-container,
-    .ant-upload-select-picture-card {
+    .@{ant-prefix}-upload-list-picture-card-container,
+    .@{ant-prefix}-upload-select-picture-card {
       width : 126px;
       height: 126px;
     }
@@ -271,7 +274,7 @@
   }
 
   .pro-upload-image {
-    .ant-space-item {
+    .@{ant-prefix}-space-item {
       display: inline-flex;
     }
 
@@ -319,3 +322,9 @@
   align-items    : center;
   justify-content: center;
 }
+
+.proupload-modal-preview {
+  .ant-modal {
+    width: 600px;
+  }
+}

package/lib/ProViewer/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -14,8 +14,9 @@ var _jsxRuntime = require("react/jsx-runtime");
 var _ahooks = require("ahooks");
 var _antd = require("antd");
 var _react = _interopRequireWildcard(require("react"));
+var _locale = _interopRequireDefault(require("../locale"));
+var _locale$ProViewer;
 /* eslint-disable jsx-a11y/iframe-has-title */
-
 // 用于解析word | excel
 var officeApp = 'https://view.officeapps.live.com/op/view.aspx?src=';
 // 文件MIME类型
@@ -203,7 +204,7 @@ ProViewer.defaultProps = {
     width: '1200px',
     height: '650px',
     centered: true,
-    title: '预览',
+    title: _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProViewer = _locale.default.ProViewer) === null || _locale$ProViewer === void 0 ? void 0 : _locale$ProViewer.preview,
     footer: null,
     bodyStyle: {
       padding: 0

package/lib/ProViewer/style/index.less

@@ -1,7 +1,10 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
+
 .pro-viewer {
-  .ant-image {
-    .ant-image-img,
-    .ant-image-mask-info {
+  .@{ant-prefix}-image {
+    .@{ant-prefix}-image-img,
+    .@{ant-prefix}-image-mask-info {
       display: none;
     }
   }

package/lib/locale/en_US.d.ts

@@ -101,6 +101,7 @@ declare const _default: {
     ProModalSelect: {
         checkMsg: string;
         select: string;
+        total: string;
     };
     ProSelect: {
         checkMsg: string;
@@ -148,5 +149,8 @@ declare const _default: {
         tableStripe: string;
         reset: string;
     };
+    ProViewer: {
+        preview: string;
+    };
 };
 export default _default;