@luck-design-biz/luckda 0.0.27 → 1.0.0-2-alpha

package/lib/lowcode/painter/panel-section/TabItems.js

@@ -0,0 +1,195 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _antd = require("luck-design/antd");
+var _utils = require("@luck-design-biz/base/utils");
+var _tabitems = _interopRequireDefault(require("../style/tabitems.less"));
+var _SortBox = require("../components/SortBox");
+var _ListEditor = require("../components/ListEditor");
+var _PopConfirm = _interopRequireDefault(require("../components/PopConfirm"));
+var _PopForm = require("../components/PopForm");
+var _SerialsSelector = _interopRequireDefault(require("./SerialsSelector"));
+var _helper = require("../../engine/tools/helper");
+var _I18N_PREFIX_ = 'luckda.lowcode.painter.panel-section.tabsitems';
+var TabItems = function TabItems(_ref) {
+  var defaultValue = _ref.defaultValue,
+    onChange = _ref.onChange;
+  var _useReducer = (0, _react.useReducer)(_helper.listReducer, defaultValue),
+    _useReducer2 = (0, _slicedToArray2.default)(_useReducer, 2),
+    items = _useReducer2[0],
+    dispatch = _useReducer2[1];
+  var isFirstRender = (0, _react.useRef)(true);
+  (0, _react.useEffect)(function () {
+    if (isFirstRender.current) {
+      isFirstRender.current = false;
+      return;
+    }
+    if (onChange) onChange(items);
+  }, [items, onChange]);
+  var handleAdd = function handleAdd() {
+    dispatch({
+      type: 'add',
+      payload: {
+        id: "tab_".concat((0, _utils.suid)()),
+        name: '标签项',
+        active: false,
+        destory: false,
+        serial: null,
+        serialEffect: 'hidden'
+      }
+    });
+  };
+  var handleSortChange = function handleSortChange(sortItems) {
+    dispatch({
+      type: 'sort',
+      payload: sortItems
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_SortBox.SortBox, {
+    datas: items.map(function (item) {
+      return item.id;
+    }),
+    onChange: handleSortChange
+  }, /*#__PURE__*/_react.default.createElement(_ListEditor.ListEditor, {
+    style: {
+      padding: '0 16px'
+    },
+    handleAdd: handleAdd
+  }, items.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement(_SortBox.SortItem, {
+      key: item.id,
+      id: item.id
+    }, /*#__PURE__*/_react.default.createElement(_ListEditor.ListEditorItem, {
+      left: /*#__PURE__*/_react.default.createElement(TabItemLeft, {
+        item: item,
+        dispatch: dispatch
+      }),
+      right: /*#__PURE__*/_react.default.createElement(TabItemRight, {
+        item: item,
+        dispatch: dispatch
+      }),
+      item: item,
+      dispatch: dispatch
+    }));
+  })));
+};
+var TabItemLeft = function TabItemLeft(_ref2) {
+  var item = _ref2.item,
+    dispatch = _ref2.dispatch;
+  var handleActiveChange = function handleActiveChange() {
+    dispatch({
+      type: 'active',
+      payload: {
+        id: item.id,
+        data: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
+          active: true
+        })
+      }
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    checked: item.active,
+    onClick: handleActiveChange
+  })), /*#__PURE__*/_react.default.createElement("div", null, item.name));
+};
+var TabItemRight = function TabItemRight(_ref3) {
+  var item = _ref3.item,
+    dispatch = _ref3.dispatch;
+  var handleDelete = function handleDelete() {
+    dispatch({
+      type: 'delete',
+      payload: item.id
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+    title: (0, _utils.formatMessage)({
+      id: 'luckda.lowcode.painter.edit',
+      label: '编辑'
+    })
+  }, /*#__PURE__*/_react.default.createElement(_PopConfirm.default, {
+    placement: "bottomLeft",
+    title: /*#__PURE__*/_react.default.createElement(TabItemEditor, {
+      item: item,
+      dispatch: dispatch
+    })
+  }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+    className: _tabitems.default['tabitem-action'],
+    type: "edit"
+  }))), /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+    title: (0, _utils.formatMessage)({
+      id: 'luckda.lowcode.painter.delete',
+      label: '删除'
+    })
+  }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+    className: _tabitems.default['tabitem-action'],
+    type: "delete",
+    onClick: handleDelete
+  })));
+};
+var TabItemEditor = function TabItemEditor(_ref4) {
+  var item = _ref4.item,
+    dispatch = _ref4.dispatch;
+  var handleNameChange = function handleNameChange(e) {
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: item.id,
+        data: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
+          name: e.target.value
+        })
+      }
+    });
+  };
+  var handleResChange = function handleResChange(val) {
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: item.id,
+        data: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
+          serial: val
+        })
+      }
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_PopForm.PopForm, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".editor.tabname"),
+    label: '名称'
+  })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small",
+    value: item.name,
+    onChange: handleNameChange,
+    placeholder: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".editor.tabname.placeholder"),
+      label: '请输入标签名称'
+    })
+  }))), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".editor.id"),
+    label: '编号'
+  })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small",
+    value: item.id,
+    disabled: true
+  }))), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".editor.destory"),
+    label: '隐藏销毁'
+  })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_antd.Switch, {
+    size: "small",
+    value: item.destory
+  }))), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".editor.serial"),
+    label: '资源串'
+  })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_SerialsSelector.default, {
+    defaultValue: item.serial,
+    onChange: handleResChange,
+    size: "small"
+  }))));
+};
+var _default = exports.default = TabItems;

