fan-standard-comp 3.2.1 → 3.2.3

package/es/FormComp/FieldComponent/TitleNode.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 interface TitleNodeProps {
     render?: any;
     data?: any;
 }
-declare const TitleNode: (props: TitleNodeProps) => JSX.Element;
+declare const TitleNode: (props: TitleNodeProps) => React.JSX.Element;
 export default TitleNode;

package/es/FormComp/FieldComponent/index.d.ts

@@ -10,7 +10,7 @@ interface OptionNameProps {
 }
 export interface FieldComponentProps {
     label?: any;
-    type?: String;
+    type?: string;
     filedName?: string;
     value?: any;
     protoConfig?: any;

package/es/FormComp/FieldComponent/index.js

@@ -24,17 +24,19 @@ import "antd/es/select/style";
 import _Select from "antd/es/select";
 import "antd/es/input/style";
 import _Input from "antd/es/input";
-import React from "react";
+import React, { useContext } from "react";
 import Uploader from '../Uploader';
 import SpecIcon from '../../SpecIcon';
 import RefactorTreeSelect from './RefactorTreeSelect.js';
-import { setSelectValue, setUploaderValue, setDatePickerValue, setTimePickerValue, setCascaderValue } from './setReadonlyValues.js';
+import { setSelectValue, setDatePickerValue, setTimePickerValue, setCascaderValue } from './setReadonlyValues.js';
 import TitleNode from './TitleNode';
 import ReUpload from './ReUpload';
+import { FanContext } from '../../ConfigContext';
 var TextArea = _Input.TextArea,
   Password = _Input.Password;
 var Option = _Select.Option;
-var RangePicker = _DatePicker.RangePicker; // 表单组件类型
+var RangePicker = _DatePicker.RangePicker;
+// 表单组件类型
 var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var type = props.type,
     _onChange = props.onChange,
@@ -69,6 +71,8 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
     selectOptionRender = props.selectOptionRender,
     render = props.render;
   var selectOptions = props.selectOptions;
+  var InitFanContext = useContext(FanContext);
+  var providerConfig = InitFanContext[type] || {}; // 使用上下文（全局配置）设置扩展的配置项
   var compContent;
   if (selectOptionName && selectOptions) {
     // 将传值的数据进行转换
@@ -81,14 +85,14 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
       });
     });
   }
-  var defaultProps = Object.assign({
+  var defaultProps = Object.assign(Object.assign({
     style: style,
     onChange: _onChange,
     value: value,
     render: render,
     size: size,
     ref: ref
-  }, protoConfig);
+  }, providerConfig), protoConfig);
   if (fieldStatus === 'disabled') {
     defaultProps.disabled = true;
   }
