@cqsjjb/jjb-react-admin-component 3.0.26 → 3.0.28

package/ErrorBoundary/index.d.ts

@@ -0,0 +1,12 @@
+// @ts-ignore
+import * as React from 'react';
+import { ComponentProps } from '../types';
+
+interface ErrorBoundaryProps extends ComponentProps {
+}
+
+interface ErrorBoundaryFc extends React.FC<ErrorBoundaryProps> {
+}
+
+declare const ErrorBoundary: ErrorBoundaryFc;
+export default ErrorBoundary;

package/ErrorBoundary/index.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Result, Tooltip, Button } from 'antd';
+export default class ErrorBoundary extends React.Component {
+  state = {
+    hasError: false,
+    errorInfo: '',
+    errorStack: undefined
+  };
+  componentDidCatch(error, info) {
+    this.setState({
+      hasError: true,
+      errorInfo: error.message,
+      errorStack: info.componentStack
+    });
+  }
+  render() {
+    if (this.state.hasError) {
+      return /*#__PURE__*/React.createElement(Result, {
+        status: "error",
+        title: "\u5E94\u7528\u8FD0\u884C\u5F02\u5E38",
+        subTitle: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, this.state.errorInfo), /*#__PURE__*/React.createElement("div", {
+          style: {
+            width: 700,
+            display: 'inline-block',
+            overflow: 'auto',
+            maxHeight: 400,
+            textAlign: 'left',
+            whiteSpace: 'pre-line'
+          }
+        }, this.state.errorStack)),
+        extra: /*#__PURE__*/React.createElement(Tooltip, {
+          title: "\u82E5\u5237\u65B0\u4EFB\u7136\u65E0\u6CD5\u89E3\u51B3\uFF0C\u8BF7\u8054\u7CFB\u6280\u672F\u4EBA\u5458\u89E3\u51B3"
+        }, /*#__PURE__*/React.createElement(Button, {
+          type: "primary",
+          onClick: () => window.location.reload()
+        }, "\u5237\u65B0\u91CD\u8BD5"))
+      });
+    }
+    return this.props.children;
+  }
+}

package/ErrorBoundary/index.mjs

@@ -0,0 +1,58 @@
+import React from 'react';
+import { Result, Tooltip, Button } from 'antd';
+
+export default class ErrorBoundary extends React.Component {
+  state = {
+    hasError: false,
+    errorInfo: '',
+    errorStack: undefined
+  };
+
+  componentDidCatch(error, info) {
+    this.setState({
+      hasError: true,
+      errorInfo: error.message,
+      errorStack: info.componentStack
+    });
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <Result
+          status="error"
+          title="应用运行异常"
+          subTitle={(
+            <React.Fragment>
+              <div>{this.state.errorInfo}</div>
+              <div
+                style={{
+                  width: 700,
+                  display: 'inline-block',
+                  overflow: 'auto',
+                  maxHeight: 400,
+                  textAlign: 'left',
+                  whiteSpace: 'pre-line'
+                }}
+              >
+                {this.state.errorStack}
+              </div>
+            </React.Fragment>
+          )}
+          extra={(
+            <Tooltip title="若刷新任然无法解决，请联系技术人员解决">
+              <Button
+                type="primary"
+                onClick={() => window.location.reload()}
+              >
+                刷新重试
+              </Button>
+            </Tooltip>
+          )}
+        />
+      );
+    }
+
+    return this.props.children;
+  }
+}

package/FormilyDescriptions/index.d.ts

@@ -56,6 +56,10 @@ interface FormilyDescriptionsProps extends ComponentProps {
    * @see https://ant.design/components/descriptions-cn#descriptions
    */
   contentStyle?: React.CSSProperties;
+  /**
+   * @description 是否外部预览？
+   */
+  extraFileLink: boolean;
 }
 
 interface FormilyDescriptionsFc extends React.FC<FormilyDescriptionsProps> {

package/FormilyDescriptions/index.js

@@ -22,8 +22,13 @@ export default function FormilyDescriptions(props) {
   });
   return dataSource.length === 0 ? /*#__PURE__*/React.createElement(Empty, {
     image: Empty.PRESENTED_IMAGE_SIMPLE
-  }) : /*#__PURE__*/React.createElement(React.Fragment, null, dataSource.map((item, index) => {
-    const isLast = index === dataSource.length - 1;
+  }) : /*#__PURE__*/React.createElement(DescriptionsRender, _extends({
+    dataSource: dataSource
+  }, props));
+}
+export function DescriptionsRender(props) {
+  return props.dataSource.map((item, index) => {
+    const isLast = index === props.dataSource.length - 1;
     return /*#__PURE__*/React.createElement(Descriptions, {
       key: index,
       size: props.size,
@@ -54,9 +59,9 @@ export default function FormilyDescriptions(props) {
       labelStyle: props.labelStyle,
       contentStyle: props.contentStyle
     });
-  }));
+  });
 }
