@openli1115/lowcode-edit-pro-table 1.0.103 → 1.0.106

package/es/components/ProSearch/index.d.ts

@@ -9,7 +9,7 @@ export interface ProSearchField {
     defaultConditions?: Array<{
         id?: string;
         sign: 'I' | 'E';
-        option: '' | 'EQ' | 'NE' | 'BT' | 'LT' | 'LE' | 'GT' | 'GE' | 'CO' | 'NC';
+        option: '' | 'EQ' | 'NE' | 'BT' | 'LT' | 'LE' | 'GT' | 'GE' | 'CO' | 'NC' | 'IS_EMPTY' | 'IS_NOT_EMPTY';
         low: string;
         high: string;
     }>;
@@ -27,6 +27,8 @@ export interface ProSearchProps {
     descriptionAlign?: 'left' | 'center' | 'right' | 'justify';
     techNameAlign?: 'left' | 'center' | 'right' | 'justify';
     onSearch?: (data: Record<string, any[]>) => void;
+    /** 由低代码引擎样式 tab 传入的样式，将应用于各子条件输入框 */
+    style?: React.CSSProperties;
 }
 declare const ProSearch: React.FC<ProSearchProps>;
 export default ProSearch;

package/es/components/ProSearch/index.js

@@ -41,6 +41,12 @@ var OPTION_OPTIONS = [{
 }, {
   label: '不包含',
   value: 'NC'
+}, {
+  label: '为空',
+  value: 'IS_EMPTY'
+}, {
+  label: '不为空',
+  value: 'IS_NOT_EMPTY'
 }];
 var OPTION_SYMBOL = {
   EQ: '=',
@@ -51,7 +57,9 @@ var OPTION_SYMBOL = {
   LE: '≤',
   BT: '~',
   CO: '∋',
-  NC: '∌'
+  NC: '∌',
+  IS_EMPTY: '∅',
+  IS_NOT_EMPTY: '≠∅'
 };
 var genId = function genId() {
   return Math.random().toString(36).slice(2);
@@ -116,6 +124,7 @@ var ConditionTable = function ConditionTable(_ref) {
       },
       placeholder: "\u503C/\u4E0B\u9650\u503C",
       value: row.low,
+      disabled: row.option === 'IS_EMPTY' || row.option === 'IS_NOT_EMPTY',
       onChange: function onChange(e) {
         return update(row.id, 'low', e.target.value);
       }
@@ -170,7 +179,8 @@ var ProSearch = function ProSearch(_ref2) {
     descriptionAlign = _ref2$descriptionAlig === void 0 ? 'right' : _ref2$descriptionAlig,
     _ref2$techNameAlign = _ref2.techNameAlign,
     techNameAlign = _ref2$techNameAlign === void 0 ? 'left' : _ref2$techNameAlign,
-    onSearch = _ref2.onSearch;
+    onSearch = _ref2.onSearch,
+    style = _ref2.style;
   var _useState = useState({}),
     fieldValues = _useState[0],
     setFieldValues = _useState[1];
@@ -231,6 +241,24 @@ var ProSearch = function ProSearch(_ref2) {
       }, (_extends3 = {}, _extends3[key] = val, _extends3)), _extends4));
     });
   };
+
+  // 更新多值条件中指定行的 low/high 值（用于字段行直接编辑同步到弹窗第一行）
+  var updateConditionRow = function updateConditionRow(fieldId, condId, key, val) {
+    return setFieldValues(function (prev) {
+      var _extends6;
+      var fv = prev[fieldId] || {
+        low: '',
+        high: '',
+        conditions: []
+      };
+      return _extends({}, prev, (_extends6 = {}, _extends6[fieldId] = _extends({}, fv, {
+        conditions: fv.conditions.map(function (c) {
+          var _extends5;
+          return c.id === condId ? _extends({}, c, (_extends5 = {}, _extends5[key] = val, _extends5)) : c;
+        })
+      }), _extends6));
+    });
+  };
   var openModal = function openModal(fieldId) {
     setActiveFieldId(fieldId);
     var fv = fieldValues[fieldId] || {
@@ -257,13 +285,13 @@ var ProSearch = function ProSearch(_ref2) {
       return r.low || r.option;
     }));
     setFieldValues(function (prev) {
-      var _extends5;
-      return _extends({}, prev, (_extends5 = {}, _extends5[activeFieldId] = _extends({}, prev[activeFieldId] || {
+      var _extends7;
+      return _extends({}, prev, (_extends7 = {}, _extends7[activeFieldId] = _extends({}, prev[activeFieldId] || {
         low: '',
         high: ''
       }, {
         conditions: conditions
-      }), _extends5));
+      }), _extends7));
     });
     setModalVisible(false);
   };
