@bit-sun/business-component 3.1.9-alpha.1 → 3.1.9

package/dist/index.esm.js

@@ -2613,6 +2613,7 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
     var _this;
     _classCallCheck(this, DataValidation);
     _this = _callSuper(this, DataValidation, [props]);
+    // this.props.onRef(this);
     _this.getCount = function () {
       var resultData = _this.state.resultData;
       return {
@@ -3072,7 +3073,6 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
         resultData: resultData
       });
     };
-    _this.props.onRef(_this);
     var format = {
       fa: FORMAT_NAME_GENERAL,
       t: FORMAT_TYPE_STRING
@@ -3117,6 +3117,7 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentDidMount",
     value: function componentDidMount() {
+      this.props.onRef(this);
       luckysheet.create(this.setConfig([]));
     }
   }, {
@@ -11841,8 +11842,9 @@ var CommodityEntry = function CommodityEntry(props) {
     modalProps = _useState2[0],
     setModalProps = _useState2[1];
   var handleOk = function handleOk() {
+    var _dataValidationRef$cu;
     // 方法获取当前组件内部的数据，然后进行自身的业务操作
-    var resultData = dataValidationRef.getValidateData();
+    var resultData = (_dataValidationRef$cu = dataValidationRef.current) === null || _dataValidationRef$cu === void 0 ? void 0 : _dataValidationRef$cu.getValidateData();
     if (!resultData.successData.length) {
       message$1.error("无校验通过数据，请校验数据");
       return;
@@ -11872,7 +11874,7 @@ var CommodityEntry = function CommodityEntry(props) {
     zIndex: 15
   }, otherModalProps), /*#__PURE__*/React$1.createElement(DataValidation, _objectSpread2(_objectSpread2({}, props), {}, {
     onRef: function onRef(ref) {
-      dataValidationRef = ref;
+      dataValidationRef.current = ref;
     },
     columns: columns,
     validDataUrl: validDataUrl,
@@ -12309,6 +12311,16 @@ var handleDefaultProps = function handleDefaultProps(type, otherRequestConfig) {
         }, otherRequestConfig)
       };
       break;
+    case 'background-category':
+      result = {
+        isChoose: true,
+        remoteSource: _objectSpread2({
+          url: "/items/category/queryCategoryTree",
+          headers: otherRequestConfig === null || otherRequestConfig === void 0 ? void 0 : otherRequestConfig.extralHeaders,
+          resKeyValue: ['categoryCode', 'name']
+        }, otherRequestConfig)
+      };
+      break;
     default:
       result = {
         treeCheckable: true,
@@ -31660,6 +31672,200 @@ var RuleField = /*#__PURE__*/function (_Component) {
             });
           }
         }
+        // 品牌选择器
+        if (dataChoiceBusinessType == 410) {
+          if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+            return /*#__PURE__*/React$1.createElement(React$1.Fragment, null, /*#__PURE__*/React$1.createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: values[0],
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[0] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[0] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[0] = [value.key];
+                  valueNames[0] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }), /*#__PURE__*/React$1.createElement("span", null, "~"), /*#__PURE__*/React$1.createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: values[1],
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[1] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[1] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[1] = [value.key];
+                  valueNames[1] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }));
+          } else {
+            var _values13;
+            var _currentValue12 = dataInputBusinessType === 12 ? ((_values13 = values) === null || _values13 === void 0 ? void 0 : _values13.map(function (s, vIndex) {
+              return {
+                key: s,
+                label: valueNames[vIndex]
+              };
+            })) || [] : values[0] && {
+              key: values[0],
+              label: valueNames[0]
+            } || {};
+            return /*#__PURE__*/React$1.createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: _currentValue12,
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values = value.map(function (i) {
+                    return i.key;
+                  }) || [];
+                  valueNames = value.map(function (i) {
+                    return i.label || '';
+                  }) || [];
+                } else {
+                  values = (value === null || value === void 0 ? void 0 : value.key) ? [value.key] : [];
+                  valueNames = (value === null || value === void 0 ? void 0 : value.label) ? [value.label] : [];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            });
+          }
+        }
+        // 类目选择器
+        if (dataChoiceBusinessType == 420) {
+          if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+            return /*#__PURE__*/React$1.createElement(React$1.Fragment, null, /*#__PURE__*/React$1.createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[0] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[0] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[0] = [value.key];
+                  valueNames[0] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }), /*#__PURE__*/React$1.createElement("span", null, "~"), /*#__PURE__*/React$1.createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[1] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[1] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[1] = [value.key];
+                  valueNames[1] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }));
+          } else {
+            return /*#__PURE__*/React$1.createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values = value.map(function (i) {
+                    return i.key;
+                  }) || [];
+                  valueNames = value.map(function (i) {
+                    return i.label || '';
+                  }) || [];
+                } else {
+                  values = (value === null || value === void 0 ? void 0 : value.key) ? [value.key] : [];
+                  valueNames = (value === null || value === void 0 ? void 0 : value.label) ? [value.label] : [];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            });
+          }
+        }
       } else {
         if (dataTypeCode == 22 || dataTypeCode == 21 || dataTypeCode == 24 || dataTypeCode == 23) {
           //数值22, 字符串21, 布尔类型24, long23
@@ -32913,6 +33119,40 @@ function RenderCompItem(props) {
     getPopupContainer: function getPopupContainer() {
       return document.body;
     }
+  })) || null, ((ites === null || ites === void 0 ? void 0 : ites.inputType) === 20 || (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30) && (ites === null || ites === void 0 ? void 0 : ites.choiceType) === 410 && ( /*#__PURE__*/React$1.createElement(BusinessSearchSelect$1, {
+    selectBusinessType: "brand",
+    selectProps: _objectSpread2({
+      style: styleCommon,
+      placeholder: '请选择品牌'
+    }, (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30 ? {
+      mode: 'multiple',
+      maxTagCount: 1
+    } : {}),
+    disabled: disabled,
+    labelInValue: true,
+    value: showValue(ites.code),
+    requestConfig: {
+      filterInit: 'qp-brandCode-in'
+    },
+    onChange: function onChange(value) {
+      handleEdit(ites.code, value);
+    },
+    getPopupContainer: function getPopupContainer() {
+      return document.body;
+    }
+  })) || null, ((ites === null || ites === void 0 ? void 0 : ites.inputType) === 20 || (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30) && (ites === null || ites === void 0 ? void 0 : ites.choiceType) === 420 && ( /*#__PURE__*/React$1.createElement(BusinessTreeSearchSelect$1, {
+    disabled: disabled,
+    treeCheckable: (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30,
+    businessType: "background-category",
+    labelInValue: true,
+    value: showValue(ites.code),
+    style: styleCommon,
+    onChange: function onChange(value) {
+      handleEdit(ites.code, value);
+    },
+    getPopupContainer: function getPopupContainer() {
+      return document.body;
+    }
   })) || null, (ites === null || ites === void 0 ? void 0 : ites.inputType) === 40 && ( /*#__PURE__*/React$1.createElement("div", {
     style: {
       display: 'flex'

package/dist/index.js

@@ -2636,6 +2636,7 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
     var _this;
     _classCallCheck(this, DataValidation);
     _this = _callSuper(this, DataValidation, [props]);
+    // this.props.onRef(this);
     _this.getCount = function () {
       var resultData = _this.state.resultData;
       return {
@@ -3095,7 +3096,6 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
         resultData: resultData
       });
     };
-    _this.props.onRef(_this);
     var format = {
       fa: FORMAT_NAME_GENERAL,
       t: FORMAT_TYPE_STRING
@@ -3140,6 +3140,7 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentDidMount",
     value: function componentDidMount() {
+      this.props.onRef(this);
       luckysheet.create(this.setConfig([]));
     }
   }, {
@@ -11864,8 +11865,9 @@ var CommodityEntry = function CommodityEntry(props) {
     modalProps = _useState2[0],
     setModalProps = _useState2[1];
   var handleOk = function handleOk() {
+    var _dataValidationRef$cu;
     // 方法获取当前组件内部的数据，然后进行自身的业务操作
-    var resultData = dataValidationRef.getValidateData();
+    var resultData = (_dataValidationRef$cu = dataValidationRef.current) === null || _dataValidationRef$cu === void 0 ? void 0 : _dataValidationRef$cu.getValidateData();
     if (!resultData.successData.length) {
       antd.message.error("无校验通过数据，请校验数据");
       return;
@@ -11895,7 +11897,7 @@ var CommodityEntry = function CommodityEntry(props) {
     zIndex: 15
   }, otherModalProps), /*#__PURE__*/React__default['default'].createElement(DataValidation, _objectSpread2(_objectSpread2({}, props), {}, {
     onRef: function onRef(ref) {
-      dataValidationRef = ref;
+      dataValidationRef.current = ref;
     },
     columns: columns,
     validDataUrl: validDataUrl,
@@ -12332,6 +12334,16 @@ var handleDefaultProps = function handleDefaultProps(type, otherRequestConfig) {
         }, otherRequestConfig)
       };
       break;
+    case 'background-category':
+      result = {
+        isChoose: true,
+        remoteSource: _objectSpread2({
+          url: "/items/category/queryCategoryTree",
+          headers: otherRequestConfig === null || otherRequestConfig === void 0 ? void 0 : otherRequestConfig.extralHeaders,
+          resKeyValue: ['categoryCode', 'name']
+        }, otherRequestConfig)
+      };
+      break;
     default:
       result = {
         treeCheckable: true,
@@ -31683,6 +31695,200 @@ var RuleField = /*#__PURE__*/function (_Component) {
             });
           }
         }
+        // 品牌选择器
+        if (dataChoiceBusinessType == 410) {
+          if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+            return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: values[0],
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[0] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[0] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[0] = [value.key];
+                  valueNames[0] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }), /*#__PURE__*/React__default['default'].createElement("span", null, "~"), /*#__PURE__*/React__default['default'].createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: values[1],
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[1] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[1] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[1] = [value.key];
+                  valueNames[1] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }));
+          } else {
+            var _values13;
+            var _currentValue12 = dataInputBusinessType === 12 ? ((_values13 = values) === null || _values13 === void 0 ? void 0 : _values13.map(function (s, vIndex) {
+              return {
+                key: s,
+                label: valueNames[vIndex]
+              };
+            })) || [] : values[0] && {
+              key: values[0],
+              label: valueNames[0]
+            } || {};
+            return /*#__PURE__*/React__default['default'].createElement(BusinessSearchSelect$1, {
+              selectBusinessType: "brand",
+              selectProps: _objectSpread2({
+                style: styleCommon,
+                placeholder: '请选择品牌'
+              }, dataInputBusinessType === 12 ? {
+                mode: 'multiple',
+                maxTagCount: 1
+              } : {}),
+              disabled: disabled,
+              labelInValue: true,
+              value: _currentValue12,
+              requestConfig: {
+                filterInit: 'qp-brandCode-in'
+              },
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values = value.map(function (i) {
+                    return i.key;
+                  }) || [];
+                  valueNames = value.map(function (i) {
+                    return i.label || '';
+                  }) || [];
+                } else {
+                  values = (value === null || value === void 0 ? void 0 : value.key) ? [value.key] : [];
+                  valueNames = (value === null || value === void 0 ? void 0 : value.label) ? [value.label] : [];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            });
+          }
+        }
+        // 类目选择器
+        if (dataChoiceBusinessType == 420) {
+          if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+            return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[0] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[0] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[0] = [value.key];
+                  valueNames[0] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }), /*#__PURE__*/React__default['default'].createElement("span", null, "~"), /*#__PURE__*/React__default['default'].createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values[1] = value.map(function (i) {
+                    return i.key;
+                  });
+                  valueNames[1] = value.map(function (i) {
+                    return i.label || '';
+                  });
+                } else {
+                  values[1] = [value.key];
+                  valueNames[1] = [value.label || ''];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            }));
+          } else {
+            return /*#__PURE__*/React__default['default'].createElement(BusinessTreeSearchSelect$1, {
+              disabled: disabled,
+              treeCheckable: dataInputBusinessType === 12,
+              businessType: "background-category",
+              labelInValue: true,
+              value: values[0],
+              style: styleCommon,
+              onChange: function onChange(value) {
+                if (dataInputBusinessType === 12) {
+                  values = value.map(function (i) {
+                    return i.key;
+                  }) || [];
+                  valueNames = value.map(function (i) {
+                    return i.label || '';
+                  }) || [];
+                } else {
+                  values = (value === null || value === void 0 ? void 0 : value.key) ? [value.key] : [];
+                  valueNames = (value === null || value === void 0 ? void 0 : value.label) ? [value.label] : [];
+                }
+                callback(values, valueNames);
+              },
+              getPopupContainer: function getPopupContainer() {
+                return document.body;
+              }
+            });
+          }
+        }
       } else {
         if (dataTypeCode == 22 || dataTypeCode == 21 || dataTypeCode == 24 || dataTypeCode == 23) {
           //数值22, 字符串21, 布尔类型24, long23
@@ -32936,6 +33142,40 @@ function RenderCompItem(props) {
     getPopupContainer: function getPopupContainer() {
       return document.body;
     }
+  })) || null, ((ites === null || ites === void 0 ? void 0 : ites.inputType) === 20 || (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30) && (ites === null || ites === void 0 ? void 0 : ites.choiceType) === 410 && ( /*#__PURE__*/React__default['default'].createElement(BusinessSearchSelect$1, {
+    selectBusinessType: "brand",
+    selectProps: _objectSpread2({
+      style: styleCommon,
+      placeholder: '请选择品牌'
+    }, (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30 ? {
+      mode: 'multiple',
+      maxTagCount: 1
+    } : {}),
+    disabled: disabled,
+    labelInValue: true,
+    value: showValue(ites.code),
+    requestConfig: {
+      filterInit: 'qp-brandCode-in'
+    },
+    onChange: function onChange(value) {
+      handleEdit(ites.code, value);
+    },
+    getPopupContainer: function getPopupContainer() {
+      return document.body;
+    }
+  })) || null, ((ites === null || ites === void 0 ? void 0 : ites.inputType) === 20 || (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30) && (ites === null || ites === void 0 ? void 0 : ites.choiceType) === 420 && ( /*#__PURE__*/React__default['default'].createElement(BusinessTreeSearchSelect$1, {
+    disabled: disabled,
+    treeCheckable: (ites === null || ites === void 0 ? void 0 : ites.inputType) === 30,
+    businessType: "background-category",
+    labelInValue: true,
+    value: showValue(ites.code),
+    style: styleCommon,
+    onChange: function onChange(value) {
+      handleEdit(ites.code, value);
+    },
+    getPopupContainer: function getPopupContainer() {
+      return document.body;
+    }
   })) || null, (ites === null || ites === void 0 ? void 0 : ites.inputType) === 40 && ( /*#__PURE__*/React__default['default'].createElement("div", {
     style: {
       display: 'flex'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bit-sun/business-component",
-  "version": "3.1.9-alpha.1",
+  "version": "3.1.9",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",

package/src/components/Business/CommodityEntry/index.tsx

@@ -34,7 +34,7 @@ const CommodityEntry = (props: any) => {
 
   const handleOk = () => {
     // 方法获取当前组件内部的数据，然后进行自身的业务操作
-    const resultData = dataValidationRef.getValidateData();
+    const resultData = dataValidationRef.current?.getValidateData();
 
     if (!resultData.successData.length) {
       message.error("无校验通过数据，请校验数据");
@@ -67,7 +67,7 @@ const CommodityEntry = (props: any) => {
         <Modal {...modalProps} onOk={handleOk} onCancel={handleCancel} destroyOnClose={true} zIndex={15} {...otherModalProps} >
           <DataValidation
             {...props}
-            onRef={(ref) => { dataValidationRef = ref }}
+            onRef={(ref) => { dataValidationRef.current = ref }}
             columns={columns}
             validDataUrl={validDataUrl}
             isBrandAuth={isBrandAuth}

package/src/components/Business/TreeSearchSelect/index.md

@@ -208,4 +208,32 @@ export default () => {
 };
 ```
 
+
+类目选择器:
+
+```tsx
+import React, { useState } from 'react';
+import { BusinessTreeSearchSelect } from '../../../index';
+
+export default () => {
+
+  const [value, setValue] = useState();
+  
+  const props = {
+    mode: 'create',
+    value,
+    onChange: (v) => {
+      setValue(v)
+    },
+    businessType: 'background-category'
+  };
+
+  return (
+    <div>
+      <BusinessTreeSearchSelect {...props} />
+    </div>
+  );
+};
+```
+
 More skills for writing demo: https://d.umijs.org/guide/demo-principle

package/src/components/Business/TreeSearchSelect/utils.ts

@@ -84,6 +84,17 @@ const handleDefaultProps = (type: string, otherRequestConfig: {extralHeaders?: s
         },
       };
       break;
+    case 'background-category':
+      result =  {
+        isChoose: true,
+        remoteSource: {
+          url: `/items/category/queryCategoryTree`,
+          headers: otherRequestConfig?.extralHeaders,
+          resKeyValue: ['categoryCode', 'name'],
+          ...otherRequestConfig,
+        },
+      };
+      break;
     default:
       result =  {
         treeCheckable: true,

package/src/components/Functional/DataValidation/index.tsx

@@ -131,7 +131,7 @@ const FORMAT_TYPE_STRING = "s"; //格式类型为数字类型
 class DataValidation extends React.Component {
   constructor(props) {
     super(props);
-    this.props.onRef(this);
+    // this.props.onRef(this);
 
     const format = { fa: FORMAT_NAME_GENERAL, t: FORMAT_TYPE_STRING };
     if (props?.customerColumnsMapping?.length) {
@@ -381,6 +381,7 @@ class DataValidation extends React.Component {
   };
 
   componentDidMount() {
+    this.props.onRef(this);
     luckysheet.create(this.setConfig([]));
   }
 

package/src/components/Solution/RuleComponent/RenderCompItem.tsx

@@ -639,6 +639,51 @@ export default function RenderCompItem(props:any){
             />
           )) ||
           null}
+        {/* 单选/多选  品牌选择器  */}
+        {((ites?.inputType === 20 || ites?.inputType === 30) &&
+          ites?.choiceType === 410 && (
+            <BusinessSearchSelect
+              selectBusinessType="brand"
+              selectProps={{
+                style: styleCommon,
+                placeholder: '请选择品牌',
+                ...(ites?.inputType === 30
+                  ? {
+                    mode: 'multiple',
+                    maxTagCount: 1,
+                  }
+                  : {}),
+              }}
+              disabled={disabled}
+              labelInValue={true}
+              value={showValue(ites.code)}
+              requestConfig={{
+                filterInit: 'qp-brandCode-in',
+              }}
+              onChange={(value) => {
+                handleEdit(ites.code, value);
+              }}
+              getPopupContainer={() => document.body}
+            />
+          )) ||
+          null}
+        {/* 单选/多选  类目选择器  */}
+        {((ites?.inputType === 20 || ites?.inputType === 30) &&
+          ites?.choiceType === 420 && (
+            <BusinessTreeSearchSelect
+              disabled={disabled}
+              treeCheckable={ites?.inputType === 30}
+              businessType="background-category"
+              labelInValue={true}
+              value={showValue(ites.code)}
+              style={styleCommon}
+              onChange={(value) => {
+                handleEdit(ites.code, value);
+              }}
+              getPopupContainer={() => document.body}
+            />
+          )) ||
+          null}
         {/* 表达式 */}
         {ites?.inputType === 40 && (
           <div style={{ display: 'flex' }}>

package/src/components/Solution/RuleComponent/ruleFiled.js

@@ -2131,6 +2131,182 @@ export default class RuleField extends Component {
           );
         }
       }
+      // 品牌选择器
+      if (dataChoiceBusinessType == 410) {
+        if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+          return (
+            <>
+              <BusinessSearchSelect
+                selectBusinessType="brand"
+                selectProps={{
+                  style: styleCommon,
+                  placeholder: '请选择品牌',
+                  ...(dataInputBusinessType === 12
+                    ? {
+                      mode: 'multiple',
+                      maxTagCount: 1,
+                    }
+                    : {}),
+                }}
+                disabled={disabled}
+                labelInValue={true}
+                value={values[0]}
+                requestConfig={{
+                  filterInit: 'qp-brandCode-in',
+                }}
+                onChange={(value) => {
+                  if (dataInputBusinessType === 12) {
+                    values[0] = value.map((i) => i.key);
+                    valueNames[0] = value.map((i) => i.label || '');
+                  } else {
+                    values[0] = [value.key];
+                    valueNames[0] = [value.label || ''];
+                  }
+                  callback(values, valueNames);
+                }}
+                getPopupContainer={() => document.body}
+              />
+              <span>~</span>
+              <BusinessSearchSelect
+                selectBusinessType="brand"
+                selectProps={{
+                  style: styleCommon,
+                  placeholder: '请选择品牌',
+                  ...(dataInputBusinessType === 12
+                    ? {
+                      mode: 'multiple',
+                      maxTagCount: 1,
+                    }
+                    : {}),
+                }}
+                disabled={disabled}
+                labelInValue={true}
+                value={values[1]}
+                requestConfig={{
+                  filterInit: 'qp-brandCode-in',
+                }}
+                onChange={(value) => {
+                  if (dataInputBusinessType === 12) {
+                    values[1] = value.map((i) => i.key);
+                    valueNames[1] = value.map((i) => i.label || '');
+                  } else {
+                    values[1] = [value.key];
+                    valueNames[1] = [value.label || ''];
+                  }
+                  callback(values, valueNames);
+                }}
+                getPopupContainer={() => document.body}
+              />
+            </>
+          );
+        } else {
+          const currentValue = dataInputBusinessType === 12 ?
+            values?.map((s,vIndex)=> ({key: s, label: valueNames[vIndex]}))||[]
+            : values[0]&&{key:values[0],label:valueNames[0]}||{}
+          return (
+            <BusinessSearchSelect
+              selectBusinessType="brand"
+              selectProps={{
+                style: styleCommon,
+                placeholder: '请选择品牌',
+                ...(dataInputBusinessType === 12
+                  ? {
+                    mode: 'multiple',
+                    maxTagCount: 1,
+                  }
+                  : {}),
+              }}
+              disabled={disabled}
+              labelInValue={true}
+              value={currentValue}
+              requestConfig={{
+                filterInit: 'qp-brandCode-in',
+              }}
+              onChange={(value) => {
+                if (dataInputBusinessType === 12) {
+                  values = value.map((i) => i.key)||[];
+                  valueNames = value.map((i) => i.label || '')||[];
+                } else {
+                  values = value?.key?[value.key]:[];
+                  valueNames = value?.label?[value.label]:[];
+                }
+                callback(values, valueNames);
+              }}
+              getPopupContainer={() => document.body}
+            />
+          );
+        }
+      }
+      // 类目选择器
+      if (dataChoiceBusinessType == 420) {
+        if (INTERVAL_TYPE.indexOf(selectOperation) > -1) {
+          return (
+            <>
+              <BusinessTreeSearchSelect
+                disabled={disabled}
+                treeCheckable={dataInputBusinessType === 12}
+                businessType="background-category"
+                labelInValue={true}
+                value={values[0]}
+                style={styleCommon}
+                onChange={(value) => {
+                  if (dataInputBusinessType === 12) {
+                    values[0] = value.map((i) => i.key);
+                    valueNames[0] = value.map((i) => i.label || '');
+                  } else {
+                    values[0] = [value.key];
+                    valueNames[0] = [value.label || ''];
+                  }
+                  callback(values, valueNames);
+                }}
+                getPopupContainer={() => document.body}
+              />
+              <span>~</span>
+              <BusinessTreeSearchSelect
+                disabled={disabled}
+                treeCheckable={dataInputBusinessType === 12}
+                businessType="background-category"
+                labelInValue={true}
+                value={values[0]}
+                style={styleCommon}
+                onChange={(value) => {
+                  if (dataInputBusinessType === 12) {
+                    values[1] = value.map((i) => i.key);
+                    valueNames[1] = value.map((i) => i.label || '');
+                  } else {
+                    values[1] = [value.key];
+                    valueNames[1] = [value.label || ''];
+                  }
+                  callback(values, valueNames);
+                }}
+                getPopupContainer={() => document.body}
+              />
+            </>
+          );
+        } else {
+          return (
+            <BusinessTreeSearchSelect
+              disabled={disabled}
+              treeCheckable={dataInputBusinessType === 12}
+              businessType="background-category"
+              labelInValue={true}
+              value={values[0]}
+              style={styleCommon}
+              onChange={(value) => {
+                if (dataInputBusinessType === 12) {
+                  values = value.map((i) => i.key)||[];
+                  valueNames = value.map((i) => i.label || '')||[];
+                } else {
+                  values = value?.key?[value.key]:[];
+                  valueNames = value?.label?[value.label]:[];
+                }
+                callback(values, valueNames);
+              }}
+              getPopupContainer={() => document.body}
+            />
+          );
+        }
+      }
     } else {
       if (
         dataTypeCode == 22 ||