package/lib/lowcode/painter/panel-section/TableTopFilter.js

@@ -0,0 +1,324 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _ahooks = require("ahooks");
+var _antd = require("luck-design/antd");
+var _lodash = require("lodash");
+var _utils = require("@luck-design-biz/base/utils");
+var _ContextProvider = require("../../engine/provider/ContextProvider");
+var _SortBox = require("../components/SortBox");
+var _ListEditor = require("../components/ListEditor");
+var _PopConfirm = _interopRequireDefault(require("../components/PopConfirm"));
+var _PopForm = require("../components/PopForm");
+var _FieldSelector = _interopRequireDefault(require("../components/FieldSelector"));
+var _helper = require("../../engine/tools/helper");
+var _I18N_PREFIX_ = 'luckda.lowcode.painter.panel-section.tableTopFilter';
+var _RADIO_STYLE_ = {
+  display: 'block',
+  margin: '0 0 4px 0',
+  lineHeight: 0.4
+};
+var TableTopFilter = function TableTopFilter(_ref) {
+  var defaultValue = _ref.defaultValue,
+    _onChange = _ref.onChange,
+    nodeId = _ref.nodeId;
+  var ctx = (0, _ContextProvider.useContext)();
+  var _useState = (0, _react.useState)(function () {
+      if ((0, _lodash.isNil)(defaultValue)) return 'nil';
+      if ((0, _lodash.isString)(defaultValue)) return 'customApi';
+      if ((0, _lodash.isArray)(defaultValue)) return 'custom';
+      return 'dict';
+    }),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    type = _useState2[0],
+    setType = _useState2[1];
+  var _useSetState = (0, _ahooks.useSetState)(type === 'dict' ? defaultValue : null),
+    _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
+    dict = _useSetState2[0],
+    setDict = _useSetState2[1];
+  var _useReducer = (0, _react.useReducer)(_helper.listReducer, type === 'custom' ? defaultValue : []),
+    _useReducer2 = (0, _slicedToArray2.default)(_useReducer, 2),
+    options = _useReducer2[0],
+    dispatch = _useReducer2[1];
+  var _useState3 = (0, _react.useState)(type === 'customApi' ? defaultValue : void 0),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    apiUrl = _useState4[0],
+    setApiUrl = _useState4[1];
+  var _useDebounceFn = (0, _ahooks.useDebounceFn)(function (val) {
+      setDict({
+        key: val
+      });
+      if (dict !== null && dict !== void 0 && dict.field) _onChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, dict), {}, {
+        key: val
+      }));
+    }, {
+      wait: 400
+    }),
+    handleDictChange = _useDebounceFn.run;
+  var handleAdd = (0, _ahooks.useMemoizedFn)(function () {
+    var id = (0, _utils.suid)();
+    dispatch({
+      type: 'add',
+      payload: {
+        id: id,
+        value: id,
+        field: void 0,
+        label: "\u8FC7\u6EE4\u9879".concat(options.length + 1)
+      },
+      callback: function callback(newOptions) {
+        return _onChange(newOptions);
+      }
+    });
+  });
+  var handleDelete = (0, _ahooks.useMemoizedFn)(function (opt) {
+    dispatch({
+      type: 'delete',
+      payload: opt.id,
+      callback: function callback(newOptions) {
+        return _onChange(newOptions);
+      }
+    });
+  });
+  var handleChange = (0, _ahooks.useMemoizedFn)(function (opt) {
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: opt.id,
+        data: opt
+      },
+      callback: function callback(newOptions) {
+        return _onChange(newOptions);
+      }
+    });
+  });
+  var handleSortChange = (0, _ahooks.useMemoizedFn)(function (sortItems) {
+    dispatch({
+      type: 'sort',
+      payload: sortItems,
+      callback: function callback(newOptions) {
+        return _onChange(newOptions);
+      }
+    });
+  });
+  var handleTypeChange = (0, _ahooks.useMemoizedFn)(function (e) {
+    setType(e.target.value);
+    _onChange({
+      nil: null,
+      dict: dict,
+      custom: options,
+      customApi: apiUrl
+    }[e.target.value]);
+  });
+  var renderItemRight = (0, _ahooks.useMemoizedFn)(function (opt) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+      title: (0, _utils.formatMessage)({
+        id: 'luckda.lowcode.painter.edit',
+        label: '编辑'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_PopConfirm.default, {
+      placement: "left",
+      title: /*#__PURE__*/_react.default.createElement(_PopForm.PopForm, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+        id: "".concat(_I18N_PREFIX_, ".label"),
+        label: '名称'
+      })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+        size: "small",
+        defaultValue: opt.label,
+        onChange: function onChange(e) {
+          return handleChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, opt), {}, {
+            label: e.target.value
+          }));
+        },
+        placeholder: (0, _utils.formatMessage)({
+          id: "".concat(_I18N_PREFIX_, ".label.placeholder"),
+          label: '请输入过滤项名称'
+        })
+      }))), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+        id: "".concat(_I18N_PREFIX_, ".value"),
+        label: '值'
+      })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+        size: "small",
+        defaultValue: opt.value,
+        onChange: function onChange(e) {
+          return handleChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, opt), {}, {
+            value: e.target.value
+          }));
+        },
+        placeholder: (0, _utils.formatMessage)({
+          id: "".concat(_I18N_PREFIX_, ".value.placeholder"),
+          label: '请输入过滤项值'
+        })
+      }))), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItem, null, /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemLeft, null, (0, _utils.formatMessage)({
+        id: "".concat(_I18N_PREFIX_, ".field"),
+        label: '字段'
+      })), /*#__PURE__*/_react.default.createElement(_PopForm.PopFormItemRight, null, /*#__PURE__*/_react.default.createElement(_FieldSelector.default, {
+        dsid: ctx.componentMap.get(nodeId).api.getSelfData().props.dataset.uid,
+        defaultValue: opt.field,
+        style: {
+          width: '100%'
+        },
+        placeholder: (0, _utils.formatMessage)({
+          id: "".concat(_I18N_PREFIX_, ".field.placeholder"),
+          label: '请选择过滤字段'
+        }),
+        onChange: function onChange(e) {
+          return handleChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, opt), {}, {
+            field: e.target.value
+          }));
+        }
+      }))))
+    }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+      type: "edit",
+      style: {
+        marginRight: '8px',
+        cursor: 'pointer'
+      }
+    }))), /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+      title: (0, _utils.formatMessage)({
+        id: 'luckda.lowcode.painter.delete',
+        label: '删除'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+      type: "delete",
+      style: {
+        marginRight: '8px',
+        cursor: 'pointer'
+      },
+      onClick: function onClick() {
+        return handleDelete(action);
+      }
+    })));
+  });
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: '100%',
+      padding: '0 16px'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_antd.Radio.Group, {
+    value: type,
+    style: {
+      width: '100%'
+    },
+    onChange: handleTypeChange
+  }, /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    style: _RADIO_STYLE_,
+    value: "nil"
+  }, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".nil"),
+    label: '关闭过滤器'
+  })), /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    style: _RADIO_STYLE_,
+    value: "dict"
+  }, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".dict"),
+    label: '数据字典'
+  }), type === 'dict' && /*#__PURE__*/_react.default.createElement(_antd.Input.Group, {
+    compact: true,
+    style: {
+      marginTop: 4
+    }
+  }, /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small",
+    defaultValue: dict === null || dict === void 0 ? void 0 : dict.key,
+    style: {
+      width: '50%'
+    },
+    placeholder: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".dict.placeholder"),
+      label: '请输入字典key'
+    }),
+    onChange: function onChange(e) {
+      return handleDictChange(e.target.value);
+    }
+  }), /*#__PURE__*/_react.default.createElement(_FieldSelector.default, {
+    dsid: ctx.componentMap.get(nodeId).api.getSelfData().props.dataset.uid,
+    style: {
+      width: '50%'
+    },
+    defaultValue: dict === null || dict === void 0 ? void 0 : dict.field,
+    placeholder: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".field.placeholder"),
+      label: '请选择过滤字段'
+    }),
+    onChange: function onChange(field) {
+      setDict({
+        field: field
+      });
+      if (dict !== null && dict !== void 0 && dict.key) _onChange((0, _objectSpread2.default)((0, _objectSpread2.default)({}, dict), {}, {
+        field: field
+      }));
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    style: _RADIO_STYLE_,
+    value: "custom"
+  }, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".custom"),
+    label: '自定义项'
+  }), type === 'custom' && /*#__PURE__*/_react.default.createElement(_SortBox.SortBox, {
+    datas: options.map(function (_ref2) {
+      var id = _ref2.id;
+      return id;
+    }),
+    onChange: handleSortChange
+  }, /*#__PURE__*/_react.default.createElement(_ListEditor.ListEditor, {
+    style: {
+      marginTop: 8
+    },
+    addText: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".add"),
+      label: '添加过滤项'
+    }),
+    handleAdd: handleAdd
+  }, options.map(function (opt) {
+    return /*#__PURE__*/_react.default.createElement(_SortBox.SortItem, {
+      key: opt.id,
+      id: opt.id
+    }, /*#__PURE__*/_react.default.createElement(_ListEditor.ListEditorItem, {
+      left: /*#__PURE__*/_react.default.createElement("span", null, opt.label),
+      right: renderItemRight(opt),
+      item: opt,
+      dispatch: dispatch
+    }));
+  })))), /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    style: _RADIO_STYLE_,
+    value: "customApi"
+  }, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".customApi"),
+    label: '自定义接口'
+  }), type === 'customApi' && /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small",
+    value: apiUrl,
+    placeholder: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".customApi.placeholder"),
+      label: '请输入接口地址'
+    }),
+    style: {
+      display: 'block',
+      marginTop: 8
+    },
+    suffix: /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+      title: (0, _utils.formatMessage)({
+        id: "".concat(_I18N_PREFIX_, ".customApi.tip"),
+        label: '接口返回数据格式必须是: {mainInfo:{options:[{value: string,label: stirng}], field: string}}'
+      })
+    }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+      type: "info-circle",
+      style: {
+        color: 'rgba(0,0,0,.45)'
+      }
+    })),
+    onChange: function onChange(e) {
+      var val = e.target.value;
+      setApiUrl(val);
+      _onChange(val);
+    }
+  }))));
+};
+var _default = exports.default = TableTopFilter;