@@ -104,35 +108,41 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var viewOnly = fieldStatus === 'viewOnly'; // 是否纯展示
   switch (type) {
     case 'input':
-      compContent = viewOnly ? value || '-' : /*#__PURE__*/React.createElement(_Input, Object.assign({
+      compContent = viewOnly ? value || '-' : (/*#__PURE__*/React.createElement(_Input, Object.assign({
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || '请输入',
         autoComplete: "off",
         title: fieldStatus === 'disabled' || defaultProps.disabled ? value : null,
-        maxLength: defaultProps.maxLength || 50
-      }, defaultProps));
+        maxLength: defaultProps.maxLength || 50,
+        onKeyDown: function onKeyDown(evt) {
+          if (evt.key === 'Enter') {
+            // 表单只有一个输入框时，焦点定到输入框后按下Enter会触发提交事件
+            evt.preventDefault(); // 禁止默认行为
+          }
+        }
+      }, defaultProps)));
       break;
     case 'password':
-      compContent = viewOnly ? value ? "\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF" : '-' : /*#__PURE__*/React.createElement(Password, Object.assign({
+      compContent = viewOnly ? value ? "\u25CF\u25CF\u25CF\u25CF\u25CF\u25CF" : '-' : (/*#__PURE__*/React.createElement(Password, Object.assign({
         autoComplete: "off",
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || '请输入',
         maxLength: defaultProps.maxLength || 50
-      }, defaultProps));
+      }, defaultProps)));
       break;
     case 'textarea':
-      compContent = viewOnly ? value || '-' : /*#__PURE__*/React.createElement(TextArea, Object.assign({
+      compContent = viewOnly ? value || '-' : (/*#__PURE__*/React.createElement(TextArea, Object.assign({
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || '请输入',
         maxLength: defaultProps.maxLength || 500,
         title: fieldStatus === 'disabled' || defaultProps.disabled ? value : null
-      }, defaultProps));
+      }, defaultProps)));
       break;
     case 'inputNumber':
-      compContent = viewOnly ? value || 0 : /*#__PURE__*/React.createElement(_InputNumber, Object.assign({
+      compContent = viewOnly ? value || 0 : (/*#__PURE__*/React.createElement(_InputNumber, Object.assign({
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || '请输入数字'
       }, sortLimitRule, defaultProps, {
         style: Object.assign({
           width: '120px'
         }, defaultProps.style)
-      }));
+      })));
       break;
     case 'select':
       // 重置返回完整字段值
@@ -153,7 +163,7 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
         selectOptionRender: selectOptionRender,
         defaultProps: defaultProps,
         type: type
-      }) : /*#__PURE__*/React.createElement(_Select, Object.assign({
+      }) : (/*#__PURE__*/React.createElement(_Select, Object.assign({
         allowClear: true,
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || "".concat(defaultProps.showSearch ? '请输入选择' : '请选择'),
         filterOption: function filterOption(inputValue, option) {
@@ -172,7 +182,7 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
           title: selectOptionRender ? selectOptionRender(val) : val.title || val.label,
           disabled: val.disabled
         }, selectOptionRender ? selectOptionRender(val) : val.label);
-      }));
+      })));
       break;
     case 'tree-select':
       compContent = /*#__PURE__*/React.createElement(RefactorTreeSelect, Object.assign({
@@ -280,13 +290,13 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
       compContent = viewOnly ? setTimePickerValue(value, {
         type: type,
         protoConfig: protoConfig
-      }) : /*#__PURE__*/React.createElement(_TimePicker, Object.assign({}, defaultProps, {
+      }) : (/*#__PURE__*/React.createElement(_TimePicker, Object.assign({}, defaultProps, {
         style: Object.assign(Object.assign({
           'minWidth': 'auto'
         }, defaultProps.style), {
           width: 'auto'
         })
-      }));
+      })));
       break;
     case 'timePickerRange':
       if (fieldStatus === 'disabled' || defaultProps.disabled) defaultProps.placeholder = ''; // 禁用时，placeHolder不显示
@@ -294,13 +304,13 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
       compContent = viewOnly ? setTimePickerValue(value, {
         type: type,
         protoConfig: protoConfig
-      }) : /*#__PURE__*/React.createElement(_TimePicker.RangePicker, Object.assign({}, defaultProps, {
+      }) : (/*#__PURE__*/React.createElement(_TimePicker.RangePicker, Object.assign({}, defaultProps, {
         style: Object.assign(Object.assign({
           'minWidth': 'auto'
         }, defaultProps.style), {
           width: 'auto'
         })
-      }));
+      })));
       break;
     case 'upload':
       compContent = viewOnly && (!value || value.length === 0) ? '-' : /*#__PURE__*/React.createElement(ReUpload, Object.assign({}, defaultProps, {
@@ -317,22 +327,23 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }), " \u70B9\u51FB\u4E0A\u4F20")));
       break;
     case 'uploader':
