@cqsjjb/jjb-react-admin-component 3.3.9 → 3.3.11

package/AMap/index.js

@@ -6,7 +6,7 @@ const _A_MAP_DEFAULT_POINT_ = {
   lng: 116.397437,
   lat: 39.909148
 };
-export default function AMap({
+function AMap({
   lng: propLng,
   lat: propLat,
   title = '高德地图',
@@ -369,4 +369,6 @@ export default function AMap({
     status: "error",
     title: "\u52A0\u8F7D\u5730\u56FE\u5931\u8D25\uFF0C\u7F3A\u5C11\u5FC5\u8981\u7684\u6587\u4EF6\uFF01"
   }));
-}
+}
+AMap.displayName = 'AMap';
+export default AMap;

package/AdaptiveTree/index.js

@@ -1,113 +1,115 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-/**
- * 自适应树组件
- * @param {Object} props - 组件属性
- * @param {Function} [props.titleAction] - 节点操作按钮生成函数
- *   @param {Object} node - 当前节点数据
- *   @returns {Array} 操作按钮配置数组，每项包含：
- *     @property {ReactNode} content - 按钮内容（文本或元素）
- *     @property {Function} onClick - 点击事件回调
- * @param {Function} [props.titleIcon] - 节点标题图标生成函数
- *   @param {Object} node - 当前节点数据
- *   @returns {ReactNode} 图标元素（如 img、Icon 组件等）
- * 
- * @note 说明：
- * 1. 自动继承全局 Ant Design 前缀配置（window.process.env.app.antd['ant-prefix']）
- * 2. 节点容器默认占满父元素空间，支持纵向滚动
- * 3. 节点标题超长自动换行，且不会挤压标题图标和操作图标的空间
- * 4. 节点选中时，返回的节点数据为当前节点及其所有父节点id（二维数组）、选中的节点数据（一维数组）
- * 
- * @example
- * <AdaptiveTree
- *     treeData={[]}
- *     fieldNames={{
- *         title: 'name',
- *         key: 'id'
- *     }}
- *     titleAction={(node) => [
- *      {
- *         content: '添加',
- *         onClick: (node) => {
- *             console.warn("添加", node)
- *         }
- *      },
- *      {
- *         content: '编辑',
- *         onClick: (node) => {
- *             console.warn("编辑", node)
- *         }
- *      }
- *     ]}
- *     titleIcon={(node) => <FolderOpenOutlined />}
- * />
- */
 import React, { useState } from 'react';
-import { Tree, Space } from "antd";
 import { styled } from 'styled-components';
-export default props => {
+import { Tree, Space } from 'antd';
+
+/**
+ * 自适应树组件
+ * @param {Object} props - 组件属性
+ * @param {Function} [props.titleAction] - 节点操作按钮生成函数
+ *   @param {Object} node - 当前节点数据
+ *   @returns {Array} 操作按钮配置数组，每项包含：
+ *     @property {ReactNode} content - 按钮内容（文本或元素）
+ *     @property {Function} onClick - 点击事件回调
+ * @param {Function} [props.titleIcon] - 节点标题图标生成函数
+ *   @param {Object} node - 当前节点数据
+ *   @returns {ReactNode} 图标元素（如 img、Icon 组件等）
+ *
+ * @note 说明：
+ * 1. 自动继承全局 Ant Design 前缀配置（window.process.env.app.antd['ant-prefix']）
+ * 2. 节点容器默认占满父元素空间，支持纵向滚动
+ * 3. 节点标题超长自动换行，且不会挤压标题图标和操作图标的空间
+ * 4. 节点选中时，返回的节点数据为当前节点及其所有父节点id（二维数组）、选中的节点数据（一维数组）
+ *
+ * @example
+ * <AdaptiveTree
+ *     treeData={[]}
+ *     fieldNames={{
+ *         title: 'name',
+ *         key: 'id'
+ *     }}
+ *     titleAction={(node) => [
+ *      {
+ *         content: '添加',
+ *         onClick: (node) => {
+ *             console.warn("添加", node)
+ *         }
+ *      },
+ *      {
+ *         content: '编辑',
+ *         onClick: (node) => {
+ *             console.warn("编辑", node)
+ *         }
+ *      }
+ *     ]}
+ *     titleIcon={(node) => <FolderOpenOutlined />}
+ * />
+ */
+
+function AdaptiveTree(props) {
   const {
     titleAction,
     titleIcon,
     draggable,
     ...rest
   } = props;
-  const prefixCls = window.process.env.app.antd['ant-prefix'];
+  const prefixCls = process.env.app.antd['ant-prefix'];
   const [expandedKeys, setExpandedKeys] = useState([]);
   const [selectedKeys, setSelectedKeys] = useState([]);
   const StyledAntdComponents = styled.div`
-        .${prefixCls}-tree {
-            width: 100%;
-            height: 100%;
-            overflow-y: auto;
-        }
-        .${prefixCls}-tree-switcher {
-            align-items: flex-start !important;
-            padding-top: 13px;
-        }
-        .${prefixCls}-tree-checkbox {
-            margin-top: 11px;
-            margin-left: 4px;
-            align-self: flex-start;
-        }
-        .${prefixCls}-tree-treenode {
-            width: 100%;
-            display: flex;
-            .${prefixCls}-tree-node-content-wrapper {
-                flex: 1
-            }
-            .${prefixCls}-tree-switcher {
-                display: flex;
-                align-items: center;
-                justify-content: flex-end;
-            }
-            .${prefixCls}-tree-switcher::before {
-                display: none;
-            }
-        }
-        .adaptive-tree-title {
-            width: 100%;
-            display: flex;
-            justify-content: space-between;
-            gap: 8px;
-            align-items: flex-start;
-            padding: 6px 0;
-            transition: none;
-            cursor: ${props?.draggable ? 'grab' : 'point'};
-            .title-left {
-                display: flex;
-                align-items: flex-start;
-                gap: 2px;
-                .icon {
-                    width: 14px;
-                    height: 14px;
-                }
-            }
-            .operation {
-                cursor: pointer;
-                white-space: nowrap;
-            }
+    .${prefixCls}-tree {
+      width: 100%;
+      height: 100%;
+      overflow-y: auto;
+    }
+    .${prefixCls}-tree-switcher {
+      align-items: flex-start !important;
+      padding-top: 13px;
+    }
+    .${prefixCls}-tree-checkbox {
+      margin-top: 11px;
+      margin-left: 4px;
+      align-self: flex-start;
+    }
+    .${prefixCls}-tree-treenode {
+      width: 100%;
+      display: flex;
+      .${prefixCls}-tree-node-content-wrapper {
+        flex: 1;
+      }
+      .${prefixCls}-tree-switcher {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+      }
+      .${prefixCls}-tree-switcher::before {
+        display: none;
+      }
+    }
+    .adaptive-tree-title {
+      width: 100%;
+      display: flex;
+      justify-content: space-between;
+      gap: 8px;
+      align-items: flex-start;
+      padding: 6px 0;
+      transition: none;
+      cursor: ${props?.draggable ? 'grab' : 'point'};
+      .title-left {
+        display: flex;
+        align-items: flex-start;
+        gap: 2px;
+        .icon {
+          width: 14px;
+          height: 14px;
         }
-    `;
+      }
+      .operation {
+        cursor: pointer;
+        white-space: nowrap;
+      }
+    }
+  `;
 
   // 获得指定索引的节点 ID
   const getLevelIndexNodeIds = (targetIndexArr, key) => {
@@ -146,7 +148,7 @@ export default props => {
       ids.push(result[0]);
       nodes.push(result[1]);
     });
-    console.warn("onCheck", ids, nodes);
+    console.warn('onCheck', ids, nodes);
     props?.onCheck && props.onCheck(ids, nodes, info);
   };
   const titleRender = node => {
@@ -158,8 +160,8 @@ export default props => {
       key: 'key'
     };
     return /*#__PURE__*/React.createElement("div", {
-      className: "adaptive-tree-title",
-      key: node[key]
+      key: node[key],
+      className: "adaptive-tree-title"
     }, /*#__PURE__*/React.createElement("div", {
       className: "title-left"
     }, titleIcon ? /*#__PURE__*/React.createElement("div", {
@@ -170,12 +172,12 @@ export default props => {
       }
     }, node[title])), /*#__PURE__*/React.createElement(Space, null, titleAction ? (titleAction(node) || []).map(item => {
       return /*#__PURE__*/React.createElement("div", {
+        className: "operation",
         onClick: e => {
           e.stopPropagation();
           e.preventDefault();
           item.onClick && item.onClick(node);
-        },
-        className: "operation"
+        }
       }, item?.content || '');
     }) : ''));
   };
@@ -198,4 +200,6 @@ export default props => {
     selectedKeys: props?.selectedKeys || selectedKeys,
     onSelect: onSelect
   }, rest)));
-};
+}
+AdaptiveTree.displayName = 'AdaptiveTree';
+export default AdaptiveTree;

package/BMap/index.js

@@ -19,6 +19,11 @@ const BMap = ({
   const GL = useRef(null);
   const mapRef = useRef(null);
 
+  /** 显示弃用警告 */
+  useEffect(() => {
+    console.warn('[BMap] 警告：该组件已弃用！请使用<AMap />组件替代！');
+  }, []);
+
   /** 初始化地图 */
   useEffect(() => {
     if (typeof window.BMapGL === 'undefined') {
@@ -164,4 +169,5 @@ const BMap = ({
     title: "\u52A0\u8F7D\u5730\u56FE\u5931\u8D25\uFF0C\u7F3A\u5C11\u5FC5\u8981\u7684\u6587\u4EF6\uFF01"
   }));
 };
+BMap.displayName = 'BMap';
 export default BMap;

package/ControlWrapper/index.js

@@ -33,29 +33,40 @@ function withLabel(WrappedComponent, extraProps = {}) {
 
 // ============ 输入类 ============
 const Input = withLabel(OriginInput);
+Input.displayName = 'ControlWrapper.Input';
 
 // ============ 选择类 ============
 const Select = withLabel(OriginSelect, {
   maxTagCount: 3
 });
+Select.displayName = 'ControlWrapper.Select';
 const Cascader = withLabel(OriginCascader, {
   maxTagCount: 3
 });
+Cascader.displayName = 'ControlWrapper.Cascader';
 const TreeSelect = withLabel(OriginTreeSelect, {
   showSearch: true,
   allowClear: true,
   showCheckedStrategy: OriginTreeSelect.SHOW_PARENT,
   treeNodeFilterProp: 'title'
 });
+TreeSelect.displayName = 'ControlWrapper.TreeSelect';
 
 // ============ 日期类 ============
 const DatePicker = withLabel(OriginDatePicker);
+DatePicker.displayName = 'ControlWrapper.DatePicker';
 DatePicker.RangePicker = withLabel(OriginDatePicker.RangePicker);
+DatePicker.RangePicker.displayName = 'ControlWrapper.RangePicker';
 DatePicker.TimePicker = withLabel(OriginDatePicker.TimePicker);
+DatePicker.TimePicker.displayName = 'ControlWrapper.TimePicker';
 DatePicker.WeekPicker = withLabel(OriginDatePicker.WeekPicker);
+DatePicker.WeekPicker.displayName = 'ControlWrapper.WeekPicker';
 DatePicker.MonthPicker = withLabel(OriginDatePicker.MonthPicker);
+DatePicker.MonthPicker.displayName = 'ControlWrapper.MonthPicker';
 DatePicker.QuarterPicker = withLabel(OriginDatePicker.QuarterPicker);
+DatePicker.QuarterPicker.displayName = 'ControlWrapper.QuarterPicker';
 DatePicker.YearPicker = withLabel(OriginDatePicker.YearPicker);
+DatePicker.YearPicker.displayName = 'ControlWrapper.YearPicker';
 export default {
   Input,
   Select,

package/Editor/index.js

@@ -307,4 +307,5 @@ const RCEditor = /*#__PURE__*/forwardRef(function RCEditor(props, ref) {
     }
   }));
 });
+RCEditor.displayName = 'Editor';
 export default RCEditor;

package/ErrorBoundary/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Result } from 'antd';
-export default class ErrorBoundary extends React.Component {
+class ErrorBoundary extends React.Component {
   state = {
     hasError: false,
     errorInfo: '',
@@ -16,8 +16,8 @@ export default class ErrorBoundary extends React.Component {
   render() {
     if (this.state.hasError) {
       return /*#__PURE__*/React.createElement(Result, {
-        status: "error",
         title: "\u62B1\u6B49\uFF0C\u5E94\u7528\u5185\u90E8\u53D1\u751F\u5F02\u5E38\u9519\u8BEF\u3002",
+        status: "error",
         subTitle: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, this.state.errorInfo), /*#__PURE__*/React.createElement("div", {
           style: {
             width: 700,
@@ -32,4 +32,6 @@ export default class ErrorBoundary extends React.Component {
     }
     return this.props.children;
   }
-}
+}
+ErrorBoundary.displayName = 'ErrorBoundary';
+export default ErrorBoundary;

package/FileUploader/index.js

@@ -1,27 +1,27 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import MD5 from 'spark-md5';
 import React from 'react';
+import { tools } from '@cqsjjb/jjb-common-lib';
 import { Tooltip, Button, message } from 'antd';
 import { DeleteOutlined, PaperClipOutlined } from '@ant-design/icons';
-import { getAppKey, getToken, isHttpUrl } from '../tools/index.js';
-import { tools } from '@cqsjjb/jjb-common-lib';
 import './index.less';
+import { getAppKey, getToken, isHttpUrl, getAntPrefix } from '../tools/index.js';
 const {
   toObject,
   isPromise,
   isFunction,
   parseObject
 } = tools;
-const prefixCls = window.process?.env?.app?.antd['ant-prefix'] || 'ant';
+const prefixCls = getAntPrefix();
 class FileUploader extends React.Component {
   state = {
     loading: false
   };
   inputFile = /*#__PURE__*/React.createRef();
 
-  /**
-   * @description http配置
-   * @returns {{headers: object, fieldName: string, data: object, action: string, url: string}}
+  /**
+   * @description http配置
+   * @returns {{headers: object, fieldName: string, data: object, action: string, url: string}}
    */
   get httpConfig() {
     const {
@@ -46,9 +46,9 @@ class FileUploader extends React.Component {
     };
   }
 
-  /**
-   * @description 填充值
-   * @returns {string[]}
+  /**
+   * @description 填充值
+   * @returns {string[]}
    */
   get value() {
     const {
@@ -57,9 +57,9 @@ class FileUploader extends React.Component {
     return Array.isArray(value) ? value : value ? [value] : [];
   }
 
-  /**
-   * @description 获取禁用状态
-   * @return {boolean}
+  /**
+   * @description 获取禁用状态
+   * @return {boolean}
    */
   get disabled() {
     const {
@@ -78,11 +78,11 @@ class FileUploader extends React.Component {
     }
   }
 
-  /**
-   * @description 验证文件类型
-   * @param fileType {string}
-   * @param accept {string}
-   * @returns {Promise<never>|Promise<void>}
+  /**
+   * @description 验证文件类型
+   * @param fileType {string}
+   * @param accept {string}
+   * @returns {Promise<never>|Promise<void>}
    */
   verifyFileAccept(fileType, accept) {
     const {
@@ -110,11 +110,11 @@ class FileUploader extends React.Component {
     }
   }
 
-  /**
-   * @description 验证文件大小
-   * @param fileSize {number}
-   * @param maxSize {number}
-   * @returns {Promise<never>|Promise<void>}
+  /**
+   * @description 验证文件大小
+   * @param fileSize {number}
+   * @param maxSize {number}
+   * @returns {Promise<never>|Promise<void>}
    */
   verifyFileSize(fileSize, maxSize) {
     const {
@@ -137,10 +137,10 @@ class FileUploader extends React.Component {
     }
   }
 
-  /**
-   * @description 发起上传请求
-   * @param file {File}
-   * @returns {Promise<{url: string, fileName: string, respDesc: string}>}
+  /**
+   * @description 发起上传请求
+   * @param file {File}
+   * @returns {Promise<{url: string, fileName: string, respDesc: string}>}
    */
   onFormRequest(file) {
     const {
@@ -196,9 +196,9 @@ class FileUploader extends React.Component {
     });
   }
 
-  /**
-   * @description 回调
-   * @param value {string}
+  /**
+   * @description 回调
+   * @param value {string}
    */
   onChange(value) {
     const {
@@ -207,17 +207,17 @@ class FileUploader extends React.Component {
     onChange && onChange(value || undefined);
   }
 
-  /**
-   * @description 删除
-   * @param sup {number}
+  /**
+   * @description 删除
+   * @param sup {number}
    */
   onDelete(sup) {
     this.onChange(this.props.multiple ? this.value.filter((_, sub) => sub !== sup) : undefined);
   }
 
-  /**
-   * @description 上传
-   * @param target {{files: FileList, value: any}}
+  /**
+   * @description 上传
+   * @param target {{files: FileList, value: any}}
    */
   onUpload({
     target
@@ -301,6 +301,7 @@ class FileUploader extends React.Component {
     }));
   }
 }
+FileUploader.displayName = 'FileUploader';
 export default FileUploader;
 export const getValueProps = value => ({
   value: value ? {

package/FormilyDescriptions/index.js

@@ -6,7 +6,7 @@ import { Modal, Descriptions, Empty, Image, Tooltip, Spin, Table, Space, TreeSel
 const formilyItemMargin = new Map([['small', 8], ['middle', 12], ['default', 16]]);
 const IS_PDF_REG = /\.pdf$/;
 const IS_VIDEO_REG = /\.(mp4|ogg|mkv|webm)$/;
-export default function FormilyDescriptions({
+function FormilyDescriptions({
   schema,
   values,
   ...props
@@ -34,6 +34,8 @@ export default function FormilyDescriptions({
     dataSource: dataSource
   }, props));
 }
+FormilyDescriptions.displayName = 'FormilyDescriptions';
+export default FormilyDescriptions;
 export function DescriptionsRender({
   dataSource,
   size = 'default',
@@ -73,6 +75,7 @@ export function DescriptionsRender({
     });
   });
 }
+DescriptionsRender.displayName = 'DescriptionsRender';
 export function ItemRender({
   data,
   imageWidth,
@@ -89,7 +92,7 @@ export function ItemRender({
   };
   const renderContent = () => {
     const systemStyle = props.systemStyle ? props.systemStyle(data.fieldCode) : {};
-    if (tools.isArray(data.value)) {
+    if (Array.isArray(data.value)) {
       if (tools.isStringArray(data.value) || tools.isNumberArray(data.value)) {
         return /*#__PURE__*/React.createElement("div", {
           style: systemStyle
@@ -146,6 +149,7 @@ export function ItemRender({
     height: 350
   })));
 }
+ItemRender.displayName = 'ItemRender';
 export function RenderText({
   value,
   name,
@@ -205,6 +209,7 @@ export function RenderText({
     name
   }) : tools.textPlaceholder(text));
 }
+RenderText.displayName = 'RenderText';
 export function RenderFileItem(props) {
   const {
     isImage,
@@ -240,6 +245,7 @@ export function RenderFileItem(props) {
     name: name
   })));
 }
+RenderFileItem.displayName = 'RenderFileItem';
 export function RenderImage({
   url,
   imageWidth,
@@ -268,6 +274,7 @@ export function RenderImage({
     } : imagePreview
   }));
 }
+RenderImage.displayName = 'RenderImage';
 export function RenderValidFile({
   url,
   name,
@@ -284,6 +291,7 @@ export function RenderValidFile({
     onClick: handleClick
   }, /*#__PURE__*/React.createElement(FileOutlined, null), name);
 }
+RenderValidFile.displayName = 'RenderValidFile';
 export function RenderInvalidFile({
   url,
   name
@@ -298,6 +306,7 @@ export function RenderInvalidFile({
     }
   }, /*#__PURE__*/React.createElement(LinkOutlined, null), name);
 }
+RenderInvalidFile.displayName = 'RenderInvalidFile';
 export function RenderTable({
   columns,
   dataSource,
@@ -343,4 +352,5 @@ export function RenderTable({
     dataSource: dataSource,
     style: systemStyle
   });
-}
+}
+RenderTable.displayName = 'RenderTable';

package/FormilyRenderer/index.js

@@ -55,4 +55,5 @@ const FormilyRenderer = /*#__PURE__*/forwardRef((props, ref) => {
     schema: schema
   }));
 });
+FormilyRenderer.displayName = 'FormilyRenderer';
 export default FormilyRenderer;

package/ImageCropper/index.js

@@ -113,4 +113,5 @@ const ImageCropper = /*#__PURE__*/forwardRef((props, ref) => {
     description: "\u672A\u5BFC\u5165\u56FE\u7247\u8D44\u6E90\uFF0C\u65E0\u6CD5\u88C1\u526A"
   }));
 });
+ImageCropper.displayName = 'ImageCropper';
 export default ImageCropper;

package/ImageUploader/index.js

@@ -299,6 +299,7 @@ const ImageUploader = props => {
     resource: resource
   })));
 };
+ImageUploader.displayName = 'ImageUploader';
 export default ImageUploader;
 export const getValueProps = value => ({
   value: value ? {

package/Layout/README.md

@@ -0,0 +1,41 @@
+页面布局组件
+
+## 代码演示
+
+```jsx
+import { useState } from 'react';
+import { Button } from 'antd';
+import PageLayout from '@cqsjjb/jjb-react-admin-component/PageLayout';
+
+function App() {
+  return (
+    <PageLayout title="用户中心">
+      
+    </PageLayout>
+  )
+}
+```
+
+## API
+
+| 属性              | 说明         |       类型        |   默认值 |
+|-----------------|:-----------|:---------------:|------:|
+| title           | 页面标题       |    `string`     |     - |
+| extra           | 右上角扩展      |   `ReactNode`   |     - |
+| header          | 自定义头部      |   `ReactNode`   |     - |
+| footer          | 自定义底部      |   `ReactNode`   |     - |
+| history         | 路由历史对象     |    `History`    |     - |
+| noStyle         | 去除所有样式     |    `boolean`    | false |
+| noBorder        | 取消边框       |    `boolean`    | false |
+| formLine        | form 表单行   |  `ReactNode[]`  |     - |
+| formLineStyle   | form 表单行样式 | `CSSProperties` |     - |
+| previous        | 显示返回上一页    |    `boolean`    | false |
+| transparent     | 背景透明       |    `boolean`    | false |
+| contentStyle    | 内容区样式      | `CSSProperties` |     - |
+| footerStyle     | 底部样式       | `CSSProperties` |     - |
+| pageHeaderStyle | 头部样式       | `CSSProperties` |     - |
+| style           | 自定义返回事件    | `CSSProperties` |     - |
+| onBack          | 容器样式       |  `() => void`   |     - |
+
+
+注意：`previous`为`true`时`history`必传，否则点击返回无效。