package/lib/lowcode/painter/panel-section/TableZebra.js

@@ -0,0 +1,82 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _ahooks = require("ahooks");
+var _antd = require("luck-design/antd");
+var _ColorInput = _interopRequireDefault(require("../components/ColorInput"));
+var _PopConfirm = _interopRequireDefault(require("../components/PopConfirm"));
+var _FullScreenEditor = _interopRequireDefault(require("../components/code-editor/FullScreenEditor"));
+var _JSEditor = _interopRequireDefault(require("../components/code-editor/JSEditor"));
+var _helper = require("../../engine/tools/helper");
+var _DEFAULT_FUNC_ = 'function getCondition(params) { \n return true; \n}';
+var TableZebra = function TableZebra(_ref) {
+  var defaultValue = _ref.defaultValue,
+    _onChange = _ref.onChange;
+  var editorRef = (0, _react.useRef)();
+  var inputRef = (0, _react.useRef)();
+  var valueRef = (0, _react.useRef)(defaultValue);
+  var defaultColor = (0, _ahooks.useCreation)(function () {
+    var _temp = defaultValue.color || defaultValue;
+    return (0, _helper.isColor)(_temp) ? _temp : void 0;
+  }, [defaultValue]);
+  var handleConfirm = (0, _ahooks.useMemoizedFn)(function () {
+    var condition = editorRef.current.editor.getValue();
+    if (condition) {
+      valueRef.current = {
+        condition: condition,
+        color: inputRef.current.state.value
+      };
+    } else {
+      valueRef.current = inputRef.current.state.value || false;
+    }
+    _onChange(valueRef.current);
+  });
+  var handleEditorLoad = (0, _ahooks.useMemoizedFn)(function () {
+    editorRef.current.editor.setValue((defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.condition) || _DEFAULT_FUNC_);
+  });
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: '100%',
+      display: 'flex',
+      alignItems: 'center'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_ColorInput.default, {
+    ref: inputRef,
+    value: defaultColor,
+    wrapperStyle: {
+      flex: 1,
+      marginRight: 4
+    },
+    onChange: function onChange(value) {
+      if (!value) {
+        valueRef.current = false;
+        editorRef.current.editor.setValue(_DEFAULT_FUNC_);
+      } else if (valueRef.current.condition) {
+        valueRef.current.color = value;
+      } else {
+        valueRef.current = value;
+      }
+      _onChange(valueRef.current);
+    }
+  }), /*#__PURE__*/_react.default.createElement(_PopConfirm.default, {
+    placement: "left",
+    title: /*#__PURE__*/_react.default.createElement(_FullScreenEditor.default, {
+      ref: editorRef,
+      EditorComponent: _JSEditor.default,
+      width: "600px",
+      height: "400px",
+      onLoad: handleEditorLoad
+    }),
+    showBtn: true,
+    onConfirm: handleConfirm
+  }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+    type: "filter"
+  })));
+};
+var _default = exports.default = TableZebra;