-function ItemRender(props) {
+export function ItemRender(props) {
   const [type, setType] = React.useState(undefined);
   const [open, setOpen] = React.useState(false);
   const [previewUrl, setPreviewUrl] = React.useState('');
@@ -64,7 +69,8 @@ function ItemRender(props) {
     data,
     imageWidth,
     imageHeight,
-    imagePreview
+    imagePreview,
+    extraFileLink
   } = props;
   return /*#__PURE__*/React.createElement(React.Fragment, null, tools.isArray(data.value) ? tools.isStringArray(data.value) || tools.isNumberArray(data.value) ? data.value.join('、') : tools.isObjectArray(data.value) ? data.formType === 'Table' ? /*#__PURE__*/React.createElement("div", {
     style: {
@@ -88,7 +94,12 @@ function ItemRender(props) {
           src: next.url,
           width: imageWidth || 64,
           height: imageHeight || 64,
-          preview: imagePreview
+          preview: extraFileLink ? {
+            visible: false,
+            onVisibleChange: e => {
+              window.open(next.url);
+            }
+          } : imagePreview
         }));
       } else {
         return /*#__PURE__*/React.createElement(Tooltip, {
@@ -101,9 +112,13 @@ function ItemRender(props) {
             alignItems: 'center'
           },
           onClick: () => {
-            setType('pdf');
-            setOpen(true);
-            setPreviewUrl(next.url);
+            if (extraFileLink) {
+              window.open(next.url);
+            } else {
+              setType('pdf');
+              setOpen(true);
+              setPreviewUrl(next.url);
+            }
           }
         }, /*#__PURE__*/React.createElement(FilePdfOutlined, null), "\u70B9\u51FB\u67E5\u770B") : /\.(mp4|ogg|mkv|webm)$/.test(next.url) ? /*#__PURE__*/React.createElement("a", {
           key: nextIndex,
@@ -113,9 +128,13 @@ function ItemRender(props) {
             alignItems: 'center'
           },
           onClick: () => {
-            setType('video');
-            setOpen(true);
-            setPreviewUrl(next.url);
+            if (props.extraFileLink) {
+              window.open(next.url);
+            } else {
+              setType('video');
+              setOpen(true);
+              setPreviewUrl(next.url);
+            }
           }
         }, /*#__PURE__*/React.createElement(PlayCircleOutlined, null), "\u70B9\u51FB\u67E5\u770B") : /*#__PURE__*/React.createElement("a", {
           key: nextIndex,
@@ -153,7 +172,7 @@ function ItemRender(props) {
     height: "350"
   })));
 }
-function generateValue(data, prefix = []) {
+export function generateValue(data, prefix = []) {
   const result = [];
   data.forEach(item => {
     // 当前节点的完整 name
@@ -169,7 +188,7 @@ function generateValue(data, prefix = []) {
   });
   return result;
 }
-function RenderText(props) {
+export function RenderText(props) {
   const {
     value
   } = props;

package/FormilyDescriptions/index.mjs

@@ -26,54 +26,56 @@ export default function FormilyDescriptions(props) {
   return dataSource.length === 0
     ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
     : (
-      <React.Fragment>
-        {dataSource.map((item, index) => {
-          const isLast = index === dataSource.length - 1;
+      <DescriptionsRender dataSource={dataSource} {...props} />
+    );
+}
+
+export function DescriptionsRender(props) {
+  return props.dataSource.map((item, index) => {
+    const isLast = index === props.dataSource.length - 1;
 
-          return (
-            <Descriptions
-              key={index}
-              size={props.size}
-              style={{
-                marginBottom: isLast
-                  ? 0
-                  : formilyItemMargin.get(props.size || 'default')
-              }}
-              items={item.fromComponentEnum === 'GRID_FORM'
-                ? item.children.map((child, childIndex) => {
-                  return {
-                    key: childIndex,
-                    label: child.name,
-                    span: child.formType === 'Table'
-                      ? props.column
-                      : 1,
-                    children: (
-                      <ItemRender data={child} {...props} />
-                    )
-                  };
-                })
-                : [
-                  {
-                    key: 1,
-                    label: item.name,
-                    children: <ItemRender data={item} {...props} />
-                  }
-                ]}
-              colon={props.colon}
-              title={props.title}
-              extra={props.extra}
-              layout={props.layout || 'vertical'}
-              column={props.column}
-              labelStyle={props.labelStyle}
-              contentStyle={props.contentStyle}
-            />
-          );
-        })}
-      </React.Fragment>
+    return (
+      <Descriptions
+        key={index}
+        size={props.size}
+        style={{
+          marginBottom: isLast
+            ? 0
+            : formilyItemMargin.get(props.size || 'default')
+        }}
+        items={item.fromComponentEnum === 'GRID_FORM'
+          ? item.children.map((child, childIndex) => {
+            return {
+              key: childIndex,
+              label: child.name,
+              span: child.formType === 'Table'
+                ? props.column
+                : 1,
+              children: (
+                <ItemRender data={child} {...props} />
+              )
+            };
+          })
+          : [
+            {
+              key: 1,
+              label: item.name,
+              children: <ItemRender data={item} {...props} />
+            }
+          ]}
+        colon={props.colon}
+        title={props.title}
+        extra={props.extra}
+        layout={props.layout || 'vertical'}
+        column={props.column}
+        labelStyle={props.labelStyle}
+        contentStyle={props.contentStyle}
+      />
     );
+  });
 }
 
-function ItemRender(props) {
+export function ItemRender(props) {
   const [ type, setType ] = React.useState(undefined);
   const [ open, setOpen ] = React.useState(false);
   const [ previewUrl, setPreviewUrl ] = React.useState('');
@@ -82,7 +84,8 @@ function ItemRender(props) {
     data,
     imageWidth,
     imageHeight,
-    imagePreview
+    imagePreview,
+    extraFileLink
   } = props;
 
   return (
@@ -119,7 +122,12 @@ function ItemRender(props) {
                               src={next.url}
                               width={imageWidth || 64}
                               height={imageHeight || 64}
-                              preview={imagePreview}
+                              preview={extraFileLink ? {
+                                visible: false,
+                                onVisibleChange: e => {
+                                  window.open(next.url);
+                                }
+                              } : imagePreview}
                             />
                           </span>
                         );
@@ -136,9 +144,13 @@ function ItemRender(props) {
                                     alignItems: 'center'
                                   }}
                                   onClick={() => {
-                                    setType('pdf');
-                                    setOpen(true);
-                                    setPreviewUrl(next.url);
+                                    if (extraFileLink) {
+                                      window.open(next.url);
+                                    } else {
+                                      setType('pdf');
+                                      setOpen(true);
+                                      setPreviewUrl(next.url);
+                                    }
                                   }}
                                 >
                                   <FilePdfOutlined />
@@ -155,9 +167,13 @@ function ItemRender(props) {
                                       alignItems: 'center'
                                     }}
                                     onClick={() => {
-                                      setType('video');
-                                      setOpen(true);
-                                      setPreviewUrl(next.url);
+                                      if (props.extraFileLink) {
+                                        window.open(next.url);
+                                      } else {
+                                        setType('video');
+                                        setOpen(true);
+                                        setPreviewUrl(next.url);
+                                      }
                                     }}
                                   >
                                     <PlayCircleOutlined />
@@ -224,7 +240,7 @@ function ItemRender(props) {
   );
 }
 
-function generateValue(data, prefix = []) {
+export function generateValue(data, prefix = []) {
   const result = [];
 
   data.forEach(item => {
@@ -244,7 +260,7 @@ function generateValue(data, prefix = []) {
   return result;
 }
 
-function RenderText(props) {
+export function RenderText(props) {
   const { value } = props;
   const [ text, setText ] = React.useState();
   const [ loading, setLoading ] = React.useState(false);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cqsjjb/jjb-react-admin-component",
-  "version": "3.0.26",
+  "version": "3.0.28",
   "description": "jjb-react-admin-组件库@new",
   "main": "index.js",
   "author": "jjb-front-team",