@@ -414,48 +442,54 @@ var ProSearch = function ProSearch(_ref2) {
       high: '',
       conditions: []
     };
-    var hasConditions = fv.conditions.length > 0;
-    var disabled = hasConditions;
-    // 4.2 / 4.2a / 4.2b / 4.5 / 4.6：有多值条件时，字段行展示"首行代表"的 low/high 值
-    // - 4.2a BT（介于）：起始值=low，到值=high 分别填入两个输入框
-    // - 非 BT 情况：到值留空，仅展示 low
-    var val = displayCond ? key === 'low' ? displayCond.low : displayCond.option === 'BT' ? displayCond.high : '' : fv[key];
+    // 有多值条件时，字段行展示"首行代表"的 low/high 值，且不置灰，用户可直接编辑同步到弹窗第一行
+    var val = displayCond ? key === 'low' ? displayCond.low : displayCond.high : fv[key];
     var _onChange = function onChange(v) {
-      return updateVal(field.id, key, v);
+      if (displayCond) {
+        // 将修改同步到多值弹窗的第一行对应字段
+        updateConditionRow(field.id, displayCond.id, key, v);
+      } else {
+        updateVal(field.id, key, v);
+      }
     };
+
+    // 将样式 tab 的所有属性直接应用于输入框
+    var inputStyle = style ? _extends({}, style) : {};
+
+    // IS_EMPTY / IS_NOT_EMPTY 时输入框置灰
+    var isEmptyOp = displayCond && (displayCond.option === 'IS_EMPTY' || displayCond.option === 'IS_NOT_EMPTY');
+    var isDisabled = !!isEmptyOp;
     if (field.fieldType === 'date') {
       return /*#__PURE__*/React.createElement(_DatePicker, {
-        size: "small",
-        style: {
+        style: _extends({
           width: '100%'
-        },
+        }, inputStyle),
         value: val ? moment(val) : null,
+        disabled: isDisabled,
         onChange: function onChange(_, s) {
           return _onChange(s);
-        },
-        disabled: disabled
+        }
       });
     }
     if (field.fieldType === 'time') {
       return /*#__PURE__*/React.createElement(_TimePicker, {
-        size: "small",
-        style: {
+        style: _extends({
           width: '100%'
-        },
+        }, inputStyle),
         value: val ? moment(val, 'HH:mm:ss') : null,
+        disabled: isDisabled,
         onChange: function onChange(_, s) {
           return _onChange(s);
-        },
-        disabled: disabled
+        }
       });
     }
     return /*#__PURE__*/React.createElement(_Input, {
-      size: "small",
+      style: Object.keys(inputStyle).length ? inputStyle : undefined,
       value: val,
+      disabled: isDisabled,
       onChange: function onChange(e) {
         return _onChange(e.target.value);
-      },
-      disabled: disabled
+      }
     });
   };
 