-      compContent = viewOnly ? setUploaderValue(value) : /*#__PURE__*/React.createElement(Uploader, Object.assign({}, defaultProps, {
+      // compContent = viewOnly ? setUploaderValue(value) : <Uploader {...defaultProps} size={protoConfig?.size}/>
+      compContent = /*#__PURE__*/React.createElement(Uploader, Object.assign({}, defaultProps, {
+        viewOnly: viewOnly,
         size: protoConfig === null || protoConfig === void 0 ? void 0 : protoConfig.size
       }));
-      // compContent = <Uploader {...defaultProps}></Uploader>
       break;
     case 'cascader':
       compContent = viewOnly ? setCascaderValue(value, {
         selectOptions: selectOptions,
         selectOptionRender: selectOptionRender,
         defaultProps: defaultProps
-      }) : /*#__PURE__*/React.createElement(_Cascader, Object.assign({
+      }) : (/*#__PURE__*/React.createElement(_Cascader, Object.assign({
         options: selectOptions,
         allowClear: true,
         fieldNames: (defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps.fieldNames) || selectOptionName,
         placeholder: fieldStatus === 'disabled' || defaultProps.disabled ? '' : defaultProps.placeholder || placeholder || '请选择'
-      }, defaultProps));
+      }, defaultProps)));
       break;
     case 'switch':
       compContent = /*#__PURE__*/React.createElement(_Switch, Object.assign({}, defaultProps, {
@@ -345,9 +356,9 @@ var FieldComponent = /*#__PURE__*/React.forwardRef(function (props, ref) {
       // compContent = viewOnly ? (String(value) === 'undefined' ? '-' : String(value)) : (<Switch {...defaultProps} checked={value} style={{ ...defaultProps.style, width: 'auto' }} />)
       break;
     case 'slider':
-      compContent = viewOnly ? value : /*#__PURE__*/React.createElement(_Slider, Object.assign({}, defaultProps, {
+      compContent = viewOnly ? value : (/*#__PURE__*/React.createElement(_Slider, Object.assign({}, defaultProps, {
         style: Object.assign({}, defaultProps.style)
-      }));
+      })));
       break;
     case 'mentions':
       compContent = viewOnly ? value : /*#__PURE__*/React.createElement(_Mentions, Object.assign({

package/es/FormComp/FieldComponent/setReadonlyValues.js

@@ -1,11 +1,11 @@
 import "antd/es/image/style";
 import _Image from "antd/es/image";
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-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; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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(r) { if (Array.isArray(r)) return r; }
 import React, { useEffect, useMemo, useState } from "react";
 import moment from 'moment';
 import { getBase64 } from "../Uploader/util";
@@ -65,7 +65,7 @@ var setSelectValue = function setSelectValue(value, props) {
       if (matchValue.length > 0) {
         // 如果 select 配置选项展示内容，则直接使用其配置值展示当前只读信息
         if (selectOptionRender) {
-          matchValues.push( /*#__PURE__*/React.createElement("div", {
+          matchValues.push(/*#__PURE__*/React.createElement("div", {
             key: index,
             className: "checkbox-viewonly-item"
           }, selectOptionRender(matchValue[0]), value.length - 1 > index ? separator ? separator : separator == null ? '' : ',' : ''));

package/es/FormComp/RenderItemGroup/index.js

@@ -32,6 +32,9 @@ var RenderItemGroup = function RenderItemGroup(props) {
     if (modalSize === 'lg' || modalSize === 'xlg') {
       return 8;
     }
+    if (modalSize === 'xxlg') {
+      return 6;
+    }
     return 12;
   };
   var updateFormFields = function updateFormFields() {
@@ -48,6 +51,12 @@ var RenderItemGroup = function RenderItemGroup(props) {
     }
     return isHide || false;
   };
+  // layout='inline'条件下设置指定控件宽度自动
+  var setAutoWidth = function setAutoWidth(fieldType) {
+    var widgets = ['checkbox', 'radio', 'datePicker', 'dateTimePicker', 'rangePicker', 'rangeTimePicker', 'timePicker', 'timePickerRange'];
+    if (!fieldType) return false;
+    return widgets.includes(fieldType);
+  };
   // 渲染表单控件
   var renderFormField = function renderFormField(field) {
     var componentStyle = field.componentStyle,
@@ -69,7 +78,11 @@ var RenderItemGroup = function RenderItemGroup(props) {
         },
         fieldStatus: field.fieldStatus || fieldStatus,
         size: field.protoConfig && field.protoConfig.size || field.size || fieldSize,
-        style: componentStyle || Object.assign({}, general.formItemStyle.wide)
+        // style={{ width: item.type === 'checkbox' || item.type === 'radio' ? 'auto' : general.formItemStyle.xsm.width, ...componentStyle }}
+        // style={componentStyle || (layout === 'inline' ? { ...general.formItemStyle.xsm } : { ...general.formItemStyle.wide } )}
+        style: Object.assign({
+          width: layout === 'inline' ? setAutoWidth(field.type) ? 'auto' : general.formItemStyle.xsm.width : general.formItemStyle.wide.width
+        }, componentStyle)
       }))), extra ? extra(field, form) : '');
     } else {
       return /*#__PURE__*/React.createElement(Field, Object.assign({}, field, {
@@ -88,7 +101,10 @@ var RenderItemGroup = function RenderItemGroup(props) {
         },
         fieldStatus: field.fieldStatus || fieldStatus,
         size: field.protoConfig && field.protoConfig.size || field.size || fieldSize,
-        style: componentStyle || Object.assign({}, general.formItemStyle.wide)
+        // style={componentStyle || { ...general.formItemStyle.wide }}
+        style: Object.assign({
+          width: layout === 'inline' ? setAutoWidth(field.type) ? 'auto' : general.formItemStyle.xsm.width : general.formItemStyle.wide.width
+        }, componentStyle)
       }));
     }
   };
@@ -105,11 +121,11 @@ var RenderItemGroup = function RenderItemGroup(props) {
       }, /*#__PURE__*/React.createElement(FormItem, Object.assign({
         name: type !== 'custom' && filedName,
         className: fieldStatus === 'viewOnly' ? 'form-item-view-only' : '',
-        label: description ? /*#__PURE__*/React.createElement("span", null, label, /*#__PURE__*/React.createElement(_Tooltip, {
+        label: description ? (/*#__PURE__*/React.createElement("span", null, label, /*#__PURE__*/React.createElement(_Tooltip, {
           title: description
         }, /*#__PURE__*/React.createElement(SpecIcon, {
           name: "info"
-        }))) : label,
+        })))) : label,
         rules: item.preExtra || item.extra ? [] : item.rules || (item.fieldOptions ? item.fieldOptions.rules : []),
         required: item.rules && item.rules.filter(function (rItem) {
           return rItem.required;
@@ -120,11 +136,11 @@ var RenderItemGroup = function RenderItemGroup(props) {
         key: index,
         name: type !== 'custom' && filedName,
         className: fieldStatus === 'viewOnly' ? 'form-item-view-only' : '',
-        label: description ? /*#__PURE__*/React.createElement("span", null, label, /*#__PURE__*/React.createElement(_Tooltip, {
+        label: description ? (/*#__PURE__*/React.createElement("span", null, label, /*#__PURE__*/React.createElement(_Tooltip, {
           title: description
         }, /*#__PURE__*/React.createElement(SpecIcon, {
           name: "info"
-        }))) : label,
+        })))) : label,
         rules: item.rules || (item.fieldOptions ? item.fieldOptions.rules : [])
       }, formLayout, item.protoFormItem), type === 'custom' && customRender ? customRender(form, Object.assign({}, item), fieldStatus) : renderFormField(Object.assign({}, item)));
     }
@@ -170,11 +186,11 @@ var RenderItemGroup = function RenderItemGroup(props) {
         }, function (FormInstance) {
           var _a;
           // isHide 返回为true则隐藏当前控件
-          return !itemIsHide(isHide, FormInstance.getFieldValue(), FormInstance) ? /*#__PURE__*/React.createElement(_Col, {
+          return !itemIsHide(isHide, FormInstance.getFieldValue(), FormInstance) ? (/*#__PURE__*/React.createElement(_Col, {
             span: item.colSpan || 24
           }, type === 'title' ? /*#__PURE__*/React.createElement("h3", Object.assign({}, item.protoConfig, {
             className: "modalPanelTitle ".concat(((_a = item === null || item === void 0 ? void 0 : item.protoConfig) === null || _a === void 0 ? void 0 : _a.className) || '')
-          }), label) : label) : /*#__PURE__*/React.createElement(React.Fragment, null, null);
+          }), label) : label)) : /*#__PURE__*/React.createElement(React.Fragment, null, null);
         });
       }
       // 判断是否强制重新渲染表单

package/es/FormComp/Uploader/index.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import './style/index.less';
 interface UploaderProps {
     extraExt?: string;
     accept?: string;
@@ -7,7 +8,10 @@ interface UploaderProps {
     className?: string;
     isOnly?: boolean;
     children?: React.ReactNode;
-    onChange?: (file?: any) => void;
+    onChange?: (file?: any, defaultFile?: {
+        file: any;
+        fileList: any[];
+    }) => void;
     value?: any;
     size?: number;
     modalSize?: string;
@@ -16,6 +20,9 @@ interface UploaderProps {
     limit?: number;
     modalConfig?: any;
     modalZIndex?: number;
+    crop?: boolean;
+    cropConfig?: any;
+    [k: string]: any;
 }
-declare const Uploader: React.ForwardRefExoticComponent<UploaderProps & React.RefAttributes<unknown>>;
+declare const Uploader: React.ForwardRefExoticComponent<Omit<UploaderProps, "ref"> & React.RefAttributes<unknown>>;
 export default Uploader;