package/lib/lowcode/painter/panel-section/TextContent.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _ahooks = require("ahooks");
+var _antd = require("luck-design/antd");
+var _lodash = require("lodash");
+var _utils = require("@luck-design-biz/base/utils");
+var _I18nInput = _interopRequireDefault(require("./I18nInput"));
+var _Collapse = _interopRequireDefault(require("../components/Collapse"));
+var _PopConfirm = _interopRequireDefault(require("../components/PopConfirm"));
+var _FullScreenEditor = _interopRequireDefault(require("../components/code-editor/FullScreenEditor"));
+var _JSEditor = _interopRequireDefault(require("../components/code-editor/JSEditor"));
+var _I18N_PREFIX_ = 'luckda.lowcode.painter.panel-section.textContent';
+var _DEFAULT_FUNC_ = "function getText() {\n return '文本'; \n}";
+var TextContent = function TextContent(_ref) {
+  var defaultValue = _ref.defaultValue,
+    onChange = _ref.onChange;
+  var editorRef = (0, _react.useRef)();
+  var _useSetState = (0, _ahooks.useSetState)(defaultValue),
+    _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
+    value = _useSetState2[0],
+    setValue = _useSetState2[1];
+  (0, _ahooks.useUpdateEffect)(function () {
+    onChange(value);
+  }, [value]);
+  var handleComfirm = (0, _ahooks.useMemoizedFn)(function () {
+    var val = editorRef.current.editor.getValue();
+    if (val === '') {
+      setValue({
+        code: void 0
+      });
+      editorRef.current.editor.setValue(_DEFAULT_FUNC_);
+    } else {
+      setValue({
+        code: val
+      });
+    }
+  });
+  var handleChange = (0, _ahooks.useMemoizedFn)(function (val) {
+    setValue({
+      text: val
+    });
+  });
+  return /*#__PURE__*/_react.default.createElement(_Collapse.default, {
+    field: "render",
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_),
+      label: '内容'
+    }),
+    bodyStyle: {
+      padding: '12px 16px'
+    },
+    suppressIcon: true,
+    extraRender: function extraRender() {
+      return /*#__PURE__*/_react.default.createElement(_PopConfirm.default, {
+        placement: "left",
+        title: /*#__PURE__*/_react.default.createElement(_FullScreenEditor.default, {
+          ref: editorRef,
+          EditorComponent: _JSEditor.default,
+          width: "600px",
+          height: "400px"
+        }, (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.code) || _DEFAULT_FUNC_),
+        showBtn: true,
+        onConfirm: handleComfirm
+      }, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+        type: "code",
+        style: (0, _lodash.isNil)(value.code) ? null : {
+          color: '#1890ff'
+        }
+      }));
+    }
+  }, /*#__PURE__*/_react.default.createElement(_I18nInput.default, {
+    defaultValue: defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.text,
+    size: "small",
+    wrapped: "textarea",
+    disabled: !(0, _lodash.isNil)(value.code),
+    onChange: handleChange
+  }));
+};
+var _default = exports.default = TextContent;