@@ -532,7 +566,7 @@ var ProSearch = function ProSearch(_ref2) {
       fontFamily: 'sans-serif',
       border: '1px solid #f0f0f0',
       borderRadius: 4,
-      padding: '8px 4px'
+      padding: '0 4px 8px 4px'
     }
   }, showHeader && /*#__PURE__*/React.createElement("div", {
     style: _extends({
@@ -571,7 +605,7 @@ var ProSearch = function ProSearch(_ref2) {
   }, "\u591A\u503C"), showTechName && /*#__PURE__*/React.createElement("div", {
     style: {
       flex: 3,
-      textAlign: 'center'
+      textAlign: techNameAlign
     }
   }, "\u6280\u672F\u540D\u79F0")), fields.length === 0 && /*#__PURE__*/React.createElement("div", {
     style: {

package/lib/components/ProSearch/index.d.ts

@@ -9,7 +9,7 @@ export interface ProSearchField {
     defaultConditions?: Array<{
         id?: string;
         sign: 'I' | 'E';
-        option: '' | 'EQ' | 'NE' | 'BT' | 'LT' | 'LE' | 'GT' | 'GE' | 'CO' | 'NC';
+        option: '' | 'EQ' | 'NE' | 'BT' | 'LT' | 'LE' | 'GT' | 'GE' | 'CO' | 'NC' | 'IS_EMPTY' | 'IS_NOT_EMPTY';
         low: string;
         high: string;
     }>;
@@ -27,6 +27,8 @@ export interface ProSearchProps {
     descriptionAlign?: 'left' | 'center' | 'right' | 'justify';
     techNameAlign?: 'left' | 'center' | 'right' | 'justify';
     onSearch?: (data: Record<string, any[]>) => void;
+    /** 由低代码引擎样式 tab 传入的样式，将应用于各子条件输入框 */
+    style?: React.CSSProperties;
 }
 declare const ProSearch: React.FC<ProSearchProps>;
 export default ProSearch;

package/lib/components/ProSearch/index.js

@@ -11,7 +11,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _button = _interopRequireDefault(require("antd/lib/button"));
 var _input = _interopRequireDefault(require("antd/lib/input"));
 var _select = _interopRequireDefault(require("antd/lib/select"));
-var _extends6 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _extends8 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _icons = require("@ant-design/icons");
@@ -47,6 +47,12 @@ var OPTION_OPTIONS = [{
 }, {
   label: '不包含',
   value: 'NC'
+}, {
+  label: '为空',
+  value: 'IS_EMPTY'
+}, {
+  label: '不为空',
+  value: 'IS_NOT_EMPTY'
 }];
 var OPTION_SYMBOL = {
   EQ: '=',
@@ -57,7 +63,9 @@ var OPTION_SYMBOL = {
   LE: '≤',
   BT: '~',
   CO: '∋',
-  NC: '∌'
+  NC: '∌',
+  IS_EMPTY: '∅',
+  IS_NOT_EMPTY: '≠∅'
 };
 var genId = function genId() {
   return Math.random().toString(36).slice(2);
@@ -80,7 +88,7 @@ var ConditionTable = function ConditionTable(_ref) {
   var update = function update(id, key, val) {
     return onChange(rows.map(function (r) {
       var _extends2;
-      return r.id === id ? (0, _extends6["default"])({}, r, (_extends2 = {}, _extends2[key] = val, _extends2)) : r;
+      return r.id === id ? (0, _extends8["default"])({}, r, (_extends2 = {}, _extends2[key] = val, _extends2)) : r;
     }));
   };
   var remove = function remove(id) {
@@ -122,6 +130,7 @@ var ConditionTable = function ConditionTable(_ref) {
       },
       placeholder: "\u503C/\u4E0B\u9650\u503C",
       value: row.low,
+      disabled: row.option === 'IS_EMPTY' || row.option === 'IS_NOT_EMPTY',
       onChange: function onChange(e) {
         return update(row.id, 'low', e.target.value);
       }
@@ -176,7 +185,8 @@ var ProSearch = function ProSearch(_ref2) {
     descriptionAlign = _ref2$descriptionAlig === void 0 ? 'right' : _ref2$descriptionAlig,
     _ref2$techNameAlign = _ref2.techNameAlign,
     techNameAlign = _ref2$techNameAlign === void 0 ? 'left' : _ref2$techNameAlign,
-    onSearch = _ref2.onSearch;
+    onSearch = _ref2.onSearch,
+    style = _ref2.style;
   var _useState = (0, _react.useState)({}),
     fieldValues = _useState[0],
     setFieldValues = _useState[1];
@@ -230,13 +240,31 @@ var ProSearch = function ProSearch(_ref2) {
   var updateVal = function updateVal(id, key, val) {
     return setFieldValues(function (prev) {
       var _extends3, _extends4;
-      return (0, _extends6["default"])({}, prev, (_extends4 = {}, _extends4[id] = (0, _extends6["default"])({}, prev[id] || {
+      return (0, _extends8["default"])({}, prev, (_extends4 = {}, _extends4[id] = (0, _extends8["default"])({}, prev[id] || {
         low: '',
         high: '',
         conditions: []
       }, (_extends3 = {}, _extends3[key] = val, _extends3)), _extends4));
     });
   };
+
+  // 更新多值条件中指定行的 low/high 值（用于字段行直接编辑同步到弹窗第一行）
+  var updateConditionRow = function updateConditionRow(fieldId, condId, key, val) {
+    return setFieldValues(function (prev) {
+      var _extends6;
+      var fv = prev[fieldId] || {
+        low: '',
+        high: '',
+        conditions: []
+      };
+      return (0, _extends8["default"])({}, prev, (_extends6 = {}, _extends6[fieldId] = (0, _extends8["default"])({}, fv, {
+        conditions: fv.conditions.map(function (c) {
+          var _extends5;
+          return c.id === condId ? (0, _extends8["default"])({}, c, (_extends5 = {}, _extends5[key] = val, _extends5)) : c;
+        })
+      }), _extends6));
+    });
+  };
   var openModal = function openModal(fieldId) {
     setActiveFieldId(fieldId);
     var fv = fieldValues[fieldId] || {
@@ -263,13 +291,13 @@ var ProSearch = function ProSearch(_ref2) {
       return r.low || r.option;
     }));
     setFieldValues(function (prev) {
-      var _extends5;
-      return (0, _extends6["default"])({}, prev, (_extends5 = {}, _extends5[activeFieldId] = (0, _extends6["default"])({}, prev[activeFieldId] || {
+      var _extends7;
+      return (0, _extends8["default"])({}, prev, (_extends7 = {}, _extends7[activeFieldId] = (0, _extends8["default"])({}, prev[activeFieldId] || {
         low: '',
         high: ''
       }, {
         conditions: conditions
-      }), _extends5));
+      }), _extends7));
     });
     setModalVisible(false);
   };
@@ -420,48 +448,54 @@ var ProSearch = function ProSearch(_ref2) {
       high: '',
       conditions: []
     };
-    var hasConditions = fv.conditions.length > 0;
-    var disabled = hasConditions;
-    // 4.2 / 4.2a / 4.2b / 4.5 / 4.6：有多值条件时，字段行展示"首行代表"的 low/high 值
-    // - 4.2a BT（介于）：起始值=low，到值=high 分别填入两个输入框
-    // - 非 BT 情况：到值留空，仅展示 low
-    var val = displayCond ? key === 'low' ? displayCond.low : displayCond.option === 'BT' ? displayCond.high : '' : fv[key];
+    // 有多值条件时，字段行展示"首行代表"的 low/high 值，且不置灰，用户可直接编辑同步到弹窗第一行
+    var val = displayCond ? key === 'low' ? displayCond.low : displayCond.high : fv[key];
     var _onChange = function onChange(v) {
-      return updateVal(field.id, key, v);
+      if (displayCond) {
+        // 将修改同步到多值弹窗的第一行对应字段
+        updateConditionRow(field.id, displayCond.id, key, v);
+      } else {
+        updateVal(field.id, key, v);
+      }
     };
+
+    // 将样式 tab 的所有属性直接应用于输入框
+    var inputStyle = style ? (0, _extends8["default"])({}, style) : {};
+
+    // IS_EMPTY / IS_NOT_EMPTY 时输入框置灰
+    var isEmptyOp = displayCond && (displayCond.option === 'IS_EMPTY' || displayCond.option === 'IS_NOT_EMPTY');
+    var isDisabled = !!isEmptyOp;
     if (field.fieldType === 'date') {
       return /*#__PURE__*/React.createElement(_datePicker["default"], {
-        size: "small",
-        style: {
+        style: (0, _extends8["default"])({
           width: '100%'
-        },
+        }, inputStyle),
         value: val ? (0, _moment["default"])(val) : null,
+        disabled: isDisabled,
         onChange: function onChange(_, s) {
           return _onChange(s);
-        },
-        disabled: disabled
+        }
       });
     }
     if (field.fieldType === 'time') {
       return /*#__PURE__*/React.createElement(_timePicker["default"], {
-        size: "small",
-        style: {
+        style: (0, _extends8["default"])({
           width: '100%'
-        },
+        }, inputStyle),
         value: val ? (0, _moment["default"])(val, 'HH:mm:ss') : null,
+        disabled: isDisabled,
         onChange: function onChange(_, s) {
           return _onChange(s);
-        },
-        disabled: disabled
+        }
       });
     }
     return /*#__PURE__*/React.createElement(_input["default"], {
-      size: "small",
+      style: Object.keys(inputStyle).length ? inputStyle : undefined,
       value: val,
+      disabled: isDisabled,
       onChange: function onChange(e) {
         return _onChange(e.target.value);
-      },
-      disabled: disabled
+      }
     });
   };
 
@@ -502,7 +536,7 @@ var ProSearch = function ProSearch(_ref2) {
       var sym = OPTION_SYMBOL[opt];
       if (!sym) return null;
       return /*#__PURE__*/React.createElement("span", {
-        style: (0, _extends6["default"])({}, badgeStyle, {
+        style: (0, _extends8["default"])({}, badgeStyle, {
           background: '#52c41a'
         })
       }, sym);
@@ -512,7 +546,7 @@ var ProSearch = function ProSearch(_ref2) {
       // 4.5.2：空 / EQ 也要显示红底 "=" ；其它按 OPTION_SYMBOL 显示
       var _sym = _opt && OPTION_SYMBOL[_opt] || '=';
       return /*#__PURE__*/React.createElement("span", {
-        style: (0, _extends6["default"])({}, badgeStyle, {
+        style: (0, _extends8["default"])({}, badgeStyle, {
           background: '#ff4d4f'
         })
       }, _sym);
@@ -538,10 +572,10 @@ var ProSearch = function ProSearch(_ref2) {
       fontFamily: 'sans-serif',
       border: '1px solid #f0f0f0',
       borderRadius: 4,
-      padding: '8px 4px'
+      padding: '0 4px 8px 4px'
     }
   }, showHeader && /*#__PURE__*/React.createElement("div", {
-    style: (0, _extends6["default"])({
+    style: (0, _extends8["default"])({
       display: 'flex',
       padding: '4px 8px',
       gap: 6,
@@ -577,7 +611,7 @@ var ProSearch = function ProSearch(_ref2) {
   }, "\u591A\u503C"), showTechName && /*#__PURE__*/React.createElement("div", {
     style: {
       flex: 3,
-      textAlign: 'center'
+      textAlign: techNameAlign
     }
   }, "\u6280\u672F\u540D\u79F0")), fields.length === 0 && /*#__PURE__*/React.createElement("div", {
     style: {

package/lowcode_es/meta.js

@@ -102,7 +102,7 @@ function fillRealVersion(meta, packageName, version, basicLibraryVersion) {
     packageName = '@openli1115/lowcode-edit-pro-table';
   }
   if (version === void 0) {
-    version = '1.0.103';
+    version = '1.0.106';
   }
   if (basicLibraryVersion === void 0) {
     basicLibraryVersion = {

package/lowcode_lib/meta.js

@@ -107,7 +107,7 @@ function fillRealVersion(meta, packageName, version, basicLibraryVersion) {
     packageName = '@openli1115/lowcode-edit-pro-table';
   }
   if (version === void 0) {
-    version = '1.0.103';
+    version = '1.0.106';
   }
   if (basicLibraryVersion === void 0) {
     basicLibraryVersion = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openli1115/lowcode-edit-pro-table",
-  "version": "1.0.103",
+  "version": "1.0.106",
   "description": "@openli1115/lowcode-edit-pro-table",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -101,10 +101,10 @@
   },
   "componentConfig": {
     "isComponentLibrary": true,
-    "materialSchema": "https://unpkg.com/@openli1115/lowcode-edit-pro-table@1.0.103/build/lowcode/assets-prod.json"
+    "materialSchema": "https://unpkg.com/@openli1115/lowcode-edit-pro-table@1.0.106/build/lowcode/assets-prod.json"
   },
   "lcMeta": {
     "type": "component"
   },
-  "homepage": "https://unpkg.com/@openli1115/lowcode-edit-pro-table@1.0.103/build/index.html"
+  "homepage": "https://unpkg.com/@openli1115/lowcode-edit-pro-table@1.0.106/build/index.